LINUXSOFT.cz Přeskoč levou lištu
Uživatel: Heslo:  
   CZUKPL

> PHP (79) - Triky s formuláři a ergonomie webu

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 | Články autora | přečteno 37795×

Komerční sdělení: Pořádáme Kurzy PHP

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.

Verze pro tisk

pridej.cz

 

DISKUZE

Nejsou žádné diskuzní příspěvky u dané položky.



Příspívat do diskuze mohou pouze registrovaní uživatelé.
> Vyhledávání software
> Vyhledávání článků

15.4.2017 15:20 /František Kučera

Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Zajímá tě IoT a radiokomunikace? Přijď na sraz spolku OpenAlt, který se bude konat ve středu 19. dubna od 18:30 v Šenkovně (Sokolská 60, Praha 2).


Přidat komentář

5.3.2017 19:12 /Redakce Linuxsoft.cz
PR: 23. března proběhne v Praze konferenci na téma Cloud computing v praxi. Hlavními tématy jsou: Nejžhavější trendy v oblasti cloudu a cloudových řešení, Moderní cloudové služby, Infrastruktura současných cloudů, Efektivní využití cloudu, Nástrahy cloudových řešení a jak se jim vyhnout.
Přidat komentář

27.2.2017 22:12 /František Kučera
Pozvánka na 137. sraz OpenAlt – Praha: Tentokrát jsme si pro vás připravili neobvyklou akci. Ve středu 1.3. v 17:30 nás přivítá sdružení CZ.NIC ve svých prostorách v Milešovské ulici číslo 5 na Praze 3, kde si pro nás připravili krátkou prezentaci jejich činnosti. Následně navštívíme jejich datacentrum pod Žižkovskou věží. Provedou nás prostory, které jsou běžnému smrtelníkovi nedostupné!
Po ukončení prohlídky se všchni odebereme do hostince U vodoucha, Jagelonská 21, Praha 3 pochutnat si na některém z vybraných piv či dát si něco na zub. Rezervaci máme od 19:30, heslo je OpenAlt.
Ale pozor! Do prostor datového centra máme omezený přístup, dostane se tam pouze 10 lidí! Takže kdo přijde dříve, ten má přednost, a občanky s sebou! Kdo nebude chtít na prohlídku datového centra, může se pomalu přesunout do hostince U vodoucha a u nepřeberné nabídky piv počkat na ostatní.
Přidat komentář

18.1.2017 0:49 /František Kučera
Členové a příznivci spolku OpenAlt se pravidelně schází v Praze a Brně. Fotky z pražských srazů za uplynulý rok si můžete prohlédnout na stránkách spolku. Příští sraz se koná už 19. ledna – tentokrát je tématem ergonomie ovládání počítače – tzn. klávesnice, myši a další zařízení. Také budete mít příležitost si prohlédnout pražský hackerspace Brmlab.
Přidat komentář

8.1.2017 17:51 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Přijď na sraz spolku OpenAlt, který se bude konat ve čtvrtek 19. ledna od 18:30 v pražském hackerspacu Brmlab. Tentokrát je tématem srazu ergonomie ovládání počítače – tzn. klávesnice, myši a další zařízení. K vidění bude mechanická klávesnice dasKeyboard, trackball Logitech nebo grafický tablet (a velký touchpad) Wacom. Přineste i vy ukázat svoje zajímavé klávesnice a další HW. V 18:20 je sraz před budovou, v 18:30 jdeme společně dovnitř, je tedy dobré přijít včas. Podle zájmu se později přesuneme do nějaké restaurace v okolí.
Přidat komentář

1.12.2016 22:13 /František Kučera
Máš rád svobodný software a hardware nebo se o nich chceš něco dozvědět? Přijď na sraz spolku OpenAlt, který se bude konat ve čtvrtek 8. prosince od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5). Sraz bude tentokrát tématický. Bude retro! K vidění budou přístroje jako Psion 5mx nebo Palm Z22. Ze svobodného hardwaru pak Openmoko nebo čtečka WikiReader. Přijďte se i vy pochlubit svými legendami, nebo alespoň na pivo. Moderní hardware má vstup samozřejmě také povolen.
Komentářů: 1

4.9.2016 20:13 /Pavel `Goldenfish' Kysilka
PR: Dne 22.9.2016 proběhne v Praze konference Cloud computing v praxi. Tématy bude např. nejnovější trendy v oblasti cloudu a cloudových řešení, provozování ERP v cloudu, o hostování různých typů softwaru, ale třeba i o zálohování dat nabízeném podnikům formou služby.
Přidat komentář

1.9.2016 11:27 /Honza Javorek
Česká konference o Pythonu, PyCon CZ, stále hledá přednášející skrz dobrovolné přihlášky. Máte-li zajímavé téma, neváhejte a zkuste jej přihlásit, uzávěrka je již 12. září. Konference letos přijímá i přednášky v češtině a nabízí pomoc s přípravou začínajícím speakerům. Řečníci mají navíc vstup zadarmo! Více na webu.
Přidat komentář

   Více ...   Přidat zprávičku

> Poslední diskuze

17.4.2017 19:15 / Jakub shoop
chyba

7.4.2017 15:43 / Som
foreign car repair

31.3.2017 18:33 / David Ostrovsky
Dotazník na obeznámenost s hummusem.

24.3.2017 11:54 / Hui
country cottages

16.3.2017 16:33 / BezvaDesign.cz
Re: Hledám grafika do teamu

Více ...

ISSN 1801-3805 | Provozovatel: Pavel Kysilka, IČ: 72868490 (2003-2017) | mail at linuxsoft dot cz | Design: www.megadesign.cz | Textová verze