Aol.com redesigns mobile-first

Ben Moss.
June 02, 2015
Aol.com redesigns mobile-first.
Very few of the major players from the Web’s early days are still with us. Business models that thrived in the days of dial-up connections and web-safe color palettes tend not to suit the modern mobile web. One of the big names, still clinging on to its early success, is Aol. Founded in 1983, Aol. rebranded as America Online in 1991 just in time to ride the first wave of Web adoption. By 2009, when the company rebranded again, this time as Aol. it was struggling to compete with young upstarts like Google. However — despite common perceptions that it has failed to keep pace — compared to early front-runners like Alta Vista, Aol. is thriving; it’s a billion dollar corporation and its website boasts more than 375,000,000 unique views per year. Aol.’s homepage redesign, unveiled today, is aimed squarely at the mobile market. VentureBeat reports that nearly a third of Aol.’s traffic comes from mobile devices. (A figure that seems surprisingly low considering Aol.’s content — mostly news and entertainment — and their primary target demographic — families with disposable income.) The new design is based on a modular grid constructed with JavaScript, which generally speaking should be reserved for progressive enhancements. However, as far as the open beta version is concerned it does seem to work, the only bugs occur when a browser window is resized but who (apart from web designers) ever resizes their browser window? comparisonThe aol.com redesign old (left) and new (right). Clearly no one has told Aol. that carousels are bad because the new site retains the hero slider of the original design, complete with 40 slides. Each slide lasts around 8 seconds, so if you’d like to review all of the content that they want to ‘prioritize’ you’ll be staring at the homepage for over five minutes. Any site, designed for mobile, needs to balance screen real estate with usability. The tablet size of the design adopts a dashboard style approach, replacing the vertical menu bar with a strip of icons. Dropping down to mobile size, the strip of icons is replaced with a hamburger menu, a common tactic that is probably the least worst solution in the majority of cases. However given that the navigation is already using icons it seems preferable in this case to keep the strip of icons right down to mobile. In all mobile cases, the navigation itself opens as a sliding drawer. An interesting issue is that the in-house team that designed the site have chosen not to make the header sticky, so when you’ve scrolled through a lot of content, you have to scroll back to the top to change sections. mobileThe aol.com redesign for tablet (left) and phones (right). A significant problem is not the navigation’s dependency on icons — the addition of text in the sliding drawer minimises that issue — but the icons that have been selected. The mail and search icons are clear, as are the sign in, entertainment, finances, and news icons. The football used to represent sports is clear, but very US-centric (a corporation with global ambitions might have used a more global sport, such as tennis or golf). The lifestyle link is represented by a heart, which given Aol.’s demographic could be mistaken for dating or romance. Tech, seems more like a social media icon. The typeface being used is Larsseit, of which I’m not a fan for body text on screens. Its counters are generous and there isn’t too much contrast, but its apertures are small and there’s too little variety in its letterforms for my taste. Aol.’s biggest challenge has been the integration of video. Video has been key to Aol.’s continued prosperity; according to The Next Web they’ve experienced a 93.8% growth in video views over the last year. It feels like a missed opportunity therefore that videos can’t be played right on the homepage. The logo block, that features the logo, the date, and the temperature at your location, uses as its background an image of the current weather conditions. It’s an intellectually clever idea, but results in a very pale blue block. I’d like to have seen this block colored neon pink to match the search button. A shock of color would have gone some way to livening up a page that is presently quite dull. The biggest issue with Aol.’s redesign is that it lacks personality. It’s rare that I would ever level this accusation at anyone, but: it’s too minimal. Aol. is undoubtedly a success story on the Web, owed in large part to their role as early adopters. Their new redesign is clearly an attempt to adopt the ever-growing mobile web. In many ways they’ve sacrificed desktop experience for a more satisfying mobile experience. Browsing the new aol.com on mobile feels more elegant than browsing it on desktop, and the whole site feels as if it was designed mobile-first. Aol. should be applauded for embracing change and fully committing to the mobile web even if, as is probably the case, the resulting site is too utilitarian to ever fall in love with. It’s a great starting point for the company’s future, but I doubt it will last as long as those free installation disks currently residing in the world’s landfill. Featured image uses smart phone image via Shutterstock.

Ben Moss

Ben Moss has designed and coded work for award-winning startups, and global names including IBM, UBS, and the FBI. When he’s not in front of a screen he’s probably out trail-running.

Read Next

15 Best New Fonts, May 2024

In this month’s edition, there are lots of historically-inspired typefaces, more of the growing trend for French…

20 Best New Websites, May 2024

Welcome to May’s compilation of the best sites on the web. This month we’re focused on color for younger humans,…

Exciting New Tools for Designers, May 2024

This year, we’ve seen a wave of groundbreaking apps and tools. AI is reshaping the industry, enhancing productivity,…

Using AI to Predict Design Trends

Design trends evolve at a blistering pace, especially in web design. On multi-month projects, you might work on a…

15 Best New Fonts, April 2024

Just like web design, type design follows trends. And while there’s always room for an exciting outsider, we tend to…

3 Essential Design Trends, May 2024

Integrated navigation elements, interactive typography, and digital overprints are three website design trends making…

How to Write World-Beating Web Content

Writing for the web is different from all other formats. We typically do not read to any real depth on the web; we…

20 Best New Websites, April 2024

Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…

Exciting New Tools for Designers, April 2024

Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…

How Web Designers Can Stay Relevant in the Age of AI

The digital landscape is evolving rapidly. With the advent of AI, every sector is witnessing a revolution, including…

14 Top UX Tools for Designers in 2024

User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…

What Negative Effects Does a Bad Website Design Have On My Business?

Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…