How to do Search Engine Optimisation (SEO) in Odoo

Пошукова оптимізація (SEO) - це набір оптимальних методів оптимізації вашого веб-сайту, завдяки чому ви отримуєте кращий рейтинг у пошукових системах, таких як Google. Словом, хороша оптимізація SEO дозволяє отримати більше відвідувачів.

Деякі приклади правил SEO: ваші веб-сторінки мають завантажуватися швидко, на вашій сторінці має бути один і тільки один заголовок <h1>, мета теги (alt-tag, title-tag) повинні відповідати вмісту сторінки, ваш веб-сайт повинен мати файл /sitemap.xml і т.д..

Щоб гарантувати, що користувачі вебсайту та електронної комерції Odoo мають чудовий SEO, Odoo бере на себе всі технічні складнощі SEO. Як саме - читайте нижче.

Але спочатку подивіться, як ви можете легко підвищити свій рейтинг шляхом тонкого налаштування вмісту та метатегів вашого вебсайту.

Метатеги

Назва, Опис

Кожна веб-сторінка повинна визначати метадані <title>, <description> та <keywords>. Ці інформаційні елементи використовуються пошуковими системами, щоб визначити рейтинг вашого сайту. Вони генеруються автоматично на основі назви та вмісту сторінки, але ви можете додатково їх налаштувати. Перевірте, що вони відповідають вмісту вашої сторінки, інакше пошукові системи знизять ваш рейтинг.

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

Ключові слова

Для того, щоб написати якісний вміст і збільшити ваш трафік, Odoo пропонує пошук <keyword>. Ці ключові слова - це пошукові запити, які ви хочете направити на ваш вебсайт. Для кожного ключового слова ви бачите, як воно використовується у вмісті (H1, H2, заголовок сторінки, опис сторінки, вміст сторінки) та які є пов’язані пошукові запити в Google. Чим більше ключових слів буде використано, тим краще.

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

Примітка

Якщо ваш веб-сайт має декілька мов, ви можете використовувати інструмент просування для кожної мови окремої сторінки та встановлювати спеціальний заголовок, опис та пошукові теги.

Вміст це наше все!

Коли мова йде про SEO, вміст має дуже великий вплив. Odoo надає кілька модулів, які допоможуть створити свій вміст на вашому вебсайті:

  • Блоги Odoo: написання чудового вмісту

  • 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)

Примітка

Сторінка 404 - це звичайна сторінка, яку можна редагувати, як і будь-яку іншу сторінку в Odoo. Таким чином, ви можете створити класну 404 сторінку, яка перенаправлятиме на найпопулярніший вміст вашого веб-сайту, якщо людина потрапила на невірну URL-адресу.

Використовуйте соціальні мережі

Соціальні мережі створені для того, щоб ділитись цікавою інформацією з великою кількістю людей. Якщо багато людей поширять ваш вміст у соціальних мережах, то, ймовірно, більше людей буде посилатись на нього, а посилання є величезним фактором для SEO-рейтингу.

Odoo має декілька інструментів для обміну вмістом через соціальні мережі:

Соціальні мережі

Odoo дозволяє відображати всі ваші облікові записи в соціальних мережах у підвалі (футері) вашого вебсайту. Все, що вам потрібно зробити - це вказати всі ваші облікові записи у налаштуваннях вашої компанії.

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

Ділитись у соціальній мережі

Пересуньте блок Ділитись на будь-яку сторінку. Користувачі зможуть натиснути на іконку та поділитись цією веб сторінкою на своїй сторінці у соціальній мережі.

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

Більшість соціальних мереж використовують зображення для кращої візуальної презентації своєї публікації. За замовчуванням Odoo використовує логотип вебсайту, але ви можете обрати будь-яке інше зображення вашої сторінки в інструменті «Просування».

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

Facebook сторінка

Пересуньте блок Сторінка Facebook, щоб відобразити віджет вашої ділової сторінки на Facebook та заохотити відвідувачів стежити за нею. Ви можете відобразити часову шкалу, наступні події та повідомлення.

Прокручування Twitter

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

Перевірте ваш веб-сайт

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

Обробка URL-адрес

У цьому розділі висвітлено як URL-адреси в Odoo сприяють хорошому рейтингу SEO​.

Структура URL-адреси

Типова URL-адреса Odoo виглядатиме так:

