“Users know to scroll. I don’t need to fit things above the fold”. Yes, but you need them to load fast.
I love what Google has done to simplify things for business like the new Google My Business solution.What I’m not happy with is the recent change to drop Google Authorship images from appearing in Google search. They claim that it will not affect click-through rate. This contradicts previous claims and the experience for those that supported Authorship.
What you can’t doubt is that search results appear more consistent and load faster without the images. Google has always worked to make things fast. Now they’re kicking things into high gear to suggest you do too. Especially with content that appears above the fold.
PageSpeed Insights is the name of a Google service that lets you submit any URL for Google to analyze. They will grade the way your site appears on desktops and a mobile device. They grade you for things like:
- Server Response Time.
- If your text files are minified to remove extra white space.
- Gzip compression support.
- Image file size optimizations.
- Avoiding redirects.
- Browser cache instructions.
They also grade the user experience for users on a mobile device. This grade is very important. Google now warns users if they believe your site will not work on their device. You need your site to work well on a mobile device.
Check out the PageSpeed Insights report for Brand Builder Websites. Presently we’re doing very well on the desktop layout.
Unfortunately we cannot control Pinterest’s servers to improve caching for their files. We either lose 1-2 points in PageSpeed or lose the ability for users to easily pin images on our site. I’m okay with 1-2 points for that functionality. Your mileage may vary.
We’re still pretty good for speed on mobile. And we’ve got a great score for the mobile user experience.
Above The Fold: Prioritize Visible Content
The above screenshots show that we lost some points for the Prioritize Visible Content rule. What this means is that we have images located above the fold. Now I don’t know about you, but I like our site to have some images. With images the browser sends another request to download the file to display it. This causes a slight delay which explains the change to Authorship I mentioned earlier.
So what can you do? You can convert your images to base64 notation and inline them in the page. This brings up a few concerns:
- The base64 notation for images larger than 2 KB are larger than the original size of the image and the HTTP headers. This means they’re downloading more content and slowing down page load.
- Base64 notation is not supported by IE 7 and below. Hopefully this is not much of a concern for most sites.
- Changing an image means that you must re-encode the file instead of uploading the new file.
This doesn’t leave much else you can do. I wish I had good news with this. You need to decide for yourself if it’s worth including images above the fold. If you cannot base64 the images then you may want to move your social media buttons to the footer.
Above The Fold: Eliminate Render Blocking Resources
… but you can do better. First remember that you don’t care when these files run so why not delay them from loading until you’re done constructing the page. Or maybe even after the page has finished downloading the pictures too. You can do this by adding an inline script creates a function to instruct the browser to download these files asynchronously. You then execute this file after the page has finished loading or called the DOMContentLoaded event. The DOMContentLoaded event is the time when the browser has knows about everything on the page, but isn’t done downloading external files like images. You might want to know what such a function might look like. Consider this:
This function loads the files “foo.js” and “bar.js” asynchronously starting at the DOMContentLoaded event in browsers that support that event, and then falls back to page load event for older browsers that do not support this event. This is the ideal solution for loading your content fast.
Now that you know the best ways to improve the speed of your above the fold content. Your users will appreciate these changes and you may see your site improve slightly in Google search. I’m sure anyone would be happy with that.
Thank you and keep building your brand.