@badams

#FOS18

@badams

#FOS18

Technical SEO in 2018

Barry Adams

Polemic Digital

08 February 2018

@badams

#FOS18

Barry Adams

Doing SEO since 1998

Founder of Polemic Digital

Co-Chief at State of Digital

@badams

#FOS18

@badams

#FOS18

How Search Engines Work

@badams

#FOS18

Web Search Engines

Three distinct processes:

1. Crawler

2. Indexer

3. Query Engine

@badams

#FOS18

Web Crawler (Googlebot)

Spiders the web;

Starts with URLs from previous crawls and XML sitemaps

Extracts hyperlinks and adds to crawl queue

Retrieves new and changed content

Access can be restricted with robots.txt

@badams

#FOS18

Elements of a Web Crawler

How fast can we crawl a site?

URL Importance;

How often do we need to recrawl a URL?

HTML Parser;

Can we find links in the crawled URL?

@badams

#FOS18

Crawler: HTML Parser

@badams

#FOS18

Indexer (Caffeine)

Analyses content

Analyses links

Analyses webpage layout

Can be controlled with robots meta tags

@badams

#FOS18

Elements of the Indexer

Web Rendering Service;

Renders webpages as a browser would (Chrome 41)

PageRanker;

Canonicalisation;

Determines the canonical URL

@badams

#FOS18

Web Rendering Service

https://developers.google.com/search/docs/guides/rendering

https://developers.google.com/search/docs/guides/rendering

@badams

#FOS18

Web Rendering Service

Chrome 41 is the rendering engine;

To be updated to Chrome 62(?) soon

Stateless;

No cookies are saved

Local & Session Storage is cleared

@badams

#FOS18

Fetch & Render

@badams

#FOS18

@badams

#FOS18

PageRanker

Links, links, links

Internal and external links both count

PageRank Damping factor

Feeds back to the crawler;

High PR = high crawl priority

@badams

#FOS18

Query Engine

Tries to understand the intent of the search;

Context

Synonyms

Entities

Retrieves relevant pages from the index

Ranks pages based on;

Content relevance

Authority signals

Freshness

@badams

#FOS18

@badams

#FOS18

JavaScript & SEO

@badams

#FOS18

Web Search Engines

Three distinct processes:

1. Crawler

2. Indexer

3. Query Engine

@badams

#FOS18

Web Search Engines

Three distinct processes:

1. Crawler

2. Indexer

3. Query Engine

@badams

#FOS18

JavaScript & Crawling

Googlebot does not render webpages;

The indexer (Caffeine) does

JavaScript is not executed by the Googlebot crawler;

@badams

#FOS18

JavaScript & Crawling

@badams

#FOS18

JavaScript & Crawling

No Hyperlinks!

@badams

#FOS18

Crawl Inefficiency

Crawler

hyperlinks

Sends page to Indexer

Cannot crawl any further

Indexer

Renders page and executes JS

Sends links back to Crawler

Cannot index any further

@badams

#FOS18

JavaScript & Indexing

https://www.elephate.com/blog/javascript -vs-crawl -

budget-ready-player-one/

https://www.elephate.com/blog/javascript-vs-crawl-budget-ready-player-one/

@badams

#FOS18

JavaScript & SEO

Googlebot (crawler) JavaScript

Caffeine (indexer) executes and indexes JavaScript

Further reading:

http://www.stateofdigital.com/javascript -seo-crawling-

indexing/

https://www.elephate.com/blog/javascript -vs-crawl -budget-

ready-player-one/

http://www.stateofdigital.com/javascript-seo-crawling-indexing/https://www.elephate.com/blog/javascript-vs-crawl-budget-ready-player-one/

@badams

#FOS18

Fetch & Render

@badams

#FOS18

Computed DOM

@badams

#FOS18

Computed DOM Chrome 41

https://search.google.com/test/rich -results

https://search.google.com/test/rich-results

@badams

#FOS18

HTML Source vs Computed DOM

https://www.diffchecker.com/

https://www.diffchecker.com/

