Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

În articolul precedent de la poziția HTML pentru manechine (care spune în esență povestea a ceea ce este html limba, tag-uri și W3C validator), am ajuns pe faptul că orice document pe internet trebuie să aibă o anumită structură.







Directiva Doctype pentru Html, Xhtml și CTML 5

În cazul în care tipul de document nu este specificat în directivă, în conformitate cu normele general acceptate ale browser-ului este de natură să afișeze în continuare corect documentele, dar nu și faptul că aceeași voință, și alte browsere populare mii de cititori. Prin urmare, Doctype trebuie să fie prezent în codul sursă al paginii și trebuie să fie compilat corect.

Dar să ne oprim puțin mai mult în detaliu. Acum suntem martori la un fel de dualism sau două tipuri de documente în rețea - așa cum am făcut-o înainte de a fi selectat CSS din sânul limbii CTML și de modul în care acestea fac acum în conformitate cu standardele moderne acceptate.

Poate să arate diferit (citiți mai jos), dar cel mai simplu mod de a utiliza această opțiune (puțin mai târziu în text vă voi explica de ce):

Astfel, browserul va înțelege prin ce standarde este să analizeze codul documentului. Dacă această declarație are loc, browserul trece în modul standard (standarts). Dacă browserul nu o găsește chiar la începutul documentului (sau nu corespunde ortografiei corecte), browserul va include un mod complicat de trucuri (modul quirks).

Documentul în acest caz va fi afișat în așa fel, ca și cum acest browser este foarte vechi (vechi). Dacă adăugați o declarație în același document, browserul va analiza codul, ținând cont de toate standardele disponibile pentru ziua curentă.

În IE (aici puteți descărca cea mai recentă versiune de Explorer sau regret) istoria este mult mai lung, motiv pentru care toate browserele în modul modul quirks (trucuri, adică, în cazul în care declarația nu a fost precizat) va afișa pagina de web în același mod în care ar face veche versiune IE 5.5 (este considerată de bază).

Cu mai multe detalii și cu un exemplu concret, puteți afla despre motivul pentru care Doctype trebuie prescris la începutul oricărui document web, puteți utiliza proprietățile înălțime, lățime și depășire ale acestui articol. De fapt, este instructiv.

Deși, dacă vă creați proiectul pe baza unui motor sau cu alte cuvinte CMS. atunci pentru corectitudinea formării acestei declarații va corespunde motorului pe care îl utilizați, dar cunoașteți scopul Doctype și opțiunile de scriere sunt încă inutile, după părerea mea, nu vor.

Acest caz poate arăta, de exemplu, astfel:

Dacă ați citit articolul meu anterior, probabil că ați dat seama că această directivă în acest caz îi spune browserului că codul acestui document va trebui să fie dezasamblat, pe baza standardelor limbii HTML 4.01. Pentru a găsi versiunea de care aveți nevoie, vă puteți referi la validatorul W3C descris în articolul precedent. Dar pentru a găsi ceva acolo, trebuie să știți exact unde se află, altfel.

Site-ul W3C nu are o interfață prietenoasă și navigare intuitivă. Acolo puteți găsi cu ușurință o versiune a directivei cu o referință relativă la pagina care descrie standardul de care aveți nevoie de XTML sau XHTML și inserând o astfel de opțiune pe site-ul dvs., nu veți obține nimic bun:

În general, există doar câteva opțiuni pentru DOCTYPE pentru Html și câteva altele pentru XHTML. Puteți vedea toate aceste opțiuni pe pagina corespunzătoare a validatorului W3C.

Să începem cu standardul limbajului de markup hipertext 4.01 (încă se dezvoltă CTML 5). În acest caz, există trei variante Doctype: stricte, tranzitorii și cu suport cadru:

Comentariile direcțiilor și doctype în cod html, precum și conceptul de bloc și elemente rând

Cel mai adesea folosiți a doua opțiune (Transitional), tk. el permite mai multor libertăți în scris codul documentului, bine, iar varianta cu cadre este greu de folos pentru dvs., din cauza irelevanței utilizării lor până în prezent.

De fapt, există aceleași trei variante ale Doctype pentru XHTML - stricte, transitive și cu suport cadru:

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

Dar să vedem unde provin aceste opțiuni din scrierea corectă a declarației. Rețineți că în primul articol am considerat un tabel de etichete HTML valide:

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând






Și o tabelă separată a posibilelor atribute Html:

Comentariile direcțiilor și doctype în cod html, precum și conceptul de bloc și elemente rând

Unele elemente și atribute care sunt marcate în coloana "DTD" cu litera "F" (de exemplu, FRAME, FRAMESET) vor fi incluse în declarația Doctype pentru structurile de cadre. Se bazează pe o bază tranzitorie, la care se adaugă etichete și atribute pentru a crea cadre. despre care puteți citi pe linkul de mai sus.

Și acum să încercăm să ne dăm seama care sunt părțile din declarația Doctype.

Mai întâi vine numele "Doctype". Aici, cred, totul este clar. Apoi apare "Html" - elementul rădăcină al acestei limbi de marcare. Apoi, există o indicație - o declarație publică sau o declarație de sistem. Toate variantele Doctype sunt publice, care este marcat cu cuvântul "PUBLIC".

Apoi, există două identificatoare de documente. Primul se numește identificator public ("- // W3C // DTD HTML 4.01 // EN"). Minus înseamnă că această declarație nu este înregistrată în standardul ISO. Apoi urmează numele consorțiului, numele și limba în care este scris. Al doilea identificator specifică calea către fișierul versiunii stricte.

