A szemantikus elrendezés alapjai a html5-ben
Hello mindenkinek! Így kezdődött a régóta várt Olimpia. Nagyon nagy sikereket és jó szerencsét kívánok minden résztvevőnek, és természetesen nagyon beteg vagyok Oroszországért, mert Én magam orosz vagyok. És most a böjt témájára. Ebben a cikkben beszéljünk a HTML5 modern elrendezéséről, annak előnyeiről és fontosságáról általában. Még mindig nem tudtam átállni a html5-re, azt gondoltam, hogy csak egyáltalán új, nem minden böngésző támogatja, különösen az IE 7-8-at. De nem így volt.
Tehát nézzük meg a html5 jelölést lépésekben, és kezdjük a dokumentum kezdetétől - Doctype. A Doctype a html5-ben sokkal egyszerűbb, így könnyedén megjegyezhető.
A kódolási jelölést a következőképpen írják le
Érzi a különbséget? A kód sokkal könnyebbé vált, és nagyon könnyen megjegyezhető. Szintén, amikor szkripteket és stílusokat csatlakoztat, akkor nem kell megadnia a típust.
Ezután meghatározzuk a nyelvet:
Ez a szkript letölthető a Google szerverről is.
Ezután felsoroljuk a fő szerkezeti elemeket:
Olvassa el: Font-Face: nem szabványos betűkészletek csatlakoztatása
Meg kell jegyezni, hogy az html5 új elemei inline jellegűek, azaz a helyes megjelenítéshez blokkolja őket.
A fentiek alapján rajzolhat egy kis oldal elrendezést a html5-ben
Ahogy láthatja, a html5-nek külön előnye van a html4-en szemben, mind a jelölés, mind a vezérigazgató szempontjából. Beszéljünk a vezérigazgatóról.
A fő címkék mellett a következő címkéket is gyakran használják:
helyőrző (placeholder = "Szöveg") - felirat jelenik meg a beviteli mezőben, és gépeléskor automatikusan eltűnik. Ez az attribútum megjelenik a html5-ben, most már nincs szükség további szkriptek megjelenítésére a mezőben, például a keresési mezőben.
- fontos szó vagy kifejezés kiválasztása. Figyeld meg a sárga háttérszínt.
- egy hangfelvételt jelenít meg a webhelyen egy standard böngésző lejátszóval
HTML5 és SEO
A HTML5 egyik legfontosabb jellemzője, és véleményem szerint a legfontosabb az, hogy az összes blokk kereső robotja szignifikánsan elkülöníti őket, azaz a weboldalak szegmentálása. A html4-ben lehetetlen ezt megcsinálni, mert A szabványos div tag nem ad semantikus jelentést az elemnek, amely e címke belsejében található. Új elemek használatával fejléc, cikk, félre, lábléc minden megváltozik. Ie Nagyjából elmondják, hogy "megmondják" a keresőrobotoknak azokat az elemeket, amelyek fontosságot tulajdonítanak, és melyeket hagynak ki. Például egy keresőmező könnyen meg tudja érteni a címkék közötti információt szerzői jogi és hasonló információ a látogató számára.
Olvassa el: Firebug - nélkülözhetetlen eszköz minden webfejlesztő számára
A keresőmotorok indexelését befolyásoló elemek
A cikkcímke az egyik legfontosabb a webhelyoldalak szegmentálásakor. Ez a címke kifejezetten jelzi azokat a keresőmotorokat, amelyeken a webhely fő tartalma található. És mindannyian tudjuk, hogy a tartalom elsősorban a látogatók számára érkezik. Itt feltételezzük, hogy a PS maximális figyelmet fordít a címkék tartalmára
A szakaszelem a jelöléseket különböző szakaszokra osztja fel. Mit nyújt? A keresőrobotok jól tájékozott egy jól megtervezett weboldalon. Ha helyesen használja a címkét
A fejléc tag segítségével a keresőrobotok könnyedén megtalálhatják az oldal logóját, webhelynevét, szlogenjét, fő navigációt (főmenü).
Ez a címke meghatározza a navigációs struktúrát a webhelyen.
A HTML5 HTML5-vel ellentétben a linkek több értelmes attribútummal rendelkeznek.
Itt találhatók a HTML5 hivatkozások főbb attribútumai:
külső linkek, amelyek a külső forrásokra utalnak
segítség - linkek az oldalak segítségére
A többi attribútum megtekinthető itt.
Itt van egy kis áttekintés a HTML5 jelölésről. Ami engem illet, már régóta kapcsolódtam a HTML5 jelölés használatához, és a sablonok legtöbbje már lefordítva a HTML5-be, így a kezek nem érik el ezt a blogot.
Ez minden. Mindez most. A következő hozzászólásokban látlak.
Már bekapcsolta a HTML5-öt?
Zaur Magomedov
Rám lehet:
Rendelés elrendezése Rendelje meg a webhelyet kulcsrakész alapon