Think of the last amazingly satisfying experience you had with a website on your smartphone – one where it was so fun and effortless to order a pizza, or pay for a ride, or donate a heifer, that you found yourself wanting to keep ordering pizzas and keep donating heifers past the point of reason.
That feeling was no accident, but rather the result of years of creative energy bent towards perfecting web design for smaller screens with touch technology.
Mobile devices have become nearly ubiquitous and changed our browsing preferences. That means many old web design practices have fallen by the wayside.
Here are the most glaring design changes spurred by mobile and the shift to responsive design techniques. If you're dreaming up a new website for your nonprofit, please take note!
1. Revolving galleries and sliders are out
These features, once considered appealing are now fraught with problems.
- They’re not mobile friendly
- They slow down page load speed
- They kill readability and the user’s sense of control
- Users have learned to visually tune them out
- They don't lead to more conversions (donations, event registration, etc)
Various eye-tracking and survey studies by Nielsen Norman Group have found that auto-forwarding sliders and galleries are considered by users to be a nuisance. They're not an effective way to impart information.
A great illustration of this comes from a Nielsen Norman Group study, in which a participant was asked to go to an appliance manufacturer website to find out if there were any sales on washing machines. Even after careful study of the page, the user completely glazed over an ad for a discounted washer in a carousel gallery and concluded there were not.
The researchers speculate that users have adapted to ignore galleries, since they resemble ads and can distract from finding information quickly.
Bottom line: Galleries and sliders are bells and whistles you DON'T want in your design. Well-designed static calls to action are much better placed to get your visitors to take the action you want them to.
2. "Above the fold" is irrelevant
Once upon a time making readers scroll too far on a desktop screen was considered certain death in the world of design. But that was before touch screen swiping. Now we have grown accustomed to infinite scroll on Facebook, Twitter, and Instagram, where scrolling is heaven; scrolling is forever. Many designers claim that the “fold” no longer even exists. If anything, now the barrier has become clicking.
“Scrolling is a continuation, clicking is a decision,” goes the thinking. Of course your page must give the right scrolling cues to the reader. (And a small minority of users still complain about scrolling). But the point is, the functionality of small touch screens has made long scrolling more natural and intuitive.
See https://missiongraduatenm.org for an example of a long scrolling website, packed with information, that you can glean at-a-glance by scrolling down the home page.
In "Why Long Scroll Sites Have Become Awesome," The Next Web points to Apple Watch’s guidelines (in which developers are told to keep page number to a bare minimum) as a harbinger of things to come. The future challenge may be to re-imagine how to design your website so that it is only a few long ribbons of information. This linear layout is considered especially compatible for more open-ended “story-telling” websites, like those of nonprofits, rather than goal-oriented websites, like online shops.
In any case, scrolling itself is no longer a barrier on a well-designed nonprofit website. A 2014 Chartbeat study showed that 66% of screen time is spent below the fold. Yes, the content "above the fold" on any device is still the most important space for creating a first impression, but you don't have to cram everything important at the top.
The goal is a nice intuitive flow of information from the top of the page to the bottom. In the words of Nielsen Norman Group's Amy Schade, "Users scroll when there is a reason to." This is another reason you should have a top notch designer working with your org.
3. Information discovery is more than menu bars
Rather than keeping everything nicely packaged within the navigation bar or in a sidebar (which is less usable on mobile), designers are now "surfacing" content by highlighting key things in content blocks below the main content.
Orderly menus in the familiar places are still important, but it’s also great to include direct access to high priority or featured deeper level pages on the site, so that visitors don’t need to click fiendishly to find what they’re after. If you are using a fly-out or hamburger menu (the menu icon of three verticals bars that, with a lot of fantasizing, resembles a sandwich), this is especially important.
After various user studies on menus, Nielsen Norman recommends using links on the homepage and in-line links on interior pages to send the reader directly to popular or featured content. Again, there should always be multiple doors to key content on your site.
Key Take-Aways
So, ditch the gallery, embrace scrolling, and build-in visual pathways to key content. If you're in the exciting position of designing a new site at this moment, make sure your vision isn't clouded by past practices.
This is our advice to nonprofits looking to build forward-thinking websites in the mobile age. Design will continue to evolve in search of the optimal user experience. Embracing this evolution may mean you offer such a spectacular experience to your donors and supporters that your fundraising moves to a whole new level. Oh, the possibilities!