O desenvolvimento web vem evoluindo muito e a vida de nós, desenvolvedores web, está cada vez mais fácil. Hoje já é possível incluir efeitos como cantos arredondados, imagens translúcidas, text-shadow, tipografia e animações que funcionem em todos — ou quase todos — os browsers e sistemas operacionais.

Firebug em qualquer Browser

• Criado por: Mike Ratcliffe
• Licença: BSD-Style
• Uso: O poder da interface do firebug em todos os browsers.
• Tamanho: 76.9kb (comprimido)
• Compatibilidade: Todos os não-firefox browsers.
• Ver Demo
• Download

O Firebug é sem nenhuma dúvida um dos melhores adventos da web moderna. Uso sempre que trabalhando na web. Ele tornou o desenvolvimento mais simples quando nos proporciona uma interface integrada ao browser que permite visualisar o código desenvolvido, ver em tempo real alterações no DOM, analisar código javascript, etc…

Antes exclusivo para o Firefox, agora é privilégio de todos — inclusive do Internet Explorer. É aqui que o Firebug Lite entra. Uma pequena biblioteca de javascript que recria quase todas as features da interface do Firebug, trazendo o melhor debugger para todas as plataformas. Fixar layouts e bugs ficou ainda mais fácil.

Um dos pontos fortes do Firebug Lite é que não é necessário nenhum download ou instalação para começar a usá-lo. Quando quiser debugar a página em que está trabalhando em um browser diferente do Firefox, você pode apenas incluir um script cujo “src” aponta para a versão online:

<script type="text/javascript" src="http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js"></script>

Pronto, o Firebug Lite está presente na página. Para uso offline basta fazer download do script. A screenshot a seguir mostra o Firebug Lite em ação no Safari:

Use qualquer Fonte, use Cufon

• Criado por: Simon Kinnunen
• Licença: MIT
• Uso: Permite a incorporação de fontes não padrões sem uso de flash ou imagens
• Tamanho: 17.8kb (comprimido)
• Compatibilidade: Todos (todas as versões comuns de todos os fornecedores, incluindo o IE6)
• Ver Demo
• Download

A tipografia sempre foi um terreno acidentado na web. Somos obrigados a nos restringir a um pequeno número de fontes e famílias de fontes que são amplamente suportadas pela maioria dos browsers e sistemas operacionais. O uso de imagens e flash prometia acabar com esse problema, mas é extremamente contra-indicado e inflexível.

O Cufon oferece aos desenvolvedores web uma solução robusta e rápida, que são mostradas nos browsers sem qualquer uso de plugins — apenas usando seus próprios recursos. As fontes Cufon podem ser usadas como VML para implementações nativas em browsers no IE ou através do elemento <canvas> para os browsers mais evoluidos. O maravilhosos é que também podemos definir diferentes estilos no texto substituido, como cor e tamanho, usando CSS puro.

Modo de Uso

Essa biblioteca precisa apenas de uma pequena preparação antes do uso, diferentemente das demais; um novo arquivo de fontes precisa ser gerado, e isso pode ser facilmente feito usando o site do Cufon. Ele irá gerar um arquivo de fonte SVG e salvá-lo em um arquivo JS. Esse arquivo precisa ser incluído em outro <script> após o Cufon:

<script type="text/javascript" src="cufon.js"></script>
<script type="text/javascript" src="Myriad_Pro_400.font.js"></script>

Sendo necessário dizer ao Cufon apenas quais elementos substituir:

<script type="text/javascript">
  Cufon.replace('.substituiFonte');
</script>

Essa API oferece soluções pro uso de vários fontes na mesma página e para se melhorar a performance no IE. Qualquer tipo de fonte pode ser usado, mas lembre-se de que a fonte que deseja usar precisa ser licenciada para tal. Segue uma headline usando Cufon:

The End

Cada uma dessas biliotecas JavaScript cuida de uma deficiência específica. Elas têm potencial para tornar o desenvolvimento web ainda mais prazeroso e divertido, além de serem extramamente fáceis de usar e pequenas. Fica a dica.