MXStudio » Usabilidade » A Internet não é WYSIWYG

A Internet não é WYSIWYG

<!– body,td,th { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; } –>

A Internet não é WYSIWYG!

WYSIWYG é a sigla para What You See Is What You Get, que significa O que você vê é o
que você obtém
.
Esse recurso foi utilizado com muito sucesso na indústria gráfica e nos editores de texto. As ferramentas
WYSIWYG (como o MS Word e Adobe Acrobat) permitiram que os designers gráficos economizassem bastante tempo e dinheiro
na visualização exata que os documentos teriam antes de serem impressos.
A mesma técnica tentou ser aplicada em editores de HTML, como o Dreamweaver, GoLive e Front Page, porém não
obtiveram sucesso, pois o próprio ambiente da Internet não permite a existência de tais ferramentas,
ou seja, não temos ferramentas que nos permitam saber com exatidão como as páginas serão visualizadas.
Portanto, é errado afirmar que tais ferramentas são WYSIWYG.

Vejamos alguns fatos que levam a esta conclusão:

Browsers

Cada browser (Navegador de Internet) possui uma maneira particular de interpretar páginas HTML e folhas de estilo
CSS. Usuários experientes e experimentadores conhecem muito bem as deformidades que algumas páginas
sofrem quando se usam diferentes navegadores para visualizá-las.
Vejamos um teste com a página da MSDN Brasil:

MSDN Brasil vizualizada pelo Internet Explorer 6.0 SP1 Internet Explorer 6.0 SP1

Aqui a página aparece sem problemas e da forma como deveria ser sempre, mas a realidade não é bem
assim.

MSDN Brasil vizualizada pelo Firefox 1.0.2 Firefox 1.0.2

Aqui podemos perceber vários problemas:
- As imagens a esquerda da tela não aparecem;
- O painel direito está completamente deformado; e
- Um banner na parte inferior direita não aparece.

MSDN Brasil vizualizada pelo Amaya 9.1 Amaya 9.1

A imagem ao lado não está com problemas! Isso mesmo, essa é a forma como o browser projetado
pela W3C e INRIA visualiza essa, e muitas outras, páginas da web.

Configurações pessoais dos usuários

A Internet possui milhões de usuários com necessidades e preferências diferentes, portanto é praticamente
impossível prever todas as possibilidades de configuração e ajustar as páginas HTML para atender
a essa enormidade de variáveis.
As imagens abaixo, apresentam o Opera 7.21 configurado de diferentes maneiras:

Opera 7.21 - 1ª Configuração Opera 7.21 – 1ª Configuração

Temos aqui uma representação otimizada da área útil de navegação do Opera
7.21.

Opera 7.21 - 2ª Configuração Opera 7.21 – 2ª Configuração

Nem todos os usuários da Internet possuem as mesmas necessidades e preferências. Aqui podemos simular
um usuário com problemas de visão e que gosta de ter todas as funcionalidades do seu browser a poucos
cliques de alcance.
Note que a resolução desta imagem é a mesma da imagem anterior. A diferença de tamanhos
entre as telas foi obtida pelo funcionalidade de zoom que o Opera 7.21 oferece.

Tamanhos e resoluções dos monitores

Qual desenvolvedor nunca arrancou uns fios de cabelo por causa das diferenças de resolução dos monitores?
Realmente um grande problema para se enfrentar.
Temos atualmente uma infinidade de monitores, que vão de monitores wide-screen de 23″ com resolução
de 1920 X 1200 pixels à monitores de 14″ com resolução de 600 X 400 pixels.
Vejamos como essas diferenças podem afetar visualmente uma página web:

Opera 7.21 - 1ª Configuração Monitor de 17″ com resolução de 1024 x 728 pixels

Os monitores de 17″ estão se tornando padrão para a felicidade dos usuários e desenvolvedores.
Geralmente possuem altas taxas de resolução, que permitem uma boa visualização da maioria
dos web sites.

Opera 7.21 - 2ª Configuração Monitor de 17″ com resolução de 600 x 400 pixels

Realmente um tormento para todos. A navegação nesta resolução é quase impraticável,
mas ainda é uma realidade para muitos usuários.

Conclusão

A Internet não é WYSIWYG. Cabe aos desenvolvedores da Web tentarem amenizar o ambiente caótico
da Internet, seguindo estritamente as regras propostas pelo W3C e conhecendo mais a fundo a estrutura da HTML e do CSS,
deixando de lado o desenvolvimento puramente visual, proporcionado pelas supostas ferramentas WYSIWYG.


Assine o nosso Feed
1.404 assinantes,
assine você também!
Publique esse artigo no Twitter Salve este artigo no Delicious Cadastre esse artigo no Dihitt Cadastre esse artigo no UEBA Cadastre esse artigo no Rec6

Deixe um Comentario

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="">

Mark_Costa

Últimos Artigos do Autor