8 legjobb gyakorlat a tiszta HTML kód írásához

Nézted már valaha a HTML-t, és kíváncsi vagy ...

Jó kódot írok?

Elég profinak tűnik? Jól vagyok? Így néz ki tiszta HTML kód?

E kérdések kérdése normális és jó, különösen, ha nem akarod rendetlen, zavart, hanyag, spagetti kódot írni, amely így néz ki:

A tiszta kód írása az egyik legnagyobb gond, mivel a legtöbb weboldal HTML formátumban jelenik meg. Nem akarod elrontani a webhely alapjait. Csak rossz és zavarba ejtő.

Itt talál 8 nagyszerű gyakorlatot, amelyekkel elfelejtheti ezeket a kétségeket, és tiszta, helyes HTML-t írhat, amely mindenki számára lenyűgöző lesz, aki elolvassa.

1. Adjon meg egy f ** k értéket

Komolyan. A legfontosabb dolog, amire jó kódot kell írni, az a vágy, hogy a dolgokat helyesen tegyék meg. A tiszta HTML-kód írása egyszerű, ám odafigyeléssel és nagy figyelmet kell fordítania.

„A tiszta kód olyan kód, amelyet valaki törődik.” - Michael Feathers

Kódja tükrözi a fejlesztő fajtáját. Meg tudja mondani, ha valaki szenvedélyesen kódol, vagy ha nem ad f ** k értéket, csak olvassa el HTML kódjának néhány sorát. Nem véletlen, hogy a lusta szakszerűtlen emberek írják rossz és nem szervezett kódot.

2. francia bekezdés

A behúzott kód könnyebben olvasható, könnyebben érthető, könnyebben módosítható és könnyebben karbantartható. Vessen egy pillantást arra, hogy milyen nehéz megérteni az elemek közötti szülő-gyermek kapcsolatot, ha a kód nem helyesen van behúzva:

Rossz HTML kód:
  
 
 

& copy; 2018 Minden jog fenntartva.

     
Jobb HTML kód:
  
    
      
        

& copy; 2018 Minden jog fenntartva.

             

Hány teret kell használni a behúzáshoz? Sokan azt mondják, hogy 4 szóköz, mások azt mondják, hogy 2, és szinte mindenki utálja a füleket.

A tanácsom? Ne gondold át, nem igazán fontos egy adott helyértéket használni. Ami igazán számít:

3. Csak légy következetes

A tiszta HTML-kód írása nem mindig jelenti a bevált gyakorlatok megválasztását és a rossz gyakorlatok elkerülését. Sokszor különböző megközelítéseket használhat ugyanazon kódsor írására.

Például:

  • Használhat kötőjelet vagy aláhúzást az azonosítókhoz és az osztályokhoz
  • Használhat egyszeri vagy dupla idézet argumentumot
  • Behúzhat 2 vagy 4 szóközzel

Csak légy következetes. Ha talál egy meghatározott gyakorlatot, amely tetszik, tartsa be és mindenhol használja. Az inkonzisztencia rendkívül zavaróvá teszi a kódot önnek és a szegény léleknek, akinek el kell olvasnia.

4. A „Divitis” megsemmisítése

A „Divitis” egy vicces név a HTML egyik leggyakoribb problémájára. Gyakran túlhasználatunk a divs-et, főleg azért, mert minden elemet át akarunk csomagolni és megcélozzuk a stílusokat a CSS-ben. Aztán végül egy örökkévaló listája van a teljesen felesleges div-okról:

Rossz HTML kód:
  
Headline
  
Felirat
  
Tartalom közzététele
  
    
          
  • 1. elem
  •       
  • 2. elem
  •        
Jobb HTML kód:
  

Headline   

Alcím   

Tartalom közzététele

  
        
  • 1. elem
  •     
  • 2. elem
  •   

Csakúgy, ahogy az írók az írási folyamat során sokszor szerkesztik a vázlatot, folyamatosan újra kell csinálniuk vagy át kell írni a HTML-t. Csökkentse a div-ek számát, és tisztítsa meg a kódot, törölve minden felesleges elemet.

5. Kerülje a megjegyzéseket

A HTML nem programozási nyelv, a hozzászólásokra nincs szükség, mivel a HTML jelölése nagyon magától értetődő. Ha úgy találja, hogy sokat kommentálja a HTML-kódot, akkor nézd át a HTML-elemek hivatkozását.

„Ne kommentálja a rossz kódot. Írja át. ”- Brian W. Kernighan

Kódját nem lesz könnyebb megérteni, csak azért, mert mindenhol hozzászólásokat ad. Használhatja őket, hogy egy kicsit világosabbá tegye a dolgokat (például, ha azt szeretné, hogy sok kódsor után bezárja a div-et). De ne kommentáljon nyilvánvaló dolgokat vagy rosszul írt kódot.

6. Osztály = „tiszta név”

Mit jelent az osztály = „wpr”?

Szélesség bekezdés? WordPress? Hatalmas?! A tiszta HTML-kód nem úgy néz ki, mint egy trivia játék.

Használjon értelmes neveket az azonosítóihoz és osztályaihoz. Rövidnek, leírónak és csak egy fogalmat kell képviselniük. Ez megtisztítja HTML-kódját és megkönnyíti a stílus kialakítását.

Nem gondolja, hogy jobb lenne, ha osztályát „burkolóra” nevezné, a „wpr” helyett?

7. Használja a szóközt

Sokan összetört kódot írnak anélkül, hogy szóközöket használnának. Az eredmény? Olyan, mintha egy könyvet olvasunk írásjelek és bekezdések nélkül:

Pokol:

Táblázat

1. adat 2. adat
Calcutta Orange
Jobb kód:

táblázat


  
    
    
  
  
    
1. adat 2. adat
Calcutta      Orange   

Használjon szóközt: behúzás, üres sorok, sorszakadások. Más embereknek (köztük te is) a jövőben képesnek kell lennie a kód elolvasására fejfájás nélkül. Rendben, ha a fájlokat apróbbá teszi, hogy azok kisebbek legyenek, miután tiszta, olvasható HTML kódot írtál.

8. Másolás a legjobbból

A világ legjobb művészei megtanultak kézművesüket az általuk csodált emberek munkájának megismételésével. Ugyanezt a stratégiát használhatja a tiszta HTML kód írására (ami szintén nagyon kreatív folyamat). A legegyszerűbb módja annak, hogy megtanulják, hogyan kell szép tiszta kódot írni: olvassa el a gyönyörű tiszta kódot, majd replikálja azt.

Azok, akik semmit sem akarnak utánozni, semmit sem hoznak. "- Salvador Dali

Tudsz:

  • Fedezze fel a nyílt forráskódú projekteket. Az egyik oka annak, hogy léteznek, tehát mindannyian megtanulhatjuk és javulhatunk egymás munkája szempontjából.
  • Olvassa el a legjobb kódolási gyakorlatokat tanító blogokat és cikkeket.
  • Vegyen részt az Udemy fejlesztői tanfolyamokon. Válassza ki azokat, amelyek lenyűgöző véleményekkel rendelkeznek.

Megállapíthatja, hogy nincs végleges módon a dolgok elvégzése ... de felfedezheti azt is, hogy Hatalmas különbség van a tiszta és a rendetlen HTML kód között.

És nem akarja, hogy a kódja teljes rendetlenségnek tűnik, igaz? ;)

*** tetszett ez? Kérem, adjon nekem néhány tapsot, hogy mások is felfedezzék ezt a cikket ***