May mga libu-libo ng mga blog at mga Tutorials mga website ay makukuha sa internet ngunit hindi ang lahat ng impormasyon ay kapaki-pakinabang o ng magandang kalidad. Sa Artikulo Kami ay magpapakita sa iyo ng 5 mga paraan upang panatilihin ang iyong code sa browser, at gumagamit ng search engine friendly. Panatilihin ang sundin ito ilang hakbang, at ako siguradong sigurado na ay tumutulong sa iyo para sa iyong susunod na website ng proyekto. Enjoy ito!

1. Sumulat ng malinis na code

Sumulat malinis na code ay madaling maintainable at mas mababa ng isang sakit para sa iyo at sa iba.

Bad Code

  > <div id = "Wrapper">
 > <div id = "MainContainer">
 > </div> <div id = "Header"> </ div>
 > </div> <div id = "Content"> </ div>
 </ div>
 </ div> 

Good Code

  <! - / Balot \ ->
 > <div id = "Wrapper">

 <! - / MAIN lalagyan \ ->
 > <div id = "MainContainer">

 <! - / Header \ ->
 > </div> <div id = "Header"> </ div>
 <! - \ Header CLOSE / ->

 <! - / NILALAMAN \ ->
 > </div> <div id = "Content"> </ div>
 <! - \ NILALAMAN CLOSE / ->
 
 </ div>
 <! - \ MAIN lalagyan CLOSE / ->

 </ div>
 <! - \ Balot CLOSE / -> 

2. Gamitin ang tamang DOCTYPE

Kung hindi mo gamitin ang DOCTYPE (uri ng dokumento na deklarasyon) tag, ang iyong mga pahina sa Web ay hindi ipinapakita sa mga pamantayan ng sang-ayon paraan at maaaring magresulta sa ilang mga kakaibang mga pahina ng Web.

3. Gamitin Heading Tags at Unordered mga listahan

Gamitin Heading Tags at Unordered listahan at pagkatapos ay sa halip spacer graphics at nakapugad na mga talahanayan ..

Bad Code

Good Code

  <div>
 <h2> Heading </ h2>
 <ul>
 <li> Nilalaman xyz </ li>
 <li> Nilalaman xyz </ li>
 <li> Nilalaman xyz </ li>
 <li> Nilalaman xyz </ li>
 </ ul>
 </ div> 

4. Gamitin semantically makabuluhan klase & ID ng mga pangalan

Hangga't maaari, gamitin ang class at ID ng mga pangalan na semantically makabuluhan at sa paghahanap-friendly. Halimbawa:

Bad Code

 > <li> Error 1 </li> <li> Error 2 </li> </ul> <ul klase = "blue"> <li> Error 1 </ li> <li> Error 2 </ li> </ ul> 

Good Code

  > <ul klase = "Error">
 <li> Error 1 </ li>
 <li> Error 2 </ li>
 </ ul> 

5. Double magpalutang Iwasan ang IE's-margin, Gamitin Display: inline para sa mga sangkap ng floated

Iwasan ang double magpalutang ng IE's margin-text at mag-urong bugs pamamagitan ng paggamit ng display: inline para sa floated mga sangkap.

Bad Code

  # nilalaman (
 ; magpalutang: kaliwa;
 ; width: 300px;
 ; padding: 4px 7px;
 ; margin-left: 20px;
 ) 

Good Code

  # nilalaman (
 ; magpalutang: kaliwa;
 ; width: 300px;
 ; padding: 4px 7px;
 ; margin-left: 20px;
 ; display: inline;
 ) 

Paghihinuha

Ang mga ito ay lamang ang ilan sa mga tips na makakatulong sa akin na sumulat ng mas mahusay na code. Umaasa ako na ang tutorial ay maaari ring makatulong sa iyo na sumulat ng mas mahusay at malinis ang code. Mag-apply ang mga Tips sa iyong kasalukuyan at susunod na proyekto, at ikaw ay tiyak na pahalagahan ang mga pagsisikap.

Kung Isipin mo na ang tutorial ay maaaring maging mas mahusay, Paki-share sa amin. Comment sa amin

kung nais mong makatanggap ng mas maraming Tips mula sa amin, mangyaring isaalang-alang-subscribe sa aming mga feed sa pamamagitan ng RSS o sa pamamagitan ng email.