5 rules to create the perfect landing page for a mobile site.
5 rules to create the perfect landing page for a mobile site
Responsive Web Design is playing an increasingly important role in designing sites that will look good on both computers and smartphones. RWD is not only a well-liked, aesthetically pleasing solution, but first and foremost a standard and requirement as a result of Google’s latest changes as to not positioning pages not adapted to mobile devices. Even if you are putting the creation of a mobile or responsive website in the hands of professionals, it is worth knowing a few principles to follow in creating the most ideal possible landing page, or landing page.
Here are 5 rules to follow when creating a RWD site with mobile in mind.
1. Be guided by simplicity.
More than once, writing about responsive websites, we have stressed the importance of keeping things simple and moderate. Both the visual aspect is important, so that the user can easily reach the information they need, but also the “weight” aspect is important. In terms of visuals, it makes sense to keep elements to a minimum – logo, header and footer, with links to each section. In addition, the site must not be overloaded with code that takes too long to load, because a mobile user’s patience usually runs out after three seconds.
If a page doesn’t load after that, the user will most likely close it and forget about it forever.
2. Hide unnecessary elements.
Mobile users visit the site for a specific purpose – they want to find basic information about the company’s activities, contact information, the location of the nearest office or contact data. All other elements are rather redundant. It’s a good idea to use media queries in CSS to hide unnecessary elements for mobile users, such as icons or long text, which would definitely lengthen the page displayed on mobile devices.
The elements will still be visible to desktop users.
3. Divide content into parts.
To make the site look good on desktops, it can be as wide as 1200 pixels. It is obvious that such a width has no way to fit on a mobile screen. Therefore, when designing a RWD site, it is worth dividing the width of the page into several columns, which on a desktop will read from left to right, while on a mobile device it will be arranged in one long column, allowing the content to be viewed from top to bottom.
4. Remember alt attributes.
The alt attribute is the text that will be displayed in place of the image, in case the image does not load. There is a possibility that images will not display correctly on all mobile devices. Therefore, it is worth ensuring that instead of an unloaded image there is an alternative text that textually supplements the content that was supposed to appear on the graphic.
