Alexandre Ferreira

Resolvi criar uma nova assinatura de e-mail* para usar com as minhas contas de e-mail.

* Uma assinatura de e-mail possui a mesma função de uma assinatura comum. A diferença está no fato dela ser usada para confirmar a validade (ter um autor explicito) de um e-mail.

Minha assinatura de e-mail estava antiga e em minha opinião já era tempo de atualiza-lá. Mesmo não alterando nenhum dos dados contidos nela decidi dá uma inovada.

Então decidi postar para explicar um pouco sobre a importância da assinatura e algumas dicas de CSS apesar de ser bastante básico o documento HTML, as dicas podem ser úteis.

Para explicar as importâncias de uma assinatura selecionei trás links no Wikipédia:

• Assinatura
• Assinatura Digital
• E-mail

As dicas de CSS são:

1. Sempre envolver uma definição com comentários, veja o exemplo em destaque:

   /* Estilizacao para os marcadores */
   .marcador {
   color: red;
   font-family: Wingdings;
   }
   /* Fim da estilizacao para os marcadores */

2. Colocar os atributos em ordem alfabética é um boa forma de organização:

   /* Estilizacao para os marcadores */
   .link {
   color: blue;
   text-decoration: underline;
   text-underline: single;
   }
   /* Fim da estilizacao para os marcadores */

3. Herança em CSS funciona da seguinte forma: estilizar uma tag - no nosso exemplo a tag span - e definir um classe para essa tag. Exemplo: Todas as tag span tem o estilo definido abaixo.

   /* Estilizacao global para a tag span */
   span {
   color: gray;
   font-family: Tahoma;
   font-size: 7pt
   }
   /* Fim da estilizacao global para a tag span */

   Se definirmos o estilo - a classe .nome - abaixo em uma tag span, ganharemos como herança as formatações definidas acima e adicionaremos as particularidades definidas abaixo. Assim teremos a vantagem de Herança, as mesmas vantagens definidas no paradigma OO.

   /* Estilizacao para o meu nome */
   .nome {
   font-weight: bold;
   }
   /* Fim da estilizacao para o meu nome */

   No nosso exemplo teremos o nome “Alexandre Ferreira” com os estilos definidos na tag span e atribuíndo um estilo negrito que existe somente na classe definida como .nome.
   Exemplo:

   <span class="nome">Alexandre Ferreira</span>

4. Atualizações automáticas (não atende todos os casos): Como podemos ver nas classes .marcador e .marcador2, no código abaixo:

   /* Estilizacao para os marcadores */
   .marcador {
   color: red;
   font-family: Wingdings;
   }
   /* Fim da estilizacao para os marcadores */
   
   /* Estilizacao para os marcadores 2 */
   .marcador2 {
   color: red;
   font-family: Wingdings 2;
   }
   /* Fim da estilizacao para os marcadores 2 */

• Usamos em nossas classes duas fontes diferentes para cada uma dessas classes, são elas as Wingdings e Wingdings 2 essas fontes tem suas letras no formato de imagens. Se você usa um cliente de e-mail ou um navegador não-Microsoft essas fontes serão automaticamente trocadas pela fonte Arial, como podem ver agora no Firefox:

• Mas se você usa Outlook, Internet Explorer, MSN Explorer e qualquer outro produto Microsoft a assinatura deverá aparecer da seguinte forma:

Legal, né?

O código-fonte completo da minha assinatura está na seção downloads.