З наступними компонентами:

  • https:// = Protocol

  • www.mysite.com = ваше доменне ім’я

  • /fr_FR вказує на мову сторінки. Ця частина URL-адреси видаляється, якщо відвідувач переглядає основну мову вебсайту. Таким чином, основна версія цієї сторінки: https://www.mysite.com/shop/product/my-great-product-31

  • /shop/product - кожен модуль визначає власний простір імен (/shop - це назва каталогу модуля електронної комерції, /shop/product вказує, що це сторінка товару).

  • my-great-product за замовчуванням, це згладжений заголовок товару, який містить ця сторінка. Але ви можете налаштувати його для цілей SEO. Товар під назвою «Pain carré» буде перетворений у «pain-carre». Залежно від простору імен це можуть бути різні об’єкти (публікація блогу, заголовок сторінки, повідомлення форуму, коментар до форуму, категорія товару, тощо).

  • -31 = унікальний ID товару

Зауважте, що будь-який динамічний компонент URL-адреси можна звести до його ID. Як приклад, всі наступні URL-адреси роблять переадресацію 301 на вказану URL-адресу:

Деякі URL-адреси мають кілька динамічних частин, як-от ця (категорія блогу та публікація):

У наведеному вище прикладі:

  • Новини компанії - це назва блогу

  • Історія Odoo - це назва конкретного поста в блозі

Коли сторінка Odoo має пейджер, номер сторінки встановлюється безпосередньо в URL-адресі (не має аргументу GET). Це дозволяє кожній сторінці індексувати пошукові системи. Приклад:

Зміни в URL-адресах і заголовках

Коли змінюється URL-адреса сторінки (наприклад, більш дружня версія для друку вашого товару), вам не потрібно турбуватися про оновлення всіх посилань:

  • Odoo автоматично оновить всі свої посилання на нову URL-адресу.

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

Як приклад, ця URL-адреса:

Автоматично переспрямовуватиметься на:

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 functions when used by external websites, via a 301 redirect, maintaining the SEO link juice.

HTTPS

Пошуковики підвищують рейтинг вебсайтів захищених через HTTPS / SSL. Отже, за замовчуванням всі інсталяції Odoo Online повністю ґрунтуються на HTTPS. Якщо відвідувач звертається до вашого вебсайту за допомогою URL-адреси, що не містить HTTPS, то 301 переадресація перенаправить його до еквівалента URL-адреси з HTTPS.

Multi-Language Support

Multi-Language URLs

Якщо ви запускаєте веб-сайт на кількох мовах, однаковий вміст буде доступний в різних URL-адресах залежно від мови використання:

У цьому прикладі fr_FR є мовою сторінки. Ви навіть можете мати декілька варіантів однієї мови: pt_BR (португальська з Бразилії), pt_PT (португальська з Португалії).

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;

З таким підходом:

  • Search engines will redirect to the 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.

Щоб змусити відвідувача дотримуватися стандартної мови, ви можете використовувати код мови за замовчуванням у вашому посиланні, наприклад: yourwebsite.com/en_US/shop. Це завжди призведе до відвідування англійської версії сторінки, без використання мовних налаштувань браузера.

Page Speed

Вступ

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

На щастя, Оdоо робить для вас магію. Нижче ви знайдете хитрощі, які Odoo використовує, щоб пришвидшити час завантаження сторінки. Ви можете порівняти, як ваш сайт використовує ці два інструменти:

Зображення

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

З кнопки завантаження ви можете зберегти оригінальне зображення без зміни, якщо ви хочете оптимізувати якість зображення, а не продуктивність.

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

Примітка

Odoo стискає зображення, коли вони завантажуються на ваш веб-сайт, а не за запитом відвідувача. Таким чином, можливо, якщо ви використовуєте сторонню тему, вона забезпечить зображення, які не стиснуті ефективно. Але всі зображення, що використовуються в офіційних темах Odoo, стискаються за замовчуванням.

Коли ви натискаєте зображення, Odoo показує атрибути <img> і назву тега. Ви можете натиснути на неї, щоб встановити власну назву та атрибути Alt для зображення.

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

Коли ви натисните на це посиланню, з’явиться таке вікно:

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

Піктограми Odoo реалізовані за допомогою шрифту (Font Awesome у більшості тем Odoo). Таким чином, ви можете використовувати стільки піктограм, скільки хочете, на своїй сторінці, але вони не дадуть додаткових запитів на завантаження сторінки.

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

Static Resources: CSS

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

  • для завантаження сторінки потрібен лише один запит CSS-файлу

  • цей файл CSS використовується для спільного використання та кешування серед сторінок, тому, коли відвідувач натискає іншу сторінку, браузер не повинен навіть завантажувати жодного ресурсу CSS.

  • цей файл CSS оптимізовано як невеликий

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.

