Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Google Throws New Challenges for Mobile Web Developers

DZone's Guide to

Google Throws New Challenges for Mobile Web Developers

Google will now be considering a mobile web page's speed in search rankings. See how this could impact you as a mobile web developer.

· Mobile Zone ·
Free Resource

Google announced on January 17th that the page speed of a mobile website will be considered for page ranking.  This is not unexpected considering the continuously increasing growth of internet searches and traffic coming from mobile browsers.

Impact on Web Sites' Search Results

SEOs of websites have long been struggling to ensure that their website appears on the first page of Google search results. All major companies have a specialist for SEO optimization. 

There is no more room for slow websites with great SEO optimization. Slow websites on mobile web browsers will be penalized with lower rankings.

Google has not yet revealed the exact relation between page speed and page ranking. The exact impact can only be figured out in July 2018, once the updated algorithm is used in page ranking and search results.

Challenges for Developers  

Now web site developers must be feeling the heat of the announcement. All product and service companies will have to enter an era of new age technologies of mobile web development.

They have to adopt all new age technologies which they have been avoiding. With the announcement of AMP from Google a few years back, most content-oriented companies have adopted AMP technology to stay in the top search results. 

The time has come to re-think your website development strategy so that your site can remain competitive with higher page rank.  Here are a few pointers to evaluate your existing websites/pages and prepare for the July 2018 deadline. 

Step 1: Access All Pages of Your Website, Whether or Not You Need to Optimize Page Speed  

Use Google's PageInsights tool to evaluate whether pages need to be optimized or not. It will give you a speed score on desktop and mobile devices, if the page can target on mobile devices as well. 

If your page is not available for mobile, then it will show you "unavailable." Time to plan for mobile web NOW!

Step 2: Identify What to Fix

There can be a range of issues with page speed:

1. Infrastructural issues

2. Server config, capability/scaling issues

3. Unoptimized resources like HTML, CSS, JS, images 

4. Coding/architecture issues

Step 3: Fix the Issue!

Hot Fix 1

Try open source Google PageSpeed Modules on Apache and Nginx web servers, if you are not already using it. It will give your website a major speed boost. It will help to automatically fix many issues with HTML, JS, CSS, and images.

Hot Fix 2

Go with various CDN providers for the JS/CSS libraries your website code is using. They will reduce the latency for third-party common resources.

Long-Term Strategy

Check Your infrastructure

After exhausting the above two solutions, you may want to check for infrastructural issues, which might be causing the slow mobile page load speed. Check the bottlenecks, if any exist. You can explore the possibilities of using PaaS or IaaS if that is the case. 

Re-architect Your Websites/Mobile Web Apps

Check the Design/Framework/Code

The last but most horrific coding issue is an architecture issue. This is a major decision for you and fixing it will consume major time, cost, and effort. 

You need to pay special attention to the mobile web part of your site. Get the dedicated version of your mobile web with new frameworks which are specialized to deliver speed on a mobile platform. 

A few of best of the class frameworks you might want to consider for your mobile web are listed below. Re-architecting your mobile web as a progressive web app with the latest development technologies will help you to boost the performance of your mobile website or app. 

  1. React JS framework: virtual DOM! 

  2. Angular 5 framework: Opinionated framework but
    great speed with a great ecosystem to manage large apps.

  3. Vue JS framework: virtual DOM and syntax somewhat similar to Angular 5; more flexible.

  4. Ionic framework (PWA version is on the way): a great UI framework originally targeted to mobile platforms. With the upcoming version, you can create great mobile web apps/desktop apps using React, Angular 5, or Vue as MVC frameworks. 

This is not an exhaustive list but a good starting point to fix your mobile web app. Hopefully, you find this article useful; looking forward to your feedback.

Topics:
mobile ,mobile web development ,performance ,google ,web optimization

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}