Re: [WSG] Getting my feet wet in HTML5
On 19 Aug 2010, at 11:08, Patrick H. Lauke wrote: >> http://www.w3.org/TR/html5/content-models.html#annotations-for-assistive-technology-products-aria > > However, with the new outline/sectioning algorithm, you can potentially go > well over the classic h1-h6 number of heading levels, while the ARIA > additional hints only allow mapping back to those six levels. Really? Maybe I'm missing something - what's non-conforming about: Foo given that "[t]he value for 'aria-level' is an integer greater than or equal to 1." http://www.w3.org/WAI/PF/aria/complete#aria-level (Those ARIA annotations are strictly unnecessary when UAs implement the "Strong native semantics and implied ARIA semantics" from that table.) -- Benjamin Hawkes-Lewis *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
David Storey wrote: maybe, but any is not backwards compatible so not really an option to use any time soon, and is (AFAICT) a Mozilla only extension that is not in any specification. As it isn't even in any spec, even if it does get accepted by the CSS working group, it will take ages to be specced up, refined and included in the other browsers. I think that its incredible usefulness for this particular scenario will lead to very quick uptake by other browser engines as their own HTML5 parsing support comes online, eg. WebKit switched over (in development builds) earlier this month: http://webkit.org/blog/1273/the-html5-parsing-algorithm/ I'm hopeful standardizing of any (or similar) can go a bit quicker than 'normal' as the main benefit of this selector is brevity, and the main drawback of vendor extensions is the lack of brevity from having to state the same thing five times. I won't be holding my breath, mind you... This is why I just stick to using the appropriate h* element for the section level that stick to h1, as it is more backwards compatible and solves all the head scratching. Of course in practical situations you should just pick and choose the parts of HTML5 that work across browsers and are completely backwards compatible, but some of us enjoy a bit of head scratching now and again :) Rob *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On 19/08/2010 11:51, Rob Crowther wrote: Patrick H. Lauke wrote: Also worth pointing out that, to my knowledge, no AT/screen reader currently supports it either, so this may cause some issues for these users at present. Similarly the native semantics of elements like header and nav don't yet have any impact on screen readers which support the similar ARIA roles (unless NVDA added support?) so you should add them even when there's duplication: http://www.w3.org/TR/html5/content-models.html#annotations-for-assistive-technology-products-aria However, with the new outline/sectioning algorithm, you can potentially go well over the classic h1-h6 number of heading levels, while the ARIA additional hints only allow mapping back to those six levels. In principle though, absolutely. P -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com | http://flickr.com/photos/redux/ __ twitter: @patrick_h_lauke | skype: patrick_h_lauke __ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On 19 Aug 2010, at 11:51, Rob Crowther wrote:
Patrick H. Lauke wrote:
On 19/08/2010 10:13, David Storey wrote:
So the section or article elements could be taken out of context
and
displayed elsewhere but retain their headings.
You could, but I still use the h1 to h2 inside the sections
because no
browser uses the sectioning algorithm for thing like styling.
I think Firefox 4.0 will, this will also be the first version of
Firefox to have the HTML5 parser enabled by default. Styling is
especially fun because it's not just sections you have to worry
about, several other elements also create a new sectioning context.
Life will be made easier by the new any() selector:
maybe, but any is not backwards compatible so not really an option to
use any time soon, and is (AFAICT) a Mozilla only extension that is
not in any specification. As it isn't even in any spec, even if it
does get accepted by the CSS working group, it will take ages to be
specced up, refined and included in the other browsers.
This is why I just stick to using the appropriate h* element for the
section level that stick to h1, as it is more backwards compatible and
solves all the head scratching.
/* Level 0 */
h1 {
font-size: 30px;
}
/* Level 1 */
:-moz-any(section, article, aside, nav) h1 {
font-size: 25px;
}
/* Level 2 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
font-size: 20px;
}
/* Level 3 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
font-size: 15px;
}
https://developer.mozilla.org/en/CSS/:-moz-any
Also worth pointing out that, to my knowledge, no AT/screen reader
currently supports it either, so this may cause some issues for
these users at present.
Similarly the native semantics of elements like header and nav don't
yet have any impact on screen readers which support the similar ARIA
roles (unless NVDA added support?) so you should add them even when
there's duplication:
http://www.w3.org/TR/html5/content-models.html#annotations-for-assistive-technology-products-aria
Rob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
David Storey
Chief Web Opener / Product Manager, Opera Dragonfly
W3C WG: Mobile Web Best Practices / SVG Interest Group
Opera Software ASA, Oslo, Norway
Mobile: +47 94 22 02 32 / E-Mail/XMPP: dsto...@opera.com / Twitter:
dstorey
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Getting my feet wet in HTML5
Patrick H. Lauke wrote:
On 19/08/2010 10:13, David Storey wrote:
So the section or article elements could be taken out of context and
displayed elsewhere but retain their headings.
You could, but I still use the h1 to h2 inside the sections because no
browser uses the sectioning algorithm for thing like styling.
I think Firefox 4.0 will, this will also be the first version of Firefox
to have the HTML5 parser enabled by default. Styling is especially fun
because it's not just sections you have to worry about, several other
elements also create a new sectioning context. Life will be made easier
by the new any() selector:
/* Level 0 */
h1 {
font-size: 30px;
}
/* Level 1 */
:-moz-any(section, article, aside, nav) h1 {
font-size: 25px;
}
/* Level 2 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
font-size: 20px;
}
/* Level 3 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
font-size: 15px;
}
https://developer.mozilla.org/en/CSS/:-moz-any
Also worth pointing out that, to my knowledge, no AT/screen reader
currently supports it either, so this may cause some issues for these
users at present.
Similarly the native semantics of elements like header and nav don't yet
have any impact on screen readers which support the similar ARIA roles
(unless NVDA added support?) so you should add them even when there's
duplication:
http://www.w3.org/TR/html5/content-models.html#annotations-for-assistive-technology-products-aria
Rob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Getting my feet wet in HTML5
On 19/08/2010 10:13, David Storey wrote: So the section or article elements could be taken out of context and displayed elsewhere but retain their headings. You could, but I still use the h1 to h2 inside the sections because no browser uses the sectioning algorithm for thing like styling. Also worth pointing out that, to my knowledge, no AT/screen reader currently supports it either, so this may cause some issues for these users at present. P -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com | http://flickr.com/photos/redux/ __ twitter: @patrick_h_lauke | skype: patrick_h_lauke __ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On 18 Aug 2010, at 23:40, Rob Crowther wrote:
On 18/08/10 17:51, tee wrote:
This example doesn't look very semantic to me :-) Is there a tag
that can replace or substitute the use of headings?
If you properly nest your and elements then you
can use just everywhere:
Monday
First post
...
Second post
...
Tuesday
First post...
The weight of each heading is then determined by the outlining
algorithm:
http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#outlines
So the section or article elements could be taken out of context and
displayed elsewhere but retain their headings.
You could, but I still use the h1 to h2 inside the sections because no
browser uses the sectioning algorithm for thing like styling. So all
the H1s will be the size set by the h1 selector, unless you do
something like:
section h1 { }
section + section h1 { }
section + section + section h1 { }
etc… which is verbose.
Is this what you meant?
There was some discussion about replacing h1-6 with, simply, and
letting the outline algorithm determine the weight, but this was
eventually dropped for backwards compatibility reasons.
Rob
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
David Storey
Chief Web Opener / Product Manager, Opera Dragonfly
W3C WG: Mobile Web Best Practices / SVG Interest Group
Opera Software ASA, Oslo, Norway
Mobile: +47 94 22 02 32 / E-Mail/XMPP: dsto...@opera.com / Twitter:
dstorey
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
Re: [WSG] Getting my feet wet in HTML5
On 18/08/10 17:51, tee wrote: This example doesn't look very semantic to me :-) Is there a tag that can replace or substitute the use of headings? If you properly nest your and elements then you can use just everywhere: Monday First post ... Second post ... Tuesday First post... The weight of each heading is then determined by the outlining algorithm: http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#outlines So the section or article elements could be taken out of context and displayed elsewhere but retain their headings. Is this what you meant? There was some discussion about replacing h1-6 with, simply, and letting the outline algorithm determine the weight, but this was eventually dropped for backwards compatibility reasons. Rob *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> > For example, an article could have a header and footer: > > > > > Article title > August 12, 2010 > >Article copy here. Article copy here. Article > copy here. Article copy here. > > By: Dan Freeman > > > > > Using ID's would not help you replicate this. You'd have to structure it > like this: > > > > > Article title > August 12, 2010 > >Article copy here. Article copy here. Article > copy here. Article copy here. > > By: Dan Freeman > > > > This example doesn't look very semantic to me :-) Is there a tag that can replace or substitute the use of headings? I am curious if and how HTML5 section and header tags could help solve the Section Headings (SC 2.4.10) in WCAG 2.0 and WCAG 1.0 Checkpoint 3.5. I had issue with WCAG 1.0 Checkpoint 3.5, thought it was just a rather impractical guideline for that a web page can be in many forms not just a page of content consists of navigations, block of callout content that must go after the main content (which is usually where H1 located). A page could have only one H1 and that semantically it must be the first heading in a document, this makes the SC 2.4.10 in impractical. I thought WCAG 2.0 would change it, and show warning instead of error if a page has no proper nested headings, it didn't so I thought perhaps HTML5 tags could help solve the SC 2.4.10 that very few sites able to comply. Not even these two quality sites that advocate, preach the accessibility. http://webaim.org http://www.w3.org/WAI/ tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On Fri, Aug 13, 2010 at 12:11 PM, designer < desig...@gwelanmor-internet.co.uk> wrote: > Tom, > > I have 'played' with the simple elements and I like them. I actually wanted > to have a 'page' element (or wrapper) since that is an element that is used > an awful lot, but I never got anywhere with folk accepting it. For a simple > example, see: > > http://www.betasite.fsnet.co.uk/gam/altgam/gwelanmor.html > > Also see: > > http://www.betasite.fsnet.co.uk/gam/altgam/portfolio.html > > for an example of the use of and > > I was very impressed with that - simple and semantic. > > Also note from the above that target=_blank is now valid! > > Hope this helps. > > Bob > Also just wanted to throw this HTML5 gallery in... There are some great examples of using HTML5 elements - http://html5gallery.com/ Anna. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Getting my feet wet in HTML5
No, I'm suggesting that if you truly want to learn html5 semantics you need to build a site without divs. Once you understand the semantics you can better understand why you would use the new tags and why you would fall back to divs. But to continue working with divs that have semantic class names will not give you that understanding. It's a mental leap. -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Tony Crockford Sent: Friday, August 13, 2010 10:57 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Getting my feet wet in HTML5 On 13 Aug 2010, at 18:51, Ted Drake wrote: > You need to build a site to learn HTML5 semantics, it's like the old days of > hybrid table-based layouts. 7 years ago you really needed to ditch tables to > truly understand CSS. Are you suggesting that to switch to HTML5 we should avoid the use of div entirely, using only section, article etc to chunk up the content? *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> Take a look at the js, it's pretty simple. > However, it is true that you are leaving yourself open. At Yahoo, we treat > IE6 as an a-level browser. http://developer.yahoo.com/yui/articles/gbs/ > So you aren't going to see me push to change Yahoo! Finance to HTML5 tags. > However, I have been doing it to smaller projects and am about to convert a > client's site to html5 structure. > > You need to build a site to learn HTML5 semantics, it's like the old days of > hybrid table-based layouts. 7 years ago you really needed to ditch tables to > truly understand CSS. > > If you are worried about a client, than do it on your personal site or for a > more progressive client. > > Ted Thanks Ted. Appreciate it. -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On 13 Aug 2010, at 18:51, Ted Drake wrote: > You need to build a site to learn HTML5 semantics, it's like the old days of > hybrid table-based layouts. 7 years ago you really needed to ditch tables to > truly understand CSS. Are you suggesting that to switch to HTML5 we should avoid the use of div entirely, using only section, article etc to chunk up the content? *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Getting my feet wet in HTML5
Take a look at the js, it's pretty simple. However, it is true that you are leaving yourself open. At Yahoo, we treat IE6 as an a-level browser. http://developer.yahoo.com/yui/articles/gbs/ So you aren't going to see me push to change Yahoo! Finance to HTML5 tags. However, I have been doing it to smaller projects and am about to convert a client's site to html5 structure. You need to build a site to learn HTML5 semantics, it's like the old days of hybrid table-based layouts. 7 years ago you really needed to ditch tables to truly understand CSS. If you are worried about a client, than do it on your personal site or for a more progressive client. Ted -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Tom Livingston Sent: Friday, August 13, 2010 10:34 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Getting my feet wet in HTML5 On Fri, Aug 13, 2010 at 1:11 PM, designer wrote: > Tom, > > I have 'played' with the simple elements and I like them. I actually wanted > to have a 'page' element (or wrapper) since that is an element that is used > an awful lot, but I never got anywhere with folk accepting it. For a simple > example, see: > > http://www.betasite.fsnet.co.uk/gam/altgam/gwelanmor.html > > Also see: > This is great. THanks. One other thing that's making me shy from the edge. A production (client site) site that relies on JS to render makes me sweat a little. Can anyone convince me that it's ok? -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On Fri, Aug 13, 2010 at 1:11 PM, designer wrote: > Tom, > > I have 'played' with the simple elements and I like them. I actually wanted > to have a 'page' element (or wrapper) since that is an element that is used > an awful lot, but I never got anywhere with folk accepting it. For a simple > example, see: > > http://www.betasite.fsnet.co.uk/gam/altgam/gwelanmor.html > > Also see: > This is great. THanks. One other thing that's making me shy from the edge. A production (client site) site that relies on JS to render makes me sweat a little. Can anyone convince me that it's ok? -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
Tom, I have 'played' with the simple elements and I like them. I actually wanted to have a 'page' element (or wrapper) since that is an element that is used an awful lot, but I never got anywhere with folk accepting it. For a simple example, see: http://www.betasite.fsnet.co.uk/gam/altgam/gwelanmor.html Also see: http://www.betasite.fsnet.co.uk/gam/altgam/portfolio.html for an example of the use of and I was very impressed with that - simple and semantic. Also note from the above that target=_blank is now valid! Hope this helps. Bob - Original Message - From: "Tom Livingston" To: Sent: Friday, August 13, 2010 2:19 PM Subject: Re: [WSG] Getting my feet wet in HTML5 [snip] I actually have this book. And read it cover to cover. The problem comes when I actually have to BUILD something using these elements... guess I'll read it again... -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Getting my feet wet in HTML5
Tom, just go for it. You can add the modernizr or similar js to get IE to recognize the elements. But you won't appreciate the semantics of HTML5 until you ditch divs for the new tags. I speak from experience. There's a certain level of awareness you get while trying to decide the most semantic structure. Continuing to work with divs/classes will always leave you half way there. Ted -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Tom Livingston Sent: Friday, August 13, 2010 8:59 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Getting my feet wet in HTML5 > Sorry,, Corrected Structure: > > > > Header here > > > > > Content with an H2, a UL, Ps and As and a > picture > > > Content with an H2, a UL, Ps and As and a > picture > > > Content with an H2, a UL, Ps and As and a > picture > > > > Sidebar > > > > Footer > > > > Dan, I am aware of the HTML5 elements, thanks. I'm just not ready to leap into that right yet, but want to try to understand the semantics of the element and, with classes/IDs, make an analogy with my structure. My 'header' is the header for the entire page. My 'articles' have an H2 in each and can't see why I'd wrap each on in a 'header' element (or analogous one). My structure above is what I am literally using on a page. WHat I am after is an HTML5 analogy to this. Does a div.section belong in there somewhere? THanks -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> Sorry,, Corrected Structure: > > > > Header here > > > > > Content with an H2, a UL, Ps and As and a > picture > > > Content with an H2, a UL, Ps and As and a > picture > > > Content with an H2, a UL, Ps and As and a > picture > > > > Sidebar > > > > Footer > > > > Dan, I am aware of the HTML5 elements, thanks. I'm just not ready to leap into that right yet, but want to try to understand the semantics of the element and, with classes/IDs, make an analogy with my structure. My 'header' is the header for the entire page. My 'articles' have an H2 in each and can't see why I'd wrap each on in a 'header' element (or analogous one). My structure above is what I am literally using on a page. WHat I am after is an HTML5 analogy to this. Does a div.section belong in there somewhere? THanks -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] Getting my feet wet in HTML5
Tom, HTML5 allows for the use of the elements header, footer, and aside in multiple instances. For example, an article could have a header and footer: Article title August 12, 2010 Article copy here. Article copy here. Article copy here. Article copy here. By: Dan Freeman Using ID's would not help you replicate this. You'd have to structure it like this: Article title August 12, 2010 Article copy here. Article copy here. Article copy here. Article copy here. By: Dan Freeman Dan Freeman Webmaster & ERP Administrator 800.650.6506 (TOLL FREE) 330.655.0341 (DIRECT) www.lexi.com -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Tom Livingston Sent: Friday, August 13, 2010 9:59 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Getting my feet wet in HTML5 > Ignoring that this isn't using HTML5 elements, but using it as an > analogy - via the classes and IDs - could this be improved upon? Is > there a place for (s) here? Did I get the element concepts > right? > > Thanks again... Sorry,, Corrected Structure: Header here Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Sidebar Footer -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** LEXI-COMP CONFIDENTIALITY NOTICE The information in this electronic mail is intended for the named recipients only. Any use of this information by anyone other than the intended receiver is prohibited. If the reader of this message is not the intended recipient, you are hereby notified that any dissemination, distribution, copying, or other use of this message or its attachments is strictly prohibited. If you have received this message in error, please notify the sender immediately by replying to this electronic e-mail or by calling 330-650-6506. Please delete it from your computer. Thank you. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
OK, I have decided to step back from HTML5 till I "get it" better, but in keeping with the idea of this thread, I'd like some feedback on the following structure: Header here Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Sidebar Footer Ignoring that this isn't using HTML5 elements, but using it as an analogy - via the classes and IDs - could this be improved upon? Is there a place for (s) here? Did I get the element concepts right? Thanks again... -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> Ignoring that this isn't using HTML5 elements, but using it as an > analogy - via the classes and IDs - could this be improved upon? Is > there a place for (s) here? Did I get the element concepts > right? > > Thanks again... Sorry,, Corrected Structure: Header here Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Content with an H2, a UL, Ps and As and a picture Sidebar Footer -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> Just to add onto Chris' email. > > This sounds like a good place to suggest people purchase Jeremy > Keith's book HTML5 for Web Designers. In it he actually describes the > semantics of the new tags and gives defines when and how to use tags > like etc. If you have questions > like these definitely pick this book up as it will help clear up the > confusion. > > Also as far as goes there is not much difference between it > and as is suppose to be used for grouping of > thematically similar content. The difference between the two is that > has no semantic meaning and doesn't tell you anything about the > content whereas section does. > > -- > > Jason Arnold > http://www.jasonarnold.net > I actually have this book. And read it cover to cover. The problem comes when I actually have to BUILD something using these elements... guess I'll read it again... -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On Fri, Aug 13, 2010 at 4:53 AM, Chris Knowles wrote: >> a 'div' definitely has meaning, ie: it is a division of one part of >> the page, from another; whether it is used for other behaviour, >> doesn't preclude it from from its original meaning. > > but when everything is in a div, div ceases to have much meaning. It simply > says theres a bunch of things on the page that are separate to each other > without giving any clue as to what they might contain > >> Similarly, a #id was originally designated as the location within a >> page, not for CSS -> semantically it is to reference a particular >> piece of information, within the bigger piece of content, eg: a >> "section" header maybe... It just so happens that it works really >> well for CSS too. And simplifying content manipulation. And so on. > > but in the context of the question, the reason to use , for > instance, vs , is to add meaning to the markup > >> I'm not sure why you would infer that information in section's, is any >> more important than stuff written in a div? Can you elaborate? >> ie: assistive technologies can already target div's, so using that >> argument needs more. > > I didn't intend to infer that, I was just trying to show how is > more useful because it can be programmatically accessed in a way that id=section> can't. With regard to relevance of content, I was just trying to > say that a search engine *might* choose to weight content in a given tag > more than in another, whereas if everything is in a div it's harder to do > this. A better example would have been to have said that the content in > *might* be more relevant to a search engine than the content in > - compared with and which would be > harder to tell apart. > > -- > Chris Knowles Just to add onto Chris' email. This sounds like a good place to suggest people purchase Jeremy Keith's book HTML5 for Web Designers. In it he actually describes the semantics of the new tags and gives defines when and how to use tags like etc. If you have questions like these definitely pick this book up as it will help clear up the confusion. Also as far as goes there is not much difference between it and as is suppose to be used for grouping of thematically similar content. The difference between the two is that has no semantic meaning and doesn't tell you anything about the content whereas section does. -- Jason Arnold http://www.jasonarnold.net *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
On Fri, Aug 13, 2010 at 5:53 AM, Chris Knowles wrote: >> a 'div' definitely has meaning, ie: it is a division of one part of >> the page, from another; whether it is used for other behaviour, >> doesn't preclude it from from its original meaning. > > but when everything is in a div, div ceases to have much meaning. It simply > says theres a bunch of things on the page that are separate to each other > without giving any clue as to what they might contain > >> Similarly, a #id was originally designated as the location within a >> page, not for CSS -> semantically it is to reference a particular >> piece of information, within the bigger piece of content, eg: a >> "section" header maybe... It just so happens that it works really >> well for CSS too. And simplifying content manipulation. And so on. > > but in the context of the question, the reason to use , for > instance, vs , is to add meaning to the markup > >> I'm not sure why you would infer that information in section's, is any >> more important than stuff written in a div? Can you elaborate? >> ie: assistive technologies can already target div's, so using that >> argument needs more. > > I didn't intend to infer that, I was just trying to show how is > more useful because it can be programmatically accessed in a way that id=section> can't. With regard to relevance of content, I was just trying to > say that a search engine *might* choose to weight content in a given tag > more than in another, whereas if everything is in a div it's harder to do > this. A better example would have been to have said that the content in > *might* be more relevant to a search engine than the content in > - compared with and which would be > harder to tell apart. > > -- > Chris Knowles > > > *** > List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm > Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm > Help: memberh...@webstandardsgroup.org > *** > > THanks all -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
a 'div' definitely has meaning, ie: it is a division of one part of the page, from another; whether it is used for other behaviour, doesn't preclude it from from its original meaning. but when everything is in a div, div ceases to have much meaning. It simply says theres a bunch of things on the page that are separate to each other without giving any clue as to what they might contain Similarly, a #id was originally designated as the location within a page, not for CSS -> semantically it is to reference a particular piece of information, within the bigger piece of content, eg: a "section" header maybe... It just so happens that it works really well for CSS too. And simplifying content manipulation. And so on. but in the context of the question, the reason to use , for instance, vs , is to add meaning to the markup I'm not sure why you would infer that information in section's, is any more important than stuff written in a div? Can you elaborate? ie: assistive technologies can already target div's, so using that argument needs more. I didn't intend to infer that, I was just trying to show how is more useful because it can be programmatically accessed in a way that can't. With regard to relevance of content, I was just trying to say that a search engine *might* choose to weight content in a given tag more than in another, whereas if everything is in a div it's harder to do this. A better example would have been to have said that the content in *might* be more relevant to a search engine than the content in - compared with and id=sidebar> which would be harder to tell apart. -- Chris Knowles *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
> Tom, I think the answer to that is semantics - div has no meaning. Id's are > there for you to manipulate the look and behaviour, the tags themselves > offer a way for third parties to glean meaning from the page. e.g you could > build an overview of a page by grabbing the first bit of text inside each > , assistive technologies can benefit from knowing what part of the > page is the main part, header, footer, asdie or google might give greater > weight to any text inside a etc. That is definitely one person's interpretation... :) a 'div' definitely has meaning, ie: it is a division of one part of the page, from another; whether it is used for other behaviour, doesn't preclude it from from its original meaning. Similarly, a #id was originally designated as the location within a page, not for CSS -> semantically it is to reference a particular piece of information, within the bigger piece of content, eg: a "section" header maybe... It just so happens that it works really well for CSS too. And simplifying content manipulation. And so on. I'm not sure why you would infer that information in section's, is any more important than stuff written in a div? Can you elaborate? ie: assistive technologies can already target div's, so using that argument needs more. As with all things, use the most appropriate tool for the job. cheers, Mathew Robertson *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Getting my feet wet in HTML5
Tom, I think the answer to that is semantics - div has no meaning. Id's are there for you to manipulate the look and behaviour, the tags themselves offer a way for third parties to glean meaning from the page. e.g you could build an overview of a page by grabbing the first bit of text inside each , assistive technologies can benefit from knowing what part of the page is the main part, header, footer, asdie or google might give greater weight to any text inside a etc. The problem is that IE currently doesn't recognise these tags, but if you do this for any element it does... document. createElement(‘ header’ ); document. createElement(‘ nav’ ) ; document. createElement(‘ article’ ) ; document. createElement(‘ footer’ ); or use this which includes it... http://remysharp.com/2009/01/07/html5-enabling-script/ except the issue here is that it makes your page dependent on javascript. Without it some elements will be styled in IE, some won't (the above comes from Introducing HTML5 by Remy Sharp and Bruce Lawson) -- Chris Knowles On 13/08/10 6:38 AM, Tom Livingston wrote: List, Here's a theory question ( i think) for ya. I'm working on a layout, and am attempting to use and. Properly, I believe. But as I look at my layout, I'm thinking "ok, i'll put an ID on this section, and one on that section..." and I stopped and thought "Uh oh... it's the same as i've always done with etc. Am I wrong? Is there still benefit to using... I don't wanna just substitute div for section... am I way off track already?? help... *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
[WSG] Getting my feet wet in HTML5
List, Here's a theory question ( i think) for ya. I'm working on a layout, and am attempting to use and . Properly, I believe. But as I look at my layout, I'm thinking "ok, i'll put an ID on this section, and one on that section..." and I stopped and thought "Uh oh... it's the same as i've always done with etc. Am I wrong? Is there still benefit to using ... I don't wanna just substitute div for section... am I way off track already?? help... -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