Acum, lasă-mă să-ți spun adevărul despre Doctype. Navigatorii au nevoie doar de ortografie corectă, dar nu vor merge niciodată la site-ul consorțiului pentru a descărca fișierul specificat în acesta.

Prin urmare, pentru a nu filozofa în mod creativ, în Html 5, scrierea lui Doctype va arăta astfel:

Și asta e tot. Stânga numai "Html". Și în ciuda faptului că HTML5 nu este încă implementat complet, această opțiune este susținută de toate browserele moderne și o puteți folosi în siguranță. Oh, cum, și tu spui.

În domeniul de document al documentului Web (între etichetele Head), trebuie înregistrat titlul documentului (pagină web) inclus în elementele Titlu (a se vedea figura).

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

Pentru a supraestima importanța informațiilor conținute este foarte dificilă (nu exagerez). Când selectați cuvintele cheie în Yandex Wordstat (utilizând statisticile interogărilor de căutare Yandex pentru acest lucru), după compilarea kernelului semantic, va trebui neapărat să menționați cuvintele cheie selectate în titlul titlului.

Despre cât de importante sunt cuvintele deținute în titlu pentru viitoarea promovare reușită a proiectului, puteți învăța din articolul Cum să dezvăluiți site-ul în sine. dar despre cum să scrieți cuvintele de care aveți nevoie în Titlul pentru Joomla și WordPress, veți învăța din articolul Autopromovarea, optimizarea și promovarea site-ului.

Conținutul Titlul meta tag-ul va fi afișată în partea de sus a ferestrei browser-ului utilizatorului și în SERP Yandex Google și, prin urmare, în plus față de conținutul în cuvinte cheie, aceasta ar trebui să încurajeze utilizatorii să meargă exact la site-ul dvs. din SERPs. Pentru fiecare pagină a resurselor dvs., titlul titlului trebuie să fie unic, altfel va exista o deteriorare a clasamentului proiectului dvs.

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

Comentariile direcțiilor și doctype în cod html, precum și conceptul de bloc și elemente rând

Comentariile directivelor și doctype în cod html, precum și conceptul de bloc și elemente rând

Noțiunea de bloc și elemente de linie (etichete) în Html

Toate etichetele pot fi utilizate în cadrul organismului elemente (care este afișat pe o pagină web și o listă cu care pot fi găsite în validatorul W3C), pot fi împărțite în două grupe: litere mici și tag-uri bloc.

Elementele de bloc sunt folosite pentru a construi structura unui document Web, iar elementele cu litere mici sunt folosite pentru a proiecta bucăți de text (șiruri de caractere). Și, întotdeauna trebuie să urmați o regulă neclintită - nu introduceți etichete de blocare inline.

Reprezentanții cei mai străluciți și cei mai reprezentativi ai etichetelor mici și bloc sunt, respectiv, Div (elementul bloc - de aici numele layout-ului blocului) și Span (cu litere mici). Aceste etichete pentru limbajul de marcare hipertext sunt asociate, adică au o etichetă de deschidere și de închidere.

În general, etichetele Div și Span nu au absolut nici un scop și nici o semnificație în Html pur, fără a utiliza foi de stil cascadă CSS. Acestea sunt containere care vă permit să modificați proprietățile elementelor închise în CSS.

Dacă montați-l în codul sursă al paginii de mai multe consecutiv Div, ai ceva pe pagina de web a fiecăreia dintre ele, cel mai probabil, va încerca să ocupe tot spațiul disponibil în lățime, și, prin urmare, există astfel de containere vor fi sub reciproc. Containerele Div în condiții normale unul lîngă celălalt nu vor sta, dacă nu sunt forțate să-i forțeze să facă acest lucru.

De exemplu, codul Html de aici va fi afișat în trei blocuri situate unul sub altul:

În browser-ul Firefox, împreună cu pluginul Firebug foarte util, încă mai folosesc plugin-ul Web Developer. care ajută foarte mult la aspect. Printre altele, el poate arăta elemente de bloc, înfățișându-le cu un cadru. Este acest dezvoltator de plugin-uri care a creat cadre albastre în jurul containerelor Div în captura de ecran.

Tag-urile pot încheia, de asemenea piese Span de text (linie) cod HTML pentru a conferi anumite proprietăți prin CSS și, astfel de elemente pot fi aranjate într-un rând adiacent unul de altul. De exemplu, un astfel de cod în browser va arăta astfel:

Conținutul Span aici a fost evidențiat și cu ajutorul dezvoltatorului Web plug-in. pentru că elementele Span sunt mici, nu trebuie să includeți etichete bloc în interiorul lor, de exemplu, toate aceleași containere Div.

Mult noroc pentru tine! Ne vedem în curând pe paginile blogului KtoNaNovenkogo.ru

Dmitry, există dorințe: dacă puteți mai multe exemple, exemplele necesare, introduceți poziția unui începător. Dvs. ați scris că este mai greu să găsiți răspunsuri la întrebări simple.

1. Cum să desenați textul din stânga;

Dacă puteți, luminați în viitor și în mod special aceste întrebări.

Mulțumesc, de mult timp a fost de gând să înțeleagă cum să lucreze cu Html. dar a fost înfricoșător. Sunteți foarte accesibile toate descrie, sa dovedit că groază, dar nu groază, groază! Mulțumesc, continuați lecțiile pe această temă, voi aștepta următoarele.







Trimiteți-le prietenilor: