utorok 3. februára 2015

HTML V SEKCII HEAD

Začíname voľbou doctype dokumentu. Preto doctype pretože tu je začiatok nezmyselných zápisov ktoré zvyčajne nemajú odvôvodnenie. Treba si najprv uvedomiť pre koho staviame web a pre aké účely. Doctype sú už desiatky a každý má svoje uplatnenie. Pre konkrétne zápisy použijem "najbežnejší" ako vzor DTD XHTML 1.0 Strict ktorý je najprijateľneší pre desktop a aj pre mobilné aplikácie.

Na spoľahlivú rýchlosť nepotrebujete content delivery network, čiže cdn sieť.


!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">" html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sk" lang="sk">" Takto zapísaný doktype je kompletný, v celosti a platný. ak však urobíte nasledujúci zápis:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">" head> je nepodstatný a neni smerodatný. Prečítanie jazykovej sady a jazyka xml je nutné zapísať v hlavičke dokumentu. Správne tvarovanie zdroja závisí na štruktúte zápisov, Nasledujúci zápis:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">" html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sk" lang="sk">" head>" meta http-equiv="Content-Type" content="text/html; charset=utf-8" />" Samozrejme že utf-8 je možné nahradiť zápisom ISO pre jazykovú deklaráciu. Preto akékoľvek zmeny v zápise http-equiv= sa stávajú neakceptovateľné.

V riadku nedávam znak "<". Takto by mal vyzerať platný head v hlavičke dokumentu:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sk" lang="sk">
head>
meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
meta name="robots" content="index, follow" />
link rel="alternate" href="http://www.vasweb.sk/" hreflang="sk-SK" />
link rel="alternate" href="http://www.vasweb.sk/" hreflang="sk" />
title>"Nazov pre dannú šablonu webu"
link rel="stylesheet" type="text/css" href="http://www.vasweb.sk/all.css" media="screen" />
link rel="stylesheet" type="text/css" href="http://www.vasweb.sk/print.css" media="print" />
link rel="alternate" type="application/rss+xml" href="http://www.vasweb.sk/feed_rss.xml" title="RSS feed for My Page" />
meta name="revisit-after" content="daily" />" meta name="description" content="Sem patrí výstižný obsah. Približne 130 až 155 znakov aj s medzerníkom." />
meta name="keywords" content="kľúčové slová s obsahom 2% až 4% ich významu na stránke" />
meta name="author" content="Sem sa píše autor webu - teda obsahu webu a "nie jeho tvorca" />
link rel="icon" href="http://www.vasweb.sk/img/favicon.ico" type="image/x-icon" />
meta name="viewport" content="width=device-width, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
meta name="google-site-verification" content="XXXXXXXXXXXXXXXXXXXXXXXXXX" />
meta name="msvalidate.01" content="XXXXXXXXXXXXXXXXXXXXXXXX" />
meta name="yandex-verification" content="XXXXXXXXXXXXXXXXXX" />
meta name="DC.Title" content="Nazov pre dannú šablonu webu" />
meta name="DC.Creator" content="Sem sa píše autor webu - teda obsahu webu a "nie jeho tvorca" />
meta name="DC.Description" content="Sem patrí výstižný obsah. Približne 130 až 155 znakov aj s medzerníkom." />
meta name="DC.Language" content="sk" />
link rel="author" href="https://plus.google.com/+nazov/" />
link rel="publisher" href="https://plus.google.com/+nazov/" />
/head>" body>"

Takže prečo takto? Nuž všetko má svoju postupnosť a všetko so všetkým súvisí ale len za predpokladu správneho postupu. Začneme vysvetľovať podľa riadka:

meta http-equiv="Content-Type" content="text/html; charset=utf-8" musí byť nezmenený a to sme si už vyšie vysvetlili
meta name="robots" content="index, follow" je povel akým vyjadrujeme čo chceme aby roboti vykonali na webe
link rel="alternate" href="http://www.vasweb.sk/" hreflang="sk-SK" označenie pre lokalizáciu krajiny
link rel="alternate" href="http://www.vasweb.sk/" hreflang="sk" označenie pre lokalizáciu jazyka, to nie je to isté ako o riadok vyššie
link rel="alternate" type="application/rss+xml" href="http://www.vasweb.sk/feed_rss.xml" title="RSS feed for My Page" mal by to mať každý solídny web - ide o rss alebo atom aplikáciu
meta name="revisit-after" content="daily" ako často sa má vrátiť robot na váš web. To je individuálne a hodnoty sú: hourly, weekly, monthly atd
meta name="description" content="Sem patrí výstižný obsah. Približne 130 až 155 znakov aj s medzerníkom." ja odporúčam 130 znakov maximálne.
meta name="keywords" content="kľúčové slová s obsahom 2% až 4% ich významu na stránke" význam keywords vytestujete napr: seowebpageanalyzer.com
meta name="author" content="Sem sa píše autor webu - teda obsahu webu a "nie jeho tvorca" optimálne do 70 znakov aj s medzerníkom
link rel="icon" href="http://www.vasweb.sk/img/favicon.ico" type="image/x-icon" rozmer je max 19x19px približne do 500 bajtov optimálne.
meta name="viewport" content="width=device-width, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" spôsob ako sa vaše stránky budú chovať v prehliadačoch menších prenosných zariadení.
meta name="google-site-verification" content="XXXXXXXXXXXXXXXXXX"
meta name="msvalidate.01" content="XXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
meta name="yandex-verification" content="XXXXXXXXXXXXXXXXXXXXXXX" samozrejme len v prípade že máte vytvorený webmasters tool
meta name="DC. je tiež jedným z ukazovateľov: DC je nástroj všeobecne uznávaný na celom svete a všetkými crawlermi podporovaný
link rel="author" href="https://plus.google.com/+nazov/"
link rel="publisher" href="https://plus.google.com/+nazov/" sem sa píše rovnaký link aj pre autor aj pre publisher ak samozrejme máte vytvorený google+ účet.

