Website Optimization for Mobile: Size, Font & Legibility

In our previous article you read why it is so important to optimize your brand website for mobile devices. To reach your clients easily and more in quantity this is a crucial step that has to be taken. We also mentioned 3 tips in order to do this which were;




  1. Making sure that your website is readable on a small screen, paying attention to font, sizes and images.

  2. Reducing load times to make sure your website loads seamlessly even on slower mobile connections. This means getting rid of large hi-resolution images on your mobile website.

  3. Automatic redirection to the mobile version of your website when a mobile user visits your website.


Let me elaborate the first point by giving tips to make your website visually better looking on mobile devices. The mobile version of a website needs to be easier to skim, navigate and readers need to be able to find exactly what they are  looking for. The full website may be detailed and flashy but the mobile version needs to be simple. Let’s look at an example of The New York Times website:


                     


Seeing the two images above you can tell that the top left image is the standard website that shows a lot more content, with numerous links and a packed sidebar and a small search bar on the top left of the page. On the other hand the top right image shows the mobile website with bigger images, text and navigation links. It is a lot simpler with less content and a larger search bar in the middle of the page to make sure users can quickly find what they are looking for. This is a great example of how a mobile website should be like.


With this example it can be seen how important legibility is on mobile website. You need to consider your clients who will be looking at your website on a mobile device  on a small screen. They need to be able to see and read the content easily without having to zoom in which would make it difficult to get around.


Similarly you also need to take into account the font that is used on this website to make sure it can be read easily. Specially designed themes are also available for websites and a term called “responsive  websites” can be used that actually adjusts your website to different screen sizes. The design is automatically optimized for big desktop screens, tablets and small smartphone screens. With these simple tips, that you can easily incorporate in your website, will make it a lot easier for your customers to get around and have a better experience when they visit your website which can in return boost your business!





With that said stay tuned for next week where we will take you through how to reduce loading times, the next step to optimize your website for mobile devices!

Visit: Toronto Web Design and Development

Written by: Shizra Saqib

Popular Posts