As pantallas táctiles funcionan de forma distinta aos teclados e os ratos
Nos primeiros días de deseño de sitios web para dispositivos móbiles, a maioría dos desarrolladores bifurcaron a súa oferta de produtos. Lanzaron unha versión de escritorio totalmente funcional e, a continuación, unha versión "optimizada para móbiles" que eliminou gran parte da marca e imaxes para acomodar as capacidades limitadas e a velocidade da rede dos teléfonos de candy bar e as redes inalámbricas 3G.
Os teléfonos intelixentes contemporáneos, sen embargo, poden renderizar páxinas web de forma tan eficiente como as PC de sobremesa, a través de redes tan boas ou mellores que as liñas DSL de onte.
O deseño converte de novo a unha interface de usuario único. Pero o risco para os diseñadores non é que un teléfono intelixente ou unha tableta non poida representar un sitio web moderno e sensible. Polo contrario, é que o método de entrada do usuario nun dispositivo con pantalla táctil require cambios significativos para o deseño do sitio subxacente. Os días de construción dun sitio web asumindo que os visitantes teñen un teclado e un ratón termínanse.
Regras básicas de deseño táctil
O deseño para unha interface web táctil conectado a pantalla require unha evolución do tradicional enfoque de monitor-mouse-keyboard do pasado. En particular, ten que acomodar interaccións como xestos, billas e entrada multitouch.
- O golpeo non é preciso. A menos que o cliente teña os dedos dun neno, mesmo cos controis de software moi precisos, pode ser difícil de tocar e ser preciso.
- Os xestos son diferentes dos grifos. Para desprazar unha páxina longa nunha pantalla táctil, o usuario tropeza un dedo na xanela do navegador. Isto pode non parecer importante ata que entenda que navegar cun rato move o rato cara a abaixo .
- Dúas (e máis) grifos de dedo. Un usuario pode usar varios toques de dedo no dispositivo ao mesmo tempo para controlalo. Os grifos adicionais poden significar algo específico segundo o sistema operativo do dispositivo do usuario.
- Dispositivos de alto brillo. As pantallas da maioría das tabletas con pantalla táctil están feitas dun vaso resistente. Este material pode ser moi difícil de ler, con moita brillo, en situacións de luz brillante. Ademais, con todo o contacto, obtén impresións dixitais e manchas na pantalla que poden afectar o aspecto das páxinas.
- Teclado en pantalla. Mentres algúns usuarios teñen un teclado sen fíos que se conectan ás súas tabletas, a maioría dos usuarios de tablet usan o teclado en pantalla para a entrada de datos. A entrada de OSK pode producir algúns erros eróticos e incómodos de usar durante longos períodos de tempo.
Debido a estas características do dispositivo, os deseñadores web deben enfatizar varias regras de deseño básicas para usuarios de pantalla táctil:
- Non coloques elementos moi precisos. Non hai unha regra dura e rápida que defina o preto que está demasiado preto, pero as listas de ligazóns, especialmente nun tamaño pequeno de fonte, poden ser difíciles de navegar premendo (tocando) cun dedo gordo. Pode ser molesto ter que acelerar só para tentar facer clic nunha ligazón. Este principio é certo para botóns e enlaces.
- As xerarquías poden ser difíciles de manter abertas. Unha forma popular de menú dinámico usa JavaScript para abrir un submenú cando o usuario fai clic e despois ocupa o rato sobre o submenú. Estes estados poden ser moi difíciles ou imposibles de usar nas pantallas táctiles porque non se atopan abertas ou non se pechan.
- Mova ligazóns e áreas clickables lonxe do bordo dereito da xanela. A maioría das persoas teñen direitas e tenden a desprazarse por ese lado da pantalla. Dado que o desprazamento realízase cun xesto, ás veces é posible iniciar o desprazamento nunha ligazón por erro. Os usuarios poden molestarse se querían desprazarse na páxina e, ao contrario, terminaron tocando accidentalmente unha ligazón. Ao mover as túas ligazóns lonxe do lado dereito, podes axudalos a evitar estas molestias.
- Non hai rato. E isto significa que non hai punteiro do rato. Non debe confiar no cambio do punteiro do rato para axudar a indicar que se pode facer clic nun elemento.
- Os estados de desprazamento non existen. Como corolario para o anterior, xa que non hai rato, non hai nada para pasar. Unha ligazón é premida (tocada) ou non nun dispositivo con pantalla táctil, polo que os usuarios non poden infiltrar ningunha información útil de tales estados de desprazamento como cambios de cor, consellos de ferramentas ou cambios na barra de estado.
- Os fondos negros melloran o brillo. Un sitio con fondo negro pode ser moi difícil de ler nun dispositivo con pantalla táctil debido ao brillo. Black fai que as impresións dixitais dos dispositivos aparezan de forma máis clara, borrándose a pantalla. E o negro pode converter a pantalla nun espello reflectindo que os usuarios enfróntanse a miúdo máis que o texto na pantalla.
- Os bloques longos de texto en formularios son difíciles de escribir. Aínda que é posible escribir novelas completas nun iPad ou unha tableta con Android ou Windows, a maioría da xente non quere usar o teclado en pantalla para longos tramos de texto. Canto máis o seu deseño poida facer a entrada de datos o máis curto e sinxelo posible, mellor.
O aspecto máis importante do deseño con pantalla táctil en mente é probar as túas páxinas nun dispositivo con pantalla táctil . Aínda que hai moitos emuladores de iPad e Android dispoñibles e moitas tabletas de Windows, aínda non proporcionan a sensación de pantalla táctil. Non podes dicir que as ligazóns están moi próximas ou que os botóns son demasiado pequenos ou que o brillo fai que a páxina sexa demasiado difícil de ler, a non ser que saias unha tableta e probedes antes de lanzar o novo deseño do sitio web.