Magazine article Computers in Libraries

Going Mobile: How I Made My Own Site Responsive

Magazine article Computers in Libraries

Going Mobile: How I Made My Own Site Responsive

Article excerpt


Increased access to web-based resources via mobile devices stands out as one of the most obvious technology trends during the last few years. Statistics vary on the proportions of users accessing library resources through mobile devices relative to those with full-size screens of desktop or laptop computers, but we're past the tipping point. According to Google Analytics, access to Library Technology Guides in February was 63% desktop, 27% mobile, and 10% tablet.

The stakes just increased dramatically with the recent announcement by Google that poor mobile usability will negatively impact search performance. It makes sense that search engines should not include pages on devices that cannot display them. In order to maintain visibility to all potential users, it is critical for web resources to be designed to accommodate the full range of devices. But most of all, it's simply important to ensure that a site can adequately serve all those with an interest in its content or services, regardless of the device they are using.

Full-size desktop interfaces have considerably different capabilities than smartphones, with tablets functioning in between. Each category of device brings different expectations of functionality. On a full-size device, I expect to be able to create content and to use the full-screen landscape to efficiently view information, often in multiple columns or panels. That complexity of presentation exceeds what can be easily used on a smartphone, where content needs to be displayed in a more simplified style, such as in single column, and with ample spacing and readable fonts.

In order to accommodate the different categories of devices, websites need to use responsive design, which customizes the delivery of each page based on the capability of the device making the request. In some cases, responsive design may only alter the presentation elements that can be controlled in CSS, but some sites may want to present an entirely different set of functionality and structure to users with mobile devices. Responsive web design involves understanding the use patterns appropriate for each type of device and optimizing the user experience accordingly.

Placing Concepts Into Practice

I created Library Technology Guides as a content repository, and maintaining it provides me with an opportunity to keep my technical skills up-to-date, as I work through some of the same issues that libraries face in how they present content to their users. Mine is a low-risk environment in which I can experiment with technology without fear of harming a larger organization. Most people who maintain the web presence for a library would generally need to work toward higher levels of usability and interact with a broad set of stakeholders to establish strategic objectives and functional requirements, as well as to explore multiple persona-based use cases. My project is a little different, since I can operate unilaterally. Given my interest in promoting mobile usability for libraries, implementing it for my own site seemed to be a way to gain some practical experience.

Admittedly overdue, I began to implement a responsive interface for Library Technology Guides. Last year, I completed a new design for the site that updated its look and layout. That redesign included upgrading the coding to HTML5, using CSS for page layout instead of tables, implementing a new navigational menu based on jQuery, and introducing more semantic structure through the use of encoding surrounding selected data elements within each page. I also refreshed the server hardware and operating system as well as upgraded the MySQL version, Perl, and other infrastructure components. Additionally, I implemented a redundant platform as an active backup in case of failure; it is synchronized daily with the primary server. …

Search by... Author
Show... All Results Primary Sources Peer-reviewed


An unknown error has occurred. Please click the button below to reload the page. If the problem persists, please try again in a little while.