As fontes nos elementos HTML

As propriedades para as fontes, definem as características (os valores na regra CSS) das letras que constituem os textos dentro dos elementos HTML.

As propriedades básicas para fontes e que abordaremos neste tutorial são as listadas abaixo:

color:...................cor da fonte

font-family:..........tipo de fonte

font-size:.............tamanho de fonte

font-style:............estilo de fonte

font-variant:.........fontes maiúsculas de menor altura

font-weight:.........quanto mais escura a fonte é (negrito)

font:....................maneira abreviada para todas as propriedades

Valores válidos para as propriedades da fonte

color:

código hexadecimal: #FFFFFF código rgb: rgb(255,235,0) nome da cor: red, blue, green...etc

font-family:

nome da família de fontes : define-se pelo nome da fonte, p. ex:"verdana", "helvetica", "arial", etc. nome da família genérica: define-se pelo nome genérico, p. ex:"serif", "sans-serif", "cursive", etc.

font-size:

xx-small x-small small medium large x-large xx-large smaller larger length: uma medida reconhecida pelas CSS (px, pt, em, cm, ...) %

font-style:

normal: fonte normal na vertical italic: fonte inclinada oblique:fonte obliqua

font-variant:

normal: fonte normal small-caps: transforma em maiúsculas de menor altura

font-weight:

normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900

Vamos a seguir analisar cada uma delas detalhadamente através de exemplos práticos.

Como estudar e entender os exemplos

Para cada propriedade apresento as regras CSS para um ou mais elementos HTML e definidas dentro de uma folha de estilos incorporada, bem como um trecho do documento HTML onde se aplicam as regras.

A seguir mostro o efeito que a regra produz. Observe a regra e o efeito e para melhor fixar seu aprendizado reproduza o código no seu editor, mude os valores e veja o resultado no browser. Esta é a melhor e mais rápida maneira de você aprender CSS. Bons estudos! E faça ótimo proveito dos tutoriais. Fonte: www.maujor.com

33 DICAS SOBRE WEBDESIGN E USABILIDADE QUE IRÃO ALAVANCAR SUAS CONVERSÕES

Usabilidade e Conversão andam lado a lado. Entretanto, poucos sites dão a devida atenção a experiência do usuário como forma de conseguir alavancar suas conversões.

Veja todos os detalhes sobre Usabilidade e Conversão no infográfico logo abaixo. Eu irei compartilhar 33 dicas sobre design e usabilidade que irão transformar simples pesquisadores em compradores.

Veja algumas estatísticas abaixo sobre Usabilidade: 
 40% das pessoas abandonarão uma página da web se ela demorar mais que três segundos para carregar; 46% dos usuários móveis relataram ter dificuldade de interagir com uma página web, e 44% reclamaram que a navegação era difícil;
Apenas 55% das empresas estão atualmente realizando algum teste online de experiência do usuário.

Pensando na importância do assunto, o Viver de Blog produziu um rico infográfico com absolutamente tudo sobre Usabilidade e Conversão.


» Clique Aqui para baixar uma versão em Alta Resolução desse infográfico «

Tabela de acentuação HTML

Copie e cole:

Á .............. Á á ............... á Â ................. Â â ................ â À ............... À à ............... à Å ................. Å å ................ å Ã ................ Ã ã ............... ã Ä .................. Ä ä ................. ä Æ ................. Æ æ .................. æ É ................ É é ............... é Ê ................. Ê ê ................ ê È ................ È è ............... è Ë .................. Ë ë ................. ë Ð ................... Ð ð .................. ð

Í ................ Í í ............... í Î ................. Î î ................ î Ì ................ Ì ì ............... ì Ï .................. Ï ï ................. ï Ó ........... Ó ó .............. ó Ô ................ Ô ô ................. ô Ò .............. Ò ò ............... ò Ø ................ Ø ø ............... ø Õ ................ Õ õ ............... õ Ö .................. Ö ö ................. ö

Ú .............. &Uacute; ú ............... &uacute; Û ................ &Ucirc; û ................ &ucirc; Ù ............. &Ugrave; ù .............. &ugrave; Ü ................. &Uuml; ü ................. &uuml; Ç ............... &Ccedil; ç ............... &ccedil; Ñ ............... &Ntilde; ñ ............... &ntilde; < ................. &lt; > ................. &gt; & ................ &amp; " ................. &quot; ® .................. &reg; © ............... &copy; Ý ............ &Yacute; ý ............ &yacute; Þ .............. &THORN; þ ................ &thorn; ß ................ &szlig;