Ganhos visuais com o CSS3
Chris Coyier, web designer que mantém o blog CSS-Tricks, escreveu em seu perfil no Twitter que o "CSS é como o xadrez. Você pode aprender os princípios básicos em um dia, e passar a vida inteira se especializando". De fato, o CSS é a linguagem mais fácil de ser aprendida, possuindo uma sintaxe bem simples. Porém, criar páginas com layouts bem elaborados usando CSS, assim como conhecer todos os seus macetes, exige tempo e experiência.
Dicas e orientações na área web. Além de serviços e trabalhos realizados.
domingo, 10 de outubro de 2010
HTML 5: turbulências para 2010!
HTML 5: turbulências para 2010!
Depois de um final de ano cheio de novidades com o surgimento de novas tecnologias, tendências e lançamentos, iniciamos 2010 com força total. A discussão foi grande em relação à migração.
Para quem acha que não está na hora de mudar, nos últimos dias uma das maiores empresas do mundo, o Google, anunciou que, a partir de 1º de março, vai parar de dar suporte a navegadores como IE 6 e versões antigas do Firefox e Safari. Somente alguns de seus serviços estarão disponíveis para navegadores antigos, como Docs e Calendar.
Toda esta revolução teve efeito depois que o Google sofreu o seu o maior ataque de hackers. A empresa cita a falta de segurança de navegadores como IE6. Este fator pode ser decisivo para a atualização dos navegadores, facilitando a migração para o HTML 5.
As novidades não param por aí.
Para que achava que iria ser desperdício começar a aprender sobre o HTML5, temos ainda outra novidade que irá forçar a migração para o HMTL5: Steve Jobs anunciou, no lançamento do Ipad, que o aparelho não terá suporte ao Adobe Flash. Ele deixou bem claro que a internet está migrando para o HTML 5 e que problemas no plug-in do Adobe são fatores que levaram a decisão de não fornecer o suporte.
O YouTube anunciou recentemente que desenvolverá um novo player de vídeo compatível para a nova TAG do HTML 5
Depois de um final de ano cheio de novidades com o surgimento de novas tecnologias, tendências e lançamentos, iniciamos 2010 com força total. A discussão foi grande em relação à migração.
Para quem acha que não está na hora de mudar, nos últimos dias uma das maiores empresas do mundo, o Google, anunciou que, a partir de 1º de março, vai parar de dar suporte a navegadores como IE 6 e versões antigas do Firefox e Safari. Somente alguns de seus serviços estarão disponíveis para navegadores antigos, como Docs e Calendar.
Toda esta revolução teve efeito depois que o Google sofreu o seu o maior ataque de hackers. A empresa cita a falta de segurança de navegadores como IE6. Este fator pode ser decisivo para a atualização dos navegadores, facilitando a migração para o HTML 5.
As novidades não param por aí.
Para que achava que iria ser desperdício começar a aprender sobre o HTML5, temos ainda outra novidade que irá forçar a migração para o HMTL5: Steve Jobs anunciou, no lançamento do Ipad, que o aparelho não terá suporte ao Adobe Flash. Ele deixou bem claro que a internet está migrando para o HTML 5 e que problemas no plug-in do Adobe são fatores que levaram a decisão de não fornecer o suporte.
O YouTube anunciou recentemente que desenvolverá um novo player de vídeo compatível para a nova TAG do HTML 5
Como usar a Google Font API
Como usar a Google Font API
Durante a Conferência Google I/O 2010, o Google lançou seu diretório com fontes para web em alta qualidade para serem usados através da Google Font API.
A Google Font API foi criada para auxiliar o uso de fontes em qualquer página web independentemente do navegador que é usado. Veja algumas vantagens:
• Economia de Banda;
• Fácil de usar;
• Suporte para estilos;
• Não é necessária a conversão para o formato suportado pelo IE;
• Fontes Open Source.
Desvantagens:
• Pouca variedade de fontes, por enquanto.
Google Font Directory
A Google também criou o Google Font Directory, um catálogo de fontes de alta qualidade para quem utiliza a Font API, basta escolher uma fonte e copiar o código. As fontes do diretório são open source e podem ser usadas em qualquer projeto comercial ou não comercial. Confira as fontes disponíveis.
Tudo isso na prática
Tudo é muito bom e bonito, mas como usar? Além de bom e bonito, é muito mais fácil do que se imagina, segue um código de exemplo:
Legal, né? Vamos trabalhar um pouco mais com essa API. Vamos ver como determinar uma família de fontes e estilos em nossa url. Começamos com a URL básica da Google Font API.
http://fonts.googleapis.com/css
Em seguida, adicione o parâmetro family na URL, com uma ou mais fontes que deseja carregar, por exemplo:
http://fonts.googleapis.com/css?family=Inconsolata
Para solicitar mais famílias de fontes, use o caractere Pipe ( | ) para separar os nomes, por exemplo:
http://fonts.googleapis.com/css?family=Tangerine|Inconsolata|Droid+Sans
Atenção: em nomes que são separados por espaço, utilize o sinal de mais ( + ) para substituir os espaços.
A API também permite customizar o estilo da família de fontes que você acabou de carregar, basta colocar dois pontos ( : ) ao nome da família e chamar os estilos que deseja, por exemplo:
http://fonts.googleapis.com/css?family=Cantarell:italic|Droid+Serif:bold
Para saber quais estilos a fonte suporta, consulte a fonte no Google Font Directory
WebFont Loader
O WebFont Loader é uma biblioteca em JavaScript que permite ter mais controle sobre o carregamento da Font API. Vamos ver um exemplo na prática:
Esse exemplo exibe o texto no padrão serif e, após carregar as fontes, exibe o texto nas fontes especificadas. Também é possível usar o WebFont Loader com o Google AJAX API. Para saber mais sobre o WebFont Loader, clique aqui.
Fonte: Imasters
Durante a Conferência Google I/O 2010, o Google lançou seu diretório com fontes para web em alta qualidade para serem usados através da Google Font API.
A Google Font API foi criada para auxiliar o uso de fontes em qualquer página web independentemente do navegador que é usado. Veja algumas vantagens:
• Economia de Banda;
• Fácil de usar;
• Suporte para estilos;
• Não é necessária a conversão para o formato suportado pelo IE;
• Fontes Open Source.
Desvantagens:
• Pouca variedade de fontes, por enquanto.
Google Font Directory
A Google também criou o Google Font Directory, um catálogo de fontes de alta qualidade para quem utiliza a Font API, basta escolher uma fonte e copiar o código. As fontes do diretório são open source e podem ser usadas em qualquer projeto comercial ou não comercial. Confira as fontes disponíveis.
Tudo isso na prática
Tudo é muito bom e bonito, mas como usar? Além de bom e bonito, é muito mais fácil do que se imagina, segue um código de exemplo:
Google Font API + Google Font Directory!
Legal, né? Vamos trabalhar um pouco mais com essa API. Vamos ver como determinar uma família de fontes e estilos em nossa url. Começamos com a URL básica da Google Font API.
http://fonts.googleapis.com/css
Em seguida, adicione o parâmetro family na URL, com uma ou mais fontes que deseja carregar, por exemplo:
http://fonts.googleapis.com/css?family=Inconsolata
Para solicitar mais famílias de fontes, use o caractere Pipe ( | ) para separar os nomes, por exemplo:
http://fonts.googleapis.com/css?family=Tangerine|Inconsolata|Droid+Sans
Atenção: em nomes que são separados por espaço, utilize o sinal de mais ( + ) para substituir os espaços.
A API também permite customizar o estilo da família de fontes que você acabou de carregar, basta colocar dois pontos ( : ) ao nome da família e chamar os estilos que deseja, por exemplo:
http://fonts.googleapis.com/css?family=Cantarell:italic|Droid+Serif:bold
Para saber quais estilos a fonte suporta, consulte a fonte no Google Font Directory
WebFont Loader
O WebFont Loader é uma biblioteca em JavaScript que permite ter mais controle sobre o carregamento da Font API. Vamos ver um exemplo na prática:
Usando Cantarell
Usando Tangerine!
Esse exemplo exibe o texto no padrão serif e, após carregar as fontes, exibe o texto nas fontes especificadas. Também é possível usar o WebFont Loader com o Google AJAX API. Para saber mais sobre o WebFont Loader, clique aqui.
Fonte: Imasters
Assinar:
Postagens (Atom)