The Reese News Lab functioning at the School of Journalism and Mass Communication at UNC Chapel Hill has been studying ways and means for content creators to adapt to the increasing number of mobile phone users. They recently experimented with WhichWayNC.com, which is a mobile-first news site. An in-house team comprising reporters, designers and programmers helped create content for the site. The experiment was about optimizing the content for mobile phone users. They also came out with an e-
publication entitled News on the Go: Field Notes on Storytelling for Mobile Devices that gives a concise idea about the findings.
Designers are aware that the small screen in a mobile phone allows the users to view only a few lines of content at a time, creating the need for scrolling frequently. Although the research team assumed that the users would prefer short, specific content, they were surprised to find that almost 17% of the users were patient enough to scroll down to the last word, as compared to 22 percent of the desktop users, who did the same thing.
The important difference between mobile and desktop users is that the former can view content anytime, anywhere, whereas desktop users need to be tethered to one place. Moreover, anytime boredom takes over, phone users start fiddling with their phones, often browsing the Internet casually.
Studies conducted by the Pew Internet & American Life Project indicate over 42% of the mobile phone users turn to their phones whenever they are bored, and catchy content will hold the attention of these bored folks.
Avoid wide-shot frames in your video and photo stories, because what looks captivating on a movie screen is often lost on a tiny phone screen. Hence, stick to close-ups or medium shots that give you a chance to make a better impression. Moreover, just because the screen you have to contend with is small, you do not have to worry too much about having to shrink the content to match. Instead, focus on taking advantage of the device having immense potential due to its mobility. You could think about content pinpointing users’ location.
Optimizing Your Mobile Site for Page Speed
There are several factors that need to be considered while designing a mobile-friendly website. There are several tools that you can use for this purpose in order to achieve the desired optimization levels. A very important factor you need to take into consideration is the time your page takes to load. If it is going to be painfully slow, you run the risk of losing customers. When compared to desktop sites, mobile versions of these sites are at a disadvantage. With mobile sites you need to contend with slower network connections, a browser cache memory that is comparatively smaller, JavaScript can parse very slowly, as will HTML as well. As early as 2012, Google developed an online tool for taking a mobile friendly test. Also, the Page Speed Insights tool which gives you the speed score of your website along with suggestions on how you can improve the load time.
Mobile caches have a limitation, and cannot hold as much content as a desktop browser can. The slow page loading can be attributed to the mobile site’s browser caching. There is a solution for the problem now, thanks to HTML5 Web Storage Application, which most mobile browsers use. With the Chrome cache, on the other hand, the cache size is dependent on the amount of disk space at its disposal, because it is dynamic. Some mobile browsers are capable of using local memory for caching resources, thus doing away with the need for any server requests.
Storing your mobile site’s resources externally or even linking them can be avoided when the site is not cached on mobile browsers. These can be embedded on the site’s HTML itself, though this could lead to an increased page size. This could directly affect the speed of your site, which is not desirable. To negate this, you’ll have to use any web application that lets you embed resources in the HTML itself. Try Mobile Optimizer, which is an application meant to do exactly this. Another way to speed up the loading of
mobile web pages is to use mobile browsers. Here are some sites like TwitterBootstrap, HTML5BoilerPlate and 52Framework which are good for documentation and downloading for CSS3 and HTML5 framework.
It is not advisable to include images on a mobile website as the screen space crunch is a major disadvantage. Go for a simple layout that is free of images, in case there is a need to include images, opt
for increased bandwidth space as well as processing time. Try using tools like JPEG & PNG Stripper, Smush.it, Online Image Optimizer, and SuperGIF to optimize images on your mobile site. It would also be a great idea to avoid using click buttons on your mobile site, as there is a painful wait after the users click. Instead use touch events that are a lot faster. Check out this link to know more about touch events.
Common Mistakes to Avoid
Smartphones, and several other hand held devices do have some limitations that often put off users who will shun your website. Any user will look for an alternative site that is mobile-optimized, and the user is bound to go to your competitor. There are a few basic things that you need to remember in order to retain users, who are potential customers. One thing that is very irritating and can put off most users is when the scrolling never seems to end on a site. Similarly, the pinch-to-zoom feature can often misfire, and lead to frayed nerves. Any user will prefer a website that can be conveniently viewed on their mobile devices. They do not like the idea of having to adjust their devices to suit your site. Hence, if
the content is too lengthy, split it into several web pages instead of making the user scroll on and on. Have a read at the common mobile friendly mistakes to avoid compiled by Toronto Web Designers, SEO Royals.
Although there is limited space at your disposal, you need to display the CTAs or the calls-to-action buttons prominently. Whenever a user inquires about your services, signs up for a newsletter, or adds his or her name to a mailing list, it indicates the interest that is shown in purchasing a product or service.
Hence make sure your CTA buttons are spread out on the web pages prominently, prompting the users to click instantly. It would be a great idea for ecommerce companies to ensure that the checking out process is rendered fast and user-friendly enough to be managed by lay people. Checkout pages too need to be optimized for mobile devices lest you lose on conversions and sales.
Similarly, there are several website features that work brilliantly on a desktop or laptop, but are not the same when viewed on a mobile screen. These features include drop-down menus and menu bar
functionality. The menu bar is the bread- and-butter of any website. It is the storehouse of navigational data that help Google or other search engines index the website properly. Importance has to be given to the menu bar when it is implemented into mobile optimization. Instead of a single menu bar, think of using an icon that can display three bars. This will tell the user that the menu is expandable, check out this responsive menu plugin called MeanMenu which tells you a lot about this option.
Displaying contact information prominently is another important thing that most people miss out on while optimizing a mobile site. Other information regarding how to place an order, what to buy and when, need to be displayed clearly on the homepage. There is no point in jumbling too much irrelevant information in such a small space, and letting the user hunt for vital bits of information they actually need.
Also See:
