How to do Search Engine Optimisation in Odoo (SEO)

Zoekmachine optimalisatie (SEO) is een set van goede werkwijzes om uw website te optimaliseren zodat deze een betere ranking heeft in zoekmachines zoals Google. Kort samengevat zorgt goede SEO ervoor dat u meer bezoekers krijgt.

Some examples of SEO rules: your web pages should load fast, your page should have one and only one title <h1>, meta tags (alt-tag, title-tag) should be consistent with the content, your website should have a /sitemap.xml file, etc.

To guarantee Odoo Website and Odoo eCommerce users have a great SEO, Odoo abstracts all the technical complexities of SEO and handles everything for you, in the best possible way. This will be explained here below.

But first, let see how you can easily boost your ranking by finetuning the content and the meta tags of your website.

Meta Tags

Title, Description

Every web page should define the <title> and <description> meta data. These information elements are used by search engines to promote your website. They are automatically generated based on page title & content, but you can finetune them. Make sure they fit the content of the page, otherwise you will be downgraded by search engines.

../../../../_images/seo01.png

Sleutelwoorden

In order to write quality content and boost your traffic, Odoo provides a <keyword> finder. Those keywords are the searches you want to head towards your website. For each keyword, you see how it is used in the content (H1, H2, page title, page description, page content) and what are the related searches in Google. The more keywords are used the better.

../../../../_images/seo02.png

Notitie

If your website is in multiple languages, you can use the Promote tool for every language of a single page and set specific title, description and search tags.

Content is King

When it comes to SEO, content is usually king. Odoo provides several modules to help you build your website content:

  • Odoo Blogs: schrijf geweldige inhoud.

  • Odoo Slides: publish all your Powerpoint or PDF presentations. Their content is automatically indexed on the web page. Example: odoo.com/slides/public-channel-1

  • Odoo Forum: let your community create contents for you. Example: odoo.com/forum/1 (accounts for 30% of Odoo.com landing pages)

  • Odoo Mailing List Archive: publish mailing list archives on your website. Example: odoo.com/groups/community-59 (1000 pages created per month)

Notitie

The 404 page is a regular page, that you can edit like any other page in Odoo. That way, you can build a great 404 page to redirect to the top content of your website when visitors get lost in invalid URLs.

Use Social Networks

Social media is built for mass sharing. If lots of people share your content on social media, then it’s likely more people will link to it, and links are a huge factor for SEO ranking.

Odoo embeds several tools to share content through social media:

Sociale netwerk

Odoo allows to link all your social network accounts in your website footer. All you have to do is to refer all your accounts in your company settings.

../../../../_images/seo03.png

Sociaal delen

Drop the building block Share on any page you want your visitors to share. By clicking the icon, they are prompted to share the page in their social media wall.

../../../../_images/seo04.png

Most social media use a picture of the picture to decorate the share post. Odoo uses the website logo by default but you can choose any other image of your page in the Promote tool.

../../../../_images/seo05.png

Facebook pagina

Drop the building block Facebook Page to display a widget of your Facebook business page and encourage visitors to follow it. You can display the timeline, the next events and the messages.

Twitter Scroller

Display the Twitter feeds with customer satifaction on your website. THis will increase the number of tweets and shares.

Test uw website

You can compare how your website rank, in terms of SEO, against Odoo using WooRank free services: woorank.com

URLs Handling

This section sheds some light on how Odoo makes URLs SEO-friendly.

URL’s structuur

Een typische Odoo URL ziet er als volgt uit:

Met de volgende componenten:

  • https:// = Protocol

  • www.mysite.com = uw domeinnaam

  • /fr_FR = page language. This part of the URL is removed if the visitor browses the main language of the website Thus, the main version of this page is: https://www.mysite.com/shop/product/my-great-product-31

  • /shop/product = every module defines its own namespace (/shop is for the catalog of the eCommerce module, /shop/product is for a product page).

  • my-great-product = by default, this is the slugified title of the product this page refers to. But you can customize it for SEO purposes. A product named “Pain carré” will be slugified to “pain-carre”. Depending on the namespace, this could be different objects (blog post, page title, forum post, forum comment, product category, etc.).

  • -31 = het unieke ID van het product

Merk op dat eender welk dynamisch deel van een URL gereduceerd kan worden naar een ID. Bijvoorbeeld, de volgende URL’s doen allemaal een 301 doorverwijzing naar de bovenstaande URL:

Sommige URL’s hebben verschillende dynamische onderdelen, zoals deze (een blogcategorie en een post):

