A study measured how much content delivery suffers when a desktop page meets a tablet or a phone, and whether design work can close the gap.
Most visits to a website now arrive on a screen smaller than the one the site was designed for. A tablet or a phone shows a fraction of the width, and the layout has to decide what to do about it.
Responsive Web Design answers that by letting a single page render differently depending on screen size. The study behind this article takes that as given and looks at what the change costs. When a layout reflows, the amount of information visible at once changes, and so does how effectively a visitor can get through it.
The authors measured effectiveness and efficiency of content delivery on three screens: a computer display, a tablet, and a smartphone. Effectiveness is about whether content can be found and used at all. Efficiency is about how much effort that takes.
They also recorded how each page was built. Every site in the study followed one of three common layouts: a single column, two columns, or three. That detail turns out to matter for the result.
Delivery got worse on smaller screens. That is not surprising, but it is worth stating plainly, because it is the baseline that design work has to beat. A desktop page placed on a phone loses effectiveness and efficiency along with the screen width.
What the authors tested next was whether the design process could change that. They applied two established approaches and measured the outcome on the same screens.
Both approaches improved content delivery on the tablet and the smartphone. The gains were not limited to one screen size or one layout style, which is the more useful part of the finding: the improvement came from the process, not from a single trick.
The three column layouts showed the largest gap between the two approaches, and that is where the companion article picks up.
Pinandito et al. (2017). Analysis of web content delivery effectiveness and efficiency in responsive web design using material design guidelines and User Centered Design. 2017 International Conference on Sustainable Information Engineering and Technology (SIET).
