Last week I (Adrian) went to An Event Apart DC 2015, a web design conference spearheaded by web-design gurus Eric Meyer and Jeffrey Zeldman. Over the course of two days we heard from some of the web’s most forward thinking individuals on topics like accessibility, page layout, and performance. In this post, I’ll look at some of the highlights from the conference and how that will impact you if you’re considering a new website.
The Web is Everywhere
In the early 2010’s we started constructing mobile-specific sites for users on iPhones and Android devices. Often these were wholly separate from the main website, and would usually come with less functionality and content than the full-sized website. In the last few years, we started building responsive websites that would adapt to mobile and tablet screens while being built around the same HTML as the desktop site.
Now in 2015 the variety of devices browsing the web has exploded. We’ve got smartphones and tablets of every size, smart watches, desktops, laptops, touch-enabled computers, smart TV’s and much more, all of which are capable of browsing the web. More than ever, users expect to be able to access all content and functionality from whichever device they choose.
“The best interface is the one within reach.”
– Cameron Moll
This means we don’t get to decide what device a customer can access parts of the site on – every piece of the website should be accessible from every device. Mobile browsers now account for over 50% of global web browsing (source), and that number is only increasing.
Photoshop Mockups are Out
In the old days of the web, we would carefully craft a design in Photoshop, revise it with the client until we were all happy and ready to move it on to the web. At that point, we’d translate it pixel by pixel to HTML and CSS so it looked exactly like it did in Photoshop.
This worked well when everyone was using roughly the same type of device to browse the web, but we no longer have the luxury of one-size-fits all design. We need to change our design process to adapt to this new reality so going forward we’ll design “mobile first” and in the web browser. Designing for small screens first forces us to figure out what’s really important for customers using the site. Starting the process in the web browser makes it simple to show how parts of the design will adapt to different screen sizes and test for different use cases.
The User Comes First
When someone comes to your site, they’re usually trying to complete some sort of task. Whether that’s locate a phone number, research a product or place an order; it’s our job to figure what customers want to do and help them do it as quickly as possible.
Putting the website user first manifests itself in a few ways. In the slow-internet dial-up days, we always tried to make websites as small as possible. With the proliferation of high speed internet and the amazing new technologies the web has to offer, web-pages have slowly become more bloated and clunky to use. Designing for performance means prioritizing which features the website really needs to meet the demands of its users. Adding another rotating slider might seem like a good idea, but is it really useful to the customer and worth the extra weight of the page load? The answer will depend on the site, but it’s a question we definitely need to ask.
Focusing on users also means focusing on content. In magazines, the layout of every page is meticulously designed to match the story that the articles are telling. On the web, we never really had the flexibility to design that way because of the limitations inherent to HTML and CSS. Jen Simmons demoed a slew of new features that are going to help make the web better-looking and more useful. We’re heading towards a world of well designed content on the web.
This post just scratches the surface of everything we covered in DC, but we’re already implementing some of these ideas in our design process. We’ve always kept up to date on the latest developments in the web-design world, and we’re excited to keep learning and pushing our projects forward.