V průběhu let se návrhy a rozvržení webu zvýšily složitě. Přesto, zatímco se naše práce stále více vylepšuje a interaguje, odklánějící se od statických rozvrstvení, které dominovaly 90. letech, se centrální cíl nezměnil.

Viditelnost je pro konstruktéry stejně důležitá jako dnes. Jedná se o naši schopnost soustředit pozornost uživatele na smysluplný obsah, který pomáhá prodávat zboží a povzbuzovat účastníky a pomáhá webům získat pravidelné čtenáře.

S lidmi, kteří stále více využívají předem připravená řešení, je důležité, aby webové stránky poskytovaly dostatek rozlišování a osobnosti, které by kultivovaly zájem uživatelů.

Koneckonců, celý bod webové stránky musí být jedinečný, nesledují ostatní nebo nabízet použitelné, ale generické a bezvládné uspořádání. S ohledem na tuto skutečnost se podíváme na to, jak může nutkání přehnat určité konvence a vzory designu příznivě nebo nepříznivě ovlivnit uživatele.

Saturace a senzibilizace

Začneme se podívat na dva základní proměnné v práci. Saturace, která není zaměňována s výrazem souvisejícím s barvami, odkazuje na všudypřítomnost určitých nástrojů, technik nebo návrhových implementací na webu. Zvažte například, jak jsou rozšířené reklamy Google dnes a jak je někteří návrháři zabalí na své webové stránky.

Senzibilizace na druhé straně se týká míry, do jaké je uživatel ovlivněn vystavením nástroje, technice nebo implementaci. Dalo by se říci, že jsme se tak zvykli vidět reklamy na internetu, které jsme přizpůsobili jejich filtrování jako irelevantní hluk v pozadí a někdy je fyzicky filtrovali.

Reklama na videohry.

Vidíme stále více rušivé reklamy, které používají animaci, zvuky a živé barvy.

Zatímco některé implementace, jako je například reklama, mohou být považovány za zhoršující hodnotu obsahu, jiné mohou být velkým přínosem, pokud jsou používány opakovaně a důsledně, například miniatury obrázků v portfoliích. Vzhledem k tomu, že jak saturace, tak desenzibilizace mohou být jak dobré, tak i špatné, zásadním problémem, kterým čelí návrháři, je zjištění, jak a kdy dodržovat konvence.

Naše odvětví se velmi spoléhá na konvenci. Pokud nepoužíváme CMS nebo šablonu, používáme rámce a webové stránky pro inspiraci. Spoléhání se na konvence o designu by mohlo vyplynout ze strachu, že pokud nebudete dodržovat kulturní směny a trendy, budou považovány za zastaralé nebo budou zpochybněny jejich pochopení použitelnosti. Ale to je daleko od pravdy.

Zatímco kopírování návrhů nebo používání obecných konvencí může být jednodušší, omezuje potenciál uživatelů spojit se s uživateli na emocionální úrovni, která se nepřijímá lehce.

Systémy správy obsahu.

S tolika rámci a motory CMS je divu, že musíme postavit cokoli.

Podívejme se na některé z výhod, které konvence mohou přinést na webovou stránku a analyzovat některé velké nástrahy, které by mohly vést k rozhodnutí o konkrétním uspořádání nebo k přehodnocení funkce.

Podíváme se také na několik praktických řešení, která vám pomohou vyhnout se tomu, aby vaše webové stránky vypadaly a vypadaly jako miliony rozvržení, které nemají žádný skutečný jedinečný prodejní návrh (USP) nebo relevantnost.

Dobrá stránka saturace

Jedním z hlavních důvodů pro použití nasycených prvků v návrhu je uznání, které uživatelům poskytuje. Trendy a vzory poskytují nejen jednoduchá řešení pro funkce, které chceme implementovat (například navigační nabídky), ale mají jasný užitečný užitek, protože ujišťují uživatele o známých referenčních bodech na stránce.

Systémy navigačních menu.

Navigační systémy jsou čím dál složitější, ale mohou být také docela elegantní.

Saturace může přinést vzdělávací hodnotu zkušenosti. Poskytnutím konvencí pro uživatele saturace snižuje křivku učení pro webové stránky v průběhu času.

Zvažte, jak jsme zvyklí na rozbalovací nabídku. pokud jste nikdy neviděli tento nástroj, nemuseli jste si uvědomit, že se nad ním bude rozvíjet sekundární seznam položek. Takové společné komponenty mohou mít méně empatickou hodnotu nebo jedinečnost, ale pomáhají uživatelům rychle plnit své úkoly.

Tajemná masová navigace.

Mystery-meat navigation představuje pro uživatele problémy. Znalost by měla předcházet estetiku.

Máme tendenci považovat za samozřejmé věci, které vidíme každý den. Jak často například považujete technologii za semafor? Tento jev lze uplatnit také při tvorbě webových stránek.

