Different Phones, Different Browsers, Same Website: Here’s Why
Your website looked great on your phone. But a client opened it on hers and something looked off. If your contractor website looks different on every phone, there is usually a reason for it.
Maybe the headline wrapped onto another line. Perhaps a button looked smaller. Or a project photo appeared cropped differently.
Your first thought might be: Did someone mess with the site?
Usually, nobody changed anything.
The same website can look slightly different from one phone to another because every device has its own screen size, browser, operating system, settings, and hardware. For contractors, this is very important. Different people will open your website from different devices. Your website has to respond to those differences each time someone opens a page.
Your Website Doesn’t Have One Permanent Shape
Think about a printed flyer. That’s permanent. Every copy matches the original.
However, websites are dynamic. The code determines how to place elements in relation to the screen size.
That is how the same website appears differently depending on the device used.
The image and text, which can be side by side on a PC, can appear in a vertical order on a mobile device.
It is called responsive design.
Chrome and Safari Can Render Things Differently
Screen size isn’t the only thing that matters. The browser matters too.
Chrome, Safari, Firefox, and other browsers are also important because they render websites and read the same code, but they do it in a somewhat different manner. As a result, this results in some discrepancies in fonts, space, buttons, or forms.
Most of the time, those differences don’t matter. A button might have slightly different spacing. A font might look a tiny bit heavier.
Sometimes though, a small difference becomes a usability issue.
Imagine a homeowner opens your contact page and finds that the estimate form is too crowded for her iPhone. She does not realize that the problem lies in Safari browser and only feels uncomfortable about it. As a result, she may leave before submitting it.
That is why browser testing belongs in the website development process rather than after a customer reports a problem.
The Operating System Adds Another Variable
Your browser runs on an operating system, which creates more variation.
iOS and Android handle touch controls, menus, forms, and keyboards differently.
The same page may look and behave slightly differently on an iPhone than on a Samsung phone.
However, this does not necessarily indicate any problems on the website side. The actual problem is about usability.
Are your clients able to read that page? Can they press those buttons? Will they be able to fill that form? Is it possible for them to call you?
If yes, then the difference lies within devices only.
Older Phones Can Create Another Challenge
Not every homeowner upgrades to a new phone every year.
Some use older devices and older browser versions. Because of this, those browsers may lack support for newer web features or handle code differently.
A website doesn’t need to look perfect on every old device ever made. But it should avoid relying on features that cause problems for a large portion of your audience.
That’s especially important for contractors. Your next customer could come from a new iPhone, an older Android, or a work desktop. You don’t get to choose their device.
Different Doesn’t Always Mean Broken
Your website doesn’t need to look identical on every screen. It needs to work. A contractor website different every phone should still provide a usable experience for every visitor.
Look for real issues. Overflowing text. Difficult to touch buttons. Unopened menus. Difficult forms to fill. Overlapping content. Untappable phone numbers.
Those problems cost you leads. A homeowner won’t figure out why a button looks strange. Instead, she’ll just call another contractor.
How to test your site:
Test it on your phone and then ask someone else to test it on a separate phone. Then, try testing it on a tablet or a laptop.
Focus on key pages: Homepage, services, portfolio, about, contact, and quotation form.
Is it possible to call from the website? Can users find your service areas? Can they browse through your photos? Additionally, is it easy to submit a form without using the zoom feature?
If something looks wrong on one device, test it again. A rendering difference may be harmless. However, a broken layout needs fixing.
Why a Contractor Website Can Look Different on Every Phone
Your customers use many different devices. Not just yours.
What is important is that the website must be readable, usable, and have proper contact details.
At Tenaya360, we create websites with the actual browsing process in mind. Websites should be designed for the customer who looks for a contractor from the dining room table, office, or even from the mobile device on the job site.
Want to see some of the websites we have built? Feel free to check out our recent projects or read what our clients say.
If you are unsure about the performance of your existing website in regards to multi-device support, contact Tenaya360. We can help identify the parts that need attention before a potential customer finds them first.
-Jack