Для вирішення цієї проблеми всі файли CSS / Less / Sass об’єднуються в єдиний файл .CSS для відправлення в браузер. Таким чином, відвідувач має лише один CSS файл для завантаження на сторінку, що є особливо ефективним. Оскільки CSS розподіляється серед усіх сторінок, коли відвідувач натискає іншу сторінку, браузер навіть не повинен завантажувати новий CSS-файл!

Обидва файли у <head>

Що отримує відвідувач (тільки один файл)

/* From bootstrap.css */

.text-muted {

.text-muted {

color: #666;

color: #777;

background: yellow

background: yellow;

}

}

/* From my-theme.css */

.text-muted {

color: #666;

}

CSS, надісланий Odoo, включає в себе всі CSS / Less / Sass всіх сторінок/модулів. Таким чином, для додаткових переглядів сторінок одного відвідувача не потрібно буде завантажувати файли CSS взагалі. Але деякі модулі можуть включати в себе величезні ресурси CSS / Javascript, які ви не бажаєте попередньо отримувати на першій сторінці, оскільки вони занадто великі. У цьому випадку Odoo розподіляє цей ресурс на другий пакет, який завантажується лише тоді, коли запитується сторінка, яка використовує її. Прикладом цього є бекенд, який завантажується тільки тоді, коли відвідувач входить до системи та звертається до бекенду (/ web).

Примітка

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.

Мініфікований: після попередньої обробки та об’єднання, результативність CSS зменшується, щоб зменшити його розмір.

Перед мініфікацією

Після мініфікації

/* some comments */

.text-muted {color: #666}

.text-muted {

color: #666;

}

Кінцевий результат стискається, перш ніж надходити до браузера.

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 створює три пакети Javascript:

  • 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)

  • Один для бекенда конкретного коду Javascript (Odoo Web Client інтерфейс для ваших співробітників, які використовує Odoo)

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.

Примітка

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

Якщо ви активуєте функцію CDN в Odoo, статичні ресурси (Javascript, CSS, зображення) завантажуються з мережі доставки вмісту. Використання мережі доставки контенту має три переваги:

  • Завантаження ресурсів із сусіднього сервера (більшість CDN мають сервери в основних країнах світу)

  • Ефективний кеш ресурсів (без використання обчислювальних ресурсів на вашому власному сервері)

  • Розбиття завантаження ресурсів на різні служби, що дозволяє паралельно завантажувати більше ресурсів (оскільки ліміт Chrome на 6 паралельних запитів за доменом)

Ви можете налаштувати параметри CDN із додатка Адміністратор веб-сайту за допомогою меню Налаштування. Ось приклад налаштування, який ви можете використовувати:

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

Сторінки HTML

Крім того, сторінки HTML можуть бути стиснуті, але, як правило, це обробляється вашим веб-сервером (NGINX або 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.

Як приклад, якщо ви використовуєте засоби вибору кольору, щоб змінити колір абзацу на основний колір вашого веб-сайту, Odoo виведе наступний код:

<p class="text-primary">Мій текст</p>

Тоді як більшість редакторів HTML (наприклад, CKEditor) вироблятиме такий код:

<p style="color: #AB0201">Мій текст</p>

Адаптивний дизайн

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.

Це дозволяє Odoo встановити дуже тривалий час затримки кешування (XXX) на цих ресурсах: XXX секунди, при цьому він оновлюється миттєво, якщо ви оновлюєте ресурс.

Масштабованість

In addition to being fast, Odoo is also more scalable than traditional CMS and eCommerce (Drupal, Wordpress, Magento, Prestashop). The following link provides an analysis of the major open source CMS and eCommerce compared to Odoo when it comes to high query volumes: https://www.odoo.com/slides/slide/197

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

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

Search Engines Files

Мапа сайту

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.

За замовчуванням всі URL-адреси будуть розміщені в одному файлі /sitemap.xml, але якщо у вас багато сторінок, Odoo автоматично створить файл індексу Sitemap, дотримуючись групування у файлі sitemaps.org protocol у 45000 шт. на файл.

Кожна карта сайту містить 4 атрибути, які обчислюються автоматично:

  • <loc> : URL-адреса сторінки

  • <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).

Розмітка структурованих даних

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 підтримує безліч багатих фрагментів для типів вмісту, зокрема: огляди, люди, товари, компанії, події та організації.

Odoo реалізує мікро-дані, як це визначено в специфікації schema.org для подій, товарів електронної комерції, повідомлень форуму та контактних адрес. Це дозволяє відображати ваші сторінки товару в Google за допомогою додаткової інформації, такої як ціна та рейтинг товару:

../../../../_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.