semantic-markup

I'd like to use a definition list as simple as: <dl> <dt>name:</dt> <dd>Tomas</dd> <dt>address:</dt> <dd>this is a very long wrapping address</dd> <dt>age:<dt> <dd>29</dd> <dl> to render something like: name: Tomas address: this is a very long wrapping address age: 29 The definition list seems semantically the best option here. Using the new run-in display style will do the trick: <style> dt { display: run-in; } </style> But this isn't widely supported yet. How can I style my definition list for better cross-browser support (ie6 not necessary), without changing the html (currently I use

When using <dl> lists to associate keys to values, is there a semantic difference between these 2 samples? Which one provides better semantics? What do multiple <dd> tags imply in this context? Sample 1 : Multiple <dd> items. <dl> <dt>Authors</dt> <dd>John Lennon</dd> <dd>Paul McCartney</dd> <dt>Genres</dt> <dd>Pop</dd> <dd>Rock</dd> </dl> Fangs output: Definition list of two items Authors equals John Lennon equals Paul McCartney Genres equals Pop equals Rock List end Sample 2 : Single <dd> contains <ul> <dl> <dt>Authors</dt> <dd> <ul> <li>John Lennon</li> <li>Paul McCartney</li> </ul> </dd>

I have read that an <h1> tag is inappropriate for a logo . But if your logo is plain text, what should you use? I feel like <p> and <span> are also unsuitable. Here's a sample: <header> <nav> <a id="logo" href="."> <span>Company Name</span> </a> <a id="linkOne" href="#thingOne"> <img src="…"> </a> <a id="linkTwo" href="#thingTwo"> <img src="…"> </a> <a id="linkThree" href="#thingThree"> <img src="…"> </a> </nav> </header> Thanks! unor Given your markup example, you seem to ask about a link in the nav element. If that’s the case, you should not use a heading element for it, because the heading

I am building a new site and I have recently started looking at the Document Outlining Algorithm. It states that all sections should have a header, sections include section , nav , article and body (There are probably some more too). So, I have a couple of navigation areas and my question is; would it be wise to have a heading but just hide it from the browser? unor Every sectioning content element "longs" for a heading element ( h1 - h6 ). But you are not required to provide one. If you don’t provide a heading element for a section, this section will have an implied heading . HTML5 outline

I need to display the duration of a video. Should I use <time> or should it be used only for displaying time as in a clock? Example Is this correct HTML5? <p>Duration: <time>3:30 min</time>.</p> Or should <time> be used only on a situation like this? <p>Good morning. The actual time is: <time>9:45</time></p>. Docs MDN presents the following definition: The HTML element represents either a time on a 24-hour clock or a precise date in the Gregorian calendar (with optional time and timezone information). This element is intended to be used presenting dates and times in a machine readable format.

When posting a link to a website in Facebook (Google+ and the rest count too) you're given a thumbnail, or selection of thumbnails to choose from. These are tags from the HTML. I've always been of the opinion that it was good practice to make my logo a background image inside a h1 tag using CSS. I make the h1 tag a link back to the home page and hide the header text with something like {text-indent: -9999px}, leaving a lovely semantic HTML header. Here's a link to my site if you want a look: http://tempertemper.net The problem with this is that as it's a background image it's overlooked. Would

I'm Making a form with multiple inputs where I need to give lable of form element inside input itself and I'm using like this An example <form class="TTWForm"> <input type="email" name="email" required="required" placeholder="Email Address"> </form> And above code is Valid in W3C validator for HTML5. Does Label not require in HTML 5? If I'm using HTML5 Placeholder to show label inside input is that ok? Does label still required along with placeholder to make it screen reader compatible? HTML validators will not check accessibility. Valid HTML can still be inaccessible or less than optimal.