As a nonprofit marketing professional, you’ve probably heard time and again that your organization’s website must be mobile-friendly. But you may be curious why this is such an important digital marketing strategy.
A mobile-optimized website gives visitors a better user experience (UX), encouraging mobile users to stay on your site longer, learn about your mission, and even get involved with your cause by signing up to volunteer or donating on the fly.
But beyond improved user-friendliness, optimizing your website for mobile devices can also boost your search engine optimization (SEO) performance. Mobile-friendliness has been a ranking factor for Google’s algorithm since 2015, meaning that it’s an essential part of boosting your site’s visibility on search engines results pages.
According to Kanopi, the best nonprofit websites give their supporters access to everything they need right in the palm of their hand with mobile-friendly design. Here are five tips for creating a mobile-friendly nonprofit website:
- Choose a mobile-responsive theme.
- Simplify your design and navigation.
- Prioritize fast load speeds.
- Streamline your giving page.
- Eliminate pop-up ads and messages.
These tips will help ensure you’re engaging mobile users effectively. Ready to learn more? Let’s get started.
1. Choose a mobile-responsive theme.
Your theme is the basic framework for your site’s design, layout, and structure. Most content management systems (CMS) now offer vast libraries of pre-built, mobile-friendly website themes. It’s your job to choose one that reflects your organization’s brand and provides a streamlined experience for mobile users.
A mobile-responsive theme will automatically adjust to fit different screen sizes. Whether a supporter uses a desktop computer, tablet, or mobile device to access your site, they will have an equally pleasant experience without any formatting issues.
As you browse through available themes, choose one that strikes the right balance between mobile responsiveness and design elements, such as page structure and fonts, that align with your branding. Most CMS platforms offer a wide enough variety of themes that this shouldn’t be a difficult task.
Whether you’re creating a brand-new website or looking to redesign your site, choosing a mobile-responsive theme will set you up for success. However, if your site already has a theme, read on for tips that can enhance an existing site’s mobile experience.
2. Simplify your design and navigation.
Your nonprofit’s website plays an important role in the donor journey. The donor journey encompasses each step donors take to get involved with your organization, from initial awareness to long-term support.
To use your website as a tool for boosting awareness and sharing your nonprofit’s activities, improve your site’s mobile user experience. An effective user experience ensures visitors can find what they’re looking for quickly and easily when browsing on their mobile devices. Improve your site’s mobile UX by:
- Keeping your navigation menu simple. Too many menu items can become confusing for visitors and increase the amount of time it takes to find what they’re looking for. Plus, long, complex menus can often have formatting issues on mobile devices. Only include three to five main items in your website’s menu to provide a more streamlined navigation experience.
- Only including necessary form fields. Whenever you present website visitors with a form to fill out, keep those items as easy as possible to fill out. Whether it’s a volunteer registration page or an online donation form, if it takes too long to complete, visitors are more likely to abandon it. This is especially true of mobile users since it can be challenging for users to fill out multi-step forms using the smaller screens and keyboards on their smartphones. Also, remember to keep those forms accessible and inclusive!
- Using large, readable fonts and other simple design choices. Since phone screens are significantly smaller than laptop or desktop computers, choose font sizes that are large enough to be easily read on mobile devices.
A simple, streamlined UX will allow supporters to browse your website and find what they’re looking for in just a few clicks. Continuously test your website and assess its appearance and functionality in the mobile view. Doing so ensures your site is as streamlined as possible and optimized for mobile users to browse your content and learn more about your mission.
3. Prioritize fast load speeds.
Studies show that 53% of users will abandon a mobile website if it takes more than three seconds to load. Plus, mobile page load time is a ranking factor for SEO. This means a fast load speed, coupled with other SEO best practices, gives your site a better chance of ranking higher in mobile search results.
Luckily, there are a few simple steps you can take to ensure your website pages load faster on mobile:
- Optimize images: If your image files are too large, you’ll slow down your page load speed since visitors’ mobile browsers will have to work overtime to load the images. Optimize your images by compressing them so they load faster. You can use a free tool like TinyPNG to compress images easily.
- Clean up your code: Messy or heavy code is another element that contributes to slow load speeds. Clean up your code by eliminating any unnecessary spaces or characters and organizing your formatting.
- Leverage browser caching: Browser caching happens when a visitor’s browser stores pieces of information about your website, such as images and code elements. The next time the visitor heads to your site, their browser won’t have to reload the entire page since it’s already stored some of the information. You can enable browser caching using plugins within your CMS, such as WP Rocket on WordPress.
You can check your website’s load speed using your Google Analytics dashboard. The average page load time metric tracks how many seconds it takes each page to load. Assess the current state of your website load speed and whether you need to use these tips to improve certain pages.
4. Streamline your giving page.
You know that to make your website mobile-friendly, you should streamline the design and navigation, keep things simple, and maintain a fast load speed. When you apply all of these same principles to your nonprofit’s online donation page, you will ensure it’s optimized to draw in donations from mobile users.
When your giving page is mobile-friendly, supporters can give as soon as the feeling strikes them, without having to go to their laptop or desktop. This allows you to sustain fundraising momentum, ensuring supporters follow through with their intention to donate.
Here are a few quick tips for creating a mobile-optimized donation form:
- Only ask for necessary information. Don’t slow your mobile donors down with a long list of questions on your donation page. Just ask for the essentials. Their name, contact information, donation amount, and payment information are all you need.
- Limit your images and other on-page information. Include just one or two main images and a brief description of your organization’s mission and fundraising goals. This will keep mobile donors’ attention on filling out your form fields.
- Offer suggested donation amounts. When you provide suggested donation options, you allow mobile users to quickly and easily choose the amount they want to donate. Suggested giving amounts help donors move through your form faster without having to pause and consider what an appropriate donation amount would be.
With a mobile-optimized donation page, you can empower donors to contribute using your nonprofit’s website, no matter what device they’re browsing on. Use Google’s free mobile-friendly test tool to assess whether your online giving page is mobile-friendly.
5. Eliminate pop-up ads and messages.
Picture this: you’re sitting on the couch watching the season finale of The Bachelorette. You’re dying to know if the winning couple has stayed together after finale night. But when you try to look it up, you land on a terrible celebrity gossip website. Eleven ads for knock-off Ugg boots flash before your eyes and you struggle to close a pop-up message telling you to sign up for the site’s weekly newsletter. You abandon the site before finding the answer you were looking for.
Needless to say, this is not the type of experience you want to offer your website’s visitors. Pop-up ads and messages lead to frustration and a poor user experience, which can result in supporters leaving your site in droves.
Reduce the number of pop-ups on your site to create a better mobile user experience. Instead of pop-up messages, use buttons and other calls-to-action to direct visitors to complete a certain action.
For example, you might include several large buttons on your homepage that encourage users to “Donate Now,” “Sign Up to Volunteer,” or “Become an Advocate.” Other effective calls-to-action include placing a link to your donation page in your website’s main menu or adding links to your internal blog posts.
These elements help get your message across without bombarding visitors with a cacophony of visually disruptive pop-ups.
Double the Donation’s nonprofit fundraising statistics page points out that half of all nonprofit website traffic last year came from mobile and tablet users. Meanwhile, the amount of desktop-based traffic actually decreased by 9%. This means that without a dedicated mobile strategy, your website isn’t reaching a large number of audience members.
When your nonprofit’s website is mobile-friendly, you can use it in a wide variety of ways, from promoting your giving page on social media platforms to giving volunteers browsing on mobile everything they need to get involved. Remember, one of the most important elements of mobile-optimized design is simplicity. When you keep your site streamlined and focused on your core mission, you can easily adjust your design and formatting to adhere to mobile best practices.
About the Author
As Founder and CEO of Kanopi Studios, Anne helps create clarity around project needs, and turns client conversations into actionable outcomes. She enjoys helping clients identify their problems, and then empowering the Kanopi team to execute great solutions.
Anne is an advocate for open source and co-organizes the Bay Area Drupal Camp. When she’s not contributing to the community or running her thoughtful web agency, she enjoys yoga, meditation, treehouses, dharma, cycling, paddle boarding, kayaking, and hanging with her nephew.