Coluna Usabilidade – Media Types e seus conceitos com usabilidade

Olá galera MX, estamos hoje falando sobre um conceito CSS chamado “Media Types”, onde temos a possibilidade de gerar Folhas de Estilo em cascata (CSS) especificas para diferentes disposições da utilização de um layout WEB, onde tanto a acessibilidade como usabilidade influenciam de forma ativa, contribuindo com a facilidade e interação do usuário com diferentes recursos utilizados atualmente.

Uma das características mais importantes de folhas do estilo é que especificam como “um original” deve ser apresentado em meios diferentes.

Determinadas propriedades do CSS são projetadas somente para determinados meios (por exemplo, ?cue-before? da propriedade para agentes aural, “tecnologia voice Browser “, do usuário). Na ocasião, entretanto, as folhas do estilo para tipos de meios diferentes podem compartilhar de uma propriedade, mas requerem valores diferentes para essa propriedade. Por exemplo, a propriedade do ?font-size? é útil para meios da Screen e de Impressão. Entretanto, os dois meios são bastante diferentes, requer valores diferentes para a propriedade comum; um original necessitará tipicamente uma fonte maior em uma tela de computador do que no papel. Sem contar que a necessidade de ter um assunto de pesquisa pronto, sem copiá-lo para um editor de texto é de fundamental importância. Experiências mostram também que a fontes sans-serif são mais fáceis de ler na tela, enquanto as Fontes serifs são mais fáceis de ler no Papel. Por estas razões, é necessário que você expresse uma folha do estilo ou uma seção de uma folha do estilo que se apliqua à um terminado Media Type.

Obs: Lembrando que essas opções de media types não se aplicam a categorias case-sensitive.

O estilo no exemplo abaixo diz ao browser para indicar uma fonte Verdana de 14 pixel para a tela do computador. Mas se a página for imprimida, estará em com uma fonte-size: 10px. Observar que font-weight está ajustado a bold(realce), na tela e no papel:

<html>
<head>
<style>
@media screen
{
p.test {font-family:verdana,sans-serif; font-size:14px}
}
@media print
{
p.test {font-family:times,serif; font-size:10px}
}
@media screen,print
{
p.test {font-weight:bold}
}
</style>
</head>
<body>
….
</body>
</html>

Media Type – Descrição.

all
- Usado para todos os tipos de dispositivos.
aural
- Usado para sintetizar discursos de Som.
braille
- Usado para dispositivos táteis de braille.
embossed
- Usado para impressoras paginadas de braille.

handheld
- Usado para dispositivos pequenos, mobile ou Palmtop.
print
- Usado para impressões comuns.
projection
- Usado para apresentações projetadas, como Slides.

screen
- Usado para telas de computador.
tty
-Pretendido para meios usando uma grade fixed-pitch do caráter, tal como teletypes, terminais, ou dispositivos portáteis com potencialidades limitadas da exposição(baixa qualidade). Os autores não devem usar unidades valores em pixel com o Media Type ?tty?.
tv
- Usado para dispositivos televisão.
Obs: As versão CSS3 podem estender esta lista.
Lembrando que atuelmente estes recursos não são seguidos ao pé da letra por desenvolvedores web, devido a não popularização dos conceitos, os mais utilizados são: Screen, print e handheld.

USABILIDADE

