Mobile internet usage surpassed the desktop in October 2016, and that trend has continued to increase every day.
This migration to mobile devices is important because mobile devices offer a completely different experience than the desktop computer. Website navigation remains relatively the same in essence, but images, content, and delivery must be mobile-friendly. For starters, mobile devices have smaller screens, not to be confused with lower resolutions. Modern phones can display HD content almost as well as desktop computers.
The key aspect of mobile browsing is that it can be done from anywhere. A mobile-friendly browsing experience should be fast and easy to use.
In addition to offering a mobile version or responsive site, how can you ensure a user-friendly experience? How can you pamper your audience without dumbing down the platform? These are questions you’ll need to answer if you want to create a successful B2C or eCommerce site.
Here are some components needed to create a successful site and ways to implement them.
1. Optimize Navigation and Performance
If customers visiting your site have issues like poor load times or terrible navigation menus, they’ll be too frustrated to stay. This leads to low revenue and high bounce rates.
This problem is even worse on mobile. Most mobile users browse while multitasking. This means they want to get in and out quickly. Meaning, they want fast load times and great performance.
Caching tools can provide faster loading of images and media, as can hosting your videos on platforms like YouTube or Vimeo. Gorgeous HD quality images are a big deal, but be careful not to bog down your site. Bridge the gap by delivering compelling content without sacrificing performance.
Here are some of the most common villains of slow page loads and what you can do about them:
- Images: Use the appropriate image format for your images. Please enable Webflow’s responsive images feature and make sure to compress all your images before uploading them to the site. Photoshop offers a number of compression tools in its Save for Web user interface, or use a web-based tool like TinyPNG.
- Fonts: Load only the fonts and weights that your layout actually uses . So if your content is set to Roboto Light and Regular, there’s no need to upload Thin, Bold, Black, etc. Alternatively, it can serve the user’s system fonts so there is no need to load custom fonts from a third party.
- Code – The simpler and cleaner your code is, the faster your website will load. When possible, style tags (eg “All H1 Headings”) instead of creating unique classes. Create a style guide at the beginning of each project. Use Webflow’s “cleanup” feature in the Style Browser to remove unused styles. And minify your code in your project settings.
You can find many more tips on optimizing site speed in our article “How to increase the performance of your site”.
Not sure if your site is fast or not?
Try it on Google PageSpeed Tools and Pingdom.
Just keep in mind that the former doesn’t actually test your site’s speed: it just checks to see if you’re doing things that tend to improve page speed. The tips they provide are of course helpful, but don’t waste them if your rating isn’t great.
2. Use trusted payment providers and clear indicators
Hacking, breaches and identity theft are rampant these days. Your customers know this and are wary of sharing confidential information. Instill trust by selecting reliable payment providers and placing clear flags and logos where applicable. Logos that certain users find trust-inducing include those for the Better Business Bureau, Diamond Certified, etc.
Also, make sure to enable HTTPS on your site. This keeps the data encrypted so that if someone gets their hands on it, it’s better protected and harder to read or access. And you get the nifty little “safe” tag, as shown above.
3. Make Sharing Easy With Social Media Links
Whether your website offers demos, previews, or descriptions of your services, you need to give customers a way to share your content. Placing social media buttons and links throughout your website is the best way to do this.
Most news sites and blogs like TechCrunch provide great examples of ideal placement of social media buttons and links. social. Buttons on landing pages make it easy to share content directly on social media.
When you click on an individual story or news update, you’ll find the share buttons just below the title and byline. (A sensible placement based on the law of proximity.)
Scroll to the bottom of the content and bam! – more social buttons await. Whenever the need to share or discuss the site arises, the links are always accessible. And keep in mind that sharing isn’t just for “virality,” sometimes it just makes it that much easier to discuss something between friends online.
Remember: Just because TechCrunch is a content-heavy site doesn’t mean you can’t draw inspiration from it for your B2C or eCommerce site.
.