Published on 15 May 2015 (Updated 15 May 2015)
The proportion of mobile Internet has been increasing enormously for several years. Smartphones and digital tablets have become essential media, which can lead to the loss of a significant number of visitors to a website. The statistics from some of our clients show that mobile visits are higher than those from the desktop in specific sectors of activity. Google now also penalizes sites that do not have a mobile version.
That’s why you now need a mobile website… But how to create one? How to work on it? What are the different technical ways to do it? Is there a quick fix? How to optimize your mobile site?
The dedicated mobile site
A dedicated mobile site is a site independent of the website visited from a computer. It is designed, developed, optimized, and adapted to be accessible on mobile/tablet interfaces. It has its own content and specific features. The mobile site chosen by the network of TCL (Lyon Public Transport) network is a great example.
The dedicated mobile site has its advantages in terms of the possibility of creating a site optimized for mobile. First of all, by completely adapting its pages and adding its own content and features only for mobile interfaces. Smartphones have, in most of the cases, recent web browsers. So we don’t need to worry about, for example, old versions of Internet Explorer (IE 7/8) with limited or outdated features!
In addition, the user experience of a dedicated mobile site is much more pleasant. Since the site is designed specifically for this platform, there are naturally fewer constraints and compromises.
Obviously there are also disadvantages. For instance, the URLs are different compared to the classic websites. As a result, the referencing service will certainly be less easy. Each URL will have a configuration that offers optimized pages for computers (base URL) and another corresponding URL for mobile use. It will be necessary to work on the code in order to integrate specific annotations and help search engines differentiate between mobile and desktop URLs.
It should also be noted that the maintenance costs will be higher, as there will be several platforms to modify.
Finally, it will also take longer to update and animate the site because the content will have to be integrated into both the classic and mobile versions.
Responsive design / mobile adaptability
Responsive design or mobile adaptability is a site that adapts to the size of the screen used by the user. Whatever the size of the screen, the site retains the same URLs, the same source code, and the same content. The contents are simplified, relocated on the page or simply disappear on the screen. The functionalities are also simplified. This is the case of Starbucks, another great example of responsive design. At Peexeo, all the sites we develop today are of Responsive Design.
The cost of developing a responsive design site will be higher than that of an older site that is not mobile-optimized. This is because it will be necessary to graphically design all the variations according to the breakpoints and determine the navigation principles for each of them, for all the pages of the site.
During production, it will be necessary to deal with issues related to the different environments (browser functionalities, mouse/keyboard…) and to pay attention to the performance. On the other hand, the cost of maintenance and content updates will be significantly reduced because there is only one site to modify for all terminals. This is an efficient solution to adapt to future devices. If new devices appear in the future, no operation will be needed to make the site adaptable to these new terminals. It should also be noted that nowadays, the use of the Internet is done increasingly on different terminals. Therefore, the optimization of the website is of great importance.
It is also recommended to take the loading time of the pages into account. If elements constituting the pages are not optimized (lightened), it can slow down the loading speed and thus affect the performance. This is because the connection of mobile terminals is less efficient than that of computers (ADSL, optical fiber… against sometimes 3G, Edge…). The hardware capabilities of mobile phones are also less reliable than those of a computer. On a responsive site, the problem of page loading will be more prominent than on a dedicated mobile site.
Good practices to follow
After several years of experience on projects carried out within the agency, we have come up with a non-exhaustive list of good practices to adopt when creating a mobile site.
- Keep it simple, and avoid unnecessary complexity (a simple product is easier to understand and master).
- Design an efficient interface and optimize the navigation (think about users on the move who will need information quickly).
- Be aware of the limitations of different terminals (small screens, 3G connections, small keyboards, low performance, color contrast, etc.).
- Start with the mobile version, using the essential elements, content and information, then expand as the screen gets bigger.
- Be flexible.
- Focus on the content (which remains the most important thing on a website) and prioritize it.
- Strive for simplicity (why make it complicated when you can make it simple?).
- Use the standards.
- Favour page templates and reusable interface elements.
- Respecting these practices is your best guarantee to be optimized on a maximum number of media.
Your service provider must also ensure that the different sectors of your business interact with each other. Don’t hesitate to exchange with him (or with us) to find the best solutions for your mobile site.
Our vision of mobile sites
Making your site adapted to mobile means making it accessible and intuitive.
Because nowadays, more than half of the Internet users use their smartphones for browsing and searching on the Internet. Given that the problem of page loading is more severe on a responsive site, it is wise to take the loading speed into account for greater visibility because 74% of mobile users abandon their visit after 5 seconds of waiting.
Responsive design has therefore the best balance between accessibility, user experience, referencing, and design & maintenance costs.
Send us a message to discuss your project with us 🙂