Build a simple HTML page

Now that you've designed a page for your online store following the tips we gave you in last month's tutorial, the next stage is to build the HTML. As you've already given the store a vaguely Web 2.0 look, it's best to follow that through with some modern HTML. That means using semantic mark-up that degrades gracefully, which is just a fancy pants way of saying that you should split the relationship between a site's content and what it looks like.

You should aim to create the cleanest code possible, so here you'll take the brave step of doing most of the work directly with the source code. For this tutorial you'll use Adobe GoLive, although any application that lets you tinker with the source code directly, even a text editor, would do.

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

The Creative Bloq team is made up of a group of design fans, and has changed and evolved since Creative Bloq began back in 2012. The current website team consists of eight full-time members of staff: Editor Georgia Coggan, Deputy Editor Rosie Hilder, Ecommerce Editor Beren Neale, Senior News Editor Daniel Piper, Editor, Digital Art and 3D Ian Dean, Tech Reviews Editor Erlingur Einarsson and Ecommerce Writer Beth Nicholls and Staff Writer Natalie Fear, as well as a roster of freelancers from around the world. The 3D World and ImagineFX magazine teams also pitch in, ensuring that content from 3D World and ImagineFX is represented on Creative Bloq. 

Latest in HTML
Write HTML faster
How to write HTML code faster
HTML tags
8 HTML tags you need to be using (and 5 to avoid)
HTML tags
HTML tags: A guide to the basics
18 great HTML APIs – and how to use them
Convert Flash games to HTML5
Convert Flash games to HTML5
Build a simple HTML page
Latest in How to
Ivan Mironenko ZBrush character tutorial
Craft a game-ready character asset using ZBrush and Substance 3D Painter
Maya 3D abstract strands tutorial
How to easily create complex and abstract animation using Maya
Whiskytree battle damage effects tutorial
Create gnarly battle damage for vehicles using a mix of Maya and Nuke
After Effects lightning tutorial
How to use Adobe After Effects to create a lightning effect the easy way
Venusaur art
How to paint Pokémon's Venusaur in Photoshop
Babiru DaVinci Resolve colour tips; a red creature in armour, it has a large toothy grin, in the background is a cyberpunk style city
How to achieve a bold cinematic look in animation, using DaVinci Resolve and Fusion Studio