Megkérdezted magadtól: „Mi az a rugalmas web design?” Az érzékeny web design olyan megközelítés, amelyben a tervező egy olyan weboldalt hoz létre, amely „válaszol” vagy átméretezi magát az eszköz típusától függően. Ez lehet egy túlméretezett asztali számítógép-monitor, laptop vagy kis képernyőkkel rendelkező eszközök, például okostelefonok és táblagépek.
Az érzékeny webes tervezés alapvető eszköze lett mindenkinek, aki digitális jelenlétben van. Az okostelefonok, táblagépek és más mobil számítástechnikai eszközök növekedésével a weblapok megtekintéséhez több ember használ kisebb képernyőket.
$config[code] not foundEzeknek a weboldalaknak is figyelembe kell venniük a Google által 2018 áprilisában bejelentett első mobilindexet. Mivel egyre több kisvállalkozás növeli mobil jelenlétét, honlapjuk, e-kereskedelem, Google üzleti oldal, szociális média oldalak és egyéb eszközök könnyen hozzáférhetőek lehetnek minden eszközöket.
Mi az az érzékeny webes tervezés?
Az érzékeny tervezés célja, hogy egy webhely legyen, de különböző elemekkel, amelyek különbözőképpen reagálnak különböző méretű eszközökre nézve.
Vegyünk egy hagyományos „fix” weboldalt. Például asztali számítógépen megtekintve a webhely három oszlopot jeleníthet meg. Ha ugyanazon elrendezést egy kisebb táblagépen látja, akkor arra kényszerítheti Önt, hogy vízszintesen görgetjen, amit a felhasználók nem szeretnek. Lehet, hogy az elemek elrejtve láthatók vagy torzítottak. A hatást is bonyolítja az a tény, hogy sok tablettát álló tájolású vagy oldalnézetben lehet megtekinteni tájképként.
Egy apró okostelefon képernyőn a webhelyek még nagyobb kihívást jelenthetnek. A nagy képek „megszakíthatják” az elrendezést. A webhelyek lassan betölthetők az okostelefonokra, ha grafika nehéz.
Ha azonban egy webhely érzékeny tervezést alkalmaz, a tablet verzió automatikusan beállíthatja, hogy csak két oszlopot jelenítsen meg. Így a tartalom olvasható és könnyen navigálható. Egy okostelefonon a tartalom egyetlen oszlopként jelenik meg, talán függőlegesen egymásra rakva. Vagy esetleg a felhasználónak képesnek kell lennie arra, hogy áthúzza a többi oszlopot. A képek az elrendezés eltorzítása helyett átméretezni fognak vagy levágásra kerülnek.
A lényeg az, hogy a webhely automatikusan reagál a tervezett eszköz alapján, amelyet a néző lát.
Hogyan működik a Responsive Web Design?
Az érzékeny helyek folyékony rácsokat használnak.Az összes oldalelemet arány szerint, nem pedig pixelek méretezik. Tehát, ha három oszlopa van, akkor nem mondaná pontosan, hogy milyen széles legyen, hanem hogy milyen szélesnek kell lennie a többi oszlophoz képest. Az 1. oszlopnak az oldal felét kell felvennie, a 2. oszlopban 30% -ot, a 3. oszlopban pedig 20% -ot kell felvenni.
A média, például a képek is viszonylag átméretezettek. Így a kép az oszlopban vagy a relatív designelemben maradhat.
Kapcsolódó problémák
Mouse v. Touch: A mobileszközök tervezése is felveti az egér és a érintés problémáját. Asztali számítógépeken a felhasználó általában egérrel navigálhat és kijelölhet elemeket. Egy okostelefonon vagy táblagépen a felhasználó többnyire ujjait használja, és megérinti a képernyőt. Az egérrel könnyen kiválaszthatónak tűnhet, hogy nehezen választható ki egy képernyőn egy apró ponton egy ujjal. A webtervezőnek figyelembe kell vennie a „touch” -ot.
Grafika és letöltési sebesség: Továbbá a grafika, a hirdetések és a letöltési sebesség kérdése is felmerül. Mobileszközökön talán bölcsebb, ha kevesebb grafikát jelenít meg, mint az asztali nézeteknél, így a webhely nem marad örökre, hogy betöltsön egy okostelefonra. Nagyobb hirdetésméreteket kell cserélni kisebb hirdetésekre.
Alkalmazások és „mobilverziók”: Előfordulhat, hogy gondoltál egy alkalmazás létrehozására a webhelyedre - mondj egy iPad alkalmazást vagy egy Android alkalmazást. Vagy egy kifejezetten a BlackBerry számára készült mobil verziója lenne.
De ma sok különböző eszközzel egyre nehezebb az alkalmazások és a különböző verziók létrehozása minden eszköz és operációs platform számára.
Miért kell a kisvállalkozásoknak átállniuk az érzékeny webdesignra
Több ember használ mobileszközöket. Egy újabb Pew-tanulmány az amerikaiak 77% -át mostanában 2018-ban birtokolja, ami a Pew Research Center 2011-ben végzett első okostelefon-tulajdonjogának 35% -át teszi ki.
Ellenőrizze a forgalmat, és lehet, hogy megdöbbent, hogy hány látogató érkezik a webhelyére mobileszközökön keresztül. (A Google Analytics-ben válassza ki a bal oldalon a „Közönség” lehetőséget, majd a „Mobil” elemet, hogy megnézze, hogy a forgalom milyen arányban van a mobileszközökről.
Az érzékeny design sablonok mindenhol vásárolhatók. Ha például van egy WordPress webhelye, látogasson el egy jó hírű sablongalériaba, mint például a ThemeForest, és keresse meg az „érzékeny WordPress témákat”. A webfejlesztő ezután testreszabhatja a logót és a márkát.
A szerkesztő megjegyzése: itt a Small Business Trends-en egy új, érzékeny tervezésen dolgozunk. Nem kellene?
Fénykép a Shutterstock-on keresztül
További információ: Tartalommarketing, Mit jelent 95 Megjegyzés ▼