Vzhledem k tomu, že úroveň nasycení trendu stoupá, dozvídáme se více o jeho funkci a tom, jak to ovlivňuje. V důsledku toho jsme schopni psychicky ignorovat, dokud ji nepotřebujeme. Toto nebezpečí je "prohlížení zombie", o kterém budeme hovořit později.

Zaměřte se na web.

Uživatelé mají tendenci zaměřovat se čistě na obsah a mohou chybět zprávy o návrhu.

Stabilita je dalším běžným účinkem konvencí návrhu. Když se něco znovu a znovu uskutečnilo, je pravděpodobné, že prošel několik iterací testování, analýzy a zlepšení a jako takový se zvyšuje hodnota.

Navíc, protože efektivita konvencí, jako je rozbalovací nabídka, byla silně zkoumána, můžeme sestavit scénáře využití, abychom zjistili, zda a jak by byly vhodné pro konkrétní uspořádání.

Logo výzvy k akci.

Víme, že uživatelé očekávají, že budou přesměrováni zpět na domovskou stránku, když kliknou na logo.


Špatná stránka saturace

Zatímco všechny tyto body ukazují, že saturace může být prospěšná, stejně jako u všech aspektů designu, tam je flip strana, která by měla přemýšlet dvakrát před skokem na vlak. První z těchto otázek je zneužití.

Pro ty z vás, kteří si pamatují designovou éru Web 2.0, kdy bylo vše lesklé a zkosené, web byl plný nezměrných návrhů, profesionálních i osobních. Všichni kopírovali to, co si mysleli, že jsou populární, a tak se trend stal tak běžným, že jeho hodnota byla ztracena v moři klonů.

Web 2.0 Era.

Návrh éry Web 2.0 se dostal z ruky a výsledkem bylo inovace rozložení.

Kromě pouhého zneužívání saturace je další překážkou bezradnost, která někdy obklopuje saturaci. Když implementujeme funkci, jako je navigační nabídka, návštěvníci by měli rozpoznat mnoho jeho prvků na stránce.

Co se stane, pokud nástroj nefunguje podle očekávání? V první řadě se může zdát triviální, ale trendy omezují naši schopnost inovovat a uživatelské předpoklady mohou bránit rozvoji webu.

Tlačítka na webu.

Uživatelé očekávají akci po kliknutí na tlačítko, takže funkce musí být reaktivní.

Kromě těchto faktorů je jedním z největších argumentů proti šablonám a nasyceným prvkům, že se necílí na potřeby konkrétního publika.

Jednou z charakteristických rysů ručně vytvořené webové stránky je to, že byla postavena (snad) s požadavky návštěvníků v jádru. Zatímco webové stránky se mohou dostat pryč s genericky vypadajícím uspořádáním, návrhy, které jsou krásně vytvořené zvýší hodnotu webové stránky a obohatí nebo doplní obsah.

Místo pro děti.

Můžete jasně říct, že tato webová stránka byla vytvořena pro své cílové publikum: děti.

Poslední otázkou je vliv, který saturace má na návštěvníky. Když se rozvržení stanou rutinou, uživatelé mohou snadno vynechat nové komponenty, které předpokládají, že existovaly během své předchozí návštěvy.

Tento psychologický stav, známý jako "prohlížení zombie", se projevuje, když uživatelé nezaznamenají objekty, které podvědomě nebo vědomě považují za nepodstatné. To je obzvláště problematické v reklamě; mnoho uživatelů blokuje reklamy s rozšířeními o prohlížeče nebo se na ně dívá, i když by reklamy mohly být užitečné.

Ad Block Plus pro Firefox.

Možnosti filtrování mohou být užitečné pro uživatele, ale mohou také učinit ztížení.


Řešení pro návrháře

První řešení, které se zdá být spíše zřejmé, je inovovat spíše než kopírovat to, co existuje.

V některých případech se však nejlepším krokem bude jednoduše nerozvinout kolo; dostupnost inspiračních galerií, skriptů pro řezání a vkládání, motory CMS a šablony rozvržení mají tendenci podporovat preferování rychlého obratu, spíše než ručního, originálního dílenského zpracování.

Dokonce i když používáte předdefinované řešení, můžete jej ještě zlepšit nebo přizpůsobit pro vaše publikum.

WordPress CMS.

WordPress může (a měl by být) vysoce přizpůsoben, aby odpovídal identitě osoby nebo společnosti.

Druhým řešením je určit, zda obecná vlastnost skutečně slouží určitému cíli. Myšlenka projektování s cílem byla po mnoho let a zatímco uživatelé nadále vyžadují vyšší úroveň interaktivity a kontroly na webových stránkách (daleko od statické éry návrhu), měli bychom zahrnout prvek na webové stránky, pouze pokud je užitečnost převyšuje náklady na to, že je tam; neměla by například odcizovat pozornost od jiného obsahu. Každý objekt by měl sloužit užitečnému účelu, dokonce i drobným prvkům, jako jsou odkazy přeskočit, které pomáhají čtečkám obrazovky.