@badams

#FOS18

@badams

#FOS18

Load Speed

@badams

#FOS18

https://webmasters.googleblog.com/2018/01/using -

page-speed-in-mobile-search.html

Load Speed & SEO

https://webmasters.googleblog.com/2018/01/using-page-speed-in-mobile-search.html

@badams

#FOS18

Load Speed & SEO

Crawl Budget = the maximum amount of time a search

engine spider will spend crawling your website before it

gives up.

@badams

#FOS18

Load Speed & SEO

Fast Load Speed = optimal use of crawl budget

@badams

#FOS18

Load Speed

https://developers.google.com/speed/pagespeed/insights/

https://developers.google.com/speed/pagespeed/insights/

@badams

#FOS18

GTMetrix

https://gtmetrix.com/

https://gtmetrix.com/

@badams

#FOS18

Waterfall chart

https://gtmetrix.com/

https://gtmetrix.com/

@badams

#FOS18

Chome DevTools : Lighthouse

@badams

#FOS18

Identify the Key Bottlenecks

Time to First Byte

Page Weight

Total Requests

JavaScript

Geographic location

@badams

#FOS18

Time to First Byte

How fast does the server respond?

Slow TTFB can mean:Slow database

Slow webserver

Long distance between client & server

Solutions:Optimise database

Upgrade server

Use a Content Delivery Network

Server-side Rendering & Caching

@badams

#FOS18

Page Weight

How many KB is the webpage?

Large page weight (>500KB):Unclean code

Large images

Large external files (CSS / JS)

Solutions:Enable compression

Optimise images

Combine & Minify CSS & JS files

Enable Caching

@badams

#FOS18

Total Requests

How many separate files are loaded for a single webpage?

Too many requests per page (>20):

Every request is a new HTTP exchange

Some requests can take a long time to complete

Solutions:

Combine external CSS and JS files

Enable client -side caching

Minimise external dependencies (plugins, tracking codes, etc)

@badams

#FOS18

JavaScript

Is there JavaScript that stops the page from rendering?

Render-blocking JavaScript means:

Crawler cannot parse the page

Browser has to wait for JS to execute

Solutions:

Asynchronous JavaScript

Server-Side Rendering

Not using JavaScript

@badams

#FOS18

Long Geographical Distance

Is the webserver far from the browser?

Large distance means:

More TCP/IP hops

Slow load times across the board

Solutions:

Host the site in the same country as your audience

Use a Content Delivery Network with good international

coverage

@badams

#FOS18

Load Speed Resources

https://developers.google.com/web/fundamentals/performance/

https://developers.google.com/web/fundamentals/performance/

@badams

#FOS18

@badams

#FOS18

Structured Data

@badams

#FOS18

Structured Data

What is Structured Data?

Old search: Keywords

New search: Things

Structured Data enables search engines to

understand things and their relationships .

@badams

#FOS18http://schema.org/docs/schemas.html

http://schema.org/docs/schemas.html

@badams

#FOS18

@badams

#FOS18

https://developers.google.com/search/docs/guides

/intro -structured -data

https://developers.google.com/search/docs/guides/intro-structured-data

@badams

#FOS18

Structured Data Vocabularies

@badams

#FOS18

JSON-LD

JavaScript Object Notation for Linked Data

W3C Standard since 2010

Schema.org recommended syntax since June 2013

Basic units are Name & Value pairs

@badams

#FOS18

JSON-LD vs Microdata

{

"@context": "http://schema.org",

"@type": "Book",

"name": "Information Architecture:

For the Web and Beyond",

"publisher": "O'Reilly",

" inLanguage ": "English",

" bookFormat ": "Paperback",

"offers":

{

"@type": "Offer",

"price": "22.99",

" priceCurrency ": "GBP"

}

}

Only £22.99

In Information

Architecture: For the Web and Beyond

In-line with the content HTML in the

@badams

#FOS18

Validating

https://search.google.com/structured -data/testing -tool/

https://search.google.com/structured-data/testing-tool/

@badams

#FOS18