Mobile devices have surpassed all other forms of computing devices when it comes to Internet access. No longer are desktop and laptop computers the only means by which individuals can surf the Web, create emails, or view their favorite social media sites. With this surge of mobile device usage, web developers, software programmers, and hardware manufacturers are now challenged to create user experiences that equal the utility of the original large computing devices. This presents problems in software and hardware design that must be explored so that users of large-screen machines are presented with a similar usable and pleasing experience on small-screen devices. This paper will examine the various challenges and suggested changes that should be implemented to create rich environments that mobile users can appreciate when they access the Internet.
The Internet has moved from the desktop to the streets and sidewalks of the world. No longer is a person restricted to a static location in order to get information or access their favorite media. In a recent study, Walker Sands Communications estimated that the mobile portion of all Web traffic increased from just 12.59% in 2011 to 23.14% in 2012 (Dundar, Yumusak, & Arsoy, 2013). This means there is an ever-increasing load being placed on the infrastructure that supports Web access. The congestion, and the subsequent slowdown, in web page rendering will only continue, therefore most users will be presented with a pitiable to mediocre web viewing experience.
The problems that increased mobile traffic presents are outlined in this paper. Along with those issues are solutions from several sources. Each resolution will be a factor in how functional Internet usability will be in the future. Without these implementations, the World Wide Web will come to a crawl due to the growing demand being placed on it from a combination of mobile and fixed access points.
Challenges and Trends in Mobile Web Development
Usability does matter
One area that has seen an increase in the use of the Internet over the past decade is education. With the proliferation of relatively cheap mobile devices, such as the Apple iPad, learning has gone from the classroom to the anywhere there is a wireless connection. Mobile learning has become a multimillion-dollar industry (Martin, Pastore, & Snider, 2012). Along with that explosion of people wanting to increase their knowledge, comes the need to explore ways to make instruction usable on smaller devices.
The educational system is not the only area that requires more from smaller devices. The same holds true for businesses. Usability, which can be described as how easy a device’s interface is to navigate and present data, is important when decisions rest on the availability of specific information at a moment’s notice (Martin, Pastore, & Snider, 2012). Limited screen size plays an important role in the development of websites for mobile devices. When information is restricted to small screens, or viewports, then the developer of the site must determine how to present the content.
Responsive web design
Responsive web design, which was first described by developer Ethan Marcotte in 2010 as a way to make a website pleasing to view on any screen size, is a one method to create visually appealing content for mobile devices (Kim, Responsive Web Design, Discoverability, and Mobile Challenge, 2013). With the use of coding called media queries, specific styles can incorporated into web pages depending on the screen size. It will not matter if the device has a 480, 768, or wider, pixel display, because the web page will render in a way that makes the content fit the device’s screen. This can be accomplished by reducing the size of text and images, moving certain elements for better spacing, or eliminating objects altogether from web pages.
Another route to take, which disregards the use of responsive design, is the creation of websites that are dedicated specifically for the mobile or the desktop platform. These are static sites, which do not reposition or change content to fit various screen sizes. In principle, one site will not fit all. In this practice, websites and their content could be developed with the requirements of smaller devices in mind, such as for tablets and mobile phones. Although the development of separately rendered sites would be a big undertaking in person-hours, the content would be guaranteed to work without major difficulties (Power, 2012).
While deciding whether to use responsive or static design is a major concern when planning a website, another area to consider that affects performance is the content itself. A study performed by Troy Johnson and Patrick Seeling at Central Michigan University, presented data that shows web page sizes have increased over a two-year period from June 2011 to June 2013. For mobile sites alone, this growth amounted to 40% per year (Johnson & Seeling, 2013). The main component creating this upsurge in web page size is the image content. Not only is it the amount of images being requested per page load, but in addition, how well those images are optimized.
Image color and quality optimization can be controlled through the design process in graphics software, such as Adobe Photoshop. Moreover, best use of images for mobile Web should include practices recommended by Kate Matsudaira (Matsudaira, 2013), such as using CSS for decoration. By incorporating CSS specifications for shadows, borders, rounded corners, and other effects, the image file sizes can be reduced, which in turn means faster download of those elements from the server.
With tighter standards, web design will come to the point where developers will be able to concentrate more on the content than on specific browser requirements. The latest standard is HTML5, which should be an official recommendation by the World Wide Web Consortium (W3C) in 2014. Yet, as this newest revision takes the stage, future specifications are being considered by the Consortium (Anthes, 2012). These specs will incorporate even more functionality for mobile devices.
There have been slow but steady advances to accommodate computer users with disabilities. Over the time that the technology has been available, developers and manufacturers have been at work to improve access for everyone. Web standards have continued to revolutionize the desktop experience so that the Internet is no longer out of reach for the disabled. As websites and web applications move beyond the stationary desktop, there is a call for developers to focus their efforts on creating an enhanced mobile usability.
In order to guarantee mobile assess for the disabled, new specifications must be created by the authorities that set standards. The W3C Web Accessibility Initiative (WAI) reviews those specifications for accessibility and makes recommendations for revisions. Within a subgroup called the HTML Accessibility Task Force, there have been developments in the structure of HTML5 that support alternative multimedia and textual presentations. These elements will provide the disabled with improved ways to interact with websites. Assistive devices, such as screen readers, will take advantage of the updated language by offering those with debilities a substitute experience that will fulfill their needs.
HTML5 includes many accessibility specifications that will become the official W3C standard in 2014. Nevertheless, even though that standard is not yet in affect, as many as 34% of the top 100 websites are now using HTML5 as their structural language (Abou-Zahra, Brewer, & Henry, 2013).
In the future, mobile device manufactures will release products that will be able to handle information efficiently with robust processors and visually appealing displays. Along with the device makers, telecommunications companies will improve their infrastructure so that wireless signals can offer greater speed and reliability.
According to Kim (Kim, The Mobile Shift, 2013), mobile web usage will continue to expand as the public adopts smartphones and tablets as their primary sources for information. With this increase in demand, developers must continually upgrade their skills and employ the newest technologies to ensure proper rendering on smaller devices.
Best practices include the use of the latest standards of HTML5 and CSS3, the production of responsive layouts, optimizing images using Photoshop or graphics applications, writing smaller scripts to alleviate the bottleneck in processing, and the inclusion of standards for users with disabilities. While this is not a complete list, developers can be confident that, by using these principles in their work, they will be providing a greater web experience for their visitors.
Abou-Zahra, S., Brewer, J., & Henry, S. L. (2013). Essential components of mobile web accessibility. W4A '13 Proceedings of the 10th International Cross-Disciplinary Conference on Web Accessibility (pp. 1-4). New York: Association for Computing Machinery.
Anthes, G. (2012, July). HTML5 Leads a Web Revolution. Communications of the ACM, 16-17.
Dundar, B., Yumusak, N., & Arsoy, S. (2013). Guided-Based Usability Evaluation On Mobile Websites. ICIW 2013: The Eighth Internatioanl Conference on Internet and Web Appllcations and Services (pp. 213-217). Istanbul: IARIA.
Johnson, T., & Seeling, P. (2013). Desktop and Mobile Web Page Comparison: Characteristics, Trends, and Implications. Mount Pleasant: Central Michigan University.
Kim, B. (2013, August/September). Responsive Web Design, Discoverability, and Mobile Challenge. Library Technology Reports, 29-39.
Kim, B. (2013, August/September). The Mobile Shift. Library Technology Reports, 5-8.
Martin, F., Pastore, R., & Snider, J. (2012, September). Developing Mobile Based Instruction. Techtrends: Linking Research & Practice To Improve Learning, 46-51.
Matsudaira, K. (2013, March). Making the Mobile Web Faster. Communications of the ACM, 56-61.
Power, M. (2012). Delivering Web to Mobile. Bath: UKOLN.
Zakas, N. (2013, April). The Evolution of Web Development for Mobile Devices. Communications of the ACM, 42-48.