Pokud vytváříte webové stránky, jistě víte, že základem každých stránek je HTML šablona webu, ve které je výsledný web zobrazen. Tato šablona vychází strukturou z analýzy webu a vzhledově z grafického návrhu.
Při vytváření šablon ale postupem času zjistíte, že některé části šablony zůstávají stejné, nebo hodně podobné. Začíná tak mít smysl připravit si nějakou základní šablonu, ze které vždy vycházíme a ušetříme si tak spousty času její přípravou. Zároveň se nám nestane, že bychom na něco zapomněli, nebo museli něco připravovat opakovaně.
V základní HTML šabloně tak můžeme mít připravenu hlavičku <head>, která se ve většině projektů až tak moc nemění. Správně si nastavíme znakovou sadu a připojíme základní stylopis včetně separátního stylu pro tisk. Dále je dobré připravit si základní strukturu stránek, to znamená nějakou obálku stránek, hlavičku <header>, obsah <content>, postranní sloupec <aside>, hlavní menu a patičku. To jsou prvky, které jsou prakticky na každých stránkách a určitě je jednodušší daný prvek smazat, než ho tam pracně dopisovat. Dobrým zvykem je naplnit si stránky základním obsahem. Bývá to hlavní nadpis <h1>, pár odstavců <p>, nějaký ten odrážkový seznam <ul>, kontaktní formulář a jednoduchá fotogalerie o pár fotkách. Donutí nás to k tomu, že všechny tyto prvky rovnou nastylujeme a nemusí se tak dodělávat při nasazování šablony do vytvářené aplikace, což následně ušetří mnoho času.
Tímto máme připravenou základní HTML šablonu. U kaskádového stylu je základem, aby zahrnoval správný CSS reset prvků, který nám srovná vzhled všech prvků přes všechny možné prohlížeče. Pokud nejsme schopni si toto vytvořit samostatně, je vhodné použít kód od některého z odborníků, např. od Erica Mayera. Dále si zapíšeme prvky které využijeme prakticky vždy, od základního stylu pro formulářové popisky, chybové hlášky a nebo třeba vyjížděcí menu, které smažeme, pokud není potřeba.
Pokud se Vám nechce takovou šablonu vytvářet, je možné převzít hotové šablony, např. HTML5 Boilerplate, které jsou opravdu komplexní, zahrnující CSS reset, připojení knihovny Modernizr pro podporu HTML5 u starších prohlížečů, opravu PNG u IE6 a mnoho dalších vychytávek.
Při využívání takových šablon je však důlažité myslet na to, aby v šabloně nezůstalo nic, co by na výsledných stránkách být nemělo. Jedná se například o odkazy na neexistující, nebo prázdné stylopisy pro IE, favicony anebo další knihovny, které nakonec ve výsledných stránkách nebyly použity.
Pro osobní použití jsem si připravil základní šablonu, která sice není tak robustní, ale jako základ pro jednoduché weby poslouží dobře. Níže je možno najít odkazy pro stažení, lze tak využít šablonu pro tvorbu svojí vlastní, nebo jako inspirace pro doplnění stávající šablony.
Šablony pro XHTML a pro HTML5 jsou nyní dostupné na GitHub jako BasicHtmlTemplates. Pro případné návrhy na vylepšení, nebo opravy lze využít Issues, přímo na GitHubu.