Čisté rozhraní.

Odstranění nepotřebných funkcí zůstává populární, protože všichni rádi čisté rozhraní.

Jednoduchost a cíl nasměrování očí návštěvníka na užitečný obsah je jádrem dobrého designu. Abychom se vyhnuli nadměrné nasycení, musíme při výběru objektů na stránku (a zvláště ne opakovaně) dbát opatrnosti a nemusíte být nadšeni "nahráváním funkcí".

Víme, že přetěžování uživatelů je přinutilo, aby pracovali lépe na stránce; a čím více rozptýlení dochází, tím vyšší je riziko, že důležitý obsah bude chybět. Návrháři musí být citliví na potřeby uživatelů, snížit křivku učení a maximalizovat viditelnost obsahu.

Dobré a špatné příklady

V prvním příkladu níže je jasné, že spousta energie se dostává do vyrovnávací konvence a originality. Všimněte si, jak se rozložení pevného rozvržení, vycentrované a vysoce viditelné logo a známé prvky na stránce spojí bez přetížení uživatele. Zatímco je vyžadováno rolování, rozhraní nabízí jedinečné odstředění, s jemnými vznášejícími se vzruky, typografickými možnostmi a pečlivě uspořádanými profilovými obrázky.

Jedinou skutečnou nevýhodou je, že neviditelní uživatelé nemusí být schopni snadno identifikovat vizuální ikony. Mysteriózní navigace je vždy velkým rizikem.

Příklad A.

Uspořádání tohoto druhého příkladu je možná méně jedinečné než první. A přesto stále přináší dobré zkušenosti v důsledku krátké učební křivky pro interakci s uživatelem: logo a navigační menu jsou místa, od kterých očekáváte, že budou; webová stránka vychází z konvenčních podmínek pro prvky portfolia (i když v tomto případě je prostor na obrazovce poněkud zbytečný); a pútavé infografiky, které uživatelům posunují dolů po stránce.

Alternativní posuvník je zajímavý. Mnoho návrhářů zřejmě přijalo jeden v pokusu získat větší kontrolu nad estetikou webových stránek. Kvůli menší oblasti, na kterou lze kliknout, může být toto uspořádání pro uživatele s nedostatkem motoru velmi nepřístupné a odporuje běžnému používání výchozího nastavení prohlížeče. To představuje anti-vzor, ​​a to je dobrý příklad nevhodného výběru návrhu.

Příklad B.

Tato konečná webová stránka je skutečným příkladem "co neudělat". Jak můžete vidět, zatímco se snaží uživatelům uklidnit, domovská stránka MSN není originální a jasně jej obsah nepředstavuje.

Logo, vyhledávací pole a odkazy na ikony jsou přijatelně vykresleny, ale jak se uživatel posouvá dolů, stránka se stává stále více přeplněná v důsledku těsně zabalených konvencí návrhu.

Existuje příliš mnoho možností navigace, což vede ke zmatku; možná by stačila rozbalovací nabídka. Navíc reklama zaujímá jednu šestinu stránky, čímž upoutá pozornost uživatele. Navíc, jak se pohybujeme dolů, stránka je rozptýlena pomocí prezentací, bloků obsahu s tabulkami a stovkami přeplněných odkazů. Toto je příliš saturace v nejlepším případě: příliš mnoho je poskytováno s příliš malou originalitou nebo účelem.

Příklad C.

Saturace a rovnováha mezi konvencí a originalitou budou vždy do značné míry záviset na konstrukci.

Vzhledem k tomu, že se web stále vyvíjí, představí se nové standardy a konvence. Zatímco se chceme vyhnout vytváření návrhů, které jsou natolik odlišné, že zaměňují uživatele, musíme v naší práci zachovat jedinečnost, abychom se vyhnuli tomu, že bychom se nechtěli zabývat našimi návštěvníky.

Každá webová stránka bude mít své vlastní výzvy a potřeby, a odpovědnost designéra bude tlačit zpět k obecným "anti-zkušenostem" šablon a přinese některé inovace zpět do své práce.



Exkluzivně napsaný pro WDD Alexander Dawson. Je nezávislým vývojářem webových stránek, autorem a rekreačním softwarem, který se specializuje na webové standardy, přístupnost a design UX. Stejně jako běhání obchodu HiTechy a psaní, tráví čas Cvrlikání , Fóra SitePoint a další místa, které pomáhají těm, kteří to potřebují. "]

Co si myslíte o nasycení v návrhu webových stránek a jak čelíte těmto výzvám na svých vlastních webových stránkách? Podělte se o své myšlenky níže ...