How To Design a Mobile First Webpage

Start By Thinking About The Whole Website

A visitor to your website is there to solve a particular problem, he or she has not pitched up at your virtual doorstep because he has fallen in love with your site and wants to scroll around it all day.
So your overarching aim must be to provide a journey from your landing page to the solution to your visitors particular need with the mimimum fuss and distractions.

Visitors to your site may have arrived there by a variety of ways:

  • Via a search engine.
  • Through email outreach.
  • Use of advertising etc.

Depending on the details you may require differing landing pages that are dependent on the route by which your visitor has arrived.

Draw up a plan for your pages and content. On a spreadsheed list your pages and summarize the content to go on each page.

Mobile First – What Content will you need?

Smarphone screens are relatively small and users are usually browsers so verbage is out and concision, brevity, laconicism, or conciseness is in. Keep it short and to the point.

WebPage Layout

The next step would be to use something like Giffy to sketch out page layouts for both smartphones and desktops, including elements such as headers, footers, content areas and navigation

Resources

Udemy Courses