Idiomas

Belo sonho, mas qual é a realidade?

por Jonathan Lane

traduzido por Diego Souza

Artigo anterior – O modelo dos padrões web — HTML, CSS e JavaScript
Próximo artigo – Arquitetura da Informação — planejando um web site
Índice

Até agora nós falamos sobre o bonito ideal dos padrões web. Padrões web permitem interoperabilidade entre todos navegadores web, em qualquer sistema operacional, e até mesmo em qualquer dispositivo eletrônico disponível. Mas é essa a verdadeira realidade? Todos os navegadores web são 100% complacentes com os padrões? Todos os desenvolvedores web estão usando padrões web corretamente? Desenvolvedores web criam páginas usando os padrões, e então vão adiante confiantes que o design permanecerá intacto em qualquer situação?

A simples resposta para a última questão é "não"; enquanto isso é uma situação ideal, isso está longe da realidade. Nesse artigo veremos o seguinte:

Como você verifica a complacência com padrões web?

Antes de irmos adiante, você deve estar se perguntando "como saber se um site segue padrões web?". Ele aparenta alguma diferença em relação aos outros?

Sim e não. Sites complacentes com padrões, se desenvolvidos corretamente, não devem aparentar diferente de sites escritos com um monte de código desorganizado. Entretanto o código fonte (tente clicar com botão direito em um site e selecionar a opção "código-fonte" ou "visualizar código-fonte" - o termo exato varia entre os navegadores) aparentará muito diferente. Um site complacente com os padrões terá um código limpo, com pouca ou nenhuma formatação embutida na própria página. Pode ser difícil você perceber isso imediatamente, mas acredite, indivíduos com limitações visuais utilizando leitores de tela e mecanismos de busca perceberão na hora. Nós já falamos das vantagens de utilizar padrões web no artigo anterior.

A forma mais fácil de verificar a complacência com os padrões é utilizar uma ferramenta prática, disponível online, chamada validador. O World Wide Web Consortium (W3C) disponibiliza um validador gratuitamente em http://validator.w3.org - veja a figura 1. Você pode (e deve) usar essa ferramenta para verificar qualquer site que está desenvolvendo em busca de erros em seu HTML/XHTML. O CSS pode ser verificado usando o validador CSS disponível em http://jigsaw.w3.org/css-validator. Sinta-se livre para visitar esses links e testar alguns de seus sites favoritos.


Figura 1: O serviço validador de marcação (HTML/XHTML) verificará suas páginas e apontará quaisquer erros no código.

Garantir que suas páginas são válidas é somente a metade do caminho. Como verificamos se navegadores são complacentes com padrões? O Web Standards Project tem desenvolvido uma série de testes denominados Acid, no qual utilizam algumas regras HTML e CSS complexas (mais algumas outras marcações e códigos) para ver se o navegador pode renderizar corretamente. A última versão do teste Acid, o Acid3, ainda é um trabalho em andamento. Você pode ler mais sobre os testes Acid em http://www.acidtests.org, assim como ir para as verdadeiras páginas de teste, para colocar seu navegador à prova.

Complacência com os padrões em sites atualmente

Os maiores sites estão utilizando padrões web, ou simplesmente "enganando" com alguns hacks? Vamos dar uma olhada em algumas poucas empresas e ver como se posicionam utilizando o serviço validador do W3C. Você se surpreenderá sobre quantos sites grandes não passam nos testes; no entanto não desanime - não há motivo para que você não possa fazer diferente e ter seus sites validados adequadamente. Conforme você lê o relatório abaixo considere que quanto maior e mais complicado um site é, mais difícil é fazê-lo válido, falando de forma genérica (existem outros fatores a considerar, como as tecnologias utilizadas).

Amazon: Comprar com padrões?

Possivelmente se você já fez alguma compra online, você provavelmente visitou a Amazon.com (ou algum de seus sites nacionais específicos). A Amazon é uma super loja na Internet, vendendo de tudo, desde livros e CDs, até alguns itens de mercearia. No entanto a Amazon.com passa na validação? Verifique na Figura 2.


Figura 2: A Amazon.com não passou na validação com sucesso! Não há somente marcação inválida, mas eles nem mesmo declaram um doctype (dizer qual versão do HTML/XHTML estão usando).

A Amazon tem um pouquinho de estrada quando o assunto é complacência com padrões. Eu não tenho a visão interna de lá, mas me permitindo especular um pouco, eu diria isso porque a Amazon esteve perto por algum tempo, eles provavelmente estiveram usando o mesmo software durante sua existência. Devido aos padrões web não terem sido destacados até o começo do milênio, possivelmente o sistema que a Amazon utiliza para vender produtos online foi desenvolvido antes, quando padrões web não eram suportados ou disponíveis. Eu não sei com certeza, mas suponho que a Amazon sofre da situação de continuar com o que apenas funciona para eles.

CNN: Notícias padronizadas?

