[Pos baru] Mobile Responsive Design Principles: Make Your Site Smartphone-Ready

Pos : Mobile Responsive Design Principles: Make Your Site Smartphone-Ready
URL : http://wordpress.com/2019/04/08/mobile-responsive-design-principles-make-your-site-smartphone-ready/
Ditulis : 8 April 2019 pukul 3:00 pm
Penulis : Aaron von Frank
Tag : Design, Mobile, Tips, UX
Kategori : Web Design

Mobile responsive design is essential for modern websites, as it allows a website's appearance to automatically optimize to whatever screen size/device (mobile, tablet, or desktop) a site visitor is using. According to Statista ( https://www.statista.com/topics/779/mobile-internet/ ) , 52 percent of all web traffic now comes from mobile devices, and mobile traffic increases yearly. This is one of the most important statistics for you to keep in mind if you're a website owner.

If your website isn't mobile-friendly, people won't find, visit, convert, or continue to use your website/business. Popular platforms like WordPress.com ( http://www.wordpress.com ) make it easy, since all of their themes are mobile-friendly (even the free ones).

Here are four steps to make your responsive website more mobile-friendly.

1. Test site speed, improve, repeat
"Nearly half of web users expect a site to load in two seconds or less, and they tend to abandon a site that isn't loaded within three seconds," says New York Times bestselling author Neil Patel ( https://neilpatel.com/blog/speed-is-a-killer/ ) . "Seventy-nine percent of web shoppers who have trouble with website performance say they won't return to the site to buy again and around 44 percent of them would tell a friend if they had a poor experience shopping online."

Use free tools such as Pingdom ( https://tools.pingdom.com/ ) and Google Page Speed Insights ( https://developers.google.com/speed/pagespeed/insights/ ) to test your site's speed. These services also provide improvement recommendations.

Once you know your starting point, you can implement changes and see how your site speed improves.

2. Compress your files
The compressing of CSS, HTML, and JavaScript files on your WordPress.com site is automatically taken care of. However, if you'd prefer to compress the files on your own, you can try using custom designs.

https://wpcom.files.wordpress.com/2019/02/sw-639094.png

When it comes to compressing images, WordPress.com sites have a big advantage, too. They automatically use Photon ( https://developer.wordpress.com/docs/photon/ ) to both compress your image sizes and serve them via a content delivery network (CDN). Therefore, no matter where in the world your site visitor is, your images will automatically be compressed and delivered to their computer via a nearby server network.

3. Simplify your navigation
Whether your navigation menu collapses into a single icon or displays horizontally at the top of a mobile window, the same rule applies — keep it simple.

Too many navigation choices or sub-menus can be overwhelming, and they may even create formatting problems on mobile devices.

4. Write mobile-friendly web copy
Your site visitors can be lumped into three categories: skimmer, swimmers, and hybrids. Skimmers will scan a page to pick up key details, while swimmers dive in and read every word. However, hybrids alternate between skimming and swimming depending on their initial interest level and whether your site engages them.

Part of your mobile-responsive design plan should be writing for all three types. Use E-Write's ( http://www.ewriteonline.com/bite-snack-and-meal-how-to-feed-content-hungry-site-visitors/ ) recommendation of the "Bite, Snack, Meal" method. Bite, or use page/post headlines to tell readers what to expect (for example, "how our services slash your expenses"). Snack by creating summary and/or conclusion sections which provide a concise takeaway. And then meal by adding more detailed explanations that fill in the blanks.

Be sure to use these tips to ensure that your website has a more mobile-friendly design.

--
WordPress.com | Terima kasih karena terbang bersama WordPress!

Kelola Langganan
https://subscribe.wordpress.com/?key=ef7902ba1ee3b86f43e7ffc017117508&email=jabatek77.internet%40blogger.com

Berhenti berlangganan:
https://subscribe.wordpress.com/?key=ef7902ba1ee3b86f43e7ffc017117508&email=jabatek77.internet%40blogger.com&b=9IWCnexL50Eoe2NoVu8T0vxDcyU6EbF5y58iNTYSfaoYtmKZNZr2z84wW-gI6mpwWqo0Tr3GZe9Re8j3DHCG6AmqjButTlks1lJxcmZ00fdHDw%3D%3D