Technical SEO Flashcards
How does Google render Javascript?
Google renders JavaScript on a second pass basis, meaning that Google will render the essential elements of a site first and will then a couple days or weeks later, render the Javascript.
This means that crucial SEO elements in the Javascript might not get indexed.
How does a website get from server to browser?
- User requests domain. Now that the name is linked to an IP address via DNS, people can request a website by typing the domain name directly into their browser or by clicking on a link to the website.
- Browser makes requests. That request for a web page prompts the browser to make a DNS lookup request to convert the domain name to its IP address. - The browser then makes a request to the server for the code your web page is constructed with, such as HTML, CSS, and JavaScript.
- Server sends resources. Once the server receives the request for the website, it sends the website files to be assembled in the searcher’s browser.
- Browser assembles the web page. The browser has now received the resources from the server, but it still needs to put it all together and render the web page so that the user can see it in their browser. As the browser parses and organizes all the web page’s resources, it’s creating a Document Object Model (DOM). The DOM is what you can see when you right click and “inspect element” on a web page in your Chrome browser (learn how to inspect elements in other browsers).
- Browser makes final requests. The browser will only show a web page after all the page’s necessary code is downloaded, parsed, and executed, so at this point, if the browser needs any additional code in order to show your website, it will make an additional request from your server.
- Website appears in browser. Whew! After all that, your website has now been transformed (rendered) from code to what you see in your browser.
Talk to your developers about async
. Async tells the DOM that it can continue to be assembled while the browser is fetching the scripts needed to display your web page. If the DOM has to pause assembly every time the browser fetches a script (called “render-blocking scripts”), it can substantially slow down your page load.
Think about removing old tracking scripts
You might also want to bring up other optimizations that devs can implement to shorten the critical rendering path, such as removing unnecessary scripts entirely, like old tracking scripts.
Client-side vs. Server Side Rendering
Most Javascript is executed in the client’s browser, with server-side rendering on the other hand the files are executed at the server and the server sends them to the browser in their fully rendered state.
SEO-Critical elements such as text, links and tags that are loaded on the client’s side with Javascript, rather than represented in your HTML, are invisible from your page’s code until they are rendered. This means search engine crawlers won’t see what’s in your Javascript - at least not initially.
Here is a list of some of the problems that can occur with your Javascript
You’ve blocked Googlebot from JavaScript resources (ex: with robots.txt, like we learned about in Chapter 2)
Your server can’t handle all the requests to crawl your content
The JavaScript is too complex or outdated for Googlebot to understand
JavaScript doesn’t “lazy load” content into the page until after the crawler has finished with the page and moved on.
How can you see whether Googlebot is seeing what you are seeing when viewing a URL? And potentially that nothing is going wrong with the Javascript?
You can use Google Search Console “URL Inspection” . Once you have inserted the URL, click on test live URL then click on view tested page.
You can also click on the screenshot tab to see how Google renders your page for mobile
In the more info tab you can also see any of the resources Google may not have been able to get for the URL you entered
What is schema markup?
Imagine being a search engine crawler scanning down a 10,000-word article about how to bake a cake. How do you identify the author, recipe, ingredients, or steps required to bake a cake?
Schema is a way to label or organize your content so that search engines have a better understanding of what certain elements on your web pages are. This code provides structure to your data, which is why schema is often referred to as “structured data.” The process of structuring your data is often referred to as “markup” because you are marking up your content with organizational code.
What is Google’s preferred schema markup?
JSON-LD is Google’s preferred schema markup and was announced in may 2016. Bing also supports this markup language
How can you test schema markup?
You can use Google’s Structured Data testing tool: https://search.google.com/structured-data/testing-tool
What are Rich Snippets?
In addition to helping bots like Google understand what a particular piece of content is about, schema markup can also enable special features to accompany your pages in the SERPs. These special features are referred to as “rich snippets,”
Some tips on Schema Markup
- You can use multiple types of schema markup on a page. However, if you mark up one element, like a product for example, and there are other products listed on the page, you must also mark up those products.
- Don’t mark up content that is not visible to visitors and follow Google’s Quality Guidelines. For example, if you add review structured markup to a page, make sure those reviews are actually visible on that page.
If you have duplicate pages, Google asks that you mark up each duplicate page with your structured markup, not just the canonical version. - Provide original and updated (if applicable) content on your structured data pages.
Structured markup should be an accurate reflection of your page. - Try to use the most specific type of schema markup for your content.
- Marked-up reviews should not be written by the business. They should be genuine unpaid business reviews from actual customers.
If you don’t want to risk duplicating content whilst using content again, use the canonicalisation tag
rel=”canonical” tag allows you to point towards the original content that you are looking to use again. You are basically just saying to a search engine “hey look at the original source and index that; don’t index this version.
Used when you don’t want to risk duplicating content
Apparently Google recommends having a self referencing canonical tag on every page of your site
This will help you avoid having multiple versions of a page on your site. You could end up having a duplicate scenario with https://www.example.com being indexed separately from https://example.com, for example. So be careful…
Distinguishing between content filtering and content penalties
There is no such thing as a duplicate content penalty. However, you should try and keep content from causing indexing issues by using the rel=”canonical” tag when possible
