A lépcsőzetes stíluslapok a weboldalak stílusának és elrendezésének szokásos módszerévé váltak. A tervezők használják stíluslapok megmondani egy böngészőnek, hogyan kell megjeleníteni egy webhelyet a megjelenés és a hangulat szempontjából, beleértve az olyan tényezőket, mint a szín, a térköz, a betűtípusok és még sok más.
A CSS-stílusok kétféleképpen települnek:
- Inline - a weboldal kódolásán belül, egyedileg, elemenként
- Önálló CSS dokumentumban, amelyhez a webhely kapcsolódik
A CSS legjobb gyakorlata
A "bevált gyakorlatok" a weboldalak tervezésének és felépítésének azon módszerei, amelyek a leghatékonyabbnak bizonyultak, és a legtöbb munkával megtérülnek. Követve őket CSS a webdesignban segít a weboldalaknak a lehető legjobban kinézni és működni. Az évek során fejlődtek más webes nyelvekkel és technológiákkal együtt, és az önálló CSS stíluslap vált a preferált felhasználási módszerré.
A CSS bevált módszereinek követése számos módon javíthatja webhelyét:
- Elválasztja a tartalmat a dizájntól: A CSS egyik fő célja, hogy eltávolítsa a tervezési elemeket a HTML-ből, és elhelyezze őket egy másik helyen, amelyet a tervező karbantarthat. Ez a gyakorlat arra is szolgál, hogy a tervezőket elkülönítsék a fejlesztőktől, hogy mindegyik a saját szakterületére koncentrálhasson. A weboldal megjelenésének fenntartásához a tervezőnek nem kell fejlesztőnek lennie.
- Könnyíti a karbantartást: A webdesign egyik leginkább figyelmen kívül hagyott eleme a karbantartás. A nyomtatott anyagokkal ellentétben a weboldal soha nem "egy és kész". A tartalom, a tervezés és a funkció idővel fejlődhet és kell. Ha a CSS központi helyen van, ahelyett, hogy a webhely egészére szórná, sokkal könnyebben fenntarthatja a dolgokat.
- Hozzáférhetővé teszi webhelyét: A CSS stílusok használata megkönnyíti a keresőmotorok és a fogyatékkal élő személyek interakcióját az Ön webhelyével.
- Tartósabban tartja webhelyét: A CSS-sel kapcsolatos bevált gyakorlatok alkalmazásával betartja azokat a szabványokat, amelyek stabilnak bizonyultak, de elég rugalmasak ahhoz, hogy megfeleljenek a webtervezési környezet változásainak.
A belső stílusok nem a legjobb gyakorlatok
Bár a beágyazott stílusok célja van, általában nem a legjobb módja a webhely fenntartásának. Szembeszállnak a legjobb gyakorlatokkal:
- A belső stílusok nem választják el a tartalmat a dizájntól: A beágyazott stílusok pontosan megegyeznek a beágyazott betűtípusokkal és más nehézkes tervezőcímkékkel, amelyek ellen a modern fejlesztők sínen esnek. A stílusok csak azokat a konkrét, egyedi elemeket érintik, amelyekre alkalmazzák őket; bár ez a megközelítés részletesebb irányítást adhat Önnek, a tervezés és fejlesztés egyéb aspektusait - például a következetességet - is megnehezíti.
- A belső stílusok karbantartási fejfájást okoznak: Amikor stíluslapokkal dolgozol, nehéz lehet kitalálni, hogy hol állítanak be egy stílust. Amikor ezek keverékével foglalkozik beágyazott, beágyazott és külső stílusok, sok helyszínt kell ellenőriznie. Ha web-tervező csapatban dolgozik, vagy át kell terveznie vagy karbantartania egy más által épített webhelyet, akkor még nagyobb gondjai lesznek. Miután megtalálta a stílust és megváltoztatta, ezt meg kell tennie minden oldalon minden elemen, ahová elhelyezték. Ez csillagászati szempontból megnöveli az idő- és a munka költségkeretét.
- A belső stílusok nem annyira elérhetőek: Míg egy modern képernyőolvasó vagy más segédeszköz képes kezelni a belső tulajdonságokat és hatékonyan címkézik, egyes régebbi eszközök nem, ami furcsán megjelenített webeket eredményezhet oldalakat. Az extra karakterek és szövegek befolyásolhatják az oldalad nézetét egy keresőmotor robot részéről is, így az oldalad nem megy olyan jól a keresőmotor optimalizálása szempontjából.
- A beágyazott stílusok nagyítják az oldalakat: Ha azt szeretné, hogy webhelye minden bekezdése bizonyos módon jelenjen meg, akkor megteheti egyszer, vagy hat sor kóddal egy külső stíluslapon. Ha azonban belső stílusokkal csinálja, akkor ezeket a stílusokat hozzá kell adnia a webhely minden bekezdéséhez. Ha öt sor CSS van, ez öt sort szorozva a webhely minden bekezdésével. Ez a sávszélesség és a betöltési idő sietve összeadódhat.
A beillesztett stílusok alternatívája a külső stíluslap
Inline stílusok használata helyett használjon külső stíluslapokat. Ezek a CSS bevált gyakorlatok összes előnyét megadják, és egyszerűen használhatók. Ilyen módon a webhelyén használt összes stílus külön dokumentumban él, amelyet aztán egyetlen kódsorral összekapcsolnak egy webdokumentummal. Külső stíluslapok befolyásolják a csatolt dokumentumokat. Ha van 20 oldalas weboldala, ahol minden oldal ugyanazt a stíluslapot használja - ez általában így van kész - megváltoztathatja az adott oldalakat, egyszerűen módosíthatja ezeket a stílusokat egyszerre, egyben hely. A stílusok egy helyen történő megváltoztatása sokkal kényelmesebb, mint a kódolás keresése a webhely minden oldalán. Ez a rugalmasság sokkal könnyebbé teszi a webhely hosszú távú kezelését.