• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Lukáš Marvan: Použitelnost a přístupnost (nejen) neziskových webů
 

Lukáš Marvan: Použitelnost a přístupnost (nejen) neziskových webů

on

  • 1,748 views

Příspěvek na konferenci Online marketing pro neziskovky

Příspěvek na konferenci Online marketing pro neziskovky

Statistics

Views

Total Views
1,748
Views on SlideShare
1,746
Embed Views
2

Actions

Likes
0
Downloads
6
Comments
0

1 Embed 2

http://www.slideshare.net 2

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Lukáš Marvan: Použitelnost a přístupnost (nejen) neziskových webů Lukáš Marvan: Použitelnost a přístupnost (nejen) neziskových webů Presentation Transcript

    • Použitelnost a přístupnost (nejen) neziskových webů
      Lukáš Marvan
      … najdu tam, co neznám !
      www.seznam.cz
    • Pročprávě toto téma?
      Protože nejen reklamou živ je web.
      Všichni (nejen NGO) řeší, jak dostat lidi na svoje stránky, ale málokdo se pak poctivě stará o to,co se tam s nimi děje.
      Facebook, Twitter, SEO, PPC, bannery, DM, RSS
      To všechno jsou kanály, které vám téměř zaručeně přivedou na stránky nové návštěvníky,ale co potom s nimi?
    • Pročprávě já?
      Protože kromě toho, že v Seznamu…
      pracuji jako koncepční návrhář v oddělení návrhu UI
      starám se o přístupnost našich služeb
      … tak se mimo Seznam věnuji:
      www.habrovka.cz
      www.ginkgo-praha.org
      www.amo.cz
    • Definice
      Použitelnost
      Zabývá se adekvátní jednoduchostí použití internetových stránek (programu, přístroje).
      Důležitá je snadnáorientace (kde jsem?)a navigace (tam jdu)na stránkách.
      UI vs. UX.
      Přístupnost
      Řeší lepší zpřístupnění obsahu webových stránek handicapovaným uživatelům.
      Postižení: zrakově, pohybově, sluchově, kognitivní poruchy, vyhledávací roboti.
    • Naše společná motivace
      Použitelnost a přístupnost se věnují zlepšování stránek. Proč?
      Chceme, aby nám tam chodilo víc lidí. Proč?
      Chceme, aby nám lidé:
      Nejen poslali víc peněz, ale třeba i:
      Podepsali víc petic.
      Přečetli víc článků.
      Registrovali se (víc).
    • A co motivace klientů?
      Naši návštěvníci mají také své cíle.
      Opravdu znáte potřeby Vašich klientů?
      Kdy naposledy jste…
      … se lidí zeptali na to, co u vás na webu pohledávají?
      … se podívali do statistik a zjistili, jestli to odpovídá?
      A odpovídají potřeby vašich klientůcílům vaší organizace?
    • Máme a známe cíle
      A pokud cíle nemáme, měli bychom si je rychle stanovit / zjistit.
      Cílů na které se soustředíme však nesmí být příliš mnoho.
      A neměly by se na stránkách křížit,
      1 stránka = 1 cíl.
    • Struktura a navigace
      Pro víc cílů potřebujeme víc stránek.
      Víc stránek tvoří strukturu.
      Struktura vyžaduje navigaci.
      Navigace ≠ Menu
    • Jak funguje váš web
      Návštěvníci
      Taky návštěvnici
      Úplně jiní návštěvníci
    • Přístupy na web
      Přístupy na web už zdaleka nejsou vertikální od HP přes sekci až k článku (vlastně ani nikdy nebyly, ale přistupovalo se tak k nim).
      Lidé na stránky přicházejí kudykoliv.
      Z toho jim vyplývá jedna zásadní otázka:
    • „Kde to sakra jsem?“
      Přesněji:
      Kde jsem?
      Na co se to dívám?
      Co s tím můžu udělat?(Asi na to můžu kliknout, ale co se potom se mnou stane?)
      Kam mohu odejít?
    • Stavte cesty k cíli
      Přivést lidi na web nestačí. Je potřeba je přimět k určité akci – k cestě k cíli.
      Chvíle, kdy se uživatelé rozhodují, kam ze vstupní stránky odejít, jsou přesně ty okamžiky, kdy začíná jejich cestak vašemu cíli.
    • 2 typy cest (částí stránek)
      Pastičky na myši
      Objednávky
      Registrace
      Kolečka pro křečky
      Čtení článků
      Prohlížení fotek
      A na cestě myším ani křečkůmneházejte klacky pod nohy!
    • Klacky +Berle
       
      Podtržený odkaz
      Zde jste
      Tam můžete jít
      Logo = Domů(poslední záchrana)
      Jeden za 1 000 slov.
      TITLE
      [Související položky]
      Nesouvisející| Položky
       
      Odkaz, text, taky odkaz.
      OK +KO +Jdi+ Stůj
      Související | Položky
      [Nesouvisející položky]
      Malé písmo(Malé písmo)
      Malý kontrast(Malý kontrast)
       Malé ovládací prvky
    • Příklady – KO #1
      auto-mat.cz – Kudy domů? (Nekliká logo, odkaznevedenarozcestník.)
      fandom.cz – Logo bez ALTu.
      sciencecafe.cz – Kde jsem = co spojuje tyto články? + 2 loga – k čemu? + Menu až úplně nahoře?! Není hned vidět.
      kulturni-most.cz – Kde jsem? Co je to za web?
      kulturni-most.cz – Zkuste přejít na web propagované akce. (Kliká jen ikonka W ne URL.)
    • Příklady – KO #2
      dtest.cz – Kde jsem? (Neodpovídá TITLE ani šipky v menu.)
      liberix.cz– Souvislosti? (Špatně umístěné čáry mezi články = odřezávají nadpis od obsahu.)
      havranek.dolnipovltavi.cz – Fotky by měly tak klikat na články – je to taky cesta!
      bazilika.cz – Filtr pořadů – jak poznám, že to nejsou jen vysvětlivky, ale že taky filtruje?Podtrhnout.
    • Příklady - OK
      sanceprodraha.cz – Vím, kde jsem i kam dál.
      nevladky-a-krize.cz – Kam dál? = Rudý button!
      hornomlynska.cz – Kde jsem? Slogan napoví.
      theia.cz – Super kontakty!
      Perlička na konec:spokojeny-domov.cz– slogan = OK, ale jako obrázek?!? = KO, ale má alespoň ALT = OK
    • Chyba je dobrá
      Geniální stránky nevytvoří na první pokus nikdo a pokud tvrdí, že ano, tak kecá.
      K chybě tedy dříve, nebo později dojde.Čím dříve, tím lépe! Později už bývá pozdě…
      Je tedy důležité udělat, odhalit a opravit chybu co nejdříve (co nejblíže počátku vývoje nového / redesignu stávajícího webu).
    • Postup
      Průzkum
      Design
      Testování
    • Postup – 1. průzkum
      Čeho chceme dosáhnout?
      Co od nás čekají klienti (donátoři)?
      Pozorujte! (Nejen na webu!)
    • Postup – 2. design
      Tužka je nejlepší kamarád.
      Buďte kreativní na správných místech.
      Nevynalézejte kolo.
    • Postup – 3. testování
      Ukazujte náčrtky, polotovary, zkušební beta verze a ptejte se lidí kolem sebe, jestli se orientují.+ Zkuste jim zadat pár jednoduchých úkolů.
    • Trpělivost a důvěra
      Každý člověk má jen omezený pohár trpělivosti, který když přeteče, tak se nas… naštve a odchází.
      Dávejte uživatelům odpovědi na jejich otázky,chovejte se na svém webu předvídatelně,budou vám o to více důvěřovat a jejich pohár trpělivosti se nebude vyprazdňovat, ba naopak plnit a prohlubovat (UX).
    • Doporučená četba
      Pro začátek:dogma.pixy.cz(starší, ale dobré!)
      Nenuťte uživatele přemýšlet (SteveKrug)
      Tvoříme přístupné webové stránky(David Špinar)
      Savethe Pixel (BenHunt)
      Gettingreal(37signals)
      12 požadavků na přístupnost
      pouzitelnost.info/pouzitelnost
      pravidla-pristupnosti.cz
    • Děkuji za pozornostOtázky?
      www.lakave.info