Quatro razões para adotar o HTML5

Se você quiser melhorar seus rankings de busca, melhorar o suporte a leitores móveis, e transformar o seu processo de desenvolvimento Web, é hora de integrar o HTML5 em seu portfólio de trabalho.

O HTML5 não é um produto único na forma de, digamos, a versão 11g do banco de dados Oracle. O HTML5 é uma coleção de definições, que, mesmo no sentido mais restrito, nenhum navegador da Web hoje apoia plenamente, mas os principais browsers suportam parcialmente.

Mais amplamente, o HTML5 inclui padrões HTML e também padões como o CSS3 (Cascading Style Sheets 3), suporte a JavaScript, SVG (Scalable Vector Graphics) e codecs multimídia que trabalham juntos para tirar o máximo proveito das novas definições do HTML.

Claro, o HTML5 pode não ser indicado para todas as organizações neste momento. Seu uso requer conhecimento detalhado dos navegadores dos usuários finais e os objetivos de uma organização para a sua presença na Internet.

Em linnhas gerais, são quatro os grandes benefícios do HTML5.

1. Proporciona downloads de imagens mais rápidos, especialmente para usuários móveis

No projeto de página Web, um “gradiente” é um efeito de fundo: um sutil sombreado ou texturização da “janela” na qual o seu próprio Web site é visto. Os designers corporativos ir esforços consideráveis para equilibrar tons, corresponder fronteiras, e de outra maneira conseguir um tom ou estilo cujo efeito sobre a maioria dos telespectadores é importante e inconsciente. Jacob Gube, fundador de seis revisões, mostra ” 25 grandes exemplos de utilização Efeitos de Gradiente em Projetos Web [8] “.

As duas primeiras décadas de efeitos gradiente foram atingidos por “pintura”. Antes de HTML5, um fundo tiveram de ser fornecido como uma imagem (talvez emendados de vários sub-imagens). Photoshop, por exemplo, tem uma “ferramenta de gradiente” em grande parte utilizado para construir imagens de fundo para uso como gradientes. Este tem sido um sucesso estrondoso, no sentido de que, essencialmente, cada Web designer competente comumente emprega gradientes realizadas como imagens de fundo.

HTML5 muda isso. A parte de CSS3 HTML5 expressa gradientes semanticamente, isto é, em palavras significativas, em vez de imagens. Aqui está um exemplo:

