homestead_faq's profileBrand User

677 Messages

 • 

44.6K Points

Wednesday, March 3rd, 2021 4:18 PM

What Makes a Good Mobile Site?

What Makes a Good Mobile Site?

What Does a Mobile Website Look Like?

Let’s focus first on the way a mobile site looks because visitors will decide at a glance whether they want to stay on your site based on its appearance. There are four basic elements a good mobile-friendly template or custom design will include:

1. Responsive Page Display

Responsive design is the foundation of a mobile-friendly website. Without it, a smartphone or tablet user who visits your site will see a miniaturized version of your desktop site, which means they’ll have to scroll vertically and horizontally to find anything—and that means they’ll just leave and go somewhere else.

A responsive site design, whether custom-built or based on a template, automatically displays your site properly on whatever type of device a visitor is using, whether they’re using it in portrait or landscape orientation.

2. Readable Fonts

Mobile-friendly templates will include fonts that are easy for mobile users to read, but you may want to play around a bit with the fonts, especially if you have a logo that uses a particular typeface.

Sans serif fonts with clean lines are generally the easiest to read on mobile devices, where glare and screen size can make serif fonts and novelty fonts like script hard to see clearly. And go up a size on your fonts—no one wants to try to read tiny text, even if it’s sans serif.

3. Proper Text Formatting.

Keep your blocks of text short and break them up with headlines and bulleted lists when it makes sense to include them. It’s hard for our eyes to track close-together lines of text on small screens, so big paragraphs make it more likely that your visitors will lose their place and get frustrated.

4. Optimized Media Display.

Test your images, infographics, and videos to make sure they look right on phones and tablets, without requiring users to scroll or resize their display to see your media.

 

What Does Mobile-Friendly Navigation Mean?

Once your mobile visitors arrive, how will they find what they need? Mobile-friendly navigation factors in the hardware and user-interface differences between desktops and mobile devices.

Think Touches and Taps Rather Than Mouse Clicks.

Websites designed for desktop users are easiest to navigate with mouse clicks, not swipes, taps, and touches. There’s no mouse on a smartphone, so you’ll need to give mobile users a way to navigate using touch controls.

Reduce the Need for Data Entry.

Trying to type on a smartphone keyboard is just the worst. Between the tiny keys, random auto-corrects, and auto-fills that may or may not populate fields correctly, it’s something most mobile users prefer to avoid. Voice-to-text isn’t much better, and it’s not always an option (say, on the train during morning rush hour).

Organize your mobile site so people can find what they need without having to type in the search field, or contact you without filling out a contact form.

 

How Does a Mobile-Friendly Website Help Your Business?

All the work you put into making your site mobile-friendly can pay off in the form of more business. Google says that 94% of American smartphone users “search for local information on their phones,” even if they have access to a desktop. By making your site easy to find and easy to use on mobile devices, you’re more likely to earn their business.

 

Check to see if your site is mobile-friendly with this helpful tool from Google:
Mobile-Friendly Testing Tool 

8 Messages

 • 

262 Points

4 years ago

Explain how the design properties differ from my desktop version and why i can't make adjustment s..This is sick..C'mon give us a complete explanation with pictures and videos .

Brand User

7.6K Messages

 • 

106.7K Points

Hello,

 

WebsiteBuilder sites have the option to edit the mobile version of the site. https://community.homestead.com/conversations/websitebuilder/websitebuilder-editing-the-mobile-site/5f2a9b2258180958845c21ac

 

Sitebuilder plus sites will display as a smaller version of the desktop site. What website are you attempting to edit?