A múlt században a weboldal elrendezése néhány szakember körébe tartozott. A technika fejlődése jelentősen leegyszerűsítette ezt a feladatot. Most minden internet-felhasználó alkothat egy weboldalt.
Szükséges
- - szoftvercsomag a weboldal elrendezéséhez;
- - raszteres grafikus szerkesztő a tervező elemek létrehozásához.
Utasítás
1. lépés
Készítsen listát az elemekről, amelyek jelen lesznek a webhelyen. Ilyenek lehetnek a navigációs menü, a keresési űrlap, a reklám- vagy információs szalag, a barátok listája. A projekt nevét általában az oldal tetején jelölik, lehet, hogy van vízszintes navigációs menü. A központi rész a webhely fő tartalmához van hozzárendelve. Az oldal alján általában a jelenléti pultokat helyezik el, a visszajelzéshez elérhetőségeket.
2. lépés
Hozzon létre egy weboldal elrendezést egy grafikus szerkesztőben. A fő feladat itt az elemek megjelenésének, relatív helyzetének meghatározása. Ne használjon túl élénk színeket. A semleges színpaletta érzékelhető a legjobban. Használjon következetes stílust a blokkokhoz. Próbáld meg a lehető legkönnyebben felhasználóbaráttá tenni. Kerülje azokat az elemeket, amelyeket nehéz megvalósítani a HTML-ben és a CSS-ben.
3. lépés
Mentse az oldal elrendezését bitkép formátumban minőségromlás nélkül. Határozza meg a HTML használatával megjelenítendő stíluselemeket. Ezek lehetnek menük, linkek, táblázatok, keresési űrlapok. Bontsa ki a többi elemet az elrendezésből, és mentse külön fájlba. Hozzon létre két szöveges dokumentumot a merevlemezén. Változtassa egyikük kiterjesztését.htm fájlra. Ez tartalmazza az elemek relatív helyzetéért felelős kódot. A második fájl a stíluslapokat fogja tartalmazni.
4. lépés
Nyissa meg az első fájlt egy HTML-szerkesztőben. Helyezze el az oldaltervezési elemeket, amelyeket korábban bitmap fájlokban mentett el. Hozzon létre szöveges hivatkozásokat, táblázatokat és egyéb elemeket, amelyeket HTML-ben kell megjeleníteni. Az elemek attribútumai, például a szín, a betűméret, a szegélyek jelenléte, írjon CSS fájlba. Ha animálni kell az oldalelemeket, használjon JavaScript-et.
