Hai milleiros de blogs e sitios tutoriais están dispoñibles en internet, pero non a totalidade da información é útil ou de boa calidade. Neste artigo imos amosar 5 formas de manter o seu navegador de código de usuario e motor de procura agradable. Manteña seguir este pasos, e eu sempre seguro que vai axuda-lo para o seu próximo proxecto do sitio web. Disfrútao!

1. Escribir código limpo

Escribir código limpo será de fácil mantemento e menos dunha dor para vostede e outros.

Bad Code

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

Código de Boas

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

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

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

 <! - CONTIDO / \ ->
 > </div> id <div "Content" => </ div>
 <! - Pechar o contido \ / ->
 
 </ Div>
 <! - \ MAIN Container CLOSE / ->

 </ Div>
 <! - \ EMBALAGENS CLOSE / -> 

2. Usa DOCTYPE correcto

Se non usar o DOCTYPE (tipo de documento declaración) tag nas súas páxinas web non serán mostrados en forma compatible coas normas e pode producir algunhas páxinas web raro.

3. Use etiquetas do título e ordenada listas

Use marcas de título e lista ordenada de gráficos en vez de información e táboas aniñados ..

Bad Code

Código de Boas

 Content xyz </li> <li> Content xyz </li> <li> Content xyz </li> <li> Content xyz </li> </ul> </div> <div> <h2> Denominación </ h2> <ul> XYZ Contido <li> </ li> <li> XYZ contido </ li> <li> XYZ contido </ li> <li> XYZ contido </ li> </ ul> </ div> 

4. Utiliza a clase semántica significativos nomes & ID

Sempre que sexa posible uso de clases e nomes de identificación que son semántica significativos e busca-friendly. Por exemplo:

Bad Code

 > <li> Error 1 </li> <li> Error 2 </li> </ul> clase <ul "blue" => <li> Erro 1 </ li> <li> Erro 2 </ li> </ ul> 

Código de Boas

  > clase <ul "Error" =>
 <li> Erro 1 </ li>
 <li> Erro 2 </ li>
 </ Ul> 

5. Float double Evite IE-margin, Use display: inline para elementos flotantes

Evite float double IE marxe de erros e hifen texto usando display: inline para elementos flotantes.

Bad Code

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

Código de Boas

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

Conclusión

Estas son só algunhas das suxestións que me axudan a escribir mellor código. Espero que o tutorial tamén pode axudar a escribir mellor e máis limpo o código. Aplicar estas suxestións para os seus proxectos actuais e no seguinte, e certamente pode apreciar os esforzos.

Se pensas que titorial pode ser máis mellor, por compartir connosco. Comentario nós

Se desexa recibir máis consellos de nós, por favor considera subscribir o noso feed de RSS ou por e-mail.

Arquivo en: Css, tutoriais, desenvolvemento Web por admin