czwartek, 14 Lipiec 2016

think-with-google

Think with Google – using new tool for testing websites.

How Mobile-Friendly Is Your Site?

There is a reason why even search engines now prioritize mobile-friendly sites and content. We’ve reached a point where more users are accessing the World Wide Web on their mobile devices than those using laptops and desktop computers. In fact, over 55% of today’s internet traffic comes from mobile users. If your site isn’t mobile-friendly by now, you are certainly missing out on this shift in trend.

Creating a mobile-friendly is no longer as difficult as it seems. Google has laid out a series of guidelines that you can follow. These guidelines help site owners and web developers determine the best course in optimizing websites for both mobile and desktop views. This article will help you get started without hassle.

Think with Google Test Tool

Google has released a very handy test tool designed to help developers and site owners assess their sites. You can access the tool on Think with Google. Don’t worry about having to go through technical stuff, because the review process is very straightforward.

To start using the tool, all you have to do is enter your site’s URL. Hit the Test Now button and the web app will do all the hard work for you. It will open your site and review its web elements in order to determine a number of things.

The review process takes no more than a few seconds. Once completed, the web review tool will show three main scores: Mobile Friendliness, Mobile Speed and Desktop Speed. Any score above 75-80 means you’re really close to offering the best mobile viewing experience to your users. Naturally, these three scores represent different aspects of your site.

Mobile Friendliness focuses more on how easy it is to use your site on mobile devices. For example, the tool analyzed the positions of links and buttons on your page to determine if they are easy to use. When you have buttons too close to each other, your total score is reduced.

The Mobile Friendliness score is a good measure of mobile user experience. The higher your site score, the better your users’ experience will be when visiting your site using their mobile devices. It takes into account the size of the screen and other factors too.

The next score is Mobile Speed. As the name suggests, this score represents how quickly your site loads when accessed from mobile devices. Internet connection speed aside, Mobile Speed measurements focus on how each web element is loaded, the overall size of your site’s mobile view and of course the time needed to load the entire page.

Lastly, we have the Desktop Speed score. Similar to Mobile Speed, Desktop Speed score is based on how well – and how quickly – your site loads on desktop computers. Since desktops tend to have more processing power than mobile devices, you can expect your Desktop Speed to be higher than the Mobile Speed due to the more lenient standards.

Scroll down to the bottom of the Think with Google test result and you can request a full report. The full report is much more detailed, containing tips and recommendations that will help you optimize your site further. That brings us to the next point to discuss….

So, how can I optimize my site?

Now that you have insights from the web app, optimizing your site for mobile devices – and desktop computers – should be very easy to do. The actual things you need to do depend very much on the current state of your website, but there are a few basic tips to follow based on Google’s guidelines:

  • Optimize Content Delivery

It is important to deliver content as quickly as possible. According to Think with Google, mobile users seldom wait for more than 3 seconds when opening a site.

To keep user experience high and your mobile viewers satisfied, try to prioritize the main content of your page. Load them first and let large images and other design elements load in the background.

  • Keep Images Small, Responsive and Mobile-Friendly

Images are important parts of a website. They add visual appeal to your content. To keep your site mobile-optimized, you need to optimize your images as well. Remove unnecessary information (i.e. color profile, metadata, etc.) to reduce the size of images for web use.

Add placeholders and use lazy-load to optimize delivery of images on mobile devices. Lastly, be sure to display images as responsive web elements. This will help with page speed and will definitely make users happier.

  • JavaScript and CSS

One of the most important things to do to improve page speed on mobile devices is removing render-blocking JavaScript files. JQuery, for instance, can be structured to load after all important, priority contents are loaded. This way, your users can still enjoy the information they are looking for without having to wait for animations and other low-priority elements to load.

It is also much better to combine and minify JavaScript and CSS files for mobile devices. Your site will load quicker with 3 or 4 HTTP requests instead of 10 or more.

As mentioned earlier, these are just some of the basic tips you can apply to make your site mobile-optimized. Use the insights from Think with Google for more tips on how to fine-tune your site.

Back to home
Flutter – Nawigacja pomiędzy widokami

Nawigacja pomiędzy widokami we frameworku Flutter.

Read more...
Alternatywne JavaScriptowe Frameworki

W JavaScriptowym świecie poza frameworkami React, Angular które podzieliły po między siebie popularność, a goniącym je Vue.js jest jeszcze miejsce na inne, mniej skompilowane frameworki, które nie zostały jeszcze dostrzeżone przez szersze grono ludzi.

Read more...
Flutter – pobieranie danych w formacie JSON

W tym wpisie zapoznamy się jak w prosty sposób pobrać dane w formacie JSON.

Read more...