Boas práticas de organizar código

[Nuno]

Um código bem escrito faz toda diferença, principalmente para sites que recebem muitas visitas. Supondo que um site receba uma média de 5.000 visitas diários e o teu HTML pesa 30KB, haverá um consumo mensal de 4,5GB. Optimizando esse HTML para 20KB, obtemos uma economia mensal de 1,5GB.

Aplicando boas práticas de codificação tu estarás organizando o código para futuras manutenções e fazendo com que a página carregue mais rapidamente, além de economizares € por conta da diminuição do consumo de trafego.

Exemplo utilizando espaços (184 bytes):

Código: [Seleccione]

<div>
  <h1>Lorem Ipsum</h1>
  <ul>
    <li>Lorem Ipsum</li>
    <li>Lorem Ipsum</li>
    <li>Lorem Ipsum</li>
    <li>Lorem Ipsum</li>
    <li>Lorem Ipsum</li>
  </ul>
</div>
Exemplo utilizando TAB’s (171 bytes):

Código: [Seleccione]

<div>
<h1>Lorem Ipsum</h1>
<ul>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
<li>Lorem Ipsum</li>
</ul>
</div>
O TAB é o melhor método para organizar o código, resultando um arquivo leve e bem organizado estruturalmente e visualmente. Cada TAB e quebra de linha consumirá 1 byte, portanto evita o uso da quebra de linha desnecessariamente para elementos como h1, a, li, strong e afins.

[rvercesi]

Não esquecer que a maioria dos editores  possuem uma funcionalidade de identação automática e alguns deles inclusive "arrumam" código que esteja "desarrumado".

[Nuno]

Pois, o Dreamweaver CS4, acho que já tras melhorias nesse aspecto, mas o CS3 sempre que fazes um enter depois de teres feito um tab ele preenche-te o espaço com espaços em vez de preencher só com um tab...