8 paraugprakse tīra HTML koda rakstīšanai

Vai esat kādreiz apskatījis savu HTML un aizdomājies ...

Vai es rakstu labu kodu?!

Vai tas izskatās pietiekami profesionāli? Vai es daru lietas pareizi? Vai tas izskatās kā tīrs HTML kods?

Uzdot šos jautājumus ir normāli un labi, it īpaši, ja nevēlaties rakstīt netīrs, samulsis, apliets, spageti kods, kas izskatās šādi:

Tīrā koda rakstīšanai vajadzētu būt vienai no jūsu lielākajām bažām, jo ​​vairums tīmekļa lapu tiek parādītas, izmantojot HTML. Jūs nevēlaties izjaukt savas vietnes pamatus. Tas ir vienkārši nepareizi un mulsinoši.

Šeit atradīsit 8 lieliskus paņēmienus, kā aizmirst par šīm šaubām un uzrakstīt tīru un pareizu HTML, kas atstāj iespaidu uz visiem, kas to lasa.

1. Dodiet f ** k

Nopietni. Vissvarīgākais, kas nepieciešams laba koda uzrakstīšanai, ir jūsu vēlme darīt lietas pareizi. Tīrā HTML koda rakstīšana ir vienkārša, taču jums ir jāuzmanās un jāpievērš liela uzmanība.

“Tīrais kods ir kods, kuru raksta kāds, kurš rūpējas” - Maikls Spalvas

Jūsu kods atspoguļo to, kāds esat izstrādātājs. Varat pateikt, vai kāds aizraujas ar kodēšanu vai arī tas nedod f ** k, vienkārši izlasot dažas HTML koda rindiņas. Tā nav nejaušība, ka slinki neprofesionāli cilvēki ir tie, kas raksta sliktu un neorganizētu kodu.

2. Atkāpe

Iekļauts kods ir vieglāk lasāms, vieglāk saprotams, vieglāk modificējams un vieglāk uzturējams. Vienkārši apskatiet, cik grūti ir izprast vecāku un bērnu attiecības starp elementiem, ja kods nav pareizi izkārtots:

Slikts HTML kods:
  
 
    
  
Labāks HTML kods:

  
    
                  
  

Cik vietas vajadzētu izmantot atkāpei? Daudzi cilvēki saka 4 atstarpes, daudzi citi saka 2, un gandrīz visi ienīst cilnes.

Mans padoms? Nepārdomājiet to, nav īsti svarīgi izmantot noteiktu telpas vērtību. Vissvarīgākais ir…

3. Vienkārši esi konsekvents

Tīrā HTML koda rakstīšana ne vienmēr nozīmē labas prakses izvēli un izvairīšanos no sliktas. Daudzas reizes jūs varat izmantot dažādas pieejas, lai rakstītu vienu un to pašu koda rindu.

Piemēram:

  • ID un klasēm varat izmantot domuzīmi vai pasvītrojumu
  • Jūs varat izmantot vienu cenu vai divkāršu cenu
  • Jūs varat atkāpties ar 2 vai 4 atstarpēm

Vienkārši esi konsekvents. Kad atrodat kādu īpašu praksi, pieturieties pie tās un izmantojiet to visur. Neatbilstība padara jūsu kodu ārkārtīgi mulsinošu jums un nabadzīgajai dvēselei, kurai tas ir jāizlasa.

Iznīcināt “Divītu”

“Divitis” ir smieklīgs nosaukums izplatītai HTML problēmai. Mēs bieži pārmērīgi izmantojam divs, galvenokārt tāpēc, ka mēs vēlamies ietīt un mērķēt visus stila elementus CSS. Tad mēs iegūstam mūžīgo pilnīgi nevajadzīgo dalījumu sarakstu:

Slikts HTML kods:
  
Virsraksts
  
Subtitri
  
Izlikt saturu
  
    
          
  • 1. elements
  •       
  • 2. elements
  •     
  
Labāks HTML kods:
  

Virsraksts

  

Apakšvirsraksts

  

Ievietot saturu

  
        
  • 1. elements
  •     
  • 2. elements
  •   

Tāpat kā rakstnieki daudzkārt rediģē savu melnrakstu, jums ir nepārtraukti jāreaģē vai jāpārraksta HTML. Samaziniet dalījumu skaitu un sakopiet kodu, izdzēšot visus nevajadzīgos elementus.

5. Izvairieties no komentāriem

HTML nav programmēšanas valoda, komentāri nav nepieciešami, jo HTML marķējums ir ļoti saprotams. Ja pamanāt, ka daudz komentējat savu HTML, jums vajadzētu pārskatīt HTML elementu atsauci.

“Nekomentējiet slikto kodu. Pārrakstiet to. ”- Braiens V. Kernigāns

Jūsu kods nebūs vieglāk saprotams tikai tāpēc, ka visur pievienojat komentārus. Varat tos izmantot, lai padarītu lietas mazliet skaidrākas (piemēram, lai parādītu, ka aizverat dalījumu pēc daudzām koda rindām). Bet nekomentējiet acīmredzamas lietas vai slikti uzrakstītu kodu.

6. Klase = “skaidrs nosaukums”

Ko nozīmē klase = “wpr”?

Platuma rindkopa? WordPress? Bļāviens?! Tīram HTML kodam nevajadzētu izskatīties kā niekiem.

Izmantojiet nozīmīgus nosaukumus jūsu ID un klasēm. Tiem jābūt īsiem, aprakstošiem un jāatspoguļo tikai viens jēdziens. Tas padarīs jūsu HTML skaidrāku un veidošanas procesu vieglāku.

Vai nedomājat, ka būtu labāk, ja jūs savu klasi nosauktu par “iesaiņojumu”, nevis “wpr”?

7. Izmantojiet atstarpi

Daudzi cilvēki raksta sajauktu kodu, neizmantojot atstarpes. Rezultāts? Tas ir tāpat kā lasīt grāmatu bez pieturzīmēm un rindkopām:

Ellē:

Tabula

Dati 1 Dati 2
CalcuttaOrange
Labāks kods:

tabula


  
     Dati 1 
     Dati 2 
  
  
     Kalkuta 
     Oranžs 
  

Izmantojiet atstarpi: atkāpe, tukšas līnijas, līniju pārtraukumi. Citiem cilvēkiem (ieskaitot jūs) nākotnē vajadzētu spēt lasīt jūsu kodu bez galvassāpēm. Ir pareizi minēt failus, lai tie būtu mazāki PĒC tam, kad esat uzrakstījis tīru, lasāmu HTML kodu.

8. Kopija no labākajiem

Labākie pasaules mākslinieki savu amatu apguva, atkārtojot to cilvēku darbus, kurus viņi apbrīnoja. To pašu stratēģiju var izmantot, lai uzrakstītu tīru HTML kodu (kas arī ir diezgan radošs process). Vienkāršākais veids, kā iemācīties uzrakstīt skaistu tīru kodu, ir vienkāršs: izlasiet skaistu tīru kodu un pēc tam to atkārtojiet.

“Tie, kas nevēlas kaut ko atdarināt, neko neražo. “- Salvadors Dalī

Jūs varat:

  • Izpētiet atvērtā koda projektus. Viens no iemesliem, kāpēc viņi pastāv, ir, tāpēc mēs visi varam mācīties un uzlabot skatoties viens uz otru.
  • Izlasiet emuārus un rakstus, kuros iemācīta labākā kodēšanas prakse.
  • Apmeklējiet Udemy izstrādātāju kursus. Izvēlieties tos, par kuriem ir pārsteidzošas atsauksmes.

Jūs atklāsit, ka nav precīzi pareizais veids, kā rīkoties, taču jūs arī pamanīsit, ka starp tīru un nekārtīgu HTML kodu ir milzīga atšķirība.

Un jūs nevēlaties, lai jūsu kods izskatās kā pilnīgs haoss, vai ne? ;)

*** Vai jums tas patika? Lūdzu, iedodiet man dažus klapsienus, lai citi varētu atklāt šo rakstu ***