A teraz finty a triky v časti head o ktorých sa nepíše a len omedzený počet ľudí vie a rozumie pricípom webrobotov a bootov ich nastaveniam crawlermi.

link rel="alternate" href="http://www.vasweb.sk/" hreflang="sk" prečo vložiť obidve link rel alternate pre jazyk a krajinu? Ide o to že váš web môže vyhľadať aj slovák žijúci v česku alebo aj slovák žijúci v inej krajine. To príkazovo dáva podnet k zachyteniu webu do databáz diskov ktoré zdieľaju odkazy súvisiace na konkrétne oblasti. To čo vyhľadáte na google.sk nemusí byť na diskoch google.com.au.

"application/rss+xml" je len aplikácia ale tiež vhodná: Ak sa rozhodnem zachytávať rss v spojených štátoch kde napúríklad žijem tak tým upozorňujem keše prehliadačov na takýto konkrétny typ www adresy ktoré keše acceptujú a archivujú. To samozrejme vylepšuje pozície a hodnoty webu.

meta name="google-site-verification" a ostatné verifikované nástroje zatvárajte " /> aj keď si to vyžaduje autor verifikácie. Zatvárajte vždy podľa toho aký html používate. Pre html5 je "> čiže bez medzerníka za úvodzovky. Vyhnite sa použitiu zápisu typu 'príkaz' v head časti, jednoduchá úvodzovka je nezmyselná a neprijateľná.

Píšte head tak aby ste nevytvárali "spacing", to znamená aby ste kurzor umiestnili za koncovú značku > a použili enter a nie tak že dáte kurzor kamkoľvek za znak ">" a to o niekoľko prázdnych medzerníkov.

V prípade že máte vytvorený png tak pri posielaní na server total commandrom prepíšte favicon.png na favicon.ico a server si to sám zadetekuje že toto nie je bežný formát obrázku. Zásadne uložte favicon do priečinka images alebo img či po slovensky obrazky a takto ho zapíšte do linku. Mnohí si zvykli uložiť favicon do root. Toto je ale veľmi nesprávne lebo aj keď je to ".ICO" je to obrázok a patrí do priečinku obrázkov.

Meta description som odporúčal do 130 znakov preto lebo to čo chýba do normatíva veľkosti to vo vyhladávaní doplnia roboti z textu ale pri zápise nad normou alebo tesne pred normou už nedoplnia alebo len zriedkavo vo výnimočných prípadoch celý prepíšu za text z webu. Vyhnite sa v meta znakom &, @, €, tieto špeciálne znaky sú nevalídne pre slovenčinu a po druhé sú v meta neprijateľné.

Meta keywords aj keď sú momentálne nie relevantné a dôležité pre robotov je dobré ich stále používať. Optimálne tých 120 znakov. Keywords píšte kľudne takto: meta name="keywords" content="html,zdrojový kód,charset,iso,utf-8,slovenský kóder" /> vynechaním medzerníka za čiarkou nič neporušíte a len získate priestor pre možno jedno keywords viacej na úkor medzerníkov. Vyhnite sa v meta keywords znakom &, @, €, tieto špeciálne znaky sú nevalídne pre slovenčinu a po druhé sú v meta neprijateľné.

Title v časti head je najlepšie čím je kratšie. Obykle sa píše do 70 znakov podľa normy, len že, webový roboti doplnia za váš krátky title, obsah H1 nadpisu ak je samozrejme nie pridlhý. Preto tu treba byť skutočne vynaliezavý a v šablone treba dať príkaz že prvé sa zobrazí nadpis stránky - čiže title a až potom má byť obsah H1. Toto sa dá naprogramovať príkazom! Title musí byť prvé lebo pri analýze sa hodnotia relevantnosti nadpisu v protihodnote keywords. Nuž a predsa chceme byť prví vo vyhľadávačoch na danné keywords.

Takto sa to dá naprogramovať v šablóne aby vaše nadpisy h2 boli textovo vo vyhľadávačoch pred nadpisom H1:

#title>#%ClanekNadpisTitle%> - Moj H1 NAdpis text sem#/title>
#title>#%ClanekNadpisTitle%> - <%H1nadpisdefinicia%>#/title>

Na záver head časti: Dávajte si mimoriadny pozor na duplicitu príkazov, čiže ak už raz použijete povedzme:
link rel="stylesheet" type="text/css" href="http://www.vasweb.sk/all.css" media="screen" />"
link rel="stylesheet" type="text/css" href="http://www.vasweb.sk/all.css" media="all" />"
ide o dva rovnaké povely a to je nemožné identifikovať čo má ktorý príkaz vykonať.

Ak potrebujete rozobrať problém alebo čokoľvek okolo webu tak píšte komentáre s url adresou webu.

Žiadne komentáre:

Zverejnenie komentára