Bármely webhelytulajdonos egy egyedi formatervezésről álmodik. Mindenki tudja, hogy valaki ruhákkal találkozik. Ugyanez vonatkozik a webhelyre, mivel a látogató először felhívja a figyelmet a projekt tervezésére, majd a tartalomra. Ha a terv túl világos vagy fordítva tompa, a felhasználó hamarosan elhagyja az erőforrást. Ne töltse túl a weboldalt felesleges elemekkel, mivel a minimalista kialakítású webes erőforrások gyakran sokkal érdekesebbek. Hogyan lehet weblaptervet készíteni??
Valójában a teljes tervezési folyamat három szakaszra osztható: vázlat létrehozása, elrendezés létrehozása egy grafikus szerkesztőben, elrendezés. A tervrajz vázlatát egyszerű fotószerkesztőben vagy rendes ceruzával rajzolhatja egy darab papírra. Ami az elrendezést illeti, többnyire a tervezők a Photoshop-ot használják a meglévők leghatékonyabb grafikus szerkesztőjeként. Az elrendezéshez ismeri a hipertext jelölő nyelvét és a CSS-t. Mielőtt létrehozná a saját tervét, tegyen fel néhány egyszerű kérdést: ismerem a HTML-t és a CSS-t, és tudok-e dolgozni egy grafikus szerkesztővel is?
Ha nemleges választ ad, akkor a formatervezési folyamat nem haladja meg az első lépést. Könnyű rajzolni a vázlatot, de nem minden felhasználó készíthet elrendezést és kész képet. Ennek eredményeként javasoljuk, hogy kezdje el a HTML | CSS alapjainak megtanulásával, valamint nézzen meg néhány képzési videót a Photoshopról, hogy megismerje az egyes eszközök elhelyezkedését, a szűrők alkalmazását és még sok minden mást..
Mielőtt elkezdené a vázlatot, készítsen fejében képet a jövőbeli tervezésről. Felhívjuk figyelmét, hogy minden formatervezés a következő részekből áll:
- A weboldal "fejléce" minden formatervezés felső része, amely rendszerint magában foglalja a logót, a webhely nevét és néhány gombot (névjegyek, a szerzőről). A sapka különböző magasságú lehet, de általában ez a paraméter nem haladja meg a 300 pixelt. A weboldal tetején gyakran vannak keresési űrlapok és reklámbannerek.
- Sidebar - a weboldal oldalmenüje. A másodlagos információkat és a kiegészítő elemeket az oldalsávba helyezik: egy blokk friss cikkekkel, keresési űrlap, különféle szavazások és naptárak, linkek, hirdetések, az erőforrás navigációs elemei. Számos oldalsáv használható a tervezéshez, de vannak olyan oldalak is, amelyek oldalsó oszlopok nélkül vannak.
- A "pince" az oldal alja. Ez általában egy linket tartalmaz a fő forráshoz és a szerzői jogokhoz, "(c) 2014 legjobb webhely" stílusban. De az utóbbi években a "alagsori" rész fogalma megváltozott a mobil eszközök megjelenésével. Az "alagsorban" elemek elkezdenek letelepedni, amelyeket általában oldalsávokba helyeznek.
- A "fő rész" az a blokk, amelybe a fő tartalom kerül. A legtöbb tervező a webhely fő részét a központba helyezi, hogy az anyag kényelmesebb legyen.
Tehát, most már tudja, hogy mi blokkolja a webhelyet. Itt az ideje, hogy elkezdje megoldani azt a kérdést, hogyan lehet saját weboldalt készíteni. Nyissa meg a legegyszerűbb fotószerkesztőt (elegendő a Festék), és hozzon létre egy új sablont 1280 × 1024 felbontással. Érdemes emlékeztetni arra, hogy webhelyek létrehozásakor a metrikus méréseket nem használják. Az összes blokkot pixelben "mérjük".
Például úgy dönt, hogy vázlatot készít egy oldalsávval. Jelölje meg az alagsor, a helyfejlécek és az oldalsáv határait a grafikus szerkesztőben.
Van ötlet, hogy készítsen több oldalsó oszlopot, és helyezze el a tartalmat a közepén? Nagyszerű, de a jelöléskor vegye figyelembe az oldalsávok szélességét és a fő tartalom helyét. Az oldalsó oszlopok nem lehetnek túl szélesek (legfeljebb 300 képpont), és legalább 500 képpontot kell hagyni a fő tartalom alatt, különben a szöveg olvasása kényelmetlen lesz..
Ha a fő címkék egymástól távol vannak, itt az ideje, hogy a tervezési vázlatot kiegészítse elemekkel. Adjon hozzá szerzői jogokat az alagsorban, egy blokkot egy keresési űrlappal, egy címet stb. A tervezési vázlat érdekesebb megjelenést mutat, és nem lesz geometriai alakzatok halmaza..
Ha megtanulta a Photoshopban dolgozni, akkor ideje konvertálni a vázlatot elrendezésbe. De még mielőtt döntsön a weboldal színéről. A híroldalak számára a fehér háttér szín, a fekete szöveg szín és a kék link színe megfelelőbb. Ha a formatervezés női vagy turisztikai témájú webhelyhez készült, akkor használjon világosabb színeket. Ugyanakkor ne készítsen karácsonyfát a tervezésből, mivel a színek bősége zavarja a fő tartalom észlelését.
Töltse ki az elrendezés minden egyes blokkját grafikával. Kísérletezzen a színekkel és a háttérrel, készítse el saját elemeit és gombjait. Az interneten azonban hatalmas számú különböző háttérrel, gombokkal lehet megtervezni.
Amikor az elrendezés végre kész, vágja blokkokra, és készítse el rajta a mintát. Ugyanakkor írja alá az egyes rétegeket, hogy könnyebb legyen ráírni.
A mobil eszközök megjelenésével nőtt a reagáló gumi minták népszerűsége. Minden felhasználó létrehozhat témát a saját webhelyére, de csak egy igazi tervező képes alkalmazkodni minden eszközhöz. A tervezés elején próbálj meg egy egyszerű sablonnal kezdeni.
Ne felejtse el a "nagyszerű formatervezés" három egyszerű szabályát:
- a szövegnek jól olvashatónak kell lennie akkor is, ha a képeket letiltják a böngészőben;
- próbáljon meg ne használni a vyrviglaznye színeket;
- hozzon létre kényelmes navigációt az oldalon.
A terv létrehozása és a webhelyre történő átvitele után minden egyes böngészőben ellenőrizze. Vonzza barátait és ismerőseit a tesztelésre, mert mások kritikája pozitív hatással van az emberre. Ne felejtse el az alapszabályt: a webhelytervezést nem csak Önnek, hanem más felhasználóknak is kedvelnie kell. Ezért mindig hallgassa meg a projekt látogatói véleményét..
