Second Part Now Uploaded! Read It Here.

Anyone else here old enough to remember the 1999 era of web design?

Half-supported standards, browsers with spectacularly funny quirks, absolutely no standard resolution whatsoever, oh, and half your audience is still on a 56k modem?

Well, the good old days are here again – with mobile.

Browser resolutions ranging from 240×320 to 640×1136? Check.

Design standards that should work, but don’t? Check.

Really, really limited bandwidth? Check.

Fortunately, I did go through it all the first time around.

And in this tutorial, I’m going to show you exactly how to navigate the pointy-rock-filled waters of mobile design to make a mobile landing page that actually works on every device you care about – unlike 97% of your competition.

What we’re going to do

In this tutorial, I’m going to take you through the process of designing a simple mobile lander. It’s loosely based on one of Stackman’s landers from this excellent post.

The tutorial’s split into two parts.

In this first part, I’ll take you through designing a lander focused on a single phone, but using intelligent responsive design to ensure you won’t have major problems on other devices.

In part 2 (here it is), we’ll dive into testing on BrowserSta ...

This thread has 97 more replies.
WANT TO SEE THE REST?

Join STM Forum