In het bovenstaande voorbeeld:

  • Company News is the title of the blog

  • The Odoo Story is the title of a specific blog post

Wanneer een Odoo pagina een pager heeft zal het paginanummer direct in de URL worden gezet (heeft geen GET argument). Dit staat toe dat elke pagina geïndexeerd wordt door zoekmachines. Bijvoorbeeld:

Wijzigingen in URL’s & titels

Wanneer de URL van een pagina wijzigt (bijvoorbeeld een vriendelijkere SEO versie van uw productnaam), hoeft u zich geen zorgen te maken over het updaten van alle links:

  • Odoo will automatically update all its links to the new URL.

  • If external websites still points to the old URL, a 301 redirect will be done to route visitors to the new website.

Als een voorbeeld, deze URL:

Will automatically redirect to:

In short, just change the title of a blog post or the name of a product, and the changes will apply automatically everywhere in your website. The old link still works for links coming from external websites, with a 301 redirect to not lose the SEO link juice.

HTTPS

Search engines boost ranking of secure HTTPS/SSL websites. So, by default all Odoo Online instances are fully based on HTTPS. If the visitor accesses your website through a non HTTPS url, it gets a 301 redirect to its HTTPS equivalent.

Multi-Language Support

Multi-Language URLs

Indien u een website in meerdere talen heeft zal dezelfde inhoud beschikbaar zijn in verschillende URL’s, afhankelijk van de gebruikte taal:

In dit voorbeeld is de taal van de pagina fr_FR. U kan zelfs verschillende variaties van dezelfde taal hebben: pt_BR (Portugees van Brazilië), pt_PT (Portugees van Portugal).

Language Annotation

To let search engines know that the second URL is the French translation of the first URL, Odoo will add an HTML link element in the header. In the HTML <head> section of the main version, Odoo automatically adds a link element pointing to the translated versions of that webpage;

Met deze aanpak:

  • Search engines will redirect to th right language according to the visitor language.

  • You do not get penalized by search engines if your page is not translated yet. Indeed, it’s not a duplicated content, but a different version of the same content.

Language Detection

When a visitor lands for the first time on your website (e.g. yourwebsite.com/shop), they may automatically be redirected to a translated version according to their browser language preference: (e.g. yourwebsite.com/fr_FR/shop).

Next time, it keeps a cookie of the current language to avoid any redirection.

Om een bezoeker te forceren om de standaard taal te gebruiken kan u de code gebruiken van de standaard taal in uw link, bijvoorbeeld: uwwebsite.com/en_US/shop. Dit zal bezoekers altijd doen landen op de Engelse versie van de pagina, zonder de browser voorkeuren te gebruiken.

Page Speed

Introductie

The time to load a page is an important criteria for search engines. A faster website not only improves your visitor’s experience, but gives you a better page ranking. Some studies have shown that, if you divide the time to load your pages by two (e.g. 2 seconds instead of 4 seconds), the visitor abandonment rate is also divided by two. (25% to 12.5%). One extra second to load a page could cost $1.6b to Amazon in sales.

../../../../_images/seo06.png

Gelukkig doet Odoo alle magie voor u. Hieronder vind u trucks die Odoo gebruikt om de laadsnelheid te verhogen. U kan vergelijken hoe uw website presteert met deze twee tools:

Afbeeldingen

When you upload new images, Odoo automatically compresses them to reduce their sizes (lossless compression for .PNG and .GIF and lossy compression for .JPG).

Vanuit de upload knop heeft u de optie om het originele bestanden ongewijzigd te houden indien u de kwaliteit van de afbeelding wilt optimaliseren in plaats van de performantie.

../../../../_images/seo07.png

Notitie

Odoo comprimeert afbeeldingen wanneer ze geüpload worden naar uw website, niet wanneer ze opgevraagd worden door de bezoeker. Dus is het mogelijk dat, indien u een derde partij thema gebruikt, het afbeeldingen aanbiedt die niet efficiënt gecomprimeerd zijn. Maar alle afbeeldingen gebruikt in de officiële Odoo thema’s zijn standaard gecomprimeerd.

Wanneer u klikt op een afbeelding toont Odoo u de Alt en titel attributen van de <img> tag. U kan hierop klikken om uw eigen titel en Alt attributen in te stellen voor de afbeelding.

../../../../_images/seo08.png

Wanneer u klikt op deze link, zal het volgende venster verschijnen:

../../../../_images/seo09.png

Odoo’s pictogrammen zijn geïmplementeerd met het gebruikt van een font (Font Awesome in de meeste Odoo thema’s). Dus kan u zoveel pictogrammen gebruiker als u wilt in uw pagina, ze hebben geen extra aanvragen nodig om de pagina te laden.

