4 Mobile-First Website Design Tips for Nonprofits

by csladmin


In recent years, mobile-friendly websites have become everything on the web. And for a good reason – mobile traffic made up 52.64% of all global online traffic in 2017 and is projected to claim 79% of all global web use by the end of this year. What’s more, 57% of web users won’t recommend a website or a nonprofit with a poorly-designed mobile site.

As the importance of the mobile platform has exploded, so, too, has Google’s distinct preference for mobile-friendly sites. Back in 2015, Google released a mobile-friendly ranking algorithm that reprioritized the way it ranked sites (giving priority to mobile-friendly sites) and earning the nickname #Mobilegeddon.

In the wake of that update, nonprofits have had to reconsider how they structure their sites.

To put it simply: if you’re not providing an outstanding mobile experience for your customers, you’re missing out.

Here’s what you need to know:

4 Mobile-First Website Design Tips for Your Nonprofit

Looking for smart ways to make your site more user-friendly and easy for mobile customers to access? Here are a few things to consider:

1. Don’t Design a Separate Mobile-Friendly Site 

In the early days of mobile-friendly websites, some companies and nonprofits went the extra mile and created a whole separate mobile-friendly site. While this may seem like a smart approach, there’s a big issue with this: duplicate content.

Google hates duplicate content. By creating a separate mobile site and featuring the same content you have on your other website, you’re putting yourself at risk of Google penalties. Instead, create one website and use responsive design principles to ensure it adapts to the platforms your customers are using to view it.

2. Prioritize Responsive Design 

As we mentioned in the last point, responsive design is essential to a good mobile experience. Responsive design is a web design tactic that allows sites to adapt to different devices. If a user navigates to your nonprofit website from a tablet, for example, the content will adjust its size. The same goes for mobile phones and desktop computers.

The principles of responsive design include flexible layouts, flexible images, and similarly flexible content items. Today, better responsive design means better (and easier) marketing for your NPO and causes.

3. Consider Your Font Size and Buttons

Mobile screens are small, which means your buttons and font both need to be large enough to make use easy for your customers. This means font size of at least 14 px and “hamburger” buttons, which drop down vertically when a mobile user taps them.

According to Apple, minimum button size is at least 44px by 44px. Keeping your web content within these parameters helps ensure a positive web experience.

4. Use High-Quality Images 

Low-quality images will destroy your website’s mobile experience faster than virtually anything else. With this in mind, be sure you’re using high-resolution images on your site. This has become especially essential since iOS devices have developed high-definition screens that make low-quality photos that much more apparent.

Having high-quality images on your site prevents blurred resolution and ensures a good experience for your customers.

A Mobile-Friendly Site Helps Your Nonprofit Grow

If you’re running a nonprofit in the modern digital world, having a great mobile-friendly site is essential. In addition to the fact that Google has recently increased its focus on mobile-friendly design, these sites will also help you gain more users and secure more donations.

As if all that weren’t enough, ensuring your site is mobile-friendly also ensures you’ll feature prominently in Google’s SERPs and that your site will be easy for new customers to find.

Need some help to help creating a beautiful, mobile-friendly site? Contact the team at Creative Science today!


  • Code Llama’s Impact on Developers
    Read More
  • Let’s Talk About Python’s Future
    Read More
  • Unlocking the Power of Behavioral Science, User-Centered Design, and AI for Digital Success
    Read More