Segundo o WIKIPEDIA “Usabilidade é um termo usado para definir a facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa específica. A usabilidade pode também se referir aos métodos de mensuração da usabilidade e ao estudo dos princípios por trás da eficiência percebida de um objeto.” mas lembrando que aqui este preceito se baseia na interação da formatação CSS prático aplicado na Arquitetura do layout WEB, lembrando que essa flexibilidade, deve-se ao suporte atualmente oferecido pela tecnologia à liguagem e não o inverso. Como citei acima, temos as 3 opções “MEDIA TYPES” mais utilizadas: Screen, Print, Handheld; onde você deve se imaginar como seria a aplicação de usabilidade referente ao usuario.
Screen – Na sua forma padrão pode-se aplicar à uma pequena referência no seu ponto de dispositivo padrão, que seria sua visualização na tela de uma Computador (variando na suas resoluções mais utilizadas), pois somente em dispor de uma forma externa de estilo visual aplicado à página, deve-se ver o lado dos desenvolvedores, que de certa forma acabam tendo uma grande facilidade em seu uso (CSS), pois também não podemos descartar que eles sejam usuários no USO ÁTIVO DA LIGUAGEM.
Print – Vamos nos passar na seguinte situação, pessoas no qual fazem diariamente pesquisas na internet, onde necessita cópiar um determinado conteúdo, tendo a mão uma caneta e um papel, dependendo da situação se torna inviável e bem mais prático usar-se de uma impressora para imprimir seu conteúdo, mas o que sempre presencio na maioria dos casos é uma forma de cópiar o conteudo necessário e colá-lo em algum tipo de editor de texto, para posteriormente ter o trabalho de editar da forma desejada para a impressão, pois muitas vezes tem certas situações onde se envolve um design muito forte em relação à cores e imagens, onde de certa forma acaba poluindo de forma involuntária para o usuário, certo que a questão de design muitas vezes prevalece para deixar mais átivo aos assuntos e conteudos de pesquisa (imagens ilustrativas para reforçar), mas onde à acessibilidade e facilidade de uso entra para beneficiar o usuário? Então entra a seguinte questão na história, no qual podemos gerar uma página, limpa de imagens e em sua textualidade clara e limpa para impressões, na forma que o usuário apenas escolha a forma mais adequada e use dessa facilidade para se beneficiar.
Handheld – Já não é de hoje que temos a possibilidade de navegar pela internet através de dispositivos móveis (palms, celulares, ipod, etc…), onde entra a seguinte pergunta, será que poderei ver algum site em um dispositivo móvel? Podemos dizer que SIM! Mas hoje isso no brasil não se torna um hábito a será aplicado a longo prazo(falando de forma popular), pois hoje temos como foco desenvolver propostas que foi definidas a algum tempo, onde podemos chamar de WEB 2.0, que muitas vezes deixa a desejar quando vemos essa “febre” se manifestar naqueles que veêm coerência nesses principios e não temem uma segunda “Bolha” como vista em 2001 no mundo inteiro, então podemos através desse recurso deixar uma página publicada na WEB ser flexível ao ponto de poder visulizá-la em algum tipo de dispositivo móvel, um bom exemplo é o Site BB(banco do brasil), onde visto pelo OPERA 9, poderá pressionar SHIFT + F11 e vê-la em resolução de um dispositivo móvel.

FINALIZANDO

Hoje vemos muitas pessoas entre usuários e desenvolvedores de modo geral, se preocupar com essa questão de estar sempre se atualizando e vendo como o sistema padrão (webstandard em geral) da web funciona, onde eles seguem e se baseiam numa hierarquia (Regida pela W3C e Empresas Tecnológicas), onde seguimos dessa forma passos daqueles que estão acima de nós, os desenvolvedores mais fluentes do mundo. Onde atuam diretamente no orgão responsável por, podemos dizer assim, manter a ordem e organização na WEB e seus suportes em Softwares. Lembrando que todo tipo de discursão que temos fica à terminar numa conclusão óbvia, mas vejam que ela não cabe ao usuário/utilizador que está por dentro do assunto, mas aqueles que determinam que seja assim! Então antes de desenvolver, sempre esteja por dentro de assuntos, que mesmo não sendo de sua importância, de uma forma que você critique ou aceite, não cabe a você achar o que pensa e sim colocar na sua cabecinha que será daquele jeito. Mas ai entra a questão de possibilidades, onde você poderá fazer isso ou aquilo que tem a sua disposição fornecida pela Hieraquia, Empresas Desenvolvedores e Orgãos Resposáveis (Adobe Macromedia, W3C, Microsoft, Apple, etc…) como usar de ferramentas como Acessibilidade, Usabilidade, Webstandard, Animações, recursos de programação, etc e sem suas questões associar de varias maneiras o que na prática acaba se tornando mais viável em sua coerência para um resultado final satisfatório.
Espero que gostem, lembrando de ver sempre as referências que temos a nossa disposição:
The Team W3C - Vejam os responsáveis.
O’Reilly conferences – Fique pode dentro.
Obs: Contribua postando abaixo o que você considera de fundamental importância para compartilhar conosco.
Dúvidas entre em contato, comente abaixo ou Acesse o fórum.