Since your mobile phone is a much smaller screen than a tablet, laptop, or desktop it's imparitive your web design take advantage of every pixel. That's why you may be able to get away with one layout that looks good on larger screen devices but perhaps not on the small screen of a phone. In this article I'm going to be sharing with you how to optimize your website for a mobile phone.
1. Use a larger font.
Don't keep your site visitors squinting in to there phone to read the content of your site. Use larger text so even grandma can read the text on your site.
In WebStarts you can click to select a text box. You can then click the font size icon and use the slider to find the perfect size text for your mobile version.
2. Make buttons bigger.
When you're on a computer you have more control over the cursor with a mouse or trackpad. Not so much on the small screen of a phone. Make sure if you have placed people need to tap they're big enough to do without having to hunt around. Buttons, icons, text hyperlinks, all of them should be big and obvious.
3. Only include the most important stuff.
Since the screen is small don't waste the real estate with unimportant content. Stick to the things people are expecting to find on your website, nothing more, nothing less.
In WebStarts you can hide content by selecting it and clicking the hide icon. That won't remove it from the desktop verison of your site, only the mobile version, and it can be unhidden just as quickly.
If you want to add content to your mobile version in WebStarts it has to be done through the desktop view. When you add a design elment there, toggle over to the mobile view, and you'll find the design element under the Hidden section of the side bar. You can than drag it where you'd like it to be displayed on the page.
4. Make the mobile version your default
When you're finished with your mobile layout you're going to want it to be displayed by default when someone visits your site from a mobile phone. To do this click on Settings and move the toggle switch to the enabled position where it says Display Mobile View. After that be sure to click the Save icon on the toolbar to save and publish the changes.
If you don't already have a website you can sign up to create a free website at WebStarts.com. WebStarts is everything you need to create a custom website, blog, or online store.