. GradientArea {background:-o-linear de gradiente (# FFB260, # FF7F13); filtro:. Progid: DXImageTransform Microsoft . [9] gradiente (startColorstr = ‘# ffb260’, endColorstr = ‘# ff7f13’, GradientType = 0) ;}}

A sintaxe detalhada desse exemplo, ou a sua prestação em um retângulo levemente sombreado laranja, não é importante, o que importa é a conseqüência de expressá-la através de palavras ao invés de imagens.

Primeiro, é mais compacto. CSS3 especificações gradiente são tipicamente algumas centenas de bytes; imagens de fundo para gradientes variam frequentemente à casa dos milhares. Ainda mais do que esta superioridade superficial, no entanto, é o facto de o gradiente CSS3 está em linha de: a sua transmissão não requer a abertura outro ficheiro. Quando tantas Web-site os visitantes chegam por meio de largura de banda reduzida navegadores móveis, mantendo a contagem de conexões auxiliares para processar uma página baixa pode ser crucial para manter o desempenho para cima.

Em termos gerais, então, os projetistas da Web fazer as mesmas coisas que sempre fizeram – usar a ferramenta gradiente do Photoshop, ou algo semelhante – mas exportar para CSS3 ao invés de HTML4 ou XHTML. O que o usuário final vê no navegador dele ou dela é indistinguível, mas é conseguido com um mais rápido, talvez muito mais rápido download,. Além disso, é muito mais fácil de se adaptar a diferentes gradientes CSS3 tela de tamanhos, com todos os benefícios óbvios para os espectadores móveis, cuja linear resoluções de tela podem variar de acordo com uma ordem cheia de magnitude.

Detalhes técnicos complicar esse quadro um pouco:

Em princípio, é possível na linha de estilo antigo gradientes e, assim, reduzir os custos de download. Isso raramente é feito.
HTML5 inclui os efeitos da inclinação fora do âmbito do CSS3, e
CSS3 suporte dos gradientes introduz novos níveis de programação. Pode-se, por exemplo, ajustar um gradiente com base na idade ou a localização do espectador.

Tão divertido quanto essas possibilidades são para programadores, que não recomendá-los. Não deixe que eles te distrair do ponto principal de semanticamente expressas HTML5 de gradientes: eles fazem para downloads mais rápidos, mais fácil portar para formatos móveis e de manutenção menos dispendiosa.

2. Melhoria SEO
Vários outros efeitos gráficos comuns têm CSS3 expressões, incluindo a opacidade (a imagem em primeiro plano é suficientemente transparente para permitir o seu fundo de ser parcialmente visível), cantos arredondados, e queda sombras. Todas estas partes com CSS3 gradientes as vantagens de uploads compactas e facilidade de manutenção de plataforma cruzada. Eles também apresentar vantagens para o motor de busca optimization (SEO) que merecem cuidadosa explicação.

Para entender as implicações de SEO, retornar por um momento para gradientes. Outra vantagem técnica de gradientes CSS3 é que eles são mais compatíveis com os sistemas de controle de código-fonte (CCSC). Antes de CSS3, gradientes foram realizadas como imagens. Para alterar uma imagem em SCCSs comuns é uma operação opaco: o CCSC si só pode gravar que a mudança ocorreu, juntamente com quaisquer comentários sobre a mudança.

Com marcação semântica CSS3 de gradientes, porém, SCCS pode operar convenientemente sobre o texto que exprime o gradiente. CCSC pode automaticamente relatam que, em determinado momento, o matiz do gradiente alterado, ou a sua intensidade, com um formato como o seguinte:

background:-o-linear de gradiente (# FFB260, # FF3F13);

Os programadores que esta é uma grande comodidade: as ferramentas que eles usam para gerenciar o código fonte, incluindo a construção de versões de produção validados, alargar mais naturalmente para as construções gráficas de Web design.

Essa vantagem amplia ainda mais para a opacidade e outras marcações CSS3. Suponha que uma empresa, “Acme Widgets”, denominado seu próprio nome com a opacidade em sua home page. Antes de CSS3, isso foi feito com o Photoshop ou uma ferramenta semelhante, e resultou em uma imagem que mostrava as palavras “Widgets Acme” com uma opacidade específico.

No entanto negrito os gráficos, o conteúdo foi totalmente perdido para motores de busca. Porque eles estão embutidos em uma imagem, as palavras “Acme Widgets” são efetivamente invisíveis para os motores de busca. Nos primeiros anos dos motores de busca, houve vários casos famosos de páginas da Web importantes que não aparecem nos resultados de busca, precisamente porque os motores de busca viu conteúdo textual muito menos do que os leitores humanos fizeram.

CSS3 mudar isso. CSS3 torna possível manter muito mais do conteúdo textual de uma página como texto, ainda estilo ainda que para a opacidade, 2-D e efeitos 3-D, e assim por diante. As implicações para o SEO são em si suficientes para fazer CSS3 convincente: a beleza de suas páginas da Web não importa em tudo quando ninguém os vê, e estilos mais antigos de aplicação gráfica fazer muito do seu conteúdo invisível para os motores de busca e prospectivo visitantes que os utilizam.

3. Sofisticados efeitos de animação
HTML5 está cheio de características individuais com as características já explicado acima: HTML5 dá a mesma aparência dos web designers de topo já estavam alcançar, mas ao menos despesa, com carga mais rápida dos tempos, e do SEO e as vantagens de manutenção de marcação semântica. HTML5 também introduz efeitos que eram, geralmente, fora as versões anteriores do padrão, um deles é a animação.

Para efeitos de animação sofisticadas, as equipes da Web, no passado, geralmente voltado para Flash. Flash tem bem conhecidas desvantagens: os motores de busca não indexá-lo (não é estritamente verdadeiro, mas certamente um passivo na melhor das hipóteses), iOS da Apple e outros sistemas operacionais não permitem, e sua segurança [10] perfil e licenciamento restringir a sua usar em muitas organizações. Com HTML5, porém, relativamente sofisticadas animações visuais tornam-se disponíveis como animações semânticas.

4. Desenvolvimento mais fácil aplicativo Web, especialmente para aplicações móveis
A vantagem qualitativa final que HTML5 oferece é que ele é rico o suficiente como um ambiente de programação para competir com aplicativos nativos. Isto é particularmente importante, uma vez mais, para celulares dos usuários finais. Desenvolvimento de aplicativo nativo é caro: seus programadores são caros, varia de licenciamento entre lunático e frustrante, e portabilidade é um desafio. HTML5 é tão potente que muitas aplicações podem efetivamente ser codificado inteiramente dentro de HTML5. Considere as seguintes vantagens sobre os aplicativos nativos:

cobertura automática por motores de busca;
acesso imediato aos usuários finais, sem a necessidade de instalar nada, e
um único código base que se estende por desktops internos, móveis e domésticos remoto ou uso de escritório.

HTML5 foi anos na fatura. Seus definidores muitos capturados das partes mais importantes de Web-site, construção e tornando-os disponíveis como marcação semântica e APIs compreensível. O uso inteligente do HTML5 contribui para mais rápida, downloads mais ágeis, muito melhor colocação motor de busca, e mais fácil desenvolvimento.

Laird é vice-presidente da boutique Phaseit consultoria de desenvolvimento, é um especialista convidado em SVG, que escreve freqüentemente sobre assuntos relacionados com HTML e que têm a ver com a web