Mobile Web Design

Mobile devices are limited by display size and require a different approach to the content layout.

A variety of different screen sizes exist across mobiles, tablets, desktops, game consoles, TVs, and laptops. Screen sizes are always changing, so it’s important that your site can adapt to any screen size, today or in the future.

Optimise text for reading

An ideal column should contain 70 to 80 characters per line.

Each time the width of a text block grows past about 10 words, it’s best to add a breakpoint.

Don’t hide content

Have a think about what content you may hide or show depending on the screen size.

It’s recommended to show all content by default – don’t hide content because you can’t fit it on the screen.

Hiding product information on an e-commerce website may have a negative impact as users can’t find the answer to their question. For example, what size a TV is.

Use CSS media queries

Media queries are filters which can be applied to CSS styles within the code.

These queries make it possible to change styles based on the characteristics of the mobile device displaying the content, including the display type, width, height, orientation and resolution.

Use relative sizes for images

It’s recommended to use relative units when specifying image widths to stop them from overflowing the viewport. For example, width: 50%; causes the image width to be 50% of the containing element (not 50% of the viewport or 50% of actual pixel size) See more about responsive images

Quick tip: CSS allows content to overflow its container, so you may need to use max-width: 100% to stop images and other content from overflowing.

Frequently asked questions

Yes, all of out web design builds are optimised for android and iOS.

Yes, we compress and speed up any content on your website. We then analyse the speed improvements via Google Site Speed Test Tool.

We can do all types of improvements, from migrations to navigational updates. We know how to optimise text, image and video content to best appear on your website, for users and search engines.

We essentially design 2 websites during the design stage, however, we do not priotise the mobile site over the desktop site, both are just as important.

Depending on the requirements, we may take up to 4 weeks to design and build a new website.

Do you have a project in mind? Get An Estimate for your campaign

Speak to our dedicated and experienced project managers to begin planning your digital campaign today.