How to use an HTML boilerplate

HTML Boilerplate
(Image credit: html5boilerplate.com)

Welcome to Creative Bloq's guide to how to use a HTML boilerplate. When it comes to building a website, the underlying foundations are always typically very similar. So, instead of starting every new page from scratch it makes sense to use an HTML boilerplate that contains the essential HTML structure. It's a quick and easy way to start building any site, and it will save a lot of time and effort. (If you are starting a site from scratch, check out our favourite website builders).

Take a peek at the HTML code of a site or page and we guarantee you will see many of the same HTML tags (if you want to learn more, see our guide to HTML tags) that make up the basic structure of any web experience. Every webpage ever built will kick off with the <html> tag and it's almost certain that you will see the essential tags such as <head>, <title>, <body>, <p> plus many more. 

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

TOPICS
Craig Grannell

Craig is an editor, writer and designer. He writes about design and tech, specialising in Mac, iPhone and iPad, and has written for Creative Bloq, Stuff, TechRadar, MacFormat, The Guardian, Retro Gamer and more. You can view more of his writing on his blog, Revert to Saved

Latest in Web Design
A screenshot of the new YouTube UI
Yes, YouTube has a new UI. Yes, it's terrible
Adobe XD logo
It seems Adobe's given up on UI design (for now)
Adobe Muse
Why Adobe is frustrating web designers
Dropbox Relay interface with photo of man running
How Dropbox Replay is helping designers future-proof their practice
UX revolution
From 2D to 3D: How brands can harness the latest UX/UI revolution
Personal portfolio of Julie Bonnemoy with a retro vibe
From AI to no-code: The top web design trends for 2024 according to Designmodo
Latest in Advice
Light and Shadow Linking are perfect for developing the look of your images like Manu Järvinen’s cat model (CC0)
Give your Blender scenes more life by mastering the Light Linking feature
How to use Cinema 4D files in Atlux tutorial main image
How to seamlessly integrate Cinema 4D files into Unreal Engine
Main image for Poly modeling with an iPad tutorial
How to get started in 3D modelling on iPad to create video game assets and 3D art
Book cover designs
14 pro tips for creating eye-catching book cover design
Pietro Chiovaro Blender T-shirt tutorial
How to make a T-shirt in Blender
Paul Hatton KeyShot tutorial
Follow my KeyShot and Photoshop advice for perfect renders every time