HTML & CSS Meta-taggar
Meta-taggar skrivs in i sidans huvud och syns inte på själva sidan.
De lämnar i stället - beroende vad de är till för - information till webbläsaren, webbservern eller sökmotorer.
Det finns förstås fler än dem jag nämner här. Men här hittar du de mest användbara!
Inledning
Meta- kommer från grekiskan och betyder mellan, efter eller över. När det gäller information betyder meta: "underliggande definition eller beskrivning" - metadata är en definition eller beskrivning av data - data om data helt enkelt.
På en webbsida används meta-taggarna för att lämna information till webbläsaren, webbservern eller sökmotorn. De infogas mellan <head> och </head>
De vanligaste meta-taggarna
Ange Teckenuppsättning
Med meta-taggen nedan anges med vilken teckenuppsättning sidan ska tolkas. För en sida skriven med vår teckenuppsättning (Latin 1 - Western Europe) ska det se ut så här:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
|
Den här meta-taggen ska infogas så tidigt som möjligt i sidhuvudet!
Content-Style-Type
Vill man använda CSS som attribut direkt i HTML-koden måste man infoga nedanstående meta-tagg för att det ska bli korrekt. Ett HTML-dokument som innehåller CSS inline style är inte korrekt om man inte upplyser om detta!
<head>
<meta http-equiv="content-style-type" content="text/css">
</head>
|
Författare & Copyright - author, copyright
Meta-taggen: Author ska innehålla en upplysning om vem som har skrivit sidan.
Meta-taggen: Copyright ska innehålla en upplysning om vem som har copyrighten till innehållet på sidan.
Så här:
<head>
<meta name="author" content="Namn">
<meta name="copyright" content="Copyright © Namn" >
</head>
|
Beskrivning & Nyckelord - description, keywords
Meta-taggen: Description ska innehålla en kortfattad beskrivning av sidans innehåll.
Meta-taggen: Keywords ska innehålla de 5 - 7 viktigaste nyckelorden som förekommer på sidan. Varje ord (eller fras) ska separeras med ett komma:
Så här:
<head>
<meta name="description" content="Sidans beskrivning.">
<meta name="keywords" content="nyckelord, en fras, nyckelord">
</head>
|
OBS!
Hur det går till att infoga beskrivning och nyckelord för att optimera sidan för sökmotorer är en hel liten vetenskap. Läs om hur det går till mer utförligt under rubriken: HEMSIDEGUIDE / Marknadsför din sida.
För sökmotorer - noindex, nofollow
Meta-taggen: Robots anger om man vill att sidan och / eller dess undersidor ska döljas för sökmotorer.
Noindex på de sidor man inte vill ska indexeras hos söktjänsterna:
<head>
<meta name="robots" content="noindex">
</head>
|
Nofollow om man inte vill att undersidorna som länkarna går till ska indexeras:
<head>
<meta name="robots" content="nofollow">
</head>
|
Noindex, Nofollow om man vill att både sidan och undersidorna ska uteslutas:
<head>
<meta name="robots" content="noindex, nofollow">
</head>
|
OBS!
Hur det mer utförligt går till när man vill dölja sidor för sökmotorer kan du läsa mer om under rubriken: HEMSIDEGUIDE / Marknadsför din sida.
Skicka vidare - refresh
Med Meta-taggen: Refresh kan besökaren skickas vidare inom ett visst antal sekunder. Om man anger tiden till: 0 kommer inte sidbytet att uppfattas. Antalet sekunder anges i content tätt följt av url som anger den nya sidans adress. Missa inte semikolonet!
Så här:
<head>
<meta http-equiv="refresh" content="5; url=nysida.html">
</head>
|
Uppdatera sidan - refresh, pragma
Med Meta-taggarna: Refresh och Pragma kan man styra hur sidan uppdateras / laddas om.
Med Refresh kan man styra så att sidan laddas om med jämna mellanrum - efter ett visst antal sekunder. Bra att ta till om det är viktigt att informationen på sidan ständigt är aktuell.
<head>
<meta http-equiv="refresh" content="120">
</head>
|
Med Pragma anger man att webbläsaren ska hämta sidan på nytt varje gång den besöks och ignorera cache-minnet - d.v.s. sidor som sparats temporärt av webbläsaren för återvisning. Användbart om sidan uppdateras ofta och det är viktigt att informationen är aktuell varje gång den besöks.
<head>
<meta http-equiv="pragma" content="no-cache">
</head>
|
Dölj Image toolbar
I Internet Explorer - från version 6 - aktiveras verktygsfältet Image toolbar på en webbsida när muspekaren förs över lite större bilder.
Så här kan det se ut:
Vill du förhindra att verktygsfältet visas på din sida kan du stänga av funktionen med en meta-tagg i sidans huvud.
Så här:
<head>
<meta http-equiv="imagetoolbar" content="no">
</head>
|
Infoga meta-taggar
Meta-taggarna ska infogas i html-sidans huvud. Det spelar egentligen ingen roll i vilken ordning de infogas - men de ska in mellan <head> och </head>
Så här skulle det kunna se ut med alla de ovanstående:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="sv">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-style-type" content="text/css">
<title>SIDANS TITEL</title>
<meta name="author" content="Namn">
<meta name="description" content="Beskrivning.">
<meta name="keywords" content="nyckelord, en fras, nyckelord">
<meta http-equiv="imagetoolbar" content="no">
<link rel="stylesheet" href="stilmall.css" type="text/css">
</head>
<body>::</body>
</html>
|
