How Modern Web Design was Shaped by Mobile Devices
I was working with a nonprofit earlier this month on redesigning their website and during the first meeting, I proposed a very standard idea: the home page needed to tell a story and guide the intended user through the intended process (for this nonprofit it happened to be guiding philanthropists through the organization’s intent and then, hopefully, to a donation). I added that the front page would be the only page that the majority of visitors visit, and therefore once the user is done scrolling through it he or she should be satisfied.
The president liked this idea and agreed with my recommendation. He then said, “I wonder if, since we are so used to consuming content on our phones, we have become so accustomed to one continuous, vertically-oriented, stream of information. Years ago we got away with dozens of pages tucked away in menus, but that isn’t what works anymore.”
I had always pushed vertically-focused layouts in web design, and always noticed that vertically-focused sites are always the ones that receive awards for beautiful design, but the idea my client just posed had never crossed my mind. He was right, mobile device use recently surpassed computer use in terms of hours/day for Americans.
Before the use of mobile devices, we had thoughtlessly adopted the idea that good websites could and should be laid out in pages, like a book. But in reality, this page-based layout of information was invented along with the internet.
Books, and nearly all information, are not laid out in pages. Well, not “pages” in the same way that websites are sometimes separated by “pages” Sure we print the books in pages, but it is a stream of content that you read in a linear order. Compare this to your state government’s DPS website. You can navigate their pages in all types of orders to achieve the same task, there is no storytelling, it is a labyrinth of chores for the user.
But for most businesses, the story that needs to be told on the front page should be told the same way an author would today or hundreds of years ago: vertically. Thankfully, recently we have realized that more and more people are using websites on smartphones. This caused a wave of mobile-optimized web design. Mobile devices result in clunky menus that need to drop down and cover your whole screen, so we began to experiment with distilling information down into a primary vertically-oriented page.
This transition somehow made the web design industry realize that pages weren’t always necessary, and we began organizing websites vertically for all uses, not just mobile. This ‘discovery’ made websites more than collections of information, they enabled them to tell a story, and to guide a user through a process with complete control.
The downside to this revolution is that it’s hard to figure out an effective way to tell a story. As a web developer, it is way easier for you to just categorize all of the needed information and put them in pages. But finding a way to distill that information into a tiny space in a way that is legible, beautiful, and that encourages the user to complete a task, takes a lot of thought. On the bright side, this type of planning and thinking is what creates high-value design. A website that is designed this way with significant attention to detail and experience, is capable of so much more than one that has a boatload of functions that no one wants to use.
