Building a "Coming Soon" Page With HTML and LESS

Adi Purdila Last updated Jul 25, 2012

Read Time: 1 min

Having designed our Coming Soon page in Photoshop, let's now kick off the build process with some markup and styling. We'll speed up the whole process by using LESS - if you haven't yet used dynamic stylesheets I promise you'll want to after watching this!

HTML Markup

We'll begin by firing up Espresso (though you can obviously use whichever code editor you prefer) and setting out some markup.

Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via iTunes or YouTube!

LESS Styling

Now let's see about slicing up our PSD and styling the markup we've laid out. As already mentioned, we'll speed up the whole process by using LESS with LiveReload.

Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via iTunes or YouTube!

Additional Resources

20 Repeatable Patterns on Premium Pixels
Rounded Corners Done Right on Webdesigntuts+
Reset CSS by Erik Meyer
LESS: The dynamic stylesheet language
LiveReload

Complete Websites HTML LESS

Did you find this post useful?

Yes No

Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.

Adi Purdila

Adi Purdila is a web design instructor for Tuts+. With over 100 courses and 200 tutorials published to date, Adi's goal is to help students become better web designers and developers by creating content that’s easy to follow and offers great value. Being self-taught himself, Adi strongly believes that constant learning (academic or otherwise) is the only way to move forward and achieve your goals. When not typing away at his keyboard, he loves woodworking and caring for his ever-growing family of rescue pets. You can stay up to date with what he's doing by following him on social media or visiting his website at adipurdila.com.

adipurdila