Fontes estilizadas com CSS | André Buzzo
contato@andrebuzzo.com.br | (11) 9-8551-3500 | facebook | skype:andrebuzzowebdesign

Fontes estilizadas com CSS

Publicado na categoria Vídeo Aulas, Vídeo Aulas - Tableless com 9.098 visualizações e 28 comentários

Fala pessoas! Nessa VA vou mostrar que é possível utilizar qualquer tipo de fonte no site.

Agora, graças ao CSS, não ficamos mais presos unicamente às fontes instaladas na máquina!

O site para converter as fontes é o: http://www.fontsquirrel.com/fontface/generator.

Abraços e até mais!

Voltar à página anterior!

  • Cara parabéns pelo post!

    • Valeu Jefferson!

      Obrigado pela visita e pelo interesse!

      Abraços!

  • Tiago Antunes

    Olá André!
    primeiramente mt bom seus vídeos, parabens pelo trabalho! gostaria de saber se há como colocar duas fontes diferentes estilizadas na página, por exemplo: uma para o titulo outra para o texto.
    obrigado!
    abrc

    • Fala Tiago!

      Resolvemos via facebook né? Mesmo assim, vai que alguém tenha a mesma dúvida: dá para usar mais de uma fonte sim. Dá para usar tantas quantas forem necessárias. O único item a ser levado em conta é que, caso o usuário não tenha a fonte instalada em sua máquina, o mesmo terá que fazer o download da fonte. Dessa maneira, pode-se gerar lentidão na hora de carregar todas as fontes e dessa maneira, até mesmo comprometer a formatação visual do site.

      Recomenda-se no máximo o uso de 3 tipos de fontes diferentes.

      Forte abraço e até mais!

  • Eita!!!
    Meu nome saiu doido!
    Malz….

    • Hahahahahahaha… holoco Fabiano! Quando crescer, que seja bem melhor … se é que sou bom em alguma coisa…hahahahahah

      Abraços meu velho!

  • Meu amigo, parabéns pela VA, sempre aprendo coisas úteis com vc. Show!!
    Agora, quanto ao uso do IE, concordo com vc, esse navegador deveria ser instinto. Eu faço a minha parte com meus cliente, sempre mostro a eles outros navegadores mais rápidos e com ótima funcionalidades como a sincronização do Chrome que vc pode ter seus favoritos onde quiser.
    Desde que conheci a internet, nunca usei ele como padrão. Na época da net discada, eu usava o Netscape, que era mais leve pra carregar e tinha até um design maneiro. Hoje sou fã do Chrome e eventualmente uso o Firefox para alguns sites. IE só para aqueles malditos sites do governo que sempre pedem seu uso.
    Valeu por compartilhar seu conhecimento conosco, sou seu fã, parceiro.
    Quando eu crescer quero ser igual vc! ;)

  • Renilson Silva

    Ótima video aula.
    Obrigado andré por compartilha conosco ..
    queria muito aprender sobre essa técnica graças a você utilizarei na maioria dos meu projeto

    Abração fica com deus :)

    • Ô Renilson!

      Fico feliz em ter ajudado de alguma maneira meu velho!

      Forte abraço!

  • Matheus

    Boa noite Andrê.
    Cara consegui utilizar a técnica porém o meu problema tá sendo com o google chrome. No Internet Explore a fonte funciona perfeitamente, a fonte estilizada seria só para a barra de menus da página, porém no Chrome fica a fonte default.
    Alguma ideia do que pode ser ?
    Abraço.

    • Cara…verifica direitinho quais os tipos de fonte que foram inseridas no css. Veja se não há nenhum erro de digitação lá!

      Abraços!

  • Marcelo Pereira

    Ótimo post!

    Já coloquei as dicas em prática.
    Grande abraço!

    • Obrigado Marcelo!

      Volte sempre que precisar meu velho!

      Abraços!

  • @leonardo386

    d+ parabéns André esse vídeo salva todos” vc é cara

    • Fala Leonardo!!!

      Obrigado meu velho!!

      Abraços!

  • Jacson Leite

    Essa aula é ótima. Não sabia que podia usar essa técnica!
    Abraços.

    • É meu amigo!

      Tem coisas que só a CSS faz por você!! rs

      Abraços e obrigado!!

  • Douglas

    caraca andré mto bom, como todas suas video aulas porém nessa vc arrazou vei mto bom mesmo !!1

    vlw

    • Fala Douglas!!!

      Obrigado meu velho!!

      Abraços!

  • Felipe

    Oww guri, nem esquente, essa troca de informações e insatisfações é de grande proveito para todos.

    Eu sou adepto ao Chrome desde o seu lançamento, hoje não o troco por nada(mas não fico em forum brigado e dizendo: o meu chrome é melhor que o seu Firefox por que ele é mais legal e mais bonito XD).

    Desde que conheci os antigos navegadores alternativos, nunca mais coloquei meu mouse para clicar duas vezes no icone do IE, salvos os casos em que um site não abre corretamente em meu navegador padrão.

    Mesmo não estando a muito tempo nesse ramo, ja tive por deveras vezes problemas com o IE, não entendo ainda com tem gente que usa esse navegador, até por sinal, esses dias eu postei um comentário no site baixaki.com.br, criticando a noticia onde a mesma dizia que finalmente a microsoft ouviu seus usuários ” Uhum Claudia, senta lá”.

    Em relação ao internet explorer 9, junte o Chrome com o Firefox deixe ele um pouco pior e você vai ter o internet explorer 9. Inclusive esse tutorial que mencionei no primeiro post que fiz aqui, funcionou que é uma beleza, tanto no Chrome quanto no Firefox e Opera mas no IE 9, tsic tsic. Mas fazer o que né.

    Fico no aguardo da nossa VA então.

    Abraços

  • Felipe

    Bom Dia André,

    Bom primeiro de tudo, obrigado pelo respeito a nós leitores e Usuário ao responder nossos posts, isso realmente mostra seu comprometimento com o site e suas finalidades.

    Bom, voltado ao assunto, eu peguei o tutorial do css3 pois achei que seria mais simples, dado o fato de que não manjo muito de programação.

    Mas se você julga de melhor proveito, vamo nessa, fico no aguardo da sua VA então.

    Obrigado.

    • Maravilha meu amigo! Agradeço o comentário, e muito mais, o interesse da parte de você na busca por conhecimento…isso sim é de tirar o chapéu! rs

      Vou ver se providencio a VA sobre o assunto… mas voltando ao problema “navegadores” …

      Vamos lá… apenas um desabafo de um webdesigner cansado de “trabalhar além do combinado” com o cliente por culpa do Internet Explorer …

      Todos os navegadores, exceto o IE, de uma maneira ou outra, acabaram “acatando” as recomendações da W3C para que houvesse uma padronização de códigos… portanto, vários navegadores reconhecem algumas coisas no CSS3, enquanto o IE, nas versões 8, 7 e 6 não entendem muita coisa ou interpretam da maneira que melhor convém!

      Para você ter uma ideia, na versão 8, o mesmo “pesquisa” em qual versão ele apresenta melhor o site, e se for o caso, faz um downgrade para a versão 7, julgando que no mesmo, a visualização é melhor!(?).

      Semana passada, foi lançada a versão 9 do IE… achei uma falta de consideração, um desrespeito, o que o pessoal da Microsoft fez…. colocaram um botão enorme, dizendo “baixe aqui o IE 9 para Windows XP” .. aí o idiota foi lá baixar o programa, pois eu queria conferir o que ele tem de novo, e se eu finalmente, pararia de fazer sites para o Firefox, Chrome, Opera, e após isso, arrumar uma porrada de coisa para que os IE´s da vida o renderizasse da melhor maneira possível… e eis que me veio a infeliz e ingrata surpresa….

      Quando cliquei no botão para baixar o IE9, me veio uma mensagem dizendo que o mesmo só roda no Windows 7 ….. quer dizer então, que eu vou ser obrigado a ter que mudar meu sistema operacional para que o maldito, infeliz e desgraçado IE rode no meu computador? Cara…isso é de uma revolta muita grande de minha parte….

      Vou ter que fazer um upgrade de sistema operacional (que ao meu ver, não tem versão melhor do que a XP, na minha opinião ok?), para obter a “última versão de uma R%@#$%@# de navegador?” … é demais pra cabeça…

      Gostaria muito de que houvesse uma corrente forte, entre os webdesigner de todo o mundo (pois não somos poucos!) que pregassem a não utilização do IE na internet nunca mais… poxa, se tratamos mal um cliente, se não fazemos aquilo que ele espera, ele nos deixa e vai atrás de outro…. o que tem nesse maldito IE que ainda, todo mundo vai atrás dessa porcaria?

      Não tem respeito por nosso trabalho, por nossa segurança, não ouve o que dizem, e nadam contra a maré…se fosse de maneira positiva, louvável…. mas não o é….

      Então, vou preparar um conteúdo com CSS 2 mesmo, por exibir uma menor quantia de erros, e pelo fato de não ter um IE 9 para fazer os testes com CS3….

      Abraços, e me desculpe pela bíblia….rs….

      Até mais!

  • Felipe

    Bom dia André,

    Gostei muito de suas Vídeo Aulas.

    Estou estudando mais afundo o CSS e me deparei com um tutorial para criar um menu DropDown, contudo não gosto muito de pegar tutoriais prontos, gosto de entender o tutorial.

    Bom, resumindo, gostaria de saber se tem como você fazer uma video aula de como criar um menu drop dowm com o css3 ?

    Abraços

    • Fala Felipe! Tudo em ordem meu velho?

      Posso até montar uma VA sobre o assunto, mas sinceramente, ainda não sou muito utilizador de CSS3… os navegadores ainda tem certa dificuldade em interpretá-los….

      Se com o CSS 2 já dá vários e sérios problemas, imagine com o 3 … rs

      Poderia ser algo com jQuery? Acho que seria melhor aproveitado….

      Abraços!

  • Exatamente Marcos!

    Bom mesmo … só precisamos ficar atentos para não utilizar muitas fontes no site!

    Primeiro, porque pesa o download, e segundo, porque muitas fontes não dá um design legal…

    Abraços!

  • Marcos

    Essa tecnica é boa para trabalhar a logo marca do site simples e eficas.

  • Tuco

    Fala Wellington!

    Obrigado pelo comentário meu velho!

    Abraços!

  • Wellington

    Cara, comentei no mxmasters e torno a comentar:

    Meus parabéns, Show de video aula, vlw.