[WSG] HTM5 Semantic markup overly done?
Is this example overly done? http://playground.html5rocks.com/#semantic_markup section id=articles article header h2a href=#Article Title/a/h2 /header section Lorem ipsum dolor sit amet, /section /article article header h2a href=#Article Title/a/h2 /header sectiongiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. /section /article /section I thought this is suffice but then I am not sure as these HTML5 tags are still too new for me. section id=articles article h2.../h2 p.../p /article article h2.../h2 p.../p /article /section tee *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] HTM5 Semantic markup overly done?
On Fri, Oct 1, 2010 at 6:24 AM, tee weblis...@gmail.com wrote: Is this example overly done? http://playground.html5rocks.com/#semantic_markup section id=articles article header h2a href=#Article Title/a/h2 /header section Lorem ipsum dolor sit amet, /section /article article header h2a href=#Article Title/a/h2 /header sectiongiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. /section /article /section the only overly done part with the above example is the use of the section tag inside the article. I would use the p tag instead like in your below example, but the rest is good. Just remember that section is defined in the spec as a thematic grouping of content, typically with a header so you should also have a header in your section unless it truly doesn't apply. I thought this is suffice but then I am not sure as these HTML5 tags are still too new for me. section id=articles article h2.../h2 p.../p /article article h2.../h2 p.../p /article /section This one is okay except, IMO, that you should wrap the h2 in a header. Also just wanted to point out with HTML5 you can use all h1 tags in your articles instead of h2. And honestly I think any of those ways would probably be okay -- 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] HTM5 Semantic markup overly done?
Hi Tee, I thought this is suffice but then I am not sure as these HTML5 tags are still too new for me. section id=articles article h2.../h2 p.../p /article article h2.../h2 p.../p /article /section What about something like this? ol id=articles li article header h1a href=#Article Title/a/h1 /header pLorem ipsum dolor sit amet, .../p /article /li li article header h1a href=#Article Title/a/h1 /header pgiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum./p /article /li /ol -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] HTM5 Semantic markup overly done?
On 01/10/2010 15:22, Thierry Koblentz wrote: Hi Tee, I thought this is suffice but then I am not sure as these HTML5 tags are still too new for me. section id=articles article h2.../h2 p.../p /article article h2.../h2 p.../p /article /section What about something like this? ol id=articles li article header h1a href=#Article Title/a/h1 /header pLorem ipsum dolor sit amet, .../p /article /li li article header h1a href=#Article Title/a/h1 /header pgiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum./p /article /li /ol let's not get into list-itis again... ;) to answer the thread starter: there will probably be no clear single answer about what is and isn't too much semantic markup. it will come down to your own personal preference, i'd say...whatever you feel comfortable with (particularly as currently there's no practical benefit of using these new structural constructs - e.g. there's no crawlers looking specifically for articles to syndicate etc). 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] CSS support of HTML5 tags not ready yet?
HI,
Joined the chat a bit late, hope the following URL is helpful
without being redundant.
http://html5boilerplate.com/
___
Christopher Kennon
Bushidodeep
Principal/Developer/Designer
(w) http://bushidodeep.com
(e) field.ni...@gmail.com
(gv) 818.322.4513
On Sep 27, 2010, at 3:13 AM, tee wrote:
Only the two Webkit browsers are able to render the header and
footer correctly.
http://lotusseedsdesign.com/css-test/templegate.html
header {
height : 300px;
width : 980px;
text-align : center;
position : relative;
clear : both;
overflow : hidden;
margin : 0 auto;
border : 1px solid #369;
background : #ddd;
}
I can't find anything wrong with my style sheet and the html code.
tee
***
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] HTM5 Semantic markup overly done?
ol id=articles li article header h1a href=#Article Title/a/h1 /header pLorem ipsum dolor sit amet, .../p /article /li li article header h1a href=#Article Title/a/h1 /header pgiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum./p /article /li /ol let's not get into list-itis again... ;) hehe, I *knew* you'd reply to this ;) -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
RE: [WSG] HTM5 Semantic markup overly done?
I'm on the fence right now about headers. I've seen use of h2's without a header wrapper in a section. This gives screen readers structure, but it breaks the HTML5 outline methodology. Shouldn't you change it to an h1 when it goes in a header. It's a struggle between building good html5 code for the future and providing hierarchical headers h1-h2-h3 for the screenreaders. Ted -Original Message- From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On Behalf Of Jason Arnold Sent: Friday, October 01, 2010 6:12 AM To: wsg@webstandardsgroup.org Subject: Re: [WSG] HTM5 Semantic markup overly done? On Fri, Oct 1, 2010 at 6:24 AM, tee weblis...@gmail.com wrote: Is this example overly done? http://playground.html5rocks.com/#semantic_markup section id=articles article header h2a href=#Article Title/a/h2 /header section Lorem ipsum dolor sit amet, /section /article article header h2a href=#Article Title/a/h2 /header sectiongiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. /section /article /section the only overly done part with the above example is the use of the section tag inside the article. I would use the p tag instead like in your below example, but the rest is good. Just remember that section is defined in the spec as a thematic grouping of content, typically with a header so you should also have a header in your section unless it truly doesn't apply. I thought this is suffice but then I am not sure as these HTML5 tags are still too new for me. section id=articles article h2.../h2 p.../p /article article h2.../h2 p.../p /article /section This one is okay except, IMO, that you should wrap the h2 in a header. Also just wanted to point out with HTML5 you can use all h1 tags in your articles instead of h2. And honestly I think any of those ways would probably be okay -- 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 *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] HTM5 Semantic markup overly done?
On 01/10/10 20:03, Ted Drake wrote: I'm on the fence right now about headers. I've seen use of h2's without a header wrapper in a section. This gives screen readers structure, but it breaks the HTML5 outline methodology. Shouldn't you change it to an h1 when it goes in a header. The outline is dependent on the sectioning content[1] (article, aside, nav, section) - you don't need to wrap an h* element in a header for that. The header is only really needed if you're going to have content that isn't a h* element but is still part of the section/article header (eg. author byline, publish date etc.). Wrapping a single h* element in a header is technically correct but unnecessary IMO - might be useful if you wanted to attach style rules to it. Rob [1] http://www.whatwg.org/specs/web-apps/current-work/multipage/content-models.html#sectioning-content-0 *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] CSS support of HTML5 tags not ready yet?
I explored the html5boilerplate quite a bit, but decided to come up my own
template instead.
To its credit, it has some really nice stuff in there and I have adapted to my
template too, but there are a number of elements that I found that really
shouldn't be in there.
If you are using the template, you may want to get rid of these two:
body { font:13px sans-serif; *font-size:small; *font:x-small; line-height:1.22;
}
This one likely will get Felix Miata all heat up :-)
Apart from this, no typeface declared and default to sans or sans serif is not
a good approach. I have in a few occasions found it resulted very bad rendering
in IE from XP and Windows 7 via Parallel Desktop, however I have not run a
thorough test whether it's a combinations of @fontface declaration (with
font-wight:normal for headings) and Windows system in Parallel Desktop.
html { -webkit-font-smoothing: antialiased; }
This is best used only if a site has a darken background. For site that has
light or white background, it gives a false impression that the text is blur. I
get many feedbacks from clients that their customers complaint about the text
not 'clear' in Chrome browser (and Safari too - but no PC user uses Safari I
presume :-) ).
tee
On Oct 1, 2010, at 8:15 AM, field.ni...@gmail.com wrote:
HI,
Joined the chat a bit late, hope the following URL is helpful
without being redundant.
http://html5boilerplate.com/
___
Christopher Kennon
Bushidodeep
Principal/Developer/Designer
(w) http://bushidodeep.com
(e) field.ni...@gmail.com
(gv) 818.322.4513
On Sep 27, 2010, at 3:13 AM, tee wrote:
Only the two Webkit browsers are able to render the header and footer
correctly.
http://lotusseedsdesign.com/css-test/templegate.html
header {
height : 300px;
width : 980px;
text-align : center;
position : relative;
clear : both;
overflow : hidden;
margin : 0 auto;
border : 1px solid #369;
background : #ddd;
}
I can't find anything wrong with my style sheet and the html code.
tee
***
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
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***
[WSG] Margin At Bottom Disappears in IE8, Safari, Chrome
Hello All - I've got a 50px margin at the bottom of a project that - for reasons I can't figure out - disappears in IE8, Safari and Chrome. Looks as per spec in both FF and Opera. Go here to take a look: http://www.koisis.com/.clients/sangat/dev_v2/index.php Take a look first in either FF or Opera... If you scroll all the way to the bottom of the page, you'll see a footer nav below which is margin I'm required to achieve. Now take a look at the same area in IE8, Safari (PC) and Chrome... The margin disappears. I don't know if this is because I'm using body as the content wrapper (which maybe these three browsers don't like me to do) or just some css property I'm overlooking that these browsers need - my css does validate as per the web-developer extension is concerned. Any insight would be greatly appreciated! Cole *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