Será que empresas de notícias são seres semânticos? CNN.com é um dos maiores sites de mídia por aí. Conta com fontes globais, reportando no noticiário as histórias conforme elas acontecem, será que eles têm um time interno de especialistas garantindo que seu site é produzido com marcação válida? Veja na Figura 3.


Figura 3: CNN.com (em 15 de abril de 2008) não passou na validação com 33 erros. Eles declaram um doctype HTML 4.01 Transitional, porém um monte de marcação aparenta como XHTML.

33 erros não é tão mal quando se é um site do tamanho e complexidade do CNN.com. Aqueles 33 erros poderiam (e novamente eu estou especulando) ocorrer pelo fato do CMS que eles usam não ser completamente capaz de produzir marcação complacente com padrões, ou poderia ser somente erros de uma assessoria de produção especializada em escrever notícias, e não na produção do site; ambas explicações são plausíveis.

Apple: O melhor da elegância no design ... e validação?

A Apple é renomada por seus produtos de hardware e software bonitos e funcionais. Seus anúncios de produto são quase como uma experiência religiosa para um grupo enorme de seguidores leais. O site da Apple (veja figura 4) é frequentemente aclamado como belo em design e bem organizado, mas isso valida?


Figura 4: Apple.com chega realmente perto de ter uma marcação HTML 4.01 Trasitional válida. Com 6 erros, há uma mesclagem de marcação "tipográfica" e um uso específico de tag para o Safari.

O site da Apple realmente chega bem perto de validar. Sério, isso tomaria 5 minutos de alguém para corrigir os erros e ter a página válida. O erro que quero comentar brevemente, no entanto, é que a Apple decidiu usar um atributo específico para o Safari no campo de busca (dando à caixa de texto o atributo type="search"). No Safari, isso deixará você ver uma lista de buscas recentes ao clicar em um pequeno ícone de lente de aumento. Em outros navegadores, como Opera ou Internet Explorer, isso mostra somente uma caixa de texto comum.

Uma pequena pesquisa de complacência com os padrões

Ao invés de ir através de dúzias de exemplos como esse (Apple), juntei os outros sites pesquisados no gráfico de pizza abaixo. Eu olhei o site de 40 empresas da lista Fortune 500 assim como os de maior tráfego no ranking Alexa - a Figura 5 mostra o que eu encontrei:


Figura 5: 85% dos sites pesquisados falharam na validação em algum ponto. Alguns tiveram falhas gritantes, passando de 1000 erros; outros apenas alguns erros de escrita aqui e ali.

Por que falta complacência nos sites?

Nós lamentamos "por que, por que não validam?" Isso pode ser um pouco dramático, mas é ao menos parecido com a pergunta passando pela sua cabeça nesse momento. Por que tão poucos sites validam? Eu já falei sobre alguns possíveis motivos - coisas como sistemas de e-commerce antigos ou sistemas gerenciadores de conteúdo - mas há alguns outros motivos subjacentes.

Educação

O colégio que eu frequentava tinha um programa gerenciador de informações, um programa de ciências da computação e um programa de novas mídias, cada qual tinha cursos relacionados à produção de sites - enquanto esses ensinavam bem muitas coisas, realmente não havia muita abordagem de como realmente codificar um site neles. A impressão geral que eu tenho buscando em vários cursos universitários, é que, linguagens como HTML, CSS e JavaScript estão abaixo do limiar técnico na maioria dos planejamentos para ciências da computação, e acima da maioria dos MIS (Management Information Systems).

O que eu estou vendo nesse momento é que, muitos cursos não cobrem esse tipo de coisa num bom nível de detalhes. Eu apostaria que se você perguntar a 10 desenvolvedores que trabalham com padrões web) onde eles aprenderam, 9 deles responderiam que aprenderam sozinhos (o outro que resta não responderia por estar ocupado tentando fazer seu site renderizar direito no IE6).

O World Wide Web Consortium (W3C), grupo responsável por desenvolver padrões, e o Web Standards Project (WaSP) estão nesse duro desafio e trabalhando pelo aumento de suporte dos padrões web, ambos desde fabricantes de navegadores a desenvolvedores.

Inferno, a razão desse curso que você está lendo ter sido criado é, fornecer uma gama de material de ensino para padrões web, e um meio de usar esse material para aprendizado, de graça. Estamos apenas tentando nos livrar de alguns outras razões (hesitamos usar a palavra "desculpas" aqui...) pelo qual pessoas não estão adotando padrões web. Realmente não há desculpa para não usá-los, dados os benefícios que eles trazem (como discutido no último artigo).

Motivos comerciais

Um site que eu frequentemente visito para empresários envolvidos em projetos web registrou inúmeras discussões sobre o uso de padrões web nas "Aplicações Web 2.0". Geralmente existe uma troca interessante entre aqueles que acreditam que padrões web deveriam ser usados porque fazem sentido (por todas as razões que discutimos previamente), e aquele que apenas dizem "E daí?".

