Reusable HTML in practice

Logo Smashing Magazine

Niels knows good HTML and isn’t afraid to share his best practices with the world. The article that was published in Smashing Magazine is another contribution to the community of front-enders. And just like the proof of the cake is in the eating, the best test for good html components is their degree of reusability and robustness, dixit Niels.

Too many projects, too little time and a healthy drive for efficiency is what makes Niels think before developing. Experience has taught him that he should write good, versatile and reusable HTML components that are independent from project-specific requirements and that stay as close to pure HTML as possible.

In his article Niels elaborates on a practical example (content type) that even laymen and –woman can understand: how to define the HTML components that make up a story. Easy enough, since we all know what the typical elements of a story can be.

Niels starts by defining the root component (story) and its various views (shortlist, thumb, summary, detail). He goes on by defining the logical units that make up the story: heading, thumbnail, abstract, action links, metadata, related stories and the actual content. So far so good. He then adds the structural containers to define hierarchy and builds the master HTML component. To finish, he adds the microdata that are HTML5 compliant. This results in legible, ready, reusable and lay-out-independent code.

Curious to learn more? Read the full article at

More news

How to get on top of your website’s performance

Picture of running contest with athlete in starting blocks

A faster website only bears fruit. Like we’ve told before: your customers’ time is your money. As your website loads faster, less people will abandon your website, they will stay longer and ultimately your bounce rate will benefit. A good performing website even impacts SEO, making sure it’ll be easier for (potential) customers to find you. A faster website improves conversion, it increases visitor satisfaction and it reduces visitor abandonment.

more about this news article