SEO Tips
========
Ensure that you fill these configs in the ``nuxt.config.js`` file with the correct values:
.. code-block:: javascript
export default defineNuxtConfig({
site: {
name: process.env.NUXT_PUBLIC_BASE_URL,
},
sitemap: {
hostname: process.env.NUXT_PUBLIC_BASE_URL,
},
})
Also, set SEO meta tags in the ``/pages/*.vue`` directory using the ``useMetaTags`` composable.
For example:
.. code-block:: javascript
useMetaTags({
pagePath: '/', // path of the page
titleKey: 'seo.title.home', // key from i18n
descriptionKey: 'seo.description.home', // key from i18n
imageUrl: 'https://pictures.helios.pyango.ch/?image=/media-files/pictures/pyango-software-agency-meta-home.png&width=1200&height=630&to=webp',
type: 'website',
twitterCardType: 'summary_large_image',
twitterSite: '@pyangogmbh'
});
1. Sitemap
----------
- ✅ Sitemap **must exist** and be submitted to Google Search Console.
- ✅ All URLs in the sitemap **must match canonical URLs** exactly.
- ✅ For SSL sites, **all URLs should be HTTPS**.
- ✅ Pay attention to **trailing slashes** (/), as they are related to your `i18n` configuration in the `nuxt.config` file.
- ✅ Ensure **sitemap is updated** automatically with new pages.
Sitemap Configuration in ``nuxt.config.js``
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
.. code-block:: javascript
export default defineNuxtConfig({
sitemap: {
hostname: process.env.NUXT_PUBLIC_BASE_URL || 'https://xxx.ch',
},
})
2. Canonical Links
------------------
- ✅ Every page should have a **canonical link**.
- ✅ Canonical URLs **must match the sitemap** in protocol (http vs https) and trailing slash.
- ✅ Prevent duplicate content by **pointing canonicals to preferred URLs**.
Example Scenario
~~~~~~~~~~~~~~~~
Your site has the same content at:
- `http://xxx.ch`
- `https://xxx.ch`
- `https://www.xxx.ch`
Without a canonical, Google might index multiple versions → leading to **duplicate content issues** and **splitting SEO value**.
- ✅ Avoid **multiple canonicals** pointing to different versions on the same page.
Example Scenario
~~~~~~~~~~~~~~~~
.. code-block:: html
Canonical Configuration in ``nuxt.config.js``
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
.. code-block:: javascript
export default defineNuxtConfig({
site: { url: process.env.NUXT_PUBLIC_BASE_URL || 'https://xxx.ch' },
})
3. Hreflang Links
-----------------
- ✅ **Hreflang tags are required**.
- ✅ Each language version should reference **all other language versions** properly.
- ✅ Use **consistent language codes** (e.g., `en`, `de-CH`, `fr`).
- ✅ Ensure **hreflang points to canonical URLs**, not redirects.
Example of hreflang in ````
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
.. code-block:: html
- *hreflang → always points to canonical URLs.*
4. HTML ``lang`` Attribute
--------------------------
- ✅ Set the correct ```` for all pages.
- Example: ```` for Swiss German.
- ✅ Required for **multilingual sites** to signal page language to search engines.
- For a single-language site: It’s not strictly required for SEO to work, but it’s still a good practice for accessibility and proper HTML standards.
5. Open Graph (OG) & Twitter Cards
----------------------------------
- ✅ OG tags and Twitter Cards **must be present on all pages**.
- ✅ Each page should include:
- ``og:title``
- ``og:description``
- ``og:image``
- ``twitter:card``
- ✅ Images for OG/Twitter cards should be **optimized** and correctly sized.
6. Image Optimization
---------------------
- ✅ Images should be **less than 1MB**.
- ✅ Use **compressed formats** (WebP, optimized JPEG/PNG).
- ✅ Include **descriptive alt attributes** for all images.
- ✅ Lazy-load images where possible to improve page speed.
7. Page Titles & Meta Descriptions
----------------------------------
- ✅ **Titles:** 50–70 characters, unique per page, include primary keywords.
- ✅ **Meta descriptions:** 150–160 characters, unique, compelling, include secondary keywords.
- ✅ Avoid **duplicate titles/descriptions** across the site.
8. URL Structure
----------------
- ✅ URLs should be **short, descriptive, and keyword-friendly**.
- ✅ Use **hyphens** (`-`) instead of underscores.
- ✅ Avoid unnecessary query parameters for main content pages.
9. Internal Linking
-------------------
- ✅ Every page should have **internal links** pointing to relevant pages.
- ✅ Anchor text should be **descriptive and keyword-rich**.
- ✅ Avoid orphan pages (pages with no internal links).
10. Security & HTTPS
-------------------
- ✅ Site must be **HTTPS**.
- ✅ No mixed content (HTTP assets on HTTPS pages).
- ✅ SSL certificate must be **valid and not expired**.
11. Robots.txt & Indexing
-------------------------
- ✅ **Robots.txt** exists and correctly allows/disallows pages.
- ✅ Pages to index should **not have ``noindex`` tags**.