How Do I Optimize My Javascript for SEO

If your website is built through a content management system (CMS) like WordPress, you may not know about all of the code that goes into your website. Websites built on a CMS are made up of three types of code: HTML, CSS, & Javascript. Generally speaking, HTML is your content, CSS is your style (fonts, colors) and javascript controls interactive elements on a website. Take a simple blog post for example. The words in the post are likely written in HTML. CSS acts as a theming device so that words are the right size, font, color, and appear in the right layout. Javascript controls elements that may appear different to different users or are interactive. Javascript has a bit of a complicated relationship with SEO.

Javascript & SEO

By nature, javascript controls elements that may appear differently based on when they are viewed, who is viewing them, etc. When a search engine like Google is scanning a site they want to know where to rank pages based on what is on the page. Because Javascript can consistently change, it is difficult for search engines to get the data they need from Javascript to properly rank the page. This leads to an issue. Many web developers like Javascript because it makes a website more eye-catching and more interactive. But, it also makes a website difficult to crawl.

Server-Side vs. Client-Side

When a person types in a website what they see may be different from what was built. Whenever someone clicks a link and a webpage loads their web browser is contacting the server of that website and pulling over all of the HTML, CSS, and Javascript to create the page on the user’s phone or computer. In a way, a website exists in two different places. It exists on the website owner’s server and on the client’s computer. HTML and CSS will likely be the same in both places, but Javascript can change what is displayed. For instance, an eCommerce website would likely use Javascript to affect what products appear on the homepage. This makes things difficult for search engines that want to know what content is going to be on a page when a user clicks their link.

Google & Javascript

The good news is Google actually really likes Javascript. As the industry leader, Google has led the way in improving their crawl bots to render Javascript and then crawl. There are actually two phases to Google crawling a website. First, it crawls the server-side version of the website, then it renders the javascript and crawls the rendered website (client-side). But nothing is perfect. Rendering takes time and actually costs money. For Google to render and crawl a website it has to use the internet to complete the process. For this reason, web developers should always focus on pre-rendered content and everything that is on the server-side.

Server-Side Optimization

When you make a change to a website you probably want it reflected on Google & Bing instantly. Unfortunately, it takes time for Google or Bing to see your new webpage or new content. Rendered content takes even longer because it is put off until Google has the resources to handle the render. So, the best thing you can do for your website is to make sure that important metadata exists on the server-side of your website in HTML.

Using Hero Elements for SEO

A hero element refers to any element that answers the question of content intent. Is the content transactional (a product), informational (a blog), or something else. If you have transactional content your hero elements are product name, product description, product price, and product availability. If you have informational content your hero elements are the post title, post meta description, and tags/categories. You want to make sure these elements are rendered on the server-side so they are caught in that first round of indexing. Similarly, any schema markup you create is better placed on the server-side.

The Importance of Sitemaps

One weakness of Javascript is it is possible for content to change on a webpage without changing the webpage you are on. For instance, if your website has a “search feature” where users can put in their zip code and find the nearest location if the website user can do multiple searches without loading a different page all of this content is non-consistent. Google and search engines what content that is consistently in the same place and not content that only exists sometimes. To fix this, it is recommended that when users change the content they are viewing the URI also changes. You might notice when you do a Google search the URL in your browser actually contains the search terms you used, this is because every page of generated content on Google has a unique URI. This is a good practice for SEO otherwise pages that change in content regularly will be harder for Google to understand.

For More Information Contact Boston Web Marketing

Javascript is a complex topic and can be difficult to understand. If you have questions about how Javascript affects your website and how it could be better optimized, please contact Boston Web Marketing.

Recent Blog Posts

Contact Us Today!