In-Page Editing

Urob to priamo

Mnoho programov má jedno miesto pre vstup a druhé pre výstup, spracovávajúc ich ako osobitné procesy. Používateľský mentálny model v tom ale nevidí rozdiel. Jedno zo základných pravidiel hovorí: Dovoľte vstup všade tam, kde máte výstup. Vo všeobecnosti by sme mali vytvoriť rozhranie tak, aby reagovalo priamo na užívateľskú interakciu. My si popíšeme ten najpoužívanejší.

Editácia na stránke

Obsah na stránkach býval kedysi určený len pre zobrazovanie. Ak niečo potrebovalo zmenu, použil sa na to osobitný formulár s niekoľkými vstupnými poľami a tlačítkom na potvrdenie zmien. Umožnenie používateľovi editovať obsah stránky priamo, nasleduje princíp “Urob to priamo”.

Výhoda tohto prístupu je v sile kontextu. Často je pre používateľov potrebné, aby počas editácie videli zvyšok stránky. Napríklad je užitočné vidieť fotku, ak editujem jej názov, aby ju bolo možné výstižnejšie pomenovať.

Jedno-políčková priama editácia

Jedná sa o najjednoduchší typ editácie priamo na stránke, ale zároveň aj najpoužívanejší. Tento proces sa skladá z 4 krokov:

Stav ne-editácie: Prvok je zobrazovaný tak, aby bol čo najviac čitateľný. Je vhodné už v tomto stave zobrazovať editačný odkaz. Výhody tohto prístupu si popíšeme neskôr.

Pozvánka na editáciu: Pre používateľa musí byť už na prvý pohľad jasné, že daný prvok sa dá editovať priamo na stránke. To je možné dosiahnuť napr. podfarbením daného prvku pri pohybe kurzorom ponad prvok a prípadným zobrazením pomocného “ToolTip textu”.

Editácia: Akonáhle používateľ klikne na daný element, prepne sa do editačného módu. Zobrazenie tlačidiel “Uložiť” a “Storno”, dávajú používateľovi jasne vedieť, že sa momentálne nachádza v editačnom režime.

Dokončenie: Jednou z možností, ako dať jasne vedieť, že daná operácia prebehla úspešne, je použitie zvýrazňovacieho efektu na dočasné podfarbenie daného elementu inou farbou a napríklad zmena jeho textu na “Ukladá sa…”.

Objaviteľnosť

Nami popísaný postup má jednu drobnú chybu. Keďže všetky zmeny sa prejavia až po nájazde myšou, používateľ nevidí na prvý pohľad, že daný element je editovateľný. To je možné vyriešiť napríklad zobrazením odkazu “edit” hneď vedľa elementu. Každopádne to musí byť vyvážené, aby na stránke nebolo príliš veľa rušivých prvkov. Je nutné zvážiť, či je prednejšia čitateľnosť alebo editovateľnosť.

Prístupnosť

Ďalšíe znepokojenie, ktoré prichádza spolu s inline-editáciou je nedostatok prístupnosti. Prístupnosť ovplyvňuje širší rozsah používateľov, ako by ste si mohli myslieť. Prístupné technológie pomáhajú ľuďom s fyzickými postihnutiami, zdravotnými problémami, zrakovými ťažkostami a veľa iným.

Pomocné technológie vo všeobecnosti spracúvajú značkovací jazyk stránky, aby našli obsah, odkazy, alternatívne názvy pre obrázky a iné štruktúry na stránke. Ak inline editácia neobsahuje explicitne značku zabudovanú priamo do stránky, pomocné technológie nemôžu jednoducho objaviť možnosť editácie.

V určitom slova zmysle, spoliehanie sa na myš, aby objavila nové možnosti, zabráni niektorým užívateľom v priamej editácii. Ako sme spomínali vyššie, poskytnutím explicitného editačného linku pomôžeme objaviteľnosti a ako vedľajšie pozitívum bude táto schopnosť aj viac prístupná.

Existuje prirodzená dilema medzi priamou a nepriamou interakciou. Je možné ju vyriešiť, poskytnutím oboch prístupov v jednom rozhraní. Samozrejme odkaz na nepriamu editáciu bude odkazovať na osobitný formulár, s ktorým dokážu pomocné technológie spoľahlivo pracovať. Toto sa javí asi ako najvhodnejšia cesta pre väčšinu použití.

Doporučené postupy pre in-page editing

• Používajte len pre jedno políčko.
• Používate, ak chcete editovať jednu položku z mnoha, pomôže to udržať kontext
• snažte sa, aby zobrazovanie aj editácia mali rovnakú veľkosť, zabráni to rušeniu a znervóznovaniu pri prechode medzi režimami.
• Urobte prechod medzi oboma módmi čo najlplynulejší.
• Používajte pozvania pri prechode myši, keď je čitateľnosť dôležitejšia ako editovateľnosť.
• Vyhnite sa dvojkliku pre aktiváciu editácie.
• Umiestnite “[edit]” link k položke, ktorá sa môže editovať, keď sú čitateľnost a editovateľnosť rovnako dôležité, alebo je množstvo editovateľných prvkov malé.
• Použite overlay, ak editovaná položka potrebuje špeciálnu pozornosť. Tak isto to zabráni nechcenej zmene dôležitej hodnoty.
• Nepoužívajte viacnásobný overlay.
• Použite tlačítka na uloženie a zrušenie, ak je pre ne dostatok miesta.
• Vždy keď je to možné, dovoľte overlayu, aby bol posúvateľný myšou tak, aby bol obsah pod ním viditeľný podľa potreby.