Meta Tagovi — Title i Description optimizacija
Kompletni vodic za HTML meta tagove koji direktno uticu na rang i klikove u Google rezultatima
Sadrzaj
- Sta su meta tagovi
- Title tag — najvazniji SEO element
- Meta description — prodajni tekst u Google-u
- Meta robots — kontrola indeksiranja
- Viewport — mobile-friendly obaveza
- Canonical URL — sprecavanje duplikata
- Ostali bitni meta tagovi
- Tabela svih meta tagova
- Najcesce greske
- Alati za optimizaciju
- Reference i resursi
1. Sta su meta tagovi i zasto su bitni za SEO
Meta tagovi su HTML elementi u <head> sekciji stranice koji pruzaju informacije pretrazivacima i browser-ima o sadrzaju stranice. Korisnici ih ne vide direktno na stranici, ali Google ih koristi za rangiranje, indeksiranje i prikazivanje u rezultatima pretrage (SERP).
Od svih on-page SEO faktora, title tag je najvazniji po uticaju na rangiranje (Backlinko studija sa 11.8 miliona Google rezultata). Meta description ne utice direktno na rang, ali dramaticno utice na CTR (Click-Through Rate) — koliko ljudi klikne na vas rezultat umesto na konkurentski.
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vas Title Tag — Brend</title>
<meta name="description" content="Vas meta description do 160 karaktera...">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://vasajt.rs/stranica">
</head>2. Title tag — najvazniji SEO element
Title tag (<title>) se prikazuje kao plavi klikabilni naslov u Google rezultatima, u browser tab-u i kad delite link na drustvenim mrezama. To je prvi i najvazniji element koji Google koristi da razume o cemu se radi vasa stranica.
Optimalna duzina
Google prikazuje do 600 piksela sirine (oko 50-60 karaktera). Ako je title duzi, bice skracen sa "..." sto smanjuje CTR i profesionalnost. Proverite sirinu u pikselima, ne samo broj karaktera — slovo "W" zauzima vise prostora od "i".
Formula za savrseni title
<!-- Formula: Kljucna rec + Modifikator + Brend -->
<!-- DOBRO -->
<title>SSL Sertifikati — Kompletni vodic 2026 | Web Security Scanner</title>
<title>Meta Tagovi za SEO — Title i Description vodic | Vas Brend</title>
<title>Besplatni SEO audit — 12 provera za vas sajt | SecurityScanner</title>
<!-- LOSE -->
<title>Pocetna stranica</title> <!-- nema kljucnu rec -->
<title>Web Security Scanner | SecurityScanner</title> <!-- ponavljanje -->
<title>SSL, TLS, HTTPS, Sertifikat, Enkripcija, Bezbednost, Let's Encrypt, Vodic</title> <!-- keyword stuffing -->Primeri dobrih i losih titlova
| Title | Ocena | Zasto |
|---|---|---|
| Web dizajn Beograd — Profesionalne stranice od 299€ | Odlican | Lokalna kljucna rec + cena + geografija |
| 10 SEO gresaka koje unistavaju vas rang (i kako ih popraviti) | Odlican | Broj + emocija + resenje |
| GDPR Vodic 2026 — Kako izbeci kazne do €20M | Vas Brend | Odlican | Godina + strah + konkretan iznos |
| Pocetna | Uzasan | Nema kljucnu rec, nema vrednost |
| O nama | Kompanija d.o.o. | Los | Nijedna kljucna rec koju bi neko pretrazivao |
| SSL, HTTPS, TLS, sertifikat, enkripcija, bezbednost | Uzasan | Keyword stuffing — Google kaznjava |
Google prepisivanje titlova
Od avgusta 2021, Google aktivno menja title tagove u rezultatima pretrage. Prema Zyppy studiji, Google prepisuje title u 33% slucajeva. Najcesci razlozi:
- Title je predugacak — Google ga skracuje ili potpuno menja
- Title ne opisuje sadrzaj — Google bira H1 ili drugi tekst sa stranice
- Keyword stuffing — Google uklanja ponavljanje i bira cistiji naslov
- Title je identican na vise stranica — Google dodaje kontekst da razlikuje rezultate
- Title ne odgovara upitu — Google bira tekst relevantniji za konkretnu pretragu
3. Meta description — prodajni tekst u Google-u
Meta description je kratak opis stranice koji se prikazuje ispod title-a u Google rezultatima. Ne utice direktno na rangiranje, ali dramaticno utice na CTR — dobar description moze podici klikove za 5-10%.
Optimalna duzina
Google prikazuje do 920 piksela (oko 150-160 karaktera) na desktopu i manje na mobilnom. Drzite se 120-155 karaktera za sigurnost. Google bolduje reci iz korisnickog upita u description-u, sto privlaci paznju.
Kako napisati description koji donosi klikove
- Pocnite sa vrednoscu — sta korisnik dobija? "Naucite...", "Otkrijte...", "Besplatni vodic za..."
- Ukljucite kljucnu rec — bolduje se u rezultatima kad se poklopi sa upitom
- Dodajte CTA — "Proverite odmah", "Saznajte vise", "Besplatno"
- Koristite brojeve — "12 provera", "za 5 minuta", "od 2026."
- Budite specificni — "za WordPress sajtove" bolje od "za sajtove"
<!-- DOBRO: konkretan, sa CTA, broj i kljucna rec -->
<meta name="description" content="Besplatni SEO audit sa 12 automatskih provera. Proverite title, description, headings, slike i strukturirane podatke vaseg sajta za 30 sekundi.">
<!-- LOSE: genericno, bez vrednosti -->
<meta name="description" content="Dobrodosli na nas sajt. Mi se bavimo SEO optimizacijom i web dizajnom. Kontaktirajte nas za vise informacija.">Kada Google prepisuje description
Prema Ahrefs studiji iz 2023, Google prepisuje meta description u 63% slucajeva. Google bira tekst sa stranice koji bolje odgovara upitu. Ipak, pisanje dobrog description-a i dalje vredi jer:
- Google ga koristi kao osnovu za generisanje snippet-a
- Socijalne mreze (Facebook, LinkedIn) koriste ga za prikaz kad delite link
- Za stranice sa malo teksta, Google nema bolju alternativu
4. Meta robots — kontrola indeksiranja
Meta robots tag govori pretrazivacima sta smeju da rade sa stranicom. Ovo je kriticno za kontrolu koje stranice se pojavljuju u Google rezultatima.
<!-- Dozvoli indeksiranje i pracenje linkova (default) -->
<meta name="robots" content="index, follow">
<!-- Zabrani indeksiranje ali prati linkove -->
<meta name="robots" content="noindex, follow">
<!-- Zabrani sve -->
<meta name="robots" content="noindex, nofollow">
<!-- Napredne direktive -->
<meta name="robots" content="index, follow, max-snippet:-1, max-image-preview:large">Direktive
| Direktiva | Znacenje | Kada koristiti |
|---|---|---|
index | Dozvoli prikazivanje u rezultatima | Sve javne stranice |
noindex | Zabrani prikazivanje u rezultatima | Admin, thankyou, duplikati, staging |
follow | Prati linkove na stranici | Skoro uvek |
nofollow | Ne prati linkove | Retko — stranice sa nepouzdanim linkovima |
max-snippet:-1 | Dozvoli snippet bilo koje duzine | Sve stranice (vise prostora u SERP-u) |
max-image-preview:large | Dozvoli veliku sliku u rezultatima | Sve stranice sa slikama |
noarchive | Ne prikazuj kesiranu verziju | Dinamicki sadrzaj, cene |
noindex moze ukloniti sajt iz Google-a za nekoliko dana. Uvek proverite robots tag nakon deploy-a. Cest problem: staging sajt sa noindex koji se kopira na produkciju.5. Viewport — mobile-friendly obaveza
Viewport meta tag kontrolise kako se stranica prikazuje na mobilnim uredjajima. Bez njega, mobilni browser prikazuje desktop verziju smanjenu na mali ekran — tekst je necitljiv i korisnici odlaze.
<!-- OBAVEZNO za svaku stranicu -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- NIKAD ne koristite (blokira zoom za accessibility) -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">Od 2019. Google koristi mobile-first indeksiranje — mobilna verzija vase stranice je primarna za rangiranje. Bez viewport taga, Google smatra da sajt nije mobile-friendly i koriguje rang na mobilnim pretragama, koje cine 60%+ svih pretraga.
6. Canonical URL — sprecavanje duplikata
Canonical tag govori Google-u koja je "originalna" verzija stranice kad isti sadrzaj postoji na vise URL-ova. Ovo je cest problem koji moze ozbiljno narusiti SEO.
<!-- Na stranici https://vasajt.rs/proizvod?color=red -->
<link rel="canonical" href="https://vasajt.rs/proizvod">
<!-- Cesti duplikati koje canonical resava: -->
<!-- https://vasajt.rs/stranica -->
<!-- https://vasajt.rs/stranica/ -->
<!-- https://vasajt.rs/stranica?utm_source=facebook -->
<!-- https://www.vasajt.rs/stranica -->
<!-- http://vasajt.rs/stranica -->Kada koristiti canonical
- URL parametri — filteri, sortiranje, tracking parametri (UTM)
- www vs non-www — obe verzije prikazuju isti sadrzaj
- HTTP vs HTTPS — obe verzije dostupne
- Trailing slash — /stranica vs /stranica/
- Sindicirani sadrzaj — isti clanak na vise sajtova
- Paginirane stranice — /blog?page=2 → canonical na /blog
7. Ostali bitni meta tagovi
Meta charset
<meta charset="UTF-8">Definise enkodovanje karaktera. UTF-8 podrzava sve jezike i specijalne karaktere (ćčžšđ). Uvek ga stavite kao prvi element u <head> — browser mora znati enkodovanje pre parsiranja ostatka.
Meta keywords (ZASTARLO)
<!-- NE KORISTITI — Google IGNORISE od 2009. -->
<meta name="keywords" content="SEO, meta tagovi, optimizacija">Google je 2009. javno potvrdio da potpuno ignorise meta keywords tag. Matt Cutts (bivsi sef Google Webspam tima) objavio je video u kom eksplicitno kaze: "Google does not use the keywords meta tag in web ranking." Ne trositi vreme na njega.
Hreflang — za visejezicke sajtove
<!-- Srpska verzija -->
<link rel="alternate" hreflang="sr" href="https://vasajt.rs/stranica">
<!-- Engleska verzija -->
<link rel="alternate" hreflang="en" href="https://vasajt.rs/en/stranica">
<!-- Default verzija -->
<link rel="alternate" hreflang="x-default" href="https://vasajt.rs/stranica">Hreflang govori Google-u koja jezicka verzija stranice da prikaze korisnicima u razlicitim zemljama. Bez njega, Google moze prikazati srpsku verziju engleskim korisnicima ili obrnuto.
Open Graph i Twitter Cards
<meta property="og:title" content="Naslov za Facebook/LinkedIn">
<meta property="og:description" content="Opis za deljenje na drustvenim mrezama">
<meta property="og:image" content="https://vasajt.rs/slika-1200x630.jpg">
<meta property="og:url" content="https://vasajt.rs/stranica">
<meta name="twitter:card" content="summary_large_image">Kontrolisu kako vas link izgleda kad ga neko podeli na Facebook-u, LinkedIn-u ili Twitter-u. Bez OG tagova, platforme biraju nasumican tekst i sliku sa stranice. Detaljnije u nasem Open Graph vodicu.
8. Kompletna tabela meta tagova
| Tag | Primer | SEO uticaj | Obavezan? |
|---|---|---|---|
<title> | Title tekst — Brend | Vrlo visok | DA |
meta description | Opis do 160 karaktera | Visok (CTR) | DA |
meta robots | index, follow | Kritican | Opciono (default=index,follow) |
meta viewport | width=device-width, initial-scale=1.0 | Visok (mobile) | DA |
meta charset | UTF-8 | Nizak | DA |
link canonical | https://vasajt.rs/stranica | Visok | DA |
link hreflang | sr, en | Visok (multi-lang) | Ako imate vise jezika |
og:title | Naslov za drustvene | Srednji (CTR) | Preporuceno |
og:description | Opis za drustvene | Srednji (CTR) | Preporuceno |
og:image | 1200x630 slika | Srednji (CTR) | Preporuceno |
twitter:card | summary_large_image | Nizak | Preporuceno |
meta keywords | — | Nula | NE (ignorisano) |
9. Najcesce greske sa meta tagovima
- Isti title na svim stranicama — svaka stranica mora imati jedinstven title. Duplirani titlovi zbunjuju Google i smanjuju rang svim stranicama.
- Nedostaje title ili description — Google tada bira nasumican tekst sa stranice, sto je gotovo uvek lose.
- Keyword stuffing u title-u — "SEO, SEO vodic, SEO optimizacija, SEO saveti" — Google ovo kaznjava.
- Predugacak title — skracuje se sa "..." i gubi kljucnu informaciju. Ciljajte 50-60 karaktera.
- Description bez CTA — description je reklama, ne enciklopedijski unos. Dodajte poziv na akciju.
- noindex na produkciji — kopiranje staging konfiguracije na produkciju. Proverite robots tag POSLE svakog deploy-a.
- Nedostaje viewport tag — sajt nije mobile-friendly, Google snizava rang.
- Nedostaje canonical — isti sadrzaj na vise URL-ova deli "link juice" umesto da ga konsoliduje.
- user-scalable=no u viewport-u — blokira zoom, accessibility problem, Google moze penalizovati.
- Trosenje vremena na meta keywords — nema efekta od 2009. godine.
10. Alati za optimizaciju meta tagova
- Web Security Scanner — proverava prisustvo i ispravnost title, description, viewport, canonical, OG tagova, heading strukture i structured data.
- Google Search Console — prikazuje kako Google vidi vase stranice, upozorava na probleme sa indeksiranjem i duplikatima.
- SERP Simulator — pregled kako ce vas title i description izgledati u Google rezultatima pre nego sto objavite.
- Yoast SEO — WordPress plugin koji vodi kroz optimizaciju title-a i description-a za svaku stranicu.
- Rank Math — alternativa Yoast-u sa naprednim funkcijama za Schema.org i redirection.
- Ahrefs Webmaster Tools — besplatan alat koji skenira sajt i pronalazi probleme sa meta tagovima.
- Screaming Frog — desktop crawler koji izvlaci sve meta tagove sa sajta i prikazuje duplikate, nedostajuce i predugacke.
11. Reference i resursi
- Google Search Central — Title links
- Google Search Central — Snippets
- Google — Robots meta tag
- Google — Hreflang
- Moz — Title Tag Best Practices
- Ahrefs — Meta Description Study
- Backlinko — Google CTR Statistics
- Zyppy — Google Title Rewrite Study
- MDN — Meta element
Meta Tags — Title and Description Optimization
Complete guide to HTML meta tags that directly impact your Google rankings and click-through rates
Table of Contents
- What are meta tags
- Title tag — the most important SEO element
- Meta description — your Google ad copy
- Meta robots — indexing control
- Viewport — mobile-friendly requirement
- Canonical URL — preventing duplicates
- Other important meta tags
- Complete meta tags table
- Common mistakes
- Optimization tools
- References
1. What are meta tags and why they matter for SEO
Meta tags are HTML elements in the <head> section that provide information to search engines and browsers about page content. Users don't see them directly, but Google uses them for ranking, indexing, and displaying results in SERP.
Of all on-page SEO factors, the title tag has the highest impact on rankings (Backlinko study of 11.8 million Google results). Meta description doesn't directly affect ranking but dramatically impacts CTR (Click-Through Rate).
2. Title tag — the most important SEO element
The title tag (<title>) appears as the blue clickable headline in Google results, in the browser tab, and when sharing links on social media.
Optimal length
Google displays up to 600 pixels wide (about 50-60 characters). Longer titles get truncated with "..." which reduces CTR and professionalism.
Formula for the perfect title
<!-- Formula: Keyword + Modifier + Brand -->
<title>SSL Certificates — Complete Guide 2026 | Web Security Scanner</title>
<title>Meta Tags for SEO — Title & Description Guide | Your Brand</title>Good vs bad titles
| Title | Rating | Why |
|---|---|---|
| 10 SEO Mistakes Killing Your Rankings (and How to Fix Them) | Great | Number + emotion + solution |
| GDPR Guide 2026 — How to Avoid Fines Up to €20M | Great | Year + fear + specific amount |
| Home | Terrible | No keyword, no value |
| SSL, HTTPS, TLS, certificate, encryption, security | Terrible | Keyword stuffing |
Google title rewriting
Since August 2021, Google actively changes title tags. According to the Zyppy study, Google rewrites titles 33% of the time. Main reasons: too long, doesn't match content, keyword stuffing, identical across pages.
3. Meta description — your Google ad copy
Meta description appears below the title in Google results. Doesn't directly affect ranking, but dramatically impacts CTR — a good description can increase clicks by 5-10%.
Optimal length
Google shows up to 920 pixels (~150-160 characters) on desktop. Keep it 120-155 characters. Google bolds words matching the user's query.
Writing descriptions that get clicks
- Lead with value — what does the user get?
- Include keyword — gets bolded in results
- Add CTA — "Check now", "Learn more", "Free"
- Use numbers — "12 checks", "in 5 minutes"
- Be specific — "for WordPress sites" beats "for websites"
According to Ahrefs (2023), Google rewrites descriptions 63% of the time. But writing good descriptions still matters: Google uses it as a base, and social platforms use it for link previews.
4. Meta robots — indexing control
The robots meta tag tells search engines what they can do with a page.
| Directive | Meaning | When to use |
|---|---|---|
index | Allow in search results | All public pages |
noindex | Block from search results | Admin, thank-you, staging |
follow | Follow links on page | Almost always |
nofollow | Don't follow links | Rarely — untrusted links |
max-snippet:-1 | Allow any snippet length | All pages |
noarchive | Don't show cached version | Dynamic content, prices |
noindex mistake can remove your site from Google within days. Always check the robots tag after deployment.5. Viewport — mobile-friendly requirement
The viewport meta tag controls how a page displays on mobile devices. Without it, mobile browsers show a zoomed-out desktop version. Since 2019, Google uses mobile-first indexing — mobile version is primary for ranking.
<!-- REQUIRED for every page -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- NEVER use (blocks zoom, accessibility violation) -->
<meta name="viewport" content="..., user-scalable=no">6. Canonical URL — preventing duplicates
The canonical tag tells Google which version of a page is the "original" when the same content exists at multiple URLs. Prevents duplicate content penalties and consolidates link equity.
<link rel="canonical" href="https://yoursite.com/page">Use for: URL parameters, www vs non-www, HTTP vs HTTPS, trailing slashes, paginated content, syndicated content.
7. Other important meta tags
Meta charset
<meta charset="UTF-8"> — always first in <head>. Supports all languages and special characters.
Meta keywords (OBSOLETE)
Google confirmed in 2009 they completely ignore this tag. Don't waste time on it.
Hreflang
Tells Google which language version to show users in different countries. Essential for multilingual sites.
Open Graph & Twitter Cards
Control how your link appears when shared on social media. Details in our Open Graph guide.
8. Complete meta tags table
| Tag | SEO impact | Required? |
|---|---|---|
<title> | Very high | YES |
meta description | High (CTR) | YES |
meta robots | Critical | Optional (default=index,follow) |
meta viewport | High (mobile) | YES |
meta charset | Low | YES |
link canonical | High | YES |
link hreflang | High (multi-lang) | If multilingual |
og:title/description/image | Medium (CTR) | Recommended |
meta keywords | Zero | NO (ignored) |
9. Common meta tag mistakes
- Same title on all pages — every page needs a unique title
- Missing title or description — Google picks random text
- Keyword stuffing — Google penalizes this
- Title too long — gets truncated with "..."
- Description without CTA — it's an ad, not an encyclopedia entry
- noindex on production — staging config copied to prod
- Missing viewport — not mobile-friendly, lower rankings
- Missing canonical — duplicate content splits link equity
- user-scalable=no — blocks zoom, accessibility issue
10. Optimization tools
- Web Security Scanner — checks title, description, viewport, canonical, OG tags, headings, structured data
- Google Search Console — shows how Google sees your pages
- SERP Simulator — preview your title/description in Google results
- Yoast SEO / Rank Math — WordPress plugins for meta optimization
- Ahrefs Webmaster Tools — free site audit for meta issues
- Screaming Frog — desktop crawler that extracts all meta tags
11. References and resources
- Google Search Central — Title links
- Google Search Central — Snippets
- Google — Robots meta tag
- Moz — Title Tag Best Practices
- Ahrefs — Meta Description Study
- Backlinko — Google CTR Statistics
- MDN — Meta element