V tomto dokumentu shrnujeme nejdůležitější zásady a tipy pro tvorbu
webovských stránek FZÚ , které by měly přispět k pokud
možno jednotnému vzhledu a na druhé straně by měly vést ke snadnému použití
těch prvků, které vaše stránky vylepší a případně i lépe v síti zviditelní.
Na dokumentu průběžně pracuji a veškeré připomínky a návrhy vítám.
Pozn.: Tento dokument původně napsal RNDr. Ivan Veltruský CSc, tvůrce webových stránek FZÚ. Protože mu nyní jeho zdravotní stav nedovoluje pokračovat v této práci tak, jak by si přál, spravuje stránky FZÚ jeho kolega Ing. Ivan Vávra. Činí tak formou doplňování a výměny textu, nebo, pokud je to nutné, formou poznámek za původní text (pak je zde uvedeno [iva] ).
2. Obecně
Přístup na web server při údržbě stránek. Pro připojení k serveru
www (alias dell006e ), k přenosu dat
a práci na www bezpodmínečně dodržujte tyto zásady:
používejte hesla odlišného od vašeho uživatelského hesla na jiných
počítačích sítě FZÚ
pro přenos dat používejte unixovského povelu scp
(při přenosu dat pomocí ftp
jde heslo otevřeně sítí!), nebo klienta MS Windowswinscp , [iva] podporujícího protokoly SFTP a SCP přes SSH-1 i SSH-2.
[iva] v současné době, pokud se nacházíte v ústavu, nebo zvenku použijete VPN , je asi nejpřirozenější přímé sdílení diskového prostoru na web serveru ve Windows pomocí Samby (co je Samba nalezneme v tomto již historickém dokumentu). Pouze je třeba dávat pozor na přístupová práva nově zřizovaných adresářů, ty zřízeny pod Windows přes Sambu (sdílení webovského prostoru jako lokalního disku) poskytnou přístupová práva pouze přihlášenému uživateli a ne pro grupu www (viz níže) a pak je nutno tyto práva ručně měnit. Doporučuji tedy nové adresáře zřizovat pomocí shellu ssh .
nezasahujte do souborů, jichž nejste vlastníky, byť vám to práva
přístupu pro grupu www v principu umožňují
ponechte právo zápisu w
pro grupu www pro své dokumenty (je to nutné ke správě
stromu webovských dokumentů hlavním webmasterem)
velmi důležité je dbát o bezpečnost a přehlednost webu - ve svých adresářích nenechávejte žádné záložní soubory, hlavně soubory s přejmenovanou příponou obsahující skripty (např. soubory typu .php*~), které mohou zveřejnit zdrojový kód skriptu, to bývá jedním ze základních principů hackerských průniků. Záložní soubory skladujte na své pracovní stanici, nebo např. na přepisovatelném CD. V prostoru webu by měly být pouze "živé", tzn. používané soubory.
Přímý přístup k www z prostředí MS
Windows je možný pomocí klienta ssh,
přímý přenos souborů pomocí
winscp , nebo nejjednodušeji pomocí sdílení diskového prostoru na web serveru ve Windows pomocí Samby a to i mimo ústav, pomocí VPN . Problémy mohou nastat se správným zadáním cesty k Vašemu domovskému adresáři na web serveru (viz další kapitola 3), což vám pomůže zjednodušit správa webu Fzu zřízením linku do Vašeho domovského adresáře.
Adresář pro obrázky. Doporučujeme umístění všech obrázků
a vlastních ikon v českých i anglických dokumentech do jednoho adresáře
/images , umístěného jako podadresář anglického
adresáře vašeho oddělení. Významně to přispívá k přehlednosti
adresářové struktury. Pokud chcete využít ikon z nadřazených stránek
webu, uveďte na ně odkaz, nekopírujte je. Jsou umístěny v adresáři
/ikony .
Údržba celého webu. Hlavní webmaster (nyní I. Vávra) používá k tvorbě webových stránek FZÚ program Macromedia Dreamweaver
v lokálním režimu a vytvořené stránky následně kopíruje ručně na webovský server. Tento způsob zveřejňování stránek doporučuje všem webmaterům. Nedochází pak při změnách
adresářů (jejich umístění i názvu) a při importu souborů do stromu
webovských dokumentů (jako např. při použití programu Frontpage i pro správu webu) k vytváření databázových adresářů typu _vti (Frontpage),
které jsou v současné době, pokud se ještě někde vyskytují, rušeny.
3. Unix
Webovské dokumentyna www . Jsou uloženy
v adresáři /usr/local/apache/htdocs .V adresářích oddeleni
a departments najdete podadresář svého oddělení. Ke
snadnému přístupu k tomuto adresáři si můžete ve svém domovském
adresáři (ve kterém se nacházíte bezprostředně po svém zalogování
na dell006e ) např. definovat symbolické linky
ln -s /usr/local/apache/htdocs/oddeleni/moje_oddeleni cz ln -s /usr/local/apache/htdocs/departments/my_department en
takže pak stačí napsat pouze např.
cd cz nebo cd
en .
Přenos souborů. Jste-li ve správném webovském
adresáři na www , zkopírování souboru do něj
provedete např. takto:
scp novak@cedr.fzu.cz:adresář/soubor.htmlsoubor.html kde adresář je relativní cesta k souboru vzhledem
k vašemu domovskému adresáři na cedru .
Názvy souborů a adresářů. V celém webovském stromu dokumentů
zásadně používáme malá písmena
(samozřejmě bez diakritiky). Jako příponu používáme pro obyčejné
dokumenty .html , pro dokumenty, obsahující PHP příkazy
(např. počitadlo) musíte použít .php .
Dokumenty, využívající SSI (Server Side Includes*)musí
být pro interpretaci příslušných řádek ve vašem zdrojovém kódu
označeny buď příponou .shtml , nebo musí mít
nastaveno přístupové právo x pro všechny .
V jednom dokumentu však nelze použít konstrukcí PHP a
SSI zároveň. Aby fungoval odkaz na adresář, musí být
tento adresář obsahovat soubor index.html , index.php ,
index.shtml . Jinak bude prohlížečem ohlášena chyba
(toto řešení umožňuje mít v adresáři připravované nebo neveřejné
dokumenty, které pak nejsou "browsable", neuvede-li se v prohlížeči
plná cesta).
* [iva] - Pozn.: jedná se o nejstarší způsob jak udělat stránky částečně dynamické. SSI jsou podobné ASP či PHP. Veškeré příkazy, které jsou ve stránce obsaženy, jsou provedeny na straně serveru (jak říká název). Dnes již se SSI moc nepoužívají.
4. Meta tagy, kódování
Meta tagy. Meta tagy jsou značky dokumentu, v prohlížeči
neviditelné, které však ovlivňují správnou funkci kódování, vyhledávacích
robotů apod. Jsou umístěny v sekci HEAD dokumentu.
Aby se odkaz na vaši stránku objevil při vyhledávání pomocí
vyhledávacích služeb při zadání klíčových slov na předních místech
seznamu nalezených dokumentů, významně přispějete uvedením dvou následujících
meta tagů s touto syntaxí:
<META NAME="keywords"
CONTENT="klíčové_slovo_1, klíčové_slovo_2,
..."> <META NAME="description" CONTENT="popis obsahu stránky v rozsahu do cca 2 běžných řádek">
Klíčové_slovo může ve svém řetězci obsahovat
mezery, používejte malých písmen. V české verzi můžete použít
i česká klíčová slova, doporučuje se však je uvést vždy dvakrát
- jednou s diakritikou (v kódování daného dokumentu) a jednou bez
diakritiky. Význam druhého meta tagu spočívá v tom, že se jako výsledek
vyhledávání nezobrazí (defaultně) první dvě řádky vlastního
dokumentu, ale právě tento popis.
K určení autora stránky lze použít meta tag
<META NAME="Author"
CONTENT="Jan Novak">
Kódování češtiny. Předpokladem správné a automatické
funkce všech
prohlížečů je uvedení meta tagu s uvedením kódové sady. Pro bezpečnou
a správnou funkci v prohlížečích uveďte pro všechny vaše
dokumenty
explicitně řádku
[iva]<META HTTP-EQUIV="Content-type" CONTENT="text/html charset=iso-8859-2"> zaručí nejmenší problémy se správným zobrazením textu, nebo <META HTTP-EQUIV="Content-type" CONTENT="text/html charset=windows-1250">
bývá používaným HTML výstupem MS pruduktů jako je Word...
[iva] Na anglických stránkách, kde nepoužíváte diakritiku (což silně doporučuji), vložte řádku <META HTTP-EQUIV="Content-type" CONTENT="text/html charset=iso-8859-1">
V případě, že váš editor pracuje pod operačním systémem typu Unix
nebo Linux , a používá tedy kódování Latin2 ,
uvedete jako charset=iso-8859-2 .
Rovněž tak v případě, že na vašich PHP stránkách
využíváte přístup k databázi MySQL , jejímž nativním
kódováním je Latin2 , musíte použít tohoto kódování
pro celou vaši stránku. Pokud pracujete pod MS Windows ,
většina současných HTML editorů toto nastavení umožňuje (např. ve Frontpage
v Page Properties ). Je též možné po dokončení
editace využít různých konverzních programů.
Čeština na anglických stránkách. Jde o problém českých názvů
a zejména jmen osob. Připomeňme si, že znaková sada iso-8859-1
(Latin1) sice obsahuje í , é , á ,
ý , ale neobsahuje např. ř a š .
Na druhé straně kódování windows-1250 (ani iso-8859-2 )
nemusí být mimo oblast střední Evropy v prohlížečích dostupné
(jsou samozřejmě výjimky). Jediným
konzistentním řešením tedy je diakritiku vůbec na anglických stránkách
neuvádět. Někteří autoři to kompromisně řeší tak, že uloží své
jméno s diakritikou do obrázku GIF . To je však řešení
nedokonalé, neboť má-li prohlížeč nastavenu vlastní velikost fontu,
nemusí pak kombinace běžného textu a GIFu vypadat pěkně.
5a. Počitadlo přístupů nové od Miloslava Štrunce
Toto počítadlo Vám pošle na Vaši stránku svůj stav ve formě obrázku, který si můžete sami nakonfigurovat při registraci počitadla. Rovněž jste instruováni, jaký kód máte na svou stránku pro dané počitadlo vložit. Mimo počítání přístupů můžete obdržet též statistické údaje o IP adresách, ze kterých bylo na Vaši stránku za zvolené období přistupováno a získat přehled o použitých prohlížečích a OS, což jsou pro webmastera velmi cenné údaje. Tyto počitadla fungují i na stránkách umístěných mimo web ústavu, ovšem jen pro zaměstnance ústavu.
Počitadlo přístupů. Zařaďte na vhodné místo vaší stránky
řádku
Počet
přístupů: <script language="php">
require "../../../counter/counter.php3"
</script> od 1.1.2004
Uvedená cesta platí pro umístění na domovskou stránku oddělení,
vůči které je soubor counter.php3 o tři úrovně
výše (je tedy mimo dostupný strom webovských dokumentů, a to o jednu úroveň
výše, než je kořenový adresář stromu dokumentů). Budete-li počitadlo
umisťovat na dokument, který je o úroveň níže než je domovský adresář
oddělení, musíte přidat do cesty další ../ , atp. Název stránky s počitadlem
musí mít samozřejmě příponu .php .
Datum poslední editace. Pro posouzení aktuálnosti dokumentu uživatelem
bývá užitečné v zápatí dokumentu uvést datum poslední editace. To můžete
aktualizovat třemi způsoby:
ručně
pomocí SSI
<!--#config timefmt="%d.%m.%Y"-->
Poslední modifikace: <!--#echo var="LAST_MODIFIED"-->
pomocí PHP
Poslední modifikace:
<script language="php">
print(Date("d.m.Y",FileMTime($SCRIPT_FILENAME)));
</script>
6. Zdrojový kód
Název stránky. Pro označení názvu dokumentu slouží značka
<TITLE> v sekci
HEAD vašeho dokumentu. Název se objevuje nejen jako
titulek okna prohlížeče, ale i jako název vašeho dokumentu po
vyhledávání v síti. Neměl by být delší než 64 znaků.
Autorství dokumentu. Je vhodné v zápatí dokumentu uvést vaše
jméno s odkazem na vaši e-mailovou adresu pomocí
mailto: ... Před zneužítim vaši e-mailové adresy vyhledané internetovskými roboty se můžete chránit viz KOUTEK PRO WEBMASTERY FZÚ odkazy ImageMail (PHP utilita na výrobu obrázku místo novak@fzu.cz ), nebo Skryté mailto: (Javascript pro skrytý funkční odkaz, zobrazte si zdrojový kód).
Relativní adresování. Pro vzájemné odkazy používejte zásadně relativních adres (vzhledem k editovanému dokumentu, významně to
zjednodušuje práci při případné reorganizaci souborů a adresářů). Vyjímky jsou možné, pokud mají smysl - např. odkaz na kaskádové styly FZÚ , které mají stále stejnou adresu www.fzu.cz/css/*.css .
Kaskádové styly (CSS). Pro definici kaskádových stylů je vhodné požít již předdefinované kaskádové styly FZÚ, které jsou umístěny v adresáři www.fzu.cz/css/ zajistíte tím standartní vzhled vašeho dokumentu. Příklad definice CSS v hlavičce tohoto dokumentu s použitím absolutního odkazu:
Jako hodnotu atributu rel použijeme klíčové slovo stylesheet, které je speciálně pro účely stylů vyčleněno.
7. Design
No frames, no marquees, please! - pozn. [iva]: platilo dříve, všechny současné prohlížeče se dovedou s rámy (pokud jsou tyto správně navrženy) vypořádat a proti pěkně udělané stránce s rámy nelze nic nenamítat. Dnes se ale místo rámů téměř všude používají tabulky, které vládnou světem webu. Pokud se týká marquee (v kontextu HTML "jezdící" text) rovněž ho nedoporučuji.
Větší grafika má smysl pouze v odůvodněných případech (kvůli rychlosti přenosu) - pozn. [iva]: opět dnes již neplatí, přenosové rychlosti jsou dostatečné i pro použití větší grafiky .
Barevné řešení používejte střízlivé, ale ne "šedivé", minimum prvků jako animované gify,
zvuky.Mějte ohled na uživatele, který se na pouťové a křiklavé stránky
může podívat kamkoliv jinam.
Nepoužívejte speciálních konstrukcí, založených na
proprietárních
řešeních, jako např. v programu MS Frontpage , které
předpokládají buď server typu MS ISS nebo tzv. MS Frontpage
extensions . Server FZÚ je linuxovským
serverem typu Apache , který je konzistentní se
standardy pro jazyk html .
Používání souborů ve formátu PDF má na webu
obecně smysl jen pro dokumenty, kde se vyžaduje přesný vzhled a předpokládá
se stažení a tisk. Ve všech ostatních případech, tedy v dokumentech,
které slouží k bezprostřední informaci, je používání PDF
nesmyslné (už jen z důvodu objemu souboru, nehovoříc o nemožnosti
prohledávání obsahu většinou prohledávacích robotů) - pozn. [iva]: opět dnes již neplatí tak zcela, použítí formátu PDF pro důležité dokumenty je na webu čím dál tím více rozšířenější a současné webové prohledávače (např. Google) umí prohledávat i PDF dokumenty.
8. Webovske stránky uživatelů
Na webu FZÚ je díky NFS připojení
uživatelských domovských adresářů možné vystavovat i osobní stránky. Jejich
URL je www.fzu.cz/~username . Uživatel cedru či
sosny má podadresář WWW pro své osobní stránky přímo ve svém domovském
adresáři. Aby webovske soubory v tomto adresáři byly vidět, musí mít práva r-- pro
všechny.. Defaultní stránka musí mít název index.html ,
příp. index.php .
