Ajuste fino no fazendoacontecer.net

FazendoAcontecer.net.

Produtividade pessoal com GTD? É no FazendoAcontecer.net.

Como mudar sua vida de forma inteligente? É no FazendoAcontecer.net.

Dicas e truques de internet e computação? É no FazendoAcontecer.net.

Lifehacking? É no FazendoAcontecer.net.
Assine nosso feed RSS.

lapiscor-copy1Esta noite gastei mais algumas horas no desenvolvimento do fazendoacontecer.net. A grande maioria delas em detalhes do layout e fontes, ajuste das cores e na barra lateral. Porém, também precisei otimizar o suporte ao Internet Explorer, principalmente a versão 6.

Eu já tinha decidido parar as atividades de layout e desenvolvimento do site e me concentrar no conteúdo. Mas ontem tomei um susto ao ver o site pela primeira vez no IE6 – como faço tudo em um Macbook Pro, só tinha testado Firefox e Safari. Vi que as imagens, todas em formato PNG com transparência 24-bit, apareciam com um fundo cinza e fora do posicionamento correto, o que acabava estragando todo o layout, inclusive dos textos.

Após buscar ajuda na internet, descobri que o IE6 não suporta transparência 24-bit em imagens PNG. Consegui uma dica através do fórum do webdeveloper.com. A solução sugerida é a inclusão de uma linha de código dentro da tag <head>, chamando um javascript que simula a transparência no IE6. O resultado não é perfeito, a barra de menu e a lateral continuam desorganizadas, mas há uma melhora significativa.

É possível resolver por completo esses problemas com um CSS específico para IE6, mas, após ver a estatística de uso de navegadores de março/09 mostrando que o IE6 só está sendo usado em 18% dos computadores no mundo, achei que não valia a pena o sacrifício. Até porque acredito que, em um blog de computação, este número deve ser ainda menor.

contorno-fa

As outras mudanças, e que tomaram bem mais tempo, foram:

  • inclusão de feeds de artigos e comentários na barra lateral;
  • alteração da fonte padrão para Lucida Grande;
  • ajuste no tamanho da fonte e altura da linha;
  • alteração das cores de links para uniformizar a apresentação;
  • alteração dos ícones de WordPress, RSS e voltar ao topo do rodapé;
  • inclusão de ícones e links de validação XHTML 1.0 e CSS 2.1 no rodapé;
  • inclusão de imagem da Creative Commons by-nc-sa no rodapé;
  • inclusão do mapa do brasil no rodapé.

contorno-ac

Vale a pena apontar alguns sites que me ajudaram, principalmente em relação a ícones e cores:

  • Icons Etc – vários ícones grátis para web, cores e modelos diferentes, inclusive glassy;
  • Wikimedia Commons – desenhos, ícones, fotos, organizados por várias categorias;
  • Easy Calculation – Site de conversão e cálculos genéricos. Tem um excelente conversor RGB – HEX (web).

O tema usado base para este blog foi o Jules Joffrin. Já havia feito alterações consideráveis antes do lançamento, no dia 6 de abril, com a inclusão do logotipo, nome, posicionamento de elementos, dimensões e mudança do layout líquido, do tema original, para estático – esta última mudança, por sinal, bem trabalhosa. Com este ajuste fino, posso dizer que se tornou um tema praticamente novo.

contorno-nt

Acredito que o resultado é um site claro, uniforme, com ótima legibilidade e validado para XHTML 1.0 Transitional e CSS 2.1. Na minha opinião, um lugar bonito e agradável.

Share/Save

O que achou do artigo? Comente.


O que você achou deste artigo? Comente.

http://fazendoacontecer.net / Ajuste fino no fazendoacontecer.net