Kterak si pomoci méně známými triky s formuláři při vývoji portálu? A což to vlastně je ergonomie webu?
15.12.2004 15:00 | Petr Zajíc | czytane 42923×
RELATED ARTICLES
KOMENTARZE
Předchozí díl jsme zakončili smutným konstatováním, že soubor
diskografie.php nedělá to, co by měl. Jeho úkolem totiž bylo zobrazovat
názvy alb, nebo alb a zároveň písní. Dnes se podíváme, jak to dořešit.
Triky s formuláři
V díle, v němž se představovaly formuláře, jsem uvedl,
že "klasický
formulář obsahuje nějaké prvky pro uživatelský vstup (třebas textová
pole) a nějaké prvky pro jeho odeslání". Rovněž Pavel Kácha v
sesterském seriálu
o HTML prohlásil, že "webový formulář je část stránky složená z
různých tlačítek, vstupních
polí a přepínačů, která slouží pro získání nějakých dat od uživatele".
Ono to není úplně přesné. Může totiž existovat formulář, který bude
obsahovat pouze odesílací tlačítko!
V našem případě takové tlačítko může být "dvoustavové" a může
obsahovat pokyn pro zobrazení vydaných alb nebo pokyn pro zobrazení dat
a zároveň písní. Celý trik přitom může spočívat v tom, že provedená
akce se vyhodnotí podle toho, jaká byla hodnota value (a tedy i
popisek) na tlačítku. Můžeme tedy zobrazit formulář pomocí finty:
<input
name="zobrazeni" type="Submit" Value="<?echo ($_POST["zobrazeni"]==="Zobrazit i písně")? "Zobrazit jen alba":"Zobrazit i písně"?>">
a následně v kódu testovat zaslanou hodnotu nějak takto:
if
($_POST["zobrazeni"]==="Zobrazit i písně"):
// atd...
endif;
Mnoho dalších problémů s formuláři může vyřešit následující trik: Na
jedné stránce můžete mít více různých formulářů, z nichž dva či více mohou provádět stejnou akci! Například bychom
mohli chtít, aby se tlačítko pro modifikaci zobrazení objevilo nejen v
úvodu stránky, ale rovněž v její patě. Není nic jednoduššího než
vykopírovat definici formuláře na správné místo v dokumentu... a ono to
bude fungovat!
Při zobrazování více formulářů na jedné stránce můžeme samozřejmě
rovněž zapojit nějakou aplikační logiku. Tak třeba si budete přát, aby
se v zápatí objevilo tlačítko pouze v případě, kdy je zobrazen výpis
jak alb, tak písní. V tom případě můžete naprogramovat něco jako:
<?if ($_POST["zobrazeni"]==="Zobrazit i písně"):?>
<form method="post" action="index.php?clanek=diskografie">
<input name="zobrazeni" type="Submit" Value="<?echo ($_POST["zobrazeni"]==="Zobrazit i písně")? "Zobrazit jen alba":"Zobrazit i písně"?>">
</form>
<?endif;?>
Metoda zobrazování formulářů obsahujících pouze tlačítka má
nespornou výhodu v tom, že nezatěžuje uživatele mnoha
ovládacími prvky a je nesmírně kompaktní. Jediným kliknutím na
odesílací tlačítko tak můžete například přepínat mezi "krátkým" a
"dlouhým"
zobrazením, jako je tomu u nás. Ostatně, zkuste si to sami.
Pohodlné listování
Pokud si budete se sezbnamem alb a písní chvíli hrát, zjistíte, že
je poměrně dlouhý. To má značnou nevýhodu - pokud budete v seznamu
někde nízko, bude návrat nahoru znamenat velké rolování. Což
představuje problém, protože všechny odkazy jsou v horní části webu.
Řešit se to dá různě - například použitím prvku IFRAME. To by ale
docela rozházelo náš celý návrh, takže se musíme porozhlédnout po něčem
jiném.
To "něco" jsou záložky. V záhlaví stránky může být definována
záložka, například pomocí kódu:
<a
name="nahore"></a>
A ve vhodné části stránky se pak na záložku můžeme přemístit:
<?
echo "<tr><td><a
href=\"#nahore\">Nahoru</a></td></tr>";
?>
Záložky popisuje ve svém seriálu o HTML Pavel Kácha, takže se můžete
podívat, jak
to s nimi je.
Pozn.: Pokud tomu, co Pavel
vysvětluje nebudete rozumět, pak vězte, že nejste sami. Pavel totiž
anglický výraz pro záložky, "bookmarks" překládá jako "návěští",
přestože to je nestandardní. Navíc, Pavel mixuje výklad o záložkách s
výkladem o odkazech, což jsou dvě různé věci. Jiný odkaz pro vysvětlení
záložek můžete najít třeba zde.
Ergonomie webu
Úvahám o snadnosti ovládání a přístupnosti navigace se souhrnně říká
ergonomie webu. Obecný návod,
jak udělat ergonomický web neexistuje, takže Vám mohu nabídnout jen
několik osvědčených pravd, mezi nimiž musíte balancovat sami:
- Obecně platí, že validní weby mají tendenci být ergonomické. Není
na tom nic divného, když si uvědomíte, že webové standardy jsou tu
hlavně proto, aby nám život s webem usnadnily. Bráno pochopitelně z
pohledu uživatele; co se týče vývojáře je to někdy spíše naopak
- Obecně platí, že krátké stránky mají tendenci být ergonomické.
Logicky - čím méně dat najednou uživateli nabídnete, tím spíše se v
nich neztratí.
- Stránky s chytře vymyšlenými kaskádovými styly mají rovnež
tendenci být ergonomické. Vždyť styly slouží k oddělení obsahu webu od
formy.
Pokud si nejste jisti, zda je web dostatečně ergonomický, můžete
zkusit následující podněty:
- Zkuste se na něm chvíli pohybovat a myslet přitom jako uživatel.
Pokud Vám něco bude připadat složité, asi to tak je.
- Posaďte k webu uživatele a sledujte jeho chování (třeba pohyby
myši). Pokud je zmatený, asi web příliš ergonomický nebude.
K ergonomii webu v našem příkladu bychom mohli přispět, pokud bychom
kromě uvedených věcí ještě zvážili následující záležitosti:
- Řazení záznamů pomocí klauzule ORDER BY v dotazech SELECT pro
MySQL databázi
- Stránkováním výpisů - což už v seriálu bylo.
Změny na portálu
Na současný stav projektu se můžete na našem webu podívat
nebo si jej můžete stáhnout.
Pozn.: Aby Vám stažená verze
fungovala na lokálním stroji, upravte si hodnotu konstant SQL_HOST,
SQL_USERNAME, SQL_PASSWORD a SQL_DBNAME. Případně si je můžete včlenit
do konfiguračního souboru podobně, jako jsem to udělal v souboru
func.php.