Er zijn duizenden blogs en websites tutorials zijn beschikbaar op het internet, maar niet alle van de informatie is nuttig of van goede kwaliteit. In dit artikel laten we u 5 manieren om uw code browser, de gebruiker en zoekmachine vriendelijk te houden. Blijf deze volgen enkele stappen, en ik zal zeker zorgen dat u helpt website voor uw volgende project. Enjoy it!

1. Schrijf schone code

Schrijven schone code zal gemakkelijk onderhoudbaar en minder van de pijn voor u en anderen.

Bad Code

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

Goede Code

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

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

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

 <! - / CONTENT \ ->
 > </div> <div id = "Content"> </ div>
 <! - \ CONTENT CLOSE / ->
 
 </ div>
 <! - \ MAIN CONTAINER CLOSE / ->

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

2. Gebruik de juiste DOCTYPE

Als u geen gebruik maken van de DOCTYPE (document type aangifte) tag, uw webpagina's worden niet weergegeven in de normen voldoet manieren en kan resulteren in een vreemde webpagina's.

3. Gebruik Omschrijving Tags en Ongeordende lijsten

Gebruik Omschrijving Tags en Ongeordende lijsten in plaats van spacer graphics en geneste tabellen ..

Bad Code

Goede Code

  <div>
 <h2> Omschrijving </ h2>
 <ul>
 <li> Inhoud xyz </ li>
 <li> Inhoud xyz </ li>
 <li> Inhoud xyz </ li>
 <li> Inhoud xyz </ li>
 </ ul>
 </ div> 

4. Gebruik semantisch betekenisvolle klasse & ID namen

Waar mogelijk, gebruik class en id namen die semantisch zinvol zijn en zoek-vriendelijk. Bijvoorbeeld

Bad Code

 > <li> Error 1 </li> <li> Error 2 </li> </ul> <ul class = "blue"> <li> Error 1 </ li> <li> Fout 2 </ li> </ ul> 

Goede Code

  > <ul class = "Error">
 <li> Error 1 </ li>
 <li> Fout 2 </ li>
 </ ul> 

5. Vermijd IE's double float-marge, Gebruik display: inline voor zwevende elementen

Vermijd dubbele float IE's en tekst-marge streepje bugs met behulp van display: inline voor zwevende elementen.

Bad Code

  # content (
 ; float: left;
 ; width: 300px;
 ; padding: 4px 7px;
 ; margin-left: 20px;
 ) 

Goede Code

  # content (
 ; float: left;
 ; width: 300px;
 ; padding: 4px 7px;
 ; margin-left: 20px;
 ; display: inline;
 ) 

Conclusie

Dit zijn slechts enkele van de tips die mij helpen om betere code te schrijven. Ik hoop dat ook tutorial zal je helpen om beter en schone code schrijven. Pas deze tips om uw huidige en volgende projecten, en u zal zeker waardering voor de inspanningen.

Als u denkt dat tutorial kan meer beter, U kunt met ons deelt. Reactie ons

Als u meer wilt Tips van ons te ontvangen, kunt u overwegen een abonnement op onze feed met RSS of per e-mail.