HTML5 Boilerplate

HTML5 Boilerplate is an open source front-end template. It is a set of tools for building cross-browser websites that work with earlier browsers, while being HTML5 ready. It can be easily combined with Twitter Bootstrap.

HTML5 BoilerplateHTML5 Boilerplate (H5BP) is a professional open source front-end template. It is not a framework and does not impose any particular type of development. It is just a set of tools for building cross-browser websites that work with earlier browsers, while being HTML5 ready. HTML5 Boilerplate is perfect for those designers who want to get started with the new standard.

H5BP is quite popular front-end template because it saves time. Using it you can create adaptable and robust website with a set of HTML5-ready features and elements:

  • Icons. There is a ‘starter set’ of favicon and apple touch icons that can be later changed to custom ones.
  • Analytics. Optimized Google Analytics snippet is included.
  • Helpers. H5BP features a modern, HTML5-ready alternative to CSS resets - Normalize.css, as well as some other base styles, helpers, and print styles.
  • Media Queries. HTML5 Boilerplate encourages to adapt media queries based on the site content. Those who do not support such approach can simply edit or remove the placeholder media queries.
  • jQuery and Modernizr.
  • Crossdomain.xml and .htaccess (Apache web server configuration). Apache settings will improve site performance.
  • and many more.

HTML5 Boilerplate is a lean, mobile-friendly HTML template. It is easy to apply ‘Mobile First’ approach while building responsive websites. It contains placeholders for creating mobile styles adapted to different resolutions and screen sizes. In order to be aware which HTML5 or CSS3 features are supported by specific browsers H5BP uses Modernizr as a feature detection tool.

There are a lot of other popular tools designers work with, like Twitter Bootstrap or ZURB Foundation. They are intended for different uses than HTML/CSS starting templates but can be combined with HTML5 Boilerplate. The latter includes a collection of best practices, server configs and common inclusions for the initial HTML template, so you can add any other components, for example, print styles, CSS helper classes, or the whole Less/CSS toolkit from Bootstrap. Moreover, there is the Initializr project. It not only allows to choose which H5BP elements you want or don’t want to include, but also helps to automatically integrate HTML5 Boilerplate and Twitter Bootstrap.

The HTML5 Boilerplate is a starting project template and provides a consistent and explained base. At the same time it is designed to be interchangeable and adapted to the needs of each user. With this template newer components are simple to work with and can become a basis for a cutting-edge website. For more information visit H5BP website.

Connect with our experts Let's talk