De la traducător
Cu plăcere, am făcut cunoștință cu aceste recomandări și acum vă ofer o traducere.
Acest ghid descrie regulile pentru formatarea și formatarea codului HTML și CSS. Scopul său este de a îmbunătăți calitatea codului și de a facilita colaborarea și sprijinirea infrastructurii.
Aceasta se aplică versiunilor de lucru ale fișierelor care utilizează cod HTML. CSS și GSS
Este permisă utilizarea oricăror instrumente pentru minimizarea compilării sau obfuscarea codului, cu condiția păstrării calității generale a codului.
Reguli generale de înregistrare
Nu specificați protocolul când resursele sunt incluse pe pagină.
Absența protocolului face ca relația de referință, care împiedică amestecarea resurselor din diferite protocoale și micșorează ușor dimensiunea fișierelor.
Nu se recomandă:
recomandat:
Nu se recomandă:
recomandat:
Formatare generală
Utilizați întotdeauna două spații pentru indentare.
Nu utilizați file și nu amestecați filele cu spații.
Scrieți întotdeauna în litere mici.
Toate codul trebuie să fie scrise în litere mici: Aceasta se referă la numele elementului, nume de atribute, valori de atribute (cu excepția text / CDATA), selectoare, proprietățile și valorile lor (cu excepția textului).
Spații de la capătul liniei
Scoateți spațiile de la capătul liniei.
Spațiile de la sfârșitul liniilor sunt opționale și complică utilizarea diff.
Nu se recomandă:
recomandat:
Reguli comune de meta
Utilizați UTF-8 (fără BOM).
Specificați codificarea în șabloane și documente HTML utilizând . Reduceți codificarea pentru fișierele css: pentru acestea UTF-8 este setat implicit.
(Puteți afla mai multe despre codificările și cum să le folosească, urmați acest link: seturi de caractere și codificări în XHTML, HTML CSS (în engleză) ..)
Dacă este posibil, explicați-vă codul acolo unde este necesar.
Marcați sarcinile pentru lista de sarcini cu TODO.
Marcați sarcinile utilizând cuvântul cheie TODO. Nu utilizați alte formate comune, cum ar fi @@.
Descrieți sarcina după colon, de exemplu: TODO: Task.
Regulile de proiectare HTML
Tipul de document
HTML5 (sintaxa HTML) este recomandat pentru toate documentele html: .
(Se recomandă utilizarea unui conținut HTML de tip text / html. Nu utilizați XHTML, ca application / xhtml + xml (ing.). Mai rău decât un browser acceptat și limitează posibilitatea de optimizare.)
Valabilitatea codului HTML
Dacă este posibil, utilizați HTML valid.
Utilizați un cod HTML valid, cu excepția cazului în care utilizarea nu vă permite să ajungeți la dimensiunea fișierului necesară pentru nivelul de performanță dorit.
Utilizați instrumente precum validatorul HTML W3C pentru a verifica validitatea codului.
Valabilitatea este o calitate importantă și măsurabilă a codului. Scrierea de cod HTML valid contribuie la studiul cerințelor și constrângerilor tehnice și asigură utilizarea corectă a codului HTML.
Nu se recomandă:
recomandat:
Utilizați HTML așa cum a fost intenționat.
Utilizați elementele (uneori incorect numite "etichete") pentru scopul dorit: anteturi pentru titluri, p pentru paragrafe și pentru link-uri etc.
Acest lucru facilitează citirea, editarea și menținerea codului.
Nu se recomandă:
recomandat:
Alternativa pentru multimedia
Specificați întotdeauna conținut alternativ pentru multimedia.
(Dacă alt este redundant pentru o imagine sau este utilizat doar în scopuri decorative în locuri unde CSS nu poate fi utilizat, utilizați text alternativ gol alt = "")
Nu se recomandă:
recomandat:
Diviziunea de responsabilitate
Structura, designul și comportamentul separat.
Păstrați separat structura (marcajul), designul (stilurile) și comportamentul (scripturile) și încercați să minimalizați interacțiunea dintre ele.
Asigurați-vă că documentele și șabloanele conțin numai cod HTML, iar HTML-ul servește numai pentru a specifica structura documentului. Tot codul responsabil pentru proiectare, transfer la fișiere de stil și codul responsabil pentru comportament - în scripturi.
Încercați să reduceți intersecțiile acestora la minimum, inclusiv în șabloane numărul minim de fișiere de stiluri și scripturi.
Separarea structurii de prezentare și comportament ajută la facilitarea suportului de cod. Modificarea șabloanelor și a documentelor HTML durează întotdeauna mai mult decât modificarea stilurilor sau a scripturilor.
Nu se recomandă:
recomandat:
Referințe mnemonice
Nu utilizați referințe mnemonice.
Singura excepție de la această regulă este caracterul serviciului HTML (de exemplu, <и & ) а так же вспомогательные и “невидимые” символы (например неразрывный пробел).
Nu se recomandă:
recomandat:
Taguri opționale
Nu utilizați etichete opționale. (Nu este necesar)
Pentru a reduce mărimea fișierelor și pentru o mai bună citire a codului, puteți omite etichetele opționale. Specificația HTML5 conține o listă de etichete opționale.
(Poate dura ceva timp pentru această abordare a început să fie utilizat pe scară largă, deoarece este foarte diferit de ceea ce este de obicei predat dezvoltatorilor web. Din punct de vedere al coerenței, și simplitate a codului este cel mai bine să omită toate etichetele opționale, mai degrabă decât o parte din le).
Nu se recomandă:
recomandat:
Tipul atributului "
Nu specificați atributul type când conectați stiluri și scripturi la un document.
Nu se recomandă:
recomandat:
Nu se recomandă:
recomandat:
Regulile de formatare HTML
formatarea
Selectați un rând nou pentru fiecare bloc, tabel sau element de listă și indentați fiecare element copil.
Indiferent de stilurile atribuite elementului (CSS vă permite să modificați comportamentul unui element utilizând proprietatea de afișare), mutați fiecare bloc sau element de tabelă într-o linie nouă.
De asemenea, setați liniuțele pentru toate elementele imbricate într-un element bloc sau tabel.
(Dacă aveți dificultăți din cauza spațiul liber dintre elementele de listă sunt permise pentru a pune toate elementele Li într-o singură linie. Lințu [utilitate pentru a verifica calitatea codului aprox. Trans.] Este recomandată în acest caz, să emită un avertisment în locul unei erori.
recomandat:
recomandat:
recomandat:
Reguli de proiectare CSS
Valabilitatea CSS
Folosiți CSS valid, dacă este posibil.
În plus față de cazurile în care aveți nevoie de un cod dependent de browser sau validator de erori, utilizați un cod CSS valid.
Utilizați instrumente precum validatorul CSS W3C (engleză) pentru a vă testa codul.
Valabilitatea este o calitate importantă și măsurabilă a codului. Scrierea unui CSS valabil ajută la scăderea codului redundant și asigură utilizarea corectă a foilor de stil ...
Identificatori și nume de clase
Utilizați șabloane sau nume de clasă și identificatori semnificativi.
În loc să utilizați cifre sau să descrieți aspectul unui element, încercați să exprimați semnificația creării sale într-un nume de clasă sau un identificator sau să îi dați un nume generic ...
se recomandă alegerea unor nume care să reflecte esența clasei, deoarece acestea sunt mai ușor de înțeles și, cel mai probabil, nu vor mai fi necesare schimbări în viitor.
Numele de șabloane sunt doar o variantă a numelui pentru elementele care nu au un scop special sau care nu diferă de frații și surorile lor. De obicei, ele sunt necesare ca "asistenți".
Folosirea numelor funcționale sau a modelelor reduce necesitatea unor modificări inutile în document sau șabloane.
Nu se recomandă:
recomandat:
Denumiri de identificatori și clase
Pentru identificatori și clase, utilizați nume de câte ori este necesar, dar cât mai scurte posibil.
Încercați să formulați exact ceea ce ar trebui să faceți acest element, fiind cât de scurte posibil.
Această utilizare a claselor și a identificatorilor contribuie la facilitarea înțelegerii și creșterea eficienței codului.
Nu se recomandă:
recomandat:
Selectori de taste
Evitați utilizarea numelor de clasă sau a identificatorilor cu selectori ai tipului de element (etichetă).
Cu excepția cazului în care acest lucru este necesar (de exemplu, cu clasele de ajutor), nu utilizați nume de elemente cu nume de clasă sau identificatori.
Nu se recomandă:
recomandat:
Formă scurtă pentru scrierea proprietăților
Folosiți forme de înregistrare, acolo unde este posibil, în forme abreviate.
CSS oferă numeroase forme de scriere abreviate (englezești) (de exemplu, fonturi), care se recomandă să fie utilizate ori de câte ori este posibil, chiar dacă este specificată doar una dintre valori.
Utilizarea unei înregistrări a proprietății prescurtată este utilă pentru o mai mare eficiență și o mai bună înțelegere a codului.
Nu se recomandă:
recomandat:
0 și unitățile de măsură
Nu specificați unități pentru valori zero
Nu specificați unități pentru valorile zero dacă nu există motive pentru aceasta.
0 în întreaga fracțiune
Nu puneți "0" în întregul număr fracționat.
Nu puneți 0 în întregime în valorile cuprinse între -1 și 1.
Nu utilizați ghilimele ("". ") Cu url ().
Nume hexazecimale pentru culori
Folosiți o notație hexazecimală cu trei caractere, dacă este posibil.
Notația hexazecimală cu trei caractere pentru culori este mai scurtă și necesită mai puțin spațiu.
Nu se recomandă:
recomandat:
Selectorii precedenți cu prefixe unice pentru aplicația curentă. (Nu este necesar)
În proiecte mari, precum și codul care urmează să fie utilizate pentru alte proiecte sau de alte site-uri folosesc prefixe (ca namespace) pentru ID-uri și nume de clasă. Utilizați nume scurte unice urmate de o cratimă.
Folosirea spațiilor de nume ajută la prevenirea conflictelor de nume și poate facilita întreținerea site-ului. De exemplu, când căutați și înlocuiți.
Separatoare în clase și identificatori
Separă cuvintele în identificatori și numele claselor folosind o cratimă.
Nu utilizați nimic altceva decât o cratimă pentru a conecta cuvinte și abrevieri în selectori pentru a îmbunătăți lizibilitatea și ușurința în înțelegerea codului.
Nu se recomandă:
recomandat:
Evitați utilizarea informațiilor despre versiunea browserelor sau "hack-urile" CSS - încercați mai întâi alte moduri.
Se pare tentant să se facă față diferențelor dintre diferitele browsere folosind filtre CSS, hack-uri sau alte soluții. Toate aceste abordări pot fi considerate ultima soluție doar dacă doriți să obțineți o bază de cod eficientă și ușor de întreținut. Pur și simplu, admiterea de hack-uri și definiții ale browserului va afecta proiectul pe termen lung, deoarece acest lucru înseamnă că proiectul urmează calea cea mai mică rezistență. Acest lucru facilitează utilizarea hack-urilor și le permite să fie utilizate din ce în ce mai des, ceea ce va duce la o utilizare prea frecventă a acestora.
Reguli de formatare CSS
Atunci când sortarea ignora prefixe browser. Mai mult decât atât, în cazul în care se folosește prefixe mai multe proprietăți de browser, acestea vor fi sortate (de exemplu, -moz trebuie să fie înainte de --webkit)
Rânduri în blocuri.
Întotdeauna indentați conținutul blocurilor.
Nu se recomandă:
recomandat:
După numele proprietăților
Nu se recomandă:
recomandat:
Nu se recomandă:
recomandat:
Separarea regulilor
Separați regulile prin mutarea unei linii.
Puneți întotdeauna o linie între reguli.
Reguli Meta pentru CSS
Regulile de grupare
concluzie
Ideea acestui ghid este de a crea un vocabular comun, care ar permite dezvoltatorilor să se concentreze pe ceea ce doresc să-și exprime, mai degrabă decât cum.
Noi oferim un design unitar reguli permit să scrie cod în același stil, dar stilul de cod care este deja utilizat în cadrul proiectului este de asemenea important.
În cazul în care codul va fi foarte diferit de prezent, se poate aduce în jos cititorului cu ritmul și face dificil de citit. Încercați să evitați acest lucru.
Notă din partea traducătorului
Aș dori, de asemenea, să rețineți că Google este axat în principal pe marile proiecte foarte încărcate, în cazul în care fiecare octet de drum, deci ar trebui să țină cont de faptul că în cazul în care recomanda incepand fiecare selector cu o nouă linie, sau de a folosi spații în loc de tab-uri, aceasta înseamnă în primul rând că codul Se va minifitsirovan în mod necesar și comprimat pentru a utiliza pe site-ul.
Vă mulțumesc tuturor celor care au citit acest loc.
Articole similare
Trimiteți-le prietenilor: