Por muito tempo eu fingia saber exatamente o que era DOM, ECMAScript, JScript, DHTML, etc significava. Mas num final de semana desses eu peguei para ler sobre o que eles significam e como eles estão relacionados.
Esta é a forma como a especificação DOM define um “DOM”:
O Document Object Model (DOM) é um Application Programming Interface (API) para HTML válido e documentos XML bem formatados. Ele define a estrutura lógica dos documentos e o modo como um documento é acessado e manipulado.
mais…
Publicado em 22 abril 2010 por
Caineli
Tags:
css,
fontes,
tipografia A propriedade @font-face do CSS possibilita aos browsers renderizar fontes que não estão instaladas no computador do usuário. Exemplo:
@font-face{
font-family:'Comic Book';
src:local('Comic Book'),url('Comic Book.ttf') format('TrueType');
}
p{font-family:'Comic Book',arial,helvetica,sans-serif}
Valores:
- O valor “local” informa se a fonte já existe no sistema operacional do usuário antes de ser instalada
- O valor “url” informa o caminho da fonte que será instalada
- O valor “format” informa qual é o formato da fonte que será instalada
Formatos:
Os formatos aceitos pelos browsers são:
- Embedded OpenType – .eot
- OpenType – .otf
- Scalable Vector Graphics – .svg e .svgz (formato .svg “gzipado”)
- TrueType – .ttf
O Internet Explorer suporta apenas o formato Embedded OpenType (.eot), portanto deverão ser declarados dois formatos, sendo um exclusivo para as versões do Internet Explorer (.eot) e/ou outro(s) para os demais browsers (.otf, .svg, .svgz e .ttf). Exemplo:
@font-face{
font-family:'Comic Book';
src:url('Comic Book.eot'); /* IE */
src:local('Comic Book'),url('Comic Book.ttf') format('TrueType'); /* DEMAIS BROWSERS */
}
p{font-family:'Comic Book',arial,helvetica,sans-serif}
Exemplo declarando outros formatos:
@font-face{
font-family:'Comic Book';
src:url('Comic Book.eot'); /* IE */
src:local('Comic Book'),
url('Comic Book.otf') format('OpenType');
url('Comic Book.svg') format('Scalable Vector Graphics');
url('Comic Book.svgz') format('Scalable Vector Graphics');
url('Comic Book.ttf') format('TrueType')
}
p{font-family:'Comic Book',arial,helvetica,sans-serif}
Compatibilidade:
A propriedade @font-face é compatível com os principais sistemas operacionais e browsers (inclusive o Internet Explorer 6):
- Linux – Chrome e Firefox
- Mac OS – Chrome, Firefox, Opera e Safari
- Windows – Internet Explorer 6, 7, 8 e 9, Chrome, Firefox, Opera e Safari
Talvez ajude…
Publicado em 14 abril 2010 por
Alex
Tags:
AJAX,
javascript,
JSONP Os serviços para intercâmbio de dados entre aplicações via protocolo http alcançaram algum nível de maturidade nesses últimos anos. Hoje, já sabemos como disponibilizar serviços via web, já existem abordagens que funcionam, outras vão sendo experimentadas. O fato é que existem diversas APIs disponíveis na web para atender as mais variadas necessidades: Agenda, mapas, autenticação de usuários, integração com redes sociais, enfim. Serviços públicos, serviços pagos, serviços com mais de um plano de licensiamento para atender mais de um tipo de consumidor. Hoje qualquer um pode criar sua api e colocar na web e ganhar (se quiser) seu dinheirinho com aquilo.
Em meio às tecnologias para troca de dados e comunicação entre aplicações pela web como REST, SOAP, WSDL etc, se destacam também as APIs que fornecem dados com simples requisições http diretamente do site via browser, sem a necessidade de processamento do lado do servidor pelo cliente do serviço. Para esses casos temos o JSONP como uma alternativa “bem em conta” para resolver problemas conhecidos. O objetivo desse post é dar uma introdução do que é e como usar o JSONP.
mais…
Como você deve ter notado em meu post anterior sobre HTML5 (http://afronteirafinal.com/prepare-se-para-o-html-5), eu abordei sobre SVG e Canvas e nas últimas semanas os debates estão se aquecendo sobre os méritos de cada um, e muitos estão prevendo um “death match”. No entanto, minha pesquisa me convence de que cada um tem suas próprias finalidades, mas definitivamente chegou a hora de usá-los.
O QUE É SVG?
SVG é uma linguagem para descrever gráficos bidimensionais e aplicações gráficas em XML. Alguns exemplos de SVG são: o logo da Wikipedia (http://upload.wikimedia.org/wikipedia/commons/7/77/Wikipedia_svg_logo.svg) e o “Hello World” do SVG chamado de “Tiger” (http://www.amplesdk.com/examples/svg/tiger). Veja o fonte desses dois arquivos SVG para ver como SVG parece. mais…
Publicado em 06 abril 2010 por
Vespa
Tags:
html,
keywords,
otimização,
SEO Continuando o texto anterior sobre SEO, vamos falar neste post a respeito das Meta Keywords.
Se você não é desenvolvedor deve se perguntar nesse momento:
“- Eu não sou desenvolvedor, devo me perguntar nesse momento se preciso mesmo saber sobre meta tags?”
Bom, sim e não. Você não precisa necessariamente saber onde aplica-las no código, mas tem que saber como funcionam e para que servem pois pode existir um campo específico para isso no seu publicador.
Existem algumas dúzias de meta tags que se pode usar no código mas, uma vez que a proposta é não sair do básico do SEO, vamos falar somente das mais importantes nessa série de textos. Aliás, vamos falar uma coisa que pouca gente aborda em textos sobre SEO: em geral as pessoas dão enfase à aplicação, enquanto aqui pretendo falar o real porquê de usa-las de forma x ou y.
mais…
Publicado em 30 março 2010 por
Vespa
Tags:
Editorial,
otimização,
SEO,
Texto Há algum tempo escrevi um texto em meu blog pessoal Heresias.org um post com “10 dicas para o seu blog aumentar estrondosamente em acessos“, um texto bem humorado a respeito da fina arte do SEO (Search Engine Optmization) e sua capacidade para poluir a internet.
O caso é que tudo que escrevi no texto, embora de forma escrachada, realmente é funcional na hora de montar um texto relevante para os nossos amigos buscadores (em especial Google, Yahoo e Bing, que são nosso atuais ditadores de tendências na produção de textos web).
Enfim, o meu foco naquele texto em específico era realmente a produção do conteúdo e sobre como a forma de escrevê-lo influencia para chamar a atenção dos buscadores. Mas de que adianta isso sem uma formatação decente?
mais…
