Abstract
Mobile-friendly web sites are designed to render well on all digital devices, including smartphones, desktop computers, laptop computers, and tablets. Creating a user-friendly experience on mobile devices require specific web design techniques. These techniques are designed to accommodate the small screens and other physical limitations of mobile devices. This article describes the three primary techniques for creating mobile-friendly web sites: responsive, separate URL, and server adaptive. It explains how each technique is implemented, the advantages and disadvantages of each, and their relative popularity. It also describes an emerging mobile technique called Accelerated Mobile Pages.
TopMobilization Techniques
Currently there are three popular techniques for developing mobile-friendly web sites: responsive, dynamic serving, and redirect to separate URL. These techniques are referred to by a variety of names so to avoid confusion this article will adopt the nomenclature utilized in Google’s Mobile Developer Guide (“Mobile SEO Overview,” 2016). All three techniques detect the size of the user’s screen and modify the page content and layout to accommodate the device. The techniques differ in how they detect screen size and the mechanisms by which they modify page content.
Key Terms in this Chapter
JavaScript: A programming language that is supported by all modern web browsers. It can be used to add dynamic features such as image slide shows, accordion menus, rollover effects, and asynchronous server requests.
HTML: Hypertext markup language is a standard used for describing web page content. HTML elements are delineated by dozens of different tags which are enclosed by angle brackets. For example, a paragraph of text may be surrounded by paragraph <p> </p> tags, and an image included using an <image> tag. HTML works in conjunction with CSS to define and format page content.
Media Queries: A feature of CSS that is used to define different style rules for different media types. Media types include screen, print, and speech. When developing pages that are mobile-friendly media queries are often used to detect screen size and apply styles appropriate to the device.
CSS: Cascading style sheets is a language used to describe the presentation of a web page. CSS is used to define syle attributes such as fonts, colors, spacing, positioning, and backgrounds. CSS works in conjunction with HTML to define and format page content.