CLEARFiX - xhtml, css, javascript, seo

Vůbec nevím jak je tento princip účinný nebo jak moc googlu doopravdy pomáhám, ale jsem naučený, že první co musí být v kodu je text samotné stránky, a poté např. hlavička, levý sloupce / pravý sloupec, patička (někdy tento způsob nepoužiji 100% kvůli hlavičce a problematickému sepisování).

Typický příklad rozložení stránky:

HTML kód by v normálním případě vypadal:

	hlavička



	levé menu


	text stránky - obsah



	patička

CSS kód:

#header{
width:960px;
height:150px;
}
#content{
width:960px;
padding:20px 0px;
}
#content #menu{
width:220px;
float:left;
}
#content #text{
width:720px;
float:right;
}
#footer{
width:960px;
height:100px;
}

Takto to napíše většina kodéru, kteří postupují blok po bloku, ale jak jsem řekl víše, mi chceme docílit toho, aby text byl na prvním místě, proto by náš kod měl vypadat:

	text stránky - obsah


	levé menu



	hlavička


	patička

Abychom docíly něčeho podobného, tak css kod budeme muste trochu poladit:

#header{
width:960px;
height:150px;
/* timto dostaneme hlavicku opet nahoru, ale cela stranka pote musi byt
obalena jeste jednim divem, ktery bude mit sirku 960px, a
nastaven position:relative */
position:absolute;
top:0px;
left:0px;
}
#content{
width:960px;
padding:170px 0px 20px 0px; /* zvysil se padding + 150px */
}
#content #menu{
width:220px;
float:left;
}
#content #text{
width:720px;
float:right;
}
#footer{
width:960px;
height:100px;
}

Nevím zda ještě musím nějak kod dál okecávat změny jsem okomentoval v CSS, takže to bude asi všem hned jasné co se udělalo, jediné co se musí ještě do HTML přidat je jeden DIV, který bude celou stránku obalovat, ale ten tam bude každý mít už předtím, takže jediné co se musí nastavit je position:relative, ke kterému se poté bude pozicovat absolutně #header.
I kdyby to stále nebylo někomu dost jasné, tak tuto techniku jsem nedávno použil na stránce www.pohony-menice.cz.
Komentáře jsou Vám otevřené, takže se nebojte napsat svoje zkušenosti, techniky, účinnost tohoto zápisu

Po dokončení a předání webu si většina zákazníků v dnešní době položí otázku, kterou si nenechájí jen pro sebe a zeptejí se i nás (Vás)!? A co SEO? Mám na stránce SEO? Funguje mi SEO? Nastavili jste SEO? Nebo otázky podobného ražení. Pokud se chceme zákazníka zbavit a nechceme mu vysvětlit co to SEO je a že nejde jen tak zapnout, tak mu pošleme zapnutí sea (kde si ho může sám zapnout a jednou týdně si zkontrolovat, zda ho má zapnuté ) a nebo si prostě otevřeme pár stránek ke kontrole základních parametrů stránky, díky kterým si ověříme, zda jsme na něco nezapomněli.

SEO nástroje

První nástroj najdete na adrese seo.webber.cz, kontroluje zdrojový kod, použití nadpisů, vyplněné základní meta tagy a pár dodatečných informací o stránce. Nemá cenu dál tuto stránku popisovat, každý si může zkusit co vše Vám řekne.

Další nástroj najdete na adrese seo-servis.cz, zde se dozvíte jednak všechny věci, které uměla předchozí stránka, ale navíc dokáže zjistit klíčová slova na stránce, pozice na daná klíčová slova ve vyhledávačích, sílů webu a zpětné odkazy.

Předposlední SEO nástroj najdete na adrese www.nastroje-seo.eu, podobné fuknce jako předchozí nástroj, navíc se můžete zaregistrovat a s delším časovým odstupem sledovat, Vaše umístění a změnu ve vyhledávačích.

Poslední nástroj najdete na adrese www.serp.cz, opět spoustu věcí, které uměli předchozí nástroje , ale navíc umí pěkné srovnání daných klíčových slov v různých vyhledávačích, spíše jen pro sledování a uspokojování sama sebe tím, jak stránka pokračuje nahoru (4 z 5 ředitelů firem doporučují papírové kapesníčky)

SEO statistiky

Mezi první statistiku, nebo spíše stránku, kterou by jste měli sem tam zkontrolovat a používat patří Google Webmaster Tools, po ověření Vašeho webu, začne vyhodnocovat vyhledávaná slova, klíčová slova, nefunkční stránky a podobné statistiky o které by jste se měli zajímat a občas kontrolovat.

Google Analytics, po přidání měřícího kódu do Vašich stránek, Vám změří většinu pohybu uživatelů, nevím zda má cenu zde popisovat jaká nastavení a jaká kouzla se dají s Analytics dělat, takovýchto informací najdete na stránkách mnoho, pokud by byl ale zájem, můžu pár svých postřehů a zkušeností přihodit

Pokud by Vám ani tyto informace nestačily, tak si za nějaký peníz můžete koupit službu, která Vám zmapuje přesné klikání uživatelů na Vaší stránce a vytvoří tzv. Heat Mapu, díky které zjistíte přesně jak se na Vaší stránce uživatelé chovají, co používají, co je naopak nezajímá. Jen podotknu, že je to jeden z mnoha nástrojů, který toto umí.

SEO aplikace

Použití množného čísla je zde asi zbytečné, protože jedinou opravdu použitelnou aplikací, která se týká SEO, je Links Manager, pokud prodáváte / kupujete / vyměňujete odkazy, popřípadě jste vlastníkem více domén a chcete mít o všem přehled, tak přesně pro Vás je tato aplikace určená, jednoduchým způsobem si ověříte funkčnost všech nakoupených nebo vyměněných odkazů, zkontrolujete si kdy Vám expiruje, popřípadě kdy na Vaší stránce bude expirovat něčí reklama. Určitě stojí za vyzkoušení, a pokud chcete mít přehled tak se nedá jinak než doporučit.

SEO odkazy

Nemá cenu abych sem dával všechny odkazy, když si ty, které mě zajímají bookuju na svůj profil na adrese www.bookmarky.cz/users/R4ms3S. Budu rád pokud mi doporučíte v komentářích nějaké další zajímavé odkazy. Díky.

V tomto příspěvku budu hlavně odkazovat na zajímavé taháky, které se můžou hodit webdesignerovi, pro rychlé nakouknutí do dané problematiky.

HTML 5

Antonio Lupetti alias Woork připravil přehlednou tabulku s HTML 5 tagy, můžete si dokonce vybrat mezi bílou nebo černou verzí

CSS

Dave Child udělal přehledný tahák pro CSS styly, dokonce ho aktualizoval a proto jsou u něj ke stažení dvě verze, novější V2 a starší V1.

Javascript

Dave Child udělal přehledný tahák pro Javascript.

jQuery

Antonio Lupetti alias Woork udělal přehledný tahák pro jQuery.
G. Scott Olson udělal také tahák pro jQuery

PHP

Dave Child udělal přehledný tahák pro PHP, také ve dvou verzích, aktualizovaná V2 nebo starší V1.

Regulární výrazy

Další co Dave Child udělal jsou regulární výrazy, také ve dvou verzích, novější V2 nebo starší V1.

mod_rewrite

Poslední co jsem našel od Dave Child je tahák pro mod_rewrite, opět ve dvou verzích, novější V2 nebo starší V1.

SEO

Danny Dover na serveru SEOmoz.org publikoval skvělý tahák o SEO.