../../../../_images/seo10.png

Static Resources: CSS

All CSS files are pre-processed, concatenated, minified, compressed and cached (server-side and browser-side). The result:

  • slechts één CSS bestandsverzoek is nodig om een pagina te laden

  • dit CSS bestand is gedeeld en gecached over verschillende pagina’s, zodat wanneer bezoekers klikken op een andere pagina, de browser geen enkel CSS bestand moet inladen.

  • dit CSS bestand is geoptimaliseerd om klein te zijn

Pre-processed: The CSS framework used by Odoo is Bootstrap. Although a theme might use another framework, most of Odoo themes extend and customize Bootstrap directly. Since Odoo supports Less and Sass, you can modify CSS rules instead of overwriting them through extra CSS lines, resulting in a smaller file.

Concatenated: every module or library you might use in Odoo has its own set of CSS, Less or Sass files (eCommerce, blogs, themes, etc.). Having several CSS files is great for the modularity, but not good for the performance because most browsers can only perform 6 requests in parallel resulting in lots of files loaded in series. The latency time to transfer a file is usually much longer than the actual data transfer time, for small files like .JS and .CSS. Thus, the time to load CSS resources depends more on the number of requests to be done than the actual file size.

Om dit probleem aan te pakken worden alle CSS / Less / Sass bestanden geconcateneerd in één .CSS bestand dat naar de browser wordt gestuurd. Zodat een bezoeker slechts één .CSS bestand moet laden per pagina, wat vooral efficiënt is. Als de CSS gedeeld wordt over alle pagina’s hoeft de browser geen nieuw CSS bestand te laden wanneer een andere pagina wordt open gedaan!

Beide bestanden in het <head>

Wat de bezoekers krijgen (slechts één bestand)

/* Van bootstrap.css */

.text-muted {

.text-muted {

color: #666;

color: #777;

background: yellow

background: yellow;

}

}

/* Van my-theme.css */

.text-muted {

color: #666;

}

De CSS verzonden door Odoo bevat alle CSS / Less / Sass bestanden van alle pagina’s / modules. Door dit te doen moeten andere pagina weergaven van dezelfde weergave geen nieuw CSS bestand inladen. Maar sommige modules kunnen grote CSS/JavaScript bronnen bevatten die u niet op voorhand wilt ophalen op de eerste pagina omdat ze te groot zijn. In dit geval splitst Odoo de bronnen in een tweede bundel die geladen wordt wanneer de pagina die het gebruikt het aanvraagt. Een voorbeeld hiervan is de back-end die enkel ingeladen wordt wanneer de bezoekers aanmelden en de back-end opendoen (/web).

Notitie

If the CSS file is very big, Odoo will split it into two smaller files to avoid the 4095 selectors limit per sheet of Internet Explorer. But most themes fit below this limit.

Minified: Na het pre-processen en concateneren zal de resulterende CSS geminificeerd worden om de grootte te verkleinen.

Voor minificatie

Na minificatie

/* sommige commentaren */

