When it comes to aligning with Google and how their flagship search product is evolving over the next year, Google’s annual I/O event is as good as it gets.
In 2017, the Google I/O event provided some incredible insights for the SEO community, chiefly the announcement of Google Lighthouse and the modern speed metrics that we now incorporate into optimization reporting for client sites.
2018 gave SEO even more with Google’s Javascript rendering and indexing process discussed in detail. We also got a nice overview of web development in relation to SEO from Mariya Moeva and John Mueller.
I’ve been champing at the bit for every annual I/O iteration and this year has been no different. 2019’s event has just wrapped up, so what has the SEO community gleaned from this year? The key themes from the SEO relevant presentations came as little surprise:
- Speed; Chrome v74, AMP etc.
- Multi device; car HUD, Google Assistant etc.
- Mobile first indexing – more than half the web now indexed this way
- PWAs (Progressive Web Apps) and Android Store submission
- Structured data and voice search
Plenty more innovation surrounding the critical themes that Google has been pushing in the last 5 years or so. I’m particularly excited about the role of PWAs in the enhancement of the web experience.
In this post I’ve provided detailed notes on some of the key talks. But for those of you who don’t have the time for all that…
TL;DR
- If your web asset is a critical component in keeping the lights on in your business, then you should seriously consider the potential advantages that some iteration of PWA could provide. You can get started implementing one for your existing website at PWABuilder.com.
- AMP is at a critical juncture in the publisher space as it continues to polarize the industry. However, if you generate content of any kind at scale and haven’t had an AMP conversation yet then it needs to happen because the performance gains can be significant.
- The Google Chrome browser v74 is getting more native speed enhancements; lazy loading, JS processing – there are still many other browsers you need to continue to optimize for, however.
- Chromium v74 will also now be used as the rendering engine for web pages (finally updated from v41 – the latest version of Chromium will from now on, always be the rendering engine used by Google – give or take a few weeks lag).
- ‘Questions’ and ‘HowTo’ schema add increased fervor to the process of content production. Use the Rich Results tester to plan your structured data.
- Native multi-device web assets are critical for Google – responsive design is a prerequisite.
- If your domain has a lot of original imagery then now is the time to begin looking at image optimization as a siloed project. There are many new features coming to search that early adopters can take advantage of; enhanced Google Image search, better discoverability with AMP etc.
Below I’ve pulled out a selection of key notes from some of the most SEO relevant presentations.
Google Search: State of the Union (Google I/O’19)
John Mueller, Martin Splitt (Google)
- The last year has seen a number of key updates to both search features, results pages and Google Search Console
- How search works
- Google rank publicly accessible and indexable URLs on the web
- That are viewable in any browser
- Examples of websites: HTML, PWA, Web Apps (in general), AMP, Angular, React, VueJS etc.
- Googlebot; 130,000,000,000,000 pages indexed
- How to get indexed: Backlinks, Internal links… Must be <a> tags with an ‘href’ attribute!
- To avoid crawling by Googlebot, use robots.txt
- Other ways to get indexed: Sitemaps, RSS feed w/ Websub, Indexing API for jobs & livestreams, Manually via Search Console
- Crawling is traditionally HTTP requests but Javascript has changed this approach
- Rendering might be needed to show content / links in a contemporary web application
- Chromium v74 is finally the Googlebot rendering engine (the latest version always will be)
- “If you have a URL on the web it is now being crawled with v74.”
- 1,000 new features – checkout the new series on YouTube for more information
- “If you have a URL on the web it is now being crawled with v74.”
- Mobile First Indexing – Over 50% of sites are now indexed mobile first
- Mobile pages must be the same or equivalent to desktop:
- Textual content
- Structured data
- Images (also alt-text, all sizes) and videos (in supported formats)
- Other meta data (and titles, descriptions, indexing directives)
- 100 % mobile indexing adoption is what Google are striving for
- Mobile pages must be the same or equivalent to desktop:
- Images
- Google Images are now better reflecting individual search results rather than being a collage
- Place images near relevant text and at top of the page
- Avoid important text within images
- Structured data is as important for images as it is for other types of content
- Descriptive file names and URL structure
- Must be <img> tags with ‘src’ and ‘alt’ attributes
- Responsive images should be used with <picture> element and ‘srcset’ attribute
- Lazy-loading with JS IntersectionObserver
- New Chrome loading=”lazy” works natively (but not for other browsers)
- Don’t block images in robots.txt
- Coming soon: High Resolution Image opt-in program
- Will be enabled using JSON-LD
- Can also work in conjunction with Google Discover
- Google Images will soon Prefetch and Preload your AMP content from images derived from those AMP pages (or pages associated with those images that also have AMP)
- Search Console
- 16 months of data in Search Analytics
- New speed report (beta)
- Latest structured data validation insights
- Augmented Reality
- Highlighting your 3D models in search
- Yielding information from the search API for things like restaurant menus
Google Search and JavaScript Sites (Google I/O’19)
Martin Splitt, Zoe Clifford (Google)
- JavaScript is not the new Flash from a rendering a web-crawling perspective…
- Chromium web-crawling now being completed via Googlebot with v74 (upgraded from v41)
- This render engine will almost always be in line with the latest desktop Chrome version (with a few weeks lag)
- New JS language features introduced with v74:
- And new API features:
- New JS testing tools will be updated in the coming months
- JS errors in Search Console may still be showing v41 rendering errors
- These likely still need to be fixed
- Web app architectures
- Universal JS / Isomorphic JS (same thing)
- JS code that can run on the server or client (browser)
- This enables us to do SSR (server side rendering)
- Server gets a request, runs some code, then generates HTML for the browser
- SSR drawbacks; isn’t so quick, so developers use…
- Pre-rendering; SSR for semi-static content (i.e. content that doesn’t change every minute)
- Hydration; a combination of static, pre-rendered HTML and dynamic JS driven elements for dynamic interactivity
- Rendering Vue.js apps
- vue-server-renderer = SSR +hydration
- prerender-spa-plugin = pre-rendering
- Nuxt.js = SSR + hydration or pre-rendering
- Universal JS / Isomorphic JS (same thing)
- New JS video series on YouTube
- Dynamic Rendering
- A temporary workaround
- SSR / hydration is development work
- Only useful for bots – users still get the slower, non-pre-rendered iteration
- Testing JS rendering
- Lighthouse in Chrome Dev Tools or as a Chrome extension
- Image lazy loading
- Use IntersectionObserver – an API that triggers a callback when new elements are visible (supported in Googlebot v74)
- Or try the experimental feature loading=”lazy” (for Chrome only)
- Rendering and Search Console reporting
- Crawl budget – a rate limit on how much Googlebot can crawl your site
- It also applies to the resources loaded; JS files loaded from script tags or XHR or fetch requests triggered from JS
- Resources get cached across renders (so cache expiry or Etags are very important)
- Infinite loops; at some point Google will cut off the JS and finish the crawl up to that point
- The render queue; URLs discovered are crawled, rendered and indexed completely separately
- Cookie enabled content is no good – Googlebot doesn’t persist with cookies across renders / sessions (always sees page like a signed out user)
- Progressive enhancement the recommended approach for web design
- Error handling in JS is important – error conditions ensuring fallback options consider SEO
- Soft 404s
- Common in SPAs
- App calls URL and JS figures out if content exists but HTTP code is already 200 (oh no!)
- Either redirect to URL that returns a 404 from the server
- Alternatively use the meta robots “noindex” on the soft 404 page
(interesting that there is no solution aside from redirecting to a dedicated 404 page – which doesn’t really seem like a solution)
- Test all this with Search Console and Mobile Testing Tool
Building Successful Websites: Case Studies for Mature and Emerging Markets (Google I/O ’19)
Jesar Shah, Charlie Croom (Twitter)
- The team at Twitter discuss building a single universal app for all users across all devices
- “Twitter Lite” – the first iteration of Twitter’s PWA aimed at serving users with poor connections or storage
- < 3MB install size via Android
- Seamless design and responsivity across devices
- Progressive enhancement in Twitter’s universal app; adapting buttons and design from feature phones through to the latest smartphones
- Twitter Lite maximized discoverability to the tune of 5 million+ installs
Rudra Kasturi (Times Internet)
- How to adapt web experiences for users with low-end devices and slow connections
- In multiple languages (over 200 languages in India)
- Across multiple brands under the publisher
- Built a fast, light PWA on two pillars of performance and engagement
- TTI (Time to Interactive) maintains at 5 seconds on the PWA
- The team even have an alerting system that triggers and identifies any breach of this threshold
- Reduced JS file size by 70% via code splitting and resource optimization
- Image optimization – lazy loading to reduce bandwidth consumption
- Caching strategies via Workbox allow users to continue to consume the top 20 stories via the PWA in offline mode
- And ultimately a 100 / 100 score across every Lighthouse category:
- All this leading to a 72% in users, a 31% increase in session duration, and a 59% increase in network revenue.
Enhance Your Search and Assistant Presence with Structured Data (Google I/O’19)
Aylin Altiok (Google)
- Two new types of structured data
- RSS feeds for podcast publishers
- Google Voice and Google Assistant success with structured data for recipe websites
- Recipes schema now supports video content
- Ability to provide step by step instructions to completing a task or activity via Google search (also supported via Google assistant)
Will Leszczuk (Google)
- Preference for JSON-LD with schema
- Rich results tester to provide a rich preview of what you get in search
- Structured data testing tool is the predecessor to this
- Natural Language Understanding demonstrated with both the following voice search questions returning the same result from a single page with relevant question markup
- “What’s the right age to start making Origami?”
- “Is my 4 year old too young to start making Origami?”
- Voice search opportunities with questions; generate answers to questions regarding your business and apply structured data to allow the following prompt via Google Voice search, (“Ask {brand}, {question}?”) e.g.
- “Ask WikiHow, how do I setup a home WiFi network?”
- “Ask Amazon, what is the highest rated wallet available Amazon?”
- Don’t use FAQ schema for Forums
- Use QA page markup instead
- Use original images in markup and not a thumbnail or other type of preview
- Google will scale images for the appropriate device
What’s New with Chrome and the Web (Google I/O ’19)
- Preload and prefetch enhancements native in Google Chrome
- Average of 840kb of images on the typical web page in 2019
- Native lazy loading in Chrome now a feature
- V8 JS processing engine optimizations to mitigate increasingly cumbersome JS payloads
- Install PWAs on desktop directly via the omnibox
- Web Packaging – possibly allowing the delivery of a website to come from dedicated caching servers or even validated peers devices rather than a traditional client / host connection
- Version 74 of Chromium now being used to render web pages:
Martin Splitt @ 🇨🇭🏡 (@g33konaut) May 9, 2019
Summary
And breathe… SEOs can learn much from this year’s Google I/O regarding strategic direction. The presentations provide an indication of what Google will value which is likely to be what is rewarded in their search algorithm (still very important to test, of course) so it is critical we’re aligned with this insights. We’re very excited at Croud to build more strategies derived from the knowledge in the talks! Be sure to reach out to us if you want to discuss in more detail.
