S&E Quick tips: Improving your site’s mobile experience

As you maintain and add to your site, are you making sure your website and all of your content is mobile friendly? Use these tips to evaluate the mobile experience of your website.

Responsive design icon
Evaluate how your site responds to screen sizes
Tools icons
Optimize media files and functionality for mobile
Check mobile icon
Always review published updates on a phone
"One of our biggest mottos is to 'think mobile first' when it comes to web design, because over half of internet traffic comes from mobile devices."

Hi guys! Welcome back to our Quick Tips video series, where we share helpful industry tips for you to use and incorporate into your next project.

Today’s topic is about: Improving your site’s mobile experience

It’s very important to continually evaluate your site on mobile screens – ensuring that all of the functionality works well on all kinds of tablets and phones.

One of our biggest mottos is to “Think mobile first” when it comes to web design – because over half of internet traffic comes from mobile devices. So it’s very important that your site is responsive.

When I say responsive, what I’m referring to a web design approach that creates dynamic changes to the appearance of your site based on the screen dimensions. So whether a user is on a desktop, tablet or phone, your site should respond appropriately and display content according to the size of their screen. It’s still just one site, but it’s responsive and optimized for any device being used.

The best way to begin evaluating your site for this is to pull out your own phone and start reviewing each page. If you have features or new content you’ve added recently, you’re probably doing that on your desktop — publishing and testing it there, but don’t forget to always check your updates on a mobile device as well. All of your functionality and content should be mobile friendly. This is especially important to check on features like forms, media galleries, search fields and any other unique components that might render differently on mobile. Make sure that the overall experience flows well on these small screens, and take note of anything that doesn’t.

A few other things to consider when adapting this “mobile first” mindset:

  • Mouse over interactions they might be cool on desktops when you move your mouse around, but remember that they won't work when you’re on a touch device.
  • Pop-ups – they might work and also look great on a desktop, but often times they can really get in the way on a phone if not designed correctly.
  • Pages with large desktop-sized images are going to bog down your page loading time on a mobile device if not optimized properly.
  • And double check your basic functions: the top navigation should work naturally on a phone:
    • Make sure there’s plenty of room for your thumb to click on each link
    • Make sure the font sizes aren’t rendering too small on mobile, especially on your site’s footer links. Ideally on mobile, those links should display a little larger in font size and be spaced out a little bit more for easy tapping on touch screens.

All of these things shape your mobile experience. So as you continue to maintain and add to your site, keep these tips in mind to help ensure your site stays mobile friendly.

That wraps up our tips today, stay tuned for more and we’ll see ya next time!

Need help evaluating or improving your mobile experience? Get in touch.