9 Základní pravidla pro citlivé galerie obrázků
Odpovědný design je nezbytnou a nezbytnou součástí vývoje webu. Jedním z největších problémů s citlivým webovým designem, jak pozdě, byly obrazy. Mnozí diskutují o tom, jak nejlépe zobrazovat obrázky na citlivém webu. A pak, co s obrazovými galeriemi?
Galerie obrázků jsou mnohem složitější než jednotlivé snímky; existuje ještě více proměnných a věcí, na které je třeba přemýšlet, když implementujete na webových stránkách celé citlivé obrazové galerie. Podívejme se na některé užitečné tipy pro implementaci citlivých obrázkových galerií správnou cestou.
1) Prezentace: skryjte nav, pokud je to možné
Možná nemáte navigační prvky na tabletu nebo mobilním zařízení, ale na pracovní ploše, je dobré skrýt tyto prvky, dokud nejsou potřebné. Položky, jako jsou šipky vpřed a vzad a navigační body, by měly být nastaveny tak, aby zobrazovaly pouze tehdy, když se někteří myši pohybují přes posuvnou galerii obrázků. Tím se zabrání rozptýlení a vyhnete se konfliktům mezi obsahem a prvky nav. Celá zkušenost se cítí méně zmatená.
2) Vyhněte se příliš mnoha obrázkům na výšku
Pokud implementujete galerii, která je mřížkou obrazů, budete chtít vybrat snímky, které jsou orientačně orientované na šířku nebo pokud je to možné. To usnadňuje jejich prohlížení na malé obrazovce. Portrétní obrázky by byly v pohodě v chytrém telefonu v režimu na výšku, ale široká pozorovací oblast telefonu orientovaného na krajinu znesnadňuje zobrazení portrétních obrázků. Krajina je nejlepší, ale můžete se vyrovnat s námětem, pokud není krajinou možnost. Všechny snímky mohou být nastaveny tak, aby se vešly do oblasti zobrazení, ale obrazy na výšku na obrazovce s terénem se objeví velmi malé. Vaše snímky nebudou zobrazeny jako záměrně jako čtvercový nebo krajinový obraz, který vyplní větší plochu obrazovky a objeví se větší. Při výběru snímků nezapomeňte nezapomeňte na osobu, která je prohlíží.
3) Používejte gesta na tabletech a mobilních zařízeních
Lidé rádi používají gesta na dotykových obrazovkách. Cítí se více posilováni, když se cítí, že posunují obraz, protože zkušenost je poněkud ponořující. Pokoušíte se klepnout na malé šipky nebo navigační body na mobilním zařízení je příliš únavné. Je mnohem přirozenější, abyste mohli vzít prst a přemístit obrázek nahoru, dolů, doleva nebo doprava.
4) Vyhněte se lehkým boxům: deaktivujte je na mobilních zařízeních
Pokud máte obrázky produktů, jako jsou stroje nebo předměty, které by měly být podrobněji viděny (tkanina, šperky atd.), Pak je to lehký box s většími obrázky. I tak by se měly používat pouze na ploše. Když rozpadnete na velikosti tabletu a mobilní obrazovky, světla by měla být vypnuta. Mohou způsobit řadu problémů se zkušenostmi uživatelů. Pokud se něco stane a lightbox není správně rozměrován, nemusí mít přístup k tlačítku ukončení nebo obraz nemusí být správně zobrazen.
5) Když používáte elementy nav, dejte je nenápadný
Pokud máte klouzavou galerii obrázků s významným počtem snímků, navigace má smysl. Nechcete, aby uživatelé čekali, až projdou vše kolem. Mohou snadno procházet svou vlastní rychlostí, dostat se, získat to, co potřebují, a dostat se ven. Při použití těchto prvků je nutno je zastrčit na místa, která jsou mimo provoz. Nemáte navigační body nad textem nebo jinými odkazy. Vyhněte se také příliš složitým kontrolám. Ty zabírají spoustu místa, odvracejí uživatele od obsahu a vytvářejí přeplněný vzhled. Máte dotyky, na které mohou uživatelé kliknout, aby projížděli nebo přeskočili na určité obrázky, a mají šípky vpřed a vzad. Nepřehánějte to!
6) Nemíchejte obrázky a videa
Míchání různých médií je obvykle v pořádku, ale míchání videí tam, kde se neočekává, může způsobit problémy. Nechcete, aby uživatel náhodně inicioval video, které přehrává zvuk pro všechny. Samostatné videa a obrázky, takže vědí, co očekávat. Nikdo nemá rád takové typy překvapení.
7) Ujistěte se, že obrazy nemají měřítko nad jejich maximální šířkou
To je důležité, protože se můžete vyhnout tomu, aby se obrazy, které jsou příliš malé pro prostor, vyloučily. Obrázky by měly být dostatečně velké, aby naplňovaly 100% mobilního zařízení (většina případů), ale weby s rozměry na ploše by měly nastavit pouze maximální šířku na 100%. Viděl jsem některé případy, kdy někdo má jednu z těch velkých 27 "displejů, a když přetáhnou šířku prohlížeče, obraz se s ním měří, přes svou zamýšlenou velikost.
8) Změna velikosti obrazu
Pokud máte měřítko obrázků, ujistěte se, že zmenšují, ne nahoru. Nejlepší je nastavit přesné rozměry pro vaše obrázky. Mnohokrát se pro jednu dimenzi používá procentní podíl, zatímco druhá dimenze je nastavena na automatickou. Chcete-li například snížit velikost obrazu o 50% šířky prohlížeče, nastavte šířku obrázku na 50% a výšku na hodnotu automatického .
9) Vyhněte se použití titulků obrázků
Názvy obrázků nebo jakýkoli jiný doprovodný text mohou způsobit vám a vašim uživatelům nejrůznější problémy. Prvním problémem je, že je těžké přizpůsobit text mobilnímu zařízení. S chytrými telefony máte omezenou plochu, jakou je, ale snažení o přidání textu může způsobit, že se celá záležitost cítí přeplněná a zaplněná. Dalším problémem je, že jste omezeni množstvím textu, který můžete použít. Přidáním nadpisu nebo jakéhokoli dalšího textu se do mixu přidává proměnná citlivého textu. Musíte zvážit slovní přestávky a jak více řádků textu skončí s vaším obrazem. Pokud je text používán jako překryv, musíte se také zajímat, kde přesahuje obraz. Světlem textu přes světlou oblast obrázku bude text nečitelný. Kontrast je klíčový a každý obrázek je jiný.
Závěr
Spodní čára, pokud jde o jakýkoli aspekt návrhu webových stránek, je, že musí fungovat dobře a mít na paměti uživatele. Pokud nikdo nemůže používat váš web, nevrátí se. Po těchto jednoduchých zákonech a nedorozuměních citlivých obrázkových galerií to udělá, takže uživatelé nebudou při prohlížení obrázků běžné problémy.