Optimize your website for mobile phones {website}

In today’s episode we discuss what your website visitors want to see and do on your website when they visit it from their mobile phone.

More and more people are using their phones as their primary browser! There are some key elements of your website that need to work right for every mobile browsing experience.

Here are three things that you should make sure are optimized:

  1. Telephone numbers. When someone presses on your phone number it should link into their phone’s dialer function in order to actually place a phone call!
  2. Physical addresses. Gym or studio addresses should always be designated as addresses so that the phone’s browser can recognize them and give the option to link into the navigation app on the phone.
  3. Pop-up boxes. (These are those boxes that come up over top of your posts or content that offer a downloadable nugget in exchange for an email address – we’ll be getting into them a whole lot more in future episodes.) For the purpose of this episode, make sure that the entry fields are accessible on mobile browsers and that the pop-up can be closed easily.

daughter-on-barsI do a lot of web browsing while sitting in the bleachers at my daughters’ gymnastics (they are 8 and 6 and getting ready for their first gymnastics competition!) So, I’m there a lot… I cannot tell you the number of times that I’ll click over to a seemingly exciting article from Twitter on my phone while I’m at gymnastics and the website is optimized for a great reading experience on my phone… then all too soon, I get this pop-up box to sign up for the list. I may be interested in doing so, I may not, but what happens is that I cannot complete the action because the pop-up is not designed to be used or closed from a mobile browser. Sometimes I’m forced to leave the site, because I cannot complete the provided form or close out of the offer box.

As promised in the episode, here’s the three step process for converting your phone numbers from text into clickable links:

  • Identify where your phone number(s) are listed on your website
  • Create the link:
    • If you are using “Visual” mode in the WordPress page/post editor, you’ll select the phone number and click the link button, then in the dialog box type tel:1-xxx-xxx-xxxx
    • If you need to enter this information in html mode, you will place this <a href=tel:1-xxx-xxx-xxxx> in front of the phone number and </a> at the end of the phone number
  • Save and update!

**Note, some phones will automatically make a phone number clickable, but this works for special numbers such as 1-800-FIT-1234

To make your address clickable, it just needs to be a single line of text (rather than a graphic or multi-line listing). Here’s an example: 123 Main Street, Town, City, Zip

Your call to action: Follow the instructions above to set your phone number and physical address so that they are clickable on mobile devices.

If you have any questions about this or have specific concerns, please note them below and I will be sure to answer them!