HTML and CSS Reference
In-Depth Information
Avoid a Case of “Divitis”
When writing HTML, it is easy to get carried away adding a <div> element here and a
<div> element there to build out any necessary styles. While this works, it can add quite
a bit of bloat to a page, and before too long we're not sure what each <div> element does.
We need to do our best to keep our code lean and to reduce markup, tying multiple styles
to a single element where possible. Additionally, we should use the HTML5 structural ele-
ments where suitable.
BAD CODE
Click here to view code image
1. <div class="container">
2. <div class="article">
3. <div class="headline">Headlines Across the World</div>
4. </div>
5. </div>
GOOD CODE
Click here to view code image
1. <div class="container">
2. <article>
3. <h1>Headlines Across the World</h1>
4. </article>
5. </div>
Continually Refactor Code
Over time websites and code bases continue to evolve and grow, leaving behind quite a bit
of cruft. Remember to remove old code and styles as necessary when editing a page. Let's
also take the time to evaluate and refactor our code after we write it, looking for ways to
condense it and make it more manageable.
CSS Coding Practices
Similar to those for HTML, the coding practices for CSS focus on keeping code lean and
well organized. CSS also has some additional principles regarding how to work with some
of the intricacies of the language.
Search WWH ::




Custom Search