Meta tags for SEO

Q: Does `meta keywords` still affect Google rankings?

No. Google has publicly ignored the `meta keywords` tag since 2009. Including it is harmless but pointless; it adds bytes to your HTML without any SEO benefit.

Tuesday 26/07/2022

·6 min read

SEO

Most SEO meta-tag guides list 30+ tags and tell you to include them all. The reality is that eight tags do 95% of the work, and another half-dozen handle social previews. Everything else is either obsolete (looking at you, meta keywords) or only useful in niche cases. Below: the tags Google actually reads, what they control, and the ones you can safely skip.

The eight that matter

1. `<title>`

Technically not a meta tag, but the most important head element for SEO:

<title>How to Build a RAG Chatbot in TypeScript — Vadim Alakhverdov</title>

Google uses this as the clickable heading in search results. Keep it under 60 characters (longer titles get truncated in the SERP). Lead with the keyword phrase users would actually search for, optionally followed by the site name.

2. `<meta name="description">`

<meta name="description" content="Build a RAG chatbot in TypeScript that answers questions about your own documents — no LangChain, no bloated frameworks. Working code in 100 lines.">

Shows up under the title in search results. Doesn't directly affect ranking, but heavily affects click-through rate. Keep it under 160 characters, write it like an ad — distinctive, specific, and showing what the page actually delivers.

3. `<link rel="canonical">`

<link rel="canonical" href="https://vadimall.com/posts/build-a-rag-chatbot-in-100-lines-of-typescript">

Tells Google which URL is the "real" one when the same content is accessible at multiple URLs (www vs non-www, http vs https, with and without query params, multiple languages). Without it, Google guesses — sometimes wrong.

4. `<meta name="viewport">`

<meta name="viewport" content="width=device-width, initial-scale=1">

Required for mobile-friendly rendering, which is required for Google's mobile-first index, which is required to rank at all. The exact content value above is the universal default. Skipping this tag is the single biggest "mobile SEO" mistake.

5. `<meta name="robots">`

<meta name="robots" content="index, follow">

The default is index, follow (index this page, follow its links), so most pages don't need the tag at all. You add it explicitly to exclude pages: noindex to keep a page out of search results, nofollow to tell Google not to pass link equity through its outbound links. Common on admin pages, search result pages, and any page you don't want surfaced.

6. `<meta charset>`

<meta charset="UTF-8">

Specifies the character encoding. Must be in the first 1024 bytes of the document. UTF-8 is the universal answer in 2026 — anything else is legacy.

7. `<html lang>`

<html lang="en">

Not a meta tag, but the lang attribute on <html> is what tells search engines and screen readers what language the content is in. For multi-language sites, combine with <link rel="alternate" hreflang="...">.

8. `<meta name="theme-color">`

<meta name="theme-color" content="#000000">

Doesn't affect SEO directly, but sets the browser chrome color on mobile (Android Chrome, iOS Safari 15+) — improving perceived polish and PWA experience.

When someone shares your URL on Slack, LinkedIn, X, or Facebook, the unfurled preview is built from these tags:

<!-- OpenGraph: used by everything except Twitter -->
<meta property="og:title" content="Build a RAG Chatbot in 100 Lines of TypeScript">
<meta property="og:description" content="No LangChain, no frameworks — just the Anthropic SDK and a vector database.">
<meta property="og:image" content="https://vadimall.com/og/rag-chatbot.png">
<meta property="og:url" content="https://vadimall.com/posts/build-a-rag-chatbot-in-100-lines-of-typescript">
<meta property="og:type" content="article">

<!-- Twitter Cards: required for X previews -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Build a RAG Chatbot in 100 Lines of TypeScript">
<meta name="twitter:description" content="No LangChain, no frameworks — just the Anthropic SDK and a vector database.">
<meta name="twitter:image" content="https://vadimall.com/og/rag-chatbot.png">

The image should be 1200×630 pixels — that's the size every platform crops to. The title should be under 70 characters; descriptions under 200.

These don't affect Google ranking, but social traffic and brand impressions both depend on them. Skipping them is leaving free traffic on the table.

Tags that are obsolete or low-value

<meta name="keywords"> — Google has officially ignored this since 2009. Skip it.
<meta name="author"> — purely informational; doesn't affect ranking. Add it if you want; it's harmless.
<meta name="generator"> — tells the world you use Next.js or WordPress. No SEO effect, mild privacy leakage. Optional.
<meta http-equiv="X-UA-Compatible"> — was needed for IE compatibility. IE is dead. Skip.
<meta name="HandheldFriendly"> — pre-dates viewport. Modern browsers don't read it. Skip.

Structured data (JSON-LD) — beyond meta tags

The tags above cover the basics. For rich results (FAQ accordions, breadcrumbs, article cards, recipe ratings), you also want JSON-LD structured data in a <script type="application/ld+json"> block. That's a longer topic — the short version is that Google's Rich Results Test tells you exactly what's recognized on any given page.

A minimal head for a content page

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Your Page Title — Site Name</title>
    <meta name="description" content="A specific, distinctive 140–160 character description.">
    <link rel="canonical" href="https://example.com/your-page">
    <meta property="og:title" content="Your Page Title">
    <meta property="og:description" content="...">
    <meta property="og:image" content="https://example.com/og.png">
    <meta property="og:url" content="https://example.com/your-page">
    <meta property="og:type" content="article">
    <meta name="twitter:card" content="summary_large_image">
</head>

Eight lines plus the OpenGraph block. That's the full SEO + social baseline for a content page.

FAQ

Does `meta keywords` still affect Google rankings?

No. Google has publicly ignored the meta keywords tag since 2009. Including it is harmless but pointless; it adds bytes to your HTML without any SEO benefit.

What's the maximum length for the meta description?

Google truncates descriptions to roughly 155–160 characters in desktop search results, sometimes shorter on mobile. Beyond that, Google often rewrites the snippet from the page content anyway. Treat 155 as a soft limit.

Do I need both OpenGraph and Twitter Card tags?

Yes — most platforms (LinkedIn, Slack, Discord, Facebook, iMessage) read OpenGraph; Twitter/X primarily uses Twitter Card tags. There's overlap, but if you want a clean preview on every platform, include both. Twitter Cards will fall back to OG tags for missing fields.

Should I use `noindex` on category or tag pages?

Only if those pages are thin (just lists of post titles with no original content) or if you have many similar variants creating duplicate-content signals. For a blog with rich category pages that include excerpts and metadata, leave them indexable.