Klíčové body
1. Nedělejte uživatele přemýšlet: Navrhujte pro intuici a jasnost
Pokud nemůžete udělat stránku samozřejmou, alespoň ji udělejte samozřejmou.
Intuitivní design je klíčový. Uživatelé by neměli muset zjišťovat, jak vaše webová stránka funguje. Každý prvek, od navigace po obsah, by měl být okamžitě srozumitelný. Když uživatelé narazí na něco nejasného, vytváří to kognitivní tření, zpomaluje je to a potenciálně je to může odradit.
Samozřejmé vs. samozřejmé. Ideálně by měl být váš design samozřejmý, nevyžadující žádné přemýšlení k pochopení. Pokud to není možné, zaměřte se na samozřejmé, kde uživatelé mohou rychle pochopit koncept s minimálním úsilím. To platí pro vše od popisků tlačítek po celkovou strukturu webu.
Snižte mentální zátěž. Odstraňte otazníky v myslích uživatelů. Udělejte volby zřejmé, používejte jasný jazyk a dodržujte zavedené webové konvence. Čím méně uživatelé musí přemýšlet o používání vašeho webu, tím více mentální energie mohou věnovat vašemu obsahu nebo produktům.
2. Weboví uživatelé skenují, nečtou: Optimalizujte pro rychlé pochopení
Nečteme stránky. Skenujeme je.
Skenování je normou. Většina uživatelů nečte webové stránky důkladně. Rychle skenují, hledají klíčová slova, fráze a vizuální nápovědy, které odpovídají jejich úkolu nebo zájmu. Toto chování je poháněno časovým tlakem, vědomím, že nemusí číst vše, a letitými zkušenostmi s „dostatečně dobrým“ shromažďováním informací.
Navrhujte pro skenery. Používejte techniky, které usnadňují skenování obsahu:
- Jasné, popisné nadpisy a podnadpisy
- Odrážkové seznamy
- Krátké odstavce
- Zvýrazněná klíčová slova
- Smysluplné obrázky a popisky
Dávejte důležité informace dopředu. Umístěte nejdůležitější obsah na začátek stránky a na začátek odstavců. Používejte styl obrácené pyramidy z žurnalistiky: začněte závěrem, pak poskytněte podpůrné detaily.
3. Vytvářejte jasné vizuální hierarchie a konvence
Konvence jsou vaši přátelé.
Vizuální hierarchie vede uživatele. Udělejte důležité prvky výraznější pomocí velikosti, barvy, umístění a bílého prostoru. Vizualizujte související položky. Používejte vnoření k zobrazení, co je součástí čeho. Jasná vizuální hierarchie pomáhá uživatelům pochopit vaši stránku na první pohled.
Využívejte konvence. Webové konvence se vyvinuly z nějakého důvodu – fungují. Uživatelé se naučili očekávat určité prvky na určitých místech (např. logo vlevo nahoře, vyhledávání vpravo nahoře). Držte se těchto konvencí, pokud nemáte velmi dobrý důvod nedělat to.
Vyvažujte inovaci a známost. Zatímco kreativita je cenná, nevynalézejte znovu kolo pro základní funkce. Známé vzory snižují kognitivní zátěž. Pokud inovujete, ujistěte se, že nový design je tak intuitivní, že nevyžaduje žádnou křivku učení, nebo přidává významnou hodnotu, aby ospravedlnil malou křivku učení.
4. Rozdělte stránky na jasně definované oblasti
Ideálně by uživatelé měli být schopni hrát verzi staré herní show Dicka Clarka $25,000 Pyramid s jakoukoli dobře navrženou webovou stránkou.
Odlišné zóny pomáhají pochopení. Rozdělení vaší stránky na jasně definované oblasti pomáhá uživatelům rychle rozhodnout, na které části se zaměřit a které ignorovat. To je obzvláště důležité vzhledem k tendenci uživatelů skenovat spíše než číst důkladně.
Udělejte oblasti okamžitě rozpoznatelné. Uživatelé by měli být schopni na první pohled identifikovat účel každé oblasti:
- Navigace
- Vyhledávání
- Obsah
- Reklama
- Brandingové prvky
Používejte vizuální design k posílení rozdělení. Používejte techniky jako bílý prostor, okraje, barevné pozadí a konzistentní stylování k vymezení různých oblastí. Tato vizuální organizace pomáhá uživatelům vytvořit si mentální model struktury vašeho webu.
5. Udělejte zřejmé, co je klikatelné
Protože velká část toho, co lidé na webu dělají, je hledání další věci, na kterou kliknout, je důležité udělat zřejmé, co je klikatelné a co ne.
Jasné affordance snižují frustraci. Uživatelé by neměli hádat, s čím mohou interagovat. Udělejte odkazy a tlačítka výrazné pomocí:
- Konzistentního stylování (např. podtržený text pro odkazy)
- Barevného odlišení
- Efektů při přejetí myší
- Tvarů podobných tlačítkům pro důležité akce
Vyhněte se falešným affordancím. Nedělejte neinteraktivní prvky vypadat klikatelné. To vytváří zmatek a narušuje důvěru ve vaše rozhraní.
Zvažte mobilní interakce. Na dotykových zařízeních udělejte cíle pro klepnutí dostatečně velké a vhodně rozmístěné. Poskytněte vizuální zpětnou vazbu pro klepnutí, aby byla potvrzena interakce.
6. Odstraňte rozptýlení a nepořádek
Zbavte se poloviny slov na každé stránce, pak se zbavte poloviny toho, co zbylo.
Fokus je klíčový. Každý zbytečný prvek na stránce soutěží o pozornost uživatele. Přeplněné designy ztěžují uživatelům najít, co hledají, a pochopit vaši zprávu.
Nemilosrdně editujte. Odstraňte:
- Zbytečná slova a obsah
- Redundantní navigační možnosti
- Čistě dekorativní obrázky
- Příliš složité rozvržení
Přijměte bílý prostor. Necítíte potřebu vyplnit každý pixel. Bílý prostor pomáhá organizovat obsah, zlepšuje čitelnost a dává důležitým prvkům prostor k dýchání.
Prioritizujte nemilosrdně. U každého prvku na stránce se zeptejte: „Podporuje to hlavní cíl této stránky?“ Pokud ne, zvažte jeho odstranění nebo zmenšení jeho významu.
7. Navrhujte efektivní navigaci: Udělejte ji snadno nalezitelnou a srozumitelnou
Webová navigace kompenzuje tento chybějící smysl pro místo tím, že ztělesňuje hierarchii webu, vytváří smysl pro „tam“.
Jasná navigace je klíčová. Dobrá navigace říká uživatelům, co je na webu, jak ho používat, a dává jim důvěru v tvůrce webu. Měla by být konzistentní napříč webem a poskytovat kontext, kde se uživatel nachází v rámci struktury webu.
Klíčové navigační prvky:
- Trvalá navigace (přítomná na každé stránce)
- Jasné názvy sekcí
- Odkaz na „Domů“
- Funkce vyhledávání
- Breadcrumbs pro hluboké hierarchie
Udělejte kategorie samozřejmé. Uživatelé by měli být schopni předpovědět, co najdou v každé sekci. Používejte jasné, popisné štítky a vyhněte se chytrým názvům, které by mohly být nejednoznačné.
8. Optimalizujte svou domovskou stránku: Jasný účel a snadné výchozí body
Domovská stránka musí vyhovovat všem, což je jako říkat „Kdokoli může parkovat zde“ o jednom parkovacím místě.
Komunikujte účel okamžitě. Během několika sekund by noví návštěvníci měli pochopit, o čem váš web je a co jim nabízí. Používejte jasný slogan a stručný vysvětlující text.
Zobrazte klíčové funkce. Udělejte zřejmé, jak začít nejdůležitější úkoly na vašem webu. Ať už jde o vyhledávání, vytvoření účtu nebo procházení produktů, tyto vstupní body by měly být výrazné.
Vyvažujte konkurenční potřeby. Domovské stránky často musí sloužit více publikům a obchodním cílům. Prioritizujte nemilosrdně a zaměřte se na nejkritičtější prvky. Odolejte pokušení propagovat vše.
9. Testování použitelnosti s omezeným rozpočtem: Udržujte to jednoduché a dělejte to často
Testování jednoho uživatele na začátku projektu je lepší než testování 50 na konci.
Pravidelné testování je neocenitelné. I malé, neformální testování použitelnosti může odhalit hlavní problémy. Snažte se testovat brzy a často během vývojového procesu.
Udržujte to jednoduché:
- Testujte s 3-4 uživateli na kolo
- Zaměřte se na hlavní úkoly a bolestivé body
- Používejte protokoly „think-aloud“ k pochopení myšlenkových procesů uživatelů
- Hledejte vzory napříč více uživateli
Rychle jednejte na základě poznatků. Cílem je zlepšit design, ne vytvářet složité zprávy. Po každém kole testování identifikujte nejkritičtější problémy a rychle implementujte opravy.
10. Přístupnost je důležitá: Navrhujte pro všechny uživatele
Udělat stránky samozřejmé je jako mít dobré osvětlení v obchodě: prostě to všechno vypadá lépe.
Inkluzivní design prospívá všem. Navrhování pro přístupnost nejen pomáhá uživatelům s postižením, ale často zlepšuje použitelnost pro všechny uživatele. Je to také stále důležitější pro právní soulad a etické obchodní praktiky.
Klíčové úvahy o přístupnosti:
- Poskytujte textové alternativy pro obrázky
- Zajistěte navigaci pomocí klávesnice
- Používejte dostatečný kontrast barev
- Vytvářejte logickou strukturu obsahu
- Udělejte formuláře přístupné
Začněte základy. I malé zlepšení přístupnosti může mít velký dopad. Zaměřte se na nejvýznamnější změny nejprve, pak postupně zlepšujte přístupnost v průběhu času.
11. Pište pro web: Stručně, skenovatelně a objektivně
Šťastné řeči musí zemřít.
Stručnost je klíčová. Weboví uživatelé mají omezený čas a pozornost. Odstraňte zbytečná slova, úvodní text a marketingové řeči. Dostaňte se k věci rychle a jasně.
Udělejte text skenovatelný:
- Používejte smysluplné nadpisy a podnadpisy
- Používejte odrážkové a číslované seznamy
- Zvýrazňujte klíčové termíny a fráze
- Používejte krátké odstavce a dostatek bílého prostoru
Buďte objektivní a přímí. Vyhněte se přehánění a nadsazeným tvrzením. Uživatelé jsou skeptičtí vůči marketingovému jazyku a ocení jasné, faktické informace. Nechte své produkty nebo služby mluvit samy za sebe.
Poslední aktualizace:
FAQ
What's "Don't Make Me Think" about?
- Web Usability Focus: "Don't Make Me Think" by Steve Krug is a guide to web usability, emphasizing the importance of intuitive design that doesn't require users to think too much.
- Practical Advice: The book provides practical advice on how to create user-friendly websites by focusing on design principles rather than technology.
- User-Centric Approach: It stresses the importance of understanding how users interact with websites and designing with their needs in mind.
- Second Edition Updates: The second edition includes updated examples and additional chapters on accessibility and usability testing.
Why should I read "Don't Make Me Think"?
- Improve Usability Skills: It offers valuable insights into making websites more user-friendly, which is crucial for anyone involved in web design or development.
- Practical and Concise: The book is known for its brevity and practical approach, making it easy to read and apply the concepts quickly.
- Widely Respected: Steve Krug is a respected figure in the field of usability, and his book is considered a classic in web design literature.
- Broad Audience: Whether you're a designer, developer, or project manager, the book provides relevant advice for improving web usability.
What are the key takeaways of "Don't Make Me Think"?
- First Law of Usability: Krug's first law is "Don't make me think," emphasizing that web pages should be self-evident and intuitive.
- User Behavior Insights: Users scan pages rather than read them, and they often satisfice, choosing the first reasonable option rather than the best one.
- Importance of Testing: Regular usability testing is crucial, even if it's informal and involves just a few users.
- Clear Navigation: Effective navigation is essential for a good user experience, and it should be consistent and easy to understand.
How does Steve Krug define usability in "Don't Make Me Think"?
- Ease of Use: Usability means ensuring that a person of average ability can use a website for its intended purpose without frustration.
- Common Sense Approach: Krug advocates for a common-sense approach to usability, focusing on making things obvious and self-explanatory.
- User-Centric Design: The design should prioritize the user's needs and minimize the cognitive load required to navigate the site.
- Iterative Testing: Usability is best achieved through iterative testing and refinement based on user feedback.
What is Krug's First Law of Usability?
- "Don't Make Me Think": The first law is that web pages should be self-evident, meaning users should understand them without having to think.
- Obvious and Intuitive: The design should be obvious and intuitive, allowing users to navigate without confusion or hesitation.
- Reduce Cognitive Load: By minimizing the cognitive load, users can focus on their tasks rather than figuring out how to use the site.
- Ultimate Tie Breaker: This principle serves as the ultimate tie breaker when deciding if a design works or not.
What are some best practices for web navigation according to "Don't Make Me Think"?
- Consistent Navigation: Use persistent navigation elements that appear on every page to provide a consistent user experience.
- Clear Visual Hierarchy: Create a clear visual hierarchy to help users understand the relationships between different elements on a page.
- Use Conventions: Take advantage of web conventions to make navigation intuitive and reduce the learning curve for users.
- Highlight Current Location: Use "You are here" indicators to show users their current location within the site.
How does Krug suggest handling usability testing?
- Start Early and Test Often: Begin testing early in the design process and continue testing iteratively to catch issues before they become ingrained.
- Simple and Inexpensive: Usability testing doesn't have to be expensive or complicated; even testing with a few users can provide valuable insights.
- Focus on Key Tasks: Test key tasks that users are likely to perform on the site to ensure they can complete them easily.
- Observe and Adjust: Watch users interact with the site, note where they struggle, and make adjustments based on these observations.
What role do taglines play in web design according to "Don't Make Me Think"?
- Convey Site Purpose: Taglines should clearly convey the purpose of the site and what makes it unique or valuable.
- Positioning: They are typically placed near the Site ID to immediately inform users about the site's mission.
- Brevity and Clarity: Effective taglines are concise, usually six to eight words, and provide a clear benefit or differentiation.
- Avoid Jargon: Taglines should avoid vague or generic language that doesn't add value or clarity.
What are some common usability issues highlighted in "Don't Make Me Think"?
- Unclear Navigation: Users often struggle with navigation that isn't intuitive or consistent across the site.
- Excessive Text: Pages with too much text can overwhelm users; Krug advises cutting unnecessary words.
- Hidden Information: Important information, like contact details or pricing, should not be hidden or difficult to find.
- Complex Forms: Forms should be simple and only ask for necessary information to avoid user frustration.
How does Krug address accessibility in "Don't Make Me Think"?
- Part of Usability: Accessibility is an integral part of usability, ensuring that all users, including those with disabilities, can use the site.
- Simple Adjustments: Implementing basic accessibility features, like alt text for images and keyboard navigation, can significantly improve usability.
- Cascading Style Sheets (CSS): Using CSS can help create accessible designs by allowing for flexible layouts and text resizing.
- Right Thing to Do: Beyond legal requirements, making a site accessible is the right thing to do as it can dramatically improve some users' lives.
What are some of the best quotes from "Don't Make Me Think" and what do they mean?
- "Don't make me think!": This quote encapsulates the book's core message that web design should be intuitive and self-evident.
- "Get rid of half the words on each page, then get rid of half of what's left.": This emphasizes the importance of concise content that doesn't overwhelm users.
- "Usability testing on 10 cents a day.": Krug highlights that usability testing can be simple and inexpensive, yet highly effective.
- "The Farmer and the Cowman Should Be Friends.": This chapter title suggests that different stakeholders in web design should collaborate despite differing perspectives.
How does "Don't Make Me Think" address the balance between design and functionality?
- Design for Users: The book stresses that design should prioritize user needs and ease of use over aesthetic appeal alone.
- Avoid Over-Design: While visual appeal is important, it should not come at the expense of functionality or user experience.
- Iterative Improvement: Design should be refined through iterative testing and feedback to ensure it meets user needs effectively.
- Balance Sizzle and Substance: Krug advises against adding unnecessary "sizzle" that can detract from the site's usability and purpose.
Recenze
Nenuťte mě přemýšlet je chválen jako nezbytný průvodce použitelností webu, nabízející praktické rady pro vytváření intuitivních a uživatelsky přívětivých webových stránek. Čtenáři oceňují Krugův přímý styl psaní, humor a použití příkladů. Zatímco někteří považují obsah za zřejmý nebo zastaralý, mnozí jej považují za cenný jak pro začátečníky, tak pro zkušené designéry. Kniha klade důraz na jednoduchost, jasnou navigaci a design zaměřený na uživatele. Zabývá se také testováním použitelnosti a přístupností. Navzdory svému stáří se většina recenzentů shoduje, že základní principy zůstávají relevantní v moderním webovém designu.
Similar Books







