Az asztal alapú elrendezésről a div-new-ra váltunk
A mai hozzászólás témája nagyon fontos mind a hétköznapi webmesterek, mind a webmesterek számára, általános elfogultsággal. Továbbá, mivel az utóbbi időben a helyek elrendezése a számomra a fő tevékenység, akkor ez a legkedveltebb témám.
Erről és beszélgetésről.
Mivel a webhely optimalizálásának kérdései, amikor számomra fejlesztenek, mindig nem állnak az utolsó helyen, fontos folyamat kezdeti lépése az optimális méretű oldalak kódjának létrehozása. vagyis a lehető legkevesebb paramétert használja a címkékhez, a kimenetük pedig külön fájlban (CSS).
Gyakorlat 3-plus éves tapasztalat azt mutatja - ahogy megpróbálják csökkenteni a méretét az oldal a táblázat elrendezés módszer, elvégre a címkék számát használhatják önmagukban egyszerűen nagyszerű, mert meg kell szorozni befektetni egyik asztalról a másikra, hogy elérjék a kívánt eredményt.
Végtére is, a táblázatokat kifejezetten a táblázatos adatok kimenetére kitalálták. nem az oldalelemek jelölésére.
Mi található a táblázatban:
ábrázolható blokk (diva) elrendezés formájában:
és sokkal kisebb a lemezterület.
Az oldal méretének és különösen az egész webhelynek a különbsége nagyon jelentős lesz, és közvetlenül befolyásolja a webes erőforrás letöltésének sebességét, amelyet minden webmester számára meg kell céloznia.
Mint mondják, minden jön a tapasztalat, ezért úgy tűnik, néhány hónappal ezelőtt, amikor úgy döntött, hogy megpróbálja divs, ez a fajta elrendezés okozott nekem nagy érdeklődést, és azóta kedvelt engem.
Itt vannak azok a előnyök, amelyeket a blokk elrendezésekkel kapcsolatban a táblázathoz képest látok:
- Jelentős csökkenés az oldal méretében. Általában 2-3 alkalommal (attól függően, hogy az oldal bonyolultságát szerkezet), ami nagyban csökkenti a töltési időt a honlapon. Ugyanakkor jelentősen növeli a méretét a CSS-fájlt, de annak a ténynek köszönhető, hogy ő volt, amikor a felhasználó cache a böngésző elérésekor a többi oldal már olvasni a számítógépet, ennek következtében a helyszínen van töltve sokkal gyorsabb, mint asztalra.
- A világméretű internetes forgalom csökkentése. Az első tétel következménye.
- Csökkentett szerverterhelés. Ismét az első bekezdés hatása.
- Sokkal kényelmesebb megváltoztatni a webhely oldalainak tervét, CSS-fájlban. Ebben az esetben gyakorlatilag nincs szükség a HTML-kód szerkesztésére.
A helyszín elemeinek manipulálása egyszerű. Bármely SEO szakember megerősíti, hogy minél magasabb az oldal tartalma a HTML-kódban, annál nagyobb az oldal a keresőoptimalizálás szempontjából. A keresőmotorok nagyobb tiszteletet fognak nyújtani egy ilyen oldalnak és gyorsan indexelik.
Az isteni elrendezés lehetőségeinek köszönhetően elérheti, hogy a kód először az oldal fő tartalmára, majd csak a fejlécre, balra és / vagy jobbra oszlopokra kerül. Az oldal megjelenése egyáltalán nem változik. Kétségtelen, hogy az asztalok is elérhetik ezt az eredményt, de a divák sokkal könnyebb végrehajtani.
A divas készítése a CSS technológia ismeretén alapul. Ie Ha jól ismeri a lépcsőzetes stílusú táblákat, akkor bizalommal mondhatom, hogy nagyon könnyű átszervezni egy blokk elrendezésben.
Most közvetlenül a gyakorlatban.
Zavarba hozta a szükség, hogy vizsgálja meg egy kicsit több információt az elrendezés a blokk, az interneten találtam a haszon vagy iránymutatást belül és mesélt a technológia ezt a módszert elrendezés (ha jól értem, a divs elrendezés általában sokkal kisebb, gyakorlati munka, mint a táblázatos elrendezés). Mindazonáltal vannak olyan webes erőforrások, amelyek rendelkeznek a szükséges információkkal. Miután tanulmányozta, el tud képzelni a blokk elrendezését és megpróbálja alkalmazni a tudást a gyakorlatban.
Tehát itt a források fogok adni. Hasznos lehet azoknak a tanulóknak a tanulmányozása, akik a DIV-ekre váltanak, és fejlesztik a CSS-ben meglévő készségeiket.
Íme néhány könyv, amelyet az olvasási oldalak egyikének olvasásához javasoltam. Felirat:
- Jeffrey Zeldman. "Webdesign szabványok szerint." (A modern dizájn általános kérdései, történelmi kitérés)
- Dan Cederholm. "Golyóálló web design" (Tisztán gyakorlat és trükkök)
- Eric Meyer. "CSS-lépcsős stíluslapok. Részletes útmutató. "(Azt mondják, hogy ez csak egy biblia!)
Fontos pont, amellyel találkozni fog az elrendezés elrendezésénél, a különböző böngészőkkel rendelkező oldalak megjelenítése. A táblázatok után sok hiba található a csodálatos elrendezésben, amelyek többségében rendszerint ugyanazok a hackok segítségével kezelhetők minden egyes böngésző számára.
Egy különálló cikket, amelyet rendszeresen frissítek, különböző internetes böngészőkre hackeket gyűjtöttem: az Internet Explorer, az Opera, a FireFox, a Safari és a Google Chrome személyes CSS-hackjeit.
A CSS-elrendezés tapasztalatával a felhasznált hackok mennyisége a lehető legkevesebb lesz. És mindenkor arra törekszenek, hogy egyáltalán nélkülözzék őket, tk. valójában a CSS hacks gonosz.
Azt is szeretném figyelni a következő tulajdonságra, amely a blokk elrendezés minimális oldalszélességének beállításához szükséges. így amikor a böngésző szűkült, az információ nem mozdul el a halomba (ha az oldal szélessége "gumi"):
Ez mind egyelőre.