O fato que importa é que navegadores web irão lidar com código realmente ruim. Suas páginas não precisam ser validadas para serem mostradas corretamente na maioria dos principais navegadores. Do ponto de vista empresarial, onde tempo é dinheiro, por que se aborrecer perdendo tempo em razão de validação completa? Se você pode ter um código rápido baseado em tabelas em 30 minutos, ou gastar 30 minutos escrevendo HMTL e CSS, mais 30 minutos garantindo que isso valida e funciona nos diferentes navegadores, e o resultado final irá aparentar o mesmo nos principais navegadores, qual parece mais fácil para você?

Muitas pessoas da minha geração (estou quase nos 30 agora) aprendeu a construir sites usando tabelas para layout e tags font para ajustar tipografia. Pode ser intimidador reaprender como fazer algo quando o que você está fazendo "funciona" (ainda aparenta OK na maioria dos navegadores). Empregadores geralmente não sabem a diferença; eu nunca tive um gerente falando da qualidade do meu código durante uma avaliação de performance. Então, onde está o incentivo?

Eu vou declarar aqui (você pode adivinhar de que lado eu costumo argumentar) que a abordagem de código bagunçado é visão restrita. Baseado em minha experiência, fazer um redesign de um site baseado em padrões é muito mais fácil do que converter uma bagunça de páginas mal codificadas (eu fiz ambos). Eu ainda tenho que alcançar a utopia prometida pelo XHTML/CSS que você somente terá que mexer no CSS durante um redesign, mas eu tenho chegado perto.

Também tenha em mente que, ultimamente você verá muito mais anúncios de emprego procurando por conhecimentos em padrões web do que antes.

Existem também alguns motivos de negócio a considerar. Geralmente, usar padrões web aumenta o posicionamento em sistemas de busca (quão alto isso aparece na lista quando você busca no Google) e quão fácil é encontrar no primeiro lugar. Adicionalmente, usando padrões e boas práticas, geralmente fará a página mais acessível para pessoas com limitações, e usuários tentando acessar o site em seus celulares. Mais usuários e visibilidade maior são sempre bons para os negócios.

Resumo

Nesse artigo eu falei sobre o estado de adoção os padrões web atualmente - como checar quais padrões estão sendo usados corretamente em um site, quantos sites estão usando padões web corretamente e o motivo pelo qual pessoas não adotam padrões. Conforme você viu acima, os motivos não são incontornáveis e devem ser facilmente vencidos.

Então o que um desenvolvedor web do futuro faz? Você quebra a cabeça com padrões web (e continua lendo esse material) ou abre um editor gráfico e começa o layout do seu site com tabelas?

Eu coloco as coisas dessa forma: a única e maior insatisfação que eu leio de pessoas, afirmando que desenvolvimento baseado em padrões é uma perda de tempo, é que leva muito tempo para aprender a usar os padrões web ao invés dos métodos ultrapassados e desenvolver sites que realmente funcionam em todos navegadores. Então por que não começar aprendendo a forma correta e evitar alguns problemas? Você decidiu aprender como fazer sites e você precisa fazer de uma forma ou de outra, então por que não fazer corretamente?

Leitura adicional

Exercícios

  • Nós vimos muitos "grandes" sites e quais deles validam ou não. Coloque alguns endereços que você visita regularmente no validador. Eles validam? Se não, dê uma olhada em alguns erros para ter noção do porque eles estão falhando.
  • O que é um doctype? O que ele faz?
  • Em que caso você pode ir adiante com padrões web relacionando a negócios?

Artigo anterior – O modelo dos padrões web — HTML, CSS e JavaScript
Próximo artigo – Arquitetura da Informação — planejando um web site
Índice

Sobre o autor

Foto do autor do artigo Jonathan Lane

Jonathan Lane é o Presidente a Industry Interactive — uma companhia de desenvolvimento de aplicações web localizada em Mayne Island, British Columbia, Canadá. Ele começou a trabalhar com desenvolvimento no Centro de Recriação de Currículo da Universitade de Lethbridge como coordenador de projetos web por vários anos.

Ele bloga no Flyingtroll e atualmente está desenvolvendo o Mailmanagr, uma interface de e-mail para a aplicação de gerenciamento de projetos Basecamp.

Este artigo está licenciado sob uma licença Creative Commons Atribuição-Uso Não-Comercial-Compartilhamento pela mesma Licença 2.5.

Discuta este artigo (No Dev Opera, em inglês).

Comentários

Enviado por Danilo em

cara, seria legal uma página com links pra todos artigos traduzidos.

parabens pela iniciativa.

[]s

Enviado por rafael em

Cara parabens pela iniciativa de traduzir esses artigos.

Enviado por Robson em

Boa iniciativa, pena que alguns conteúdos abordados nos artigos já estão ficando obsoletos conforme aponta o site dos Desenvolvedores do Opera, mas de qualquer forma o curso é muito bom e as explicações também, precisamos de mais iniciativas como essa no Brasil!=)

Comentar