.text-muted {color: #666}

.text-muted {

color: #666;

}

Het uiteindelijke resultaat is dan gecomprimeerd, voordat het aan de browser wordt aangeleverd.

Then, a cached version is stored server-side (so we do not have to pre-process, concatenate, minify at every request) and browser-side (so the same visitor will load the CSS only once for all pages they visit).

Static Resources: Javascript

As with CSS resources, Javascript resources are also concatenated, minified, compressed and cached (server-side and browser-side).

Odoo maakt drie JavaScript bundels aan:

  • One for all pages of the website (including code for parallax effects, form validation, etc.)

  • One for common Javascript code shared among frontend and backend (Bootstrap)

  • Een voor back-end specifieke JavaScript code (Odoo Web Client interface voor uw werknemers die Odoo gebruiken)

Most visitors of your website will only need the first two bundles, resulting in a maximum of two Javascript files to load to render one page. As these files are shared across all pages, further clicks by the same visitor will not load any other Javascript resource.

Notitie

If you work on developer mode, the CSS and Javascript are neither concatenated, nor minified. Thus, it’s much slower. But it allows you to easily debug with the Chrome debugger as CSS and Javascript resources are not transformed from their original versions.

CDN

Indien u de CDN optie activeert in Odoo worden statische bronnen (JavaScript, CSS, afbeeldingen) geladen van het Content Delivery Netwerk. Een Content Delivery Netwerk heeft drie voordelen:

  • Laad bronnen van een dichtbij zijnde server (meeste CDN’s hebben servers in de belangrijkste landen over de wereld)

  • Cache bronnen efficiënt (er worden geen resources gebruikt op uw eigen server voor de berekening)

  • Verdeel de bronnen die geladen worden over verschillende diensten zodat u meerdere bronnen parallel kan laden (Sinds de Chrome limiet van 6 parallelle aanvragen op domeinniveau is)

U kan uw CDN opties configureren vanuit de Website Admin app, met behulp van het configuratie menu. Hier is een voorbeeld van een configuratie die u kan gebruiken:

../../../../_images/seo11.png

HTML pagina’s

De HTML pagina’s kunnen gecomprimeerd worden, maar dit wordt meestal afgehandeld door uw webserver (NGINX of Apache).

The Odoo Website builder has been optimized to guarantee clean and short HTML code. Building blocks have been developed to produce clean HTML code, usually using Bootstrap and the HTML editor.

Als een voorbeeld, als u de kleurenprikker gebruikt om de kleur van een paragraaf te wijzigen naar de primaire kleur van uw website, zal Odoo de volgende code genereren:

<p class="text-primary">Mijn tekst</p>

Waar de meeste HTML editors (zoals een CKEditor) de volgende code produceert:

<p style="color: #AB0201">Mijn tekst</p>

Responsief design

Websites that are not mobile-friendly are negatively impacted in search engine rankings. All Odoo themes rely on Bootstrap to render efficiently according to the device: desktop, tablet or mobile.

../../../../_images/seo12.png

As all Odoo modules share the same technology, absolutely all pages in your website are mobile friendly.

Browser Caching

Javascript, images and CSS resources have an URL that changes dynamically when their content change. As an example, all CSS files are loaded through this URL: localhost:8069/web/content/457-0da1d9d/web.assets_common.0.css. The 457-0da1d9d part of this URL will change if you modify the CSS of your website.

Dit laat Odoo toe om een heel lange cache vertraging in te stellen (XXX) op deze bronnen: XXX seconden, terwijl deze direct wordt geüpdatet als u de bron update.

Schaalbaarheid

In addition to being fast, Odoo is also more scalable than traditional CMS and eCommerce (Drupal, Wordpress, Magento, Prestashop).

Here is the slide that summarizes the scalability of Odoo Website & eCommerce.

../../../../_images/seo13.png

Search Engines Files

Sitemap

The sitemap points out pages to index to search engine robots. Odoo generates a /sitemap.xml file automatically for you. For performance reasons, this file is cached and updated every 12 hours.

Standaard zijn alle URL’s één /sitemap.xml bestand, maar als u veel pagina’s heeft zal Odoo automatisch een Sitemap index bestand aanmaakt dat het sitemaps.org protocol protocol respecteert om sitemap URL’s te groeperen in 45000 stukken per bestand.

Elke sitemap heeft 4 attributen die automatisch berekend worden:

  • <loc> : de URL van een pagina

  • <lastmod> : last modification date of the resource, computed automatically based on related object. For a page related to a product, this could be the last modification date of the product or the page.

  • <priority> : modules may implement their own priority algorithm based on their content (example: a forum might assign a priority based on the number of votes on a specific post). The priority of a static page is defined by it’s priority field, which is normalized (16 is the default).

Gestructureerde Gegevens Markup

Structured Data Markup is used to generate Rich Snippets in search engine results. It is a way for website owners to send structured data to search engine robots; helping them understand your content and create well-presented search results.

Google ondersteunt een aantal rijke snippets voor inhoudstypes, inclusief: Beoordelingen, Mensen, Producten, Zaken, Evenementen en Organisaties.

Odoo implementeert micro data zoals gedefinieerd in de schema.org specificaties voor gebeurtenissen, e-commerce producten, forum berichten en contactadressen. Dit staat uw productpagina’s toe om getoond te worden in Google en om extra informatie te gebruiken zoals de prijs en beoordeling van een product:

../../../../_images/seo14.png

robots.txt

When indexing your website, search engines take a first look at the general indexing rules of the a``/robots.txt`` file (allowed robots, sitemap path, etc.). Odoo automatically creates it. Its content is:

User-agent: * Sitemap: https://www.odoo.com/sitemap.xml

It means that all robots are allowed to index your website and there is no other indexing rule than specified in the sitemap to be found at following address.

You can customize the file robots in developer mode from Settings –> Technical –> User Interface –> Views (exclude robots, exclude some pages, redirect to a custom Sitemap). Make the Model Data of the view Non Updatable to not reset the file after system upgrades.