StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>The article referred to by @Lee Theobald is a good start.</p> <p>Some basic ideas I try to keep in mind when marking up:</p> <p><strong>Regarding html:</strong></p> <p>Try to write for the next person - that is, think about how easy or difficult it might be for someone else to come and pick up your work and carry on. </p> <p>To support this principle, you should try and make sure your markup is as legible as possible - class and id tags in particular should relate <em>as much as possible</em> to their intended content. In other words, try to use your tags to describe the kind of content they will have. </p> <p>For example, "Sub-navigation", "content" etc. </p> <p>The aim is to provide markup that someone can pickup having not looked at before and get a sense of the logical structure of the document.</p> <p>Also, try to avoid the addition of markup that is purely to achieve a visual effect. But bear in mind that any website that requires even slightly sophisticated styling is unlikely to be able avoid non-semantic markup, due to weaknesses in current implementations of CSS and browser-compatibility issues.</p> <p><strong>Regarding CSS files:</strong></p> <p>Many people divide their css up into sections using comments, separating them into functional or structural areas. So you might have a section for your header, your footer, or typography and so on. Others take this further and split css across files, having one for typography, one for layout etc. However, this can according to Yslow! can have a negative impact on page loading, due to increased http requests.</p> <p>I could write more, but as you can see I struggle to be concise. I hope this is of some use to you.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload