Zeptali jste se sami sebe: "Co je citlivý webový design?" Odpovědný webdesign je přístup, kdy návrhář vytvoří webovou stránku, která "reaguje na" nebo se změní v závislosti na typu zařízení, které je vidět. Může to být nadměrný počítačový stolní počítač, notebook nebo zařízení s malými obrazovkami, jako jsou smartphony a tablety.
Odpovědný webový design se stal základním nástrojem pro každého, kdo má digitální přítomnost. S růstem smartphonů, tabletů a dalších mobilních počítačových zařízení využívají pro zobrazování webových stránek více lidí menší obrazovky.
$config[code] not foundTyto webové stránky musí také zvážit mobilní první index, který právě společnost Google oznámila v dubnu 2018. Vzhledem k tomu, že více malých podniků zvyšuje jejich mobilní přítomnost, musí být jejich webové stránky, eCommerce, stránky Google Business, stránky sociálních médií a další majetek snadno přístupné ve všech zařízení.
Co je odpovědný webový design?
Účelem reagujícího návrhu je mít jedno místo, ale s různými prvky, které reagují odlišně při pohledu na zařízení různých velikostí.
Vezměme si tradiční "pevné" webové stránky. Při prohlížení na stolním počítači se například na webu mohou zobrazit tři sloupce. Když však uvidíte stejné rozložení na menší tabletě, může vás přinutit k horizontálnímu posouvání, což se uživatelům nelíbí. Nebo prvky mohou být skryté z pohledu nebo zkreslené. Náraz je také komplikován skutečností, že mnoho tabulek může být zobrazeno buď v orientaci na výšku, nebo otočeno stranou pro zobrazení na šířku.
Na malém displeji smartphonu mohou být webové stránky ještě náročnější. Velké obrazy mohou rozložení rozdělit. Stránky mohou být nabité na smartphony pomalu, pokud jsou těžké.
Pokud však web používá citlivý design, může se verze tabletu automaticky přizpůsobit tak, aby zobrazovala pouze dva sloupce. Tím je obsah čitelný a snadno se pohybuje. Na smartphonu se obsah může zobrazit jako jediný sloupec, pravděpodobně skládaný vertikálně. Nebo by mohl mít uživatel možnost přejet přes další sloupce. Snímky se změní místo toho, aby došlo k narušení rozvržení nebo k přerušení.
Otázkou je, že s citlivým designem se webové stránky automaticky přizpůsobí na základě zařízení, které ho prohlížeč prohlíží.
Jak funguje odpovědný webový design?
Odpovědné weby používají tekuté mřížky.Všechny prvky stránky jsou dimenzovány poměrně, nikoliv pixely. Takže pokud máte tři sloupce, neřeknete přesně, jak velký by měl být každý, ale spíše kolik by měly být ve vztahu k ostatním sloupcům. Sloupec 1 by měl zaujímat polovinu stránky, sloupec 2 by měl zaujímat 30% a sloupec 3 by měl mít například 20%.
Média, jako jsou obrázky, jsou rovněž poměrně změněny. Tímto způsobem může obraz zůstat v jeho sloupci nebo v relativním návrhu.
Související problémy
Klepněte na ikonu myši v: Navrhování pro mobilní zařízení také přináší problém myši versus dotyk. V stolních počítačích má uživatel obvykle myš pro navigaci a výběr položek. Na smartphonu nebo tabletu uživatel většinou používá prsty a dotýká se obrazovky. To, co se může zdát snadné vybrat pomocí myši, může být těžké vybrat prstem na malém místě na obrazovce. Webový návrhář musí vzít v úvahu "dotyk".
Grafika a rychlost stahování: Také je tu problém s grafikou, reklamami a rychlostí stahování. V mobilních zařízeních může být moudré zobrazovat méně grafiky než u stolních pohledů, takže stránky nebudou navždy naloženy na smartphone. Pro menší reklamy může být potřeba vyměnit větší velikosti reklam.
Aplikace a "verze pro mobilní zařízení": V minulosti jste možná přemýšleli o vytvoření aplikace pro vaše webové stránky - řekněme aplikaci iPad nebo aplikaci pro Android. Nebo byste měli mobilní verzi speciálně pro BlackBerry.
Ale s tolika různými zařízeními dnes je stále těžší vytvářet aplikace a různé verze pro každé zařízení a operační platformu.
Proč malé firmy potřebují přejít na odpovědný webový design
Více lidí používá mobilní zařízení. Nedávná studie společnosti Pew 77% Američanů dnes vlastní smartphony v roce 2018, což představuje nárůst z pouhých 35% v prvním průzkumu společnosti Pew Research Center, který se uskutečnil v roce 2011.
Zkontrolujte provoz a můžete být jen šokován tím, kolik návštěvníků se dostává na vaše webové stránky prostřednictvím mobilních zařízení. (Ve službě Google Analytics vyberte na levé straně položku "Publikum" a poté "Mobilní", abyste viděli, jaký je objem přenosu z mobilních zařízení. Můžete dokonce provést analýzu a zjistit, která zařízení odesílají návštěvnost.)
Odpovědné šablony návrhu jsou všude k nákupu. Pokud například máte stránky WordPress, můžete navštívit renomovanou galerii šablon, jako je ThemeForest, a hledat "témata reagující na WordPress." Koupit jednu za méně než 50 dolarů. Váš webový vývojář pak může přizpůsobit své logo a značku.
Poznámka redakce: Tady v trendech pro malé firmy pracujeme na novém reagujícím návrhu. Nemůžete?
Fotografie pomocí programu Shutterstock
Více v: Content Marketing, Co je 95 komentářů ▼
