Tips to Create a Mobile-Friendly Web Design


The days of building websites especially for desktop and laptops are over. Now users are able to access your website from a variety of internet-enabled devices including smartphones, tablets, etc. Accessing the web from mobile devices is far from new. However, the popularity of smartphones and cheaper data packages from several network providers have driven a very sharp rise in mobile data usage, which is not just reserved for the latest and greatest smartphones.

As a website owner, mobile devices offers some fantastic features, which are not available on the desktop such as clicking a hyperlink in your website to call your phone number, or adding your contact details to an address book in the device . And with more advanced devices, a mobile website can provide more targeted, location-aware content and information for the visitors.

Tips to make your website easily accessible on mobile devices:

  • Don’t ever try to make a separate website for mobile:

In the past, when web designers designs a website for mobile, they have generally cut out most of the content to fit for mobile use and have also done arguments that which part are more suitable for mobile user. However, we can’t decide accurately what kind of content our users want.

  • Use responsive design:

Responsive design allows the website developers to create a web design that will be easily view able on several devices ignoring the size of device. This has reduced the amount of work website developers have to do when they have to create a website for different devices.

  • Always include a viewport meta tag:

The viewport is basically a virtual area which is used by the browser’s rendering engine to determine how the content is scaled and sized. Without it, your site will not work properly on a mobile device. The viewport Meta tag tells your browser that the page needs to be fit according to the screen.

  • Font sizes and button size matters:

The font size and button size used in a web design matters a lot for the mobile device. The font size should be at least 14px and for buttons, the bigger is the button it reduces more chances that the user will miss it or click the wrong button by mistake.

  • Use high-resolution images:

Hi-resolution images are extremely important on your responsive websites to ensure that the user’s experience is of a high standard. So always use extremely high-resolution images to avoid having pixelated or blurry images.

  • Remove the default zoom:

Auto-zoom can really destroy your layout elements, especially for navigation content and images. They may appear very small or too large in your layout. To avoid this, you may use viewport Meta tag to set up your custom variables within the content.

  • Use YouTube videos on your site:

If there are a lot of videos on your site, then the way your video is viewed on a mobile will be different and can sometimes it might be very difficult. By using YouTube videos, it is a great solution to combat any difficulties in viewing videos on mobile

iMedia designs | is an Ecommerce web design company for B2B and B2C clients. It offers cost effective web design and development services in Toronto.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s