When you think about it, our phones have somehow become an extension of most of us. When I ask my friends about their computers, they look at me like I’m some kind of elderly person talking about outdated technology. There are only a few of my friends that still utilize computers and this has got me thinking; From the standpoint of a person who develops websites, what if my sites don’t transfer to mobile devices well? I put it to the test, and I was pretty upset with what I saw. 

My First Mobile Site

One of my very first websites was a blog reviewing mobile online casinos, so naturally when Google came out with its guidelines for mobile friendly websites I thought this should be one of my very first projects to tackle. As you can see by visiting the link below, the site now offers a clean layout, with an simple menu structure that works well when viewed from both desktop and mobile devices. I already had a blog where I was reviewing online casinos, but when I read that mobile users where now in the majority of web surfers,  I started thinking, a site that offers mobile casino reviews may be of some interest. But for whatever reason, I built the site from a desktop perspective, making it only look nice on mobile.

The Importance of Mobile First Web Design

I use the same template for all of my websites, because it is easy to use with drag and drop technology. This is great because I can make each website look different from all the rest. I went to my phone, and I took a look at my website. To my surprise, the website on my phone looked much different from what I saw on the computer. This mostly had to do with the text. My text was touching each edge of the screen in some kind of weird word vomit kind of way. In addition to the overload of text, the images weren’t sized properly and some of them even seemed to slip underneath the text, making it so that parts of the words weren’t even visible.

So many things went through my mind when I saw this, I first thought.. Wow, this is the very first impression that people are getting from me (they were most likely thinking that I am incompetent around technology and am in no way up to speed with what is going on in the real world) I also realized how important it is to optimize my websites to be used across all platforms. 

Luckily for me, I had a phone, a tablet and a desktop computer which I could use to see how my website came across on all devices. The tablet website looked a bit better, but it still had some major issues to be resolved. 

So why is mobile first marketing and design so important? Most of the time, when people are looking for something really quickly, they will use their smartphone in line at the grocery store, at a coffee shop, during work hours etc and if that is their first impression of you.. A broken website with many errors and access to only half of your content, you aren’t putting your best foot forward by any means. 

After Google came out with their full list of guidelines, I had to overhaul my entire mobile casino site. This was a long process including changing out the entire theme, to something lightweight and faster. Aside from that I did some work making sure every image was optimized (save for web), along with adding a cache plugin. Since the mobile casinos blog platform is using the WordPress CMS, each page is dynamic as they are stored in a MySql database, meaning the pages have to load every-time a request to them is made. A cache plugin speeds this process up by caching some of the pages prior to the visitor requesting them. 

Static Websites On The Blockchain

In the future I plan on further optimizing this site by using a static CMS such as Jekyll, instead of relying on WordPress and a caching plugin due to the fact that speed is an ever increasingly important ranking factor, especially when it comes to mobile.

There is also an option to host your website on the blockchain using ZeroNet.io, but I have yet to try this. They claim to be a Decentralized Web Platform using Bitcoin cryptography, and the BitTorrent network. This may be worth looking into for a static website, as it should be easy to setup with no database. ZeroNet also claims to be "open, free and uncensored" with no hosting costs. They go on to say that this service works across all browsers, and operating systems. 

Tips for optimizing your website for mobile devices

Since we’ve already covered the bases as far as why and the direct point as to the fact that you need to be optimizing for web, here are some tips for making sure that your website is mobile friendly. 

• Image Size - I’m not talking about the actual pixel size of your image, this should automatically be calculated by the template you’re using, but the size of the image as far as load time. You want to be sure that your image loads before your visitor decides to scroll right past the big blank square in the center of the page. Make sure that your images are optimized for web.

• Pick and choose what content you’d like to display on a mobile device. Some templates allow you to create a totally separate mobile layout which will help you to decide which content you want to have for mobile users. 

• Put your best content first. Most likely, your mobile readers will become distracted by notifications, emails or phone calls that could disrupt their browsing session. Be sure to choose your content that is straight to the point to display on their screen first. 

• Make their experience memorable, since mobile users tend to have a lot of distractions, sometimes they will bookmark websites to save for later or view on their computer at home. Be one of those sites which players want to come back to later on.