Since 2015, google has started to delist sites in searches that are not mobile friendly, making it even more imperative that you have a website that fits mobile devices. WordPress has many plugins that make this very simple. A key to having a site that works on mobile is to choose a WordPress theme that is responsive. Pretty much all new ones are – WordPress makes it easy to check your work as well.
Here are 4 rules to follow when designing a page or post that will still work for mobile or tablet screen, taken from the second video below:
Rule 1: The mobile preview – preview pages as you develop them to avoid mistakes early. When you preview, pay attention to what happens to your menus, images, paragraphs, etc.
Rule 2: Optimal image size – don’t upload images that are bigger than you need, as even if it is shown small, it will load the full picture file and then downsize it to fit your screen. If this rule is not followed, your site may load very slowly on mobile.
Rule 3: Use margins and padding with care – around paragraphs, photos, etc. so everything doesn’t crash together. Be careful not to set them too big either.
Rule 4: Alignments versus column layouts – columns are often better for side-by-side content than left/right alignments are.
From your dashboard, click on your site name in the red box above to go to the screen from the picture below, where you can preview your site on different sized screens.
Another easy way to check is to have your website open, and squish your browser very thin so that it is representative of a mobile phone. Most decent WordPress themes will be responsive and will form fit the new screen. You can obviously just use an actual mobile phone instead of this, but that isn’t so easy if the page hasn’t been published yet, and it’s not quite as quick as just doing this.
Tutorial on making your site mobile friendly:
Thanks to QuickRegister SEO for the video.
4 Simple rules to create perfectly responsive mobile pages:
Thanks to Thrive Themes for the video.