Deseño web

O deseño web é unha actividade que consiste na planificación, deseño, posta en funcionamento e mantemento de sitios web. Non é simplemente a introdución do deseño convencional xa que se abarcan diferentes aspectos como o deseño gráfico web, deseño de interface e experiencia de usuario, como a navegabilidade, interactividade, usabilidade, arquitectura da información; interacción de medios, entre os que podemos mencionar son, texto, imaxe, ligazóns, vídeo e a optimización de motores de procura. A miúdo moitas persoas traballan en equipos que cobren os diferentes aspectos do proceso de deseño, aínda que existen algúns deseñadores independentes que traballan sós.

Libros sobre deseño web nunha libraría.

A unión dun bo deseño cunha xerarquía ben elaborada de contidos, aumenta a eficiencia da web como canle de comunicación e intercambio de datos, que brinda posibilidades como o contacto directo entre o produtor e o consumidor de contidos.

O deseño web viu ampla aplicación nos sectores comerciais de Internet especialmente na World Wide Web. A miúdo a web utilízase como medio de expresión plástica en si. Artistas e creadores fan das páxinas en Internet un medio máis para ofrecer as súas producións e utilizalas como unha canle máis de difusión da súa obra.

Deseño web aplicado

O deseño de páxinas web é a construción de documentos de hipertexto para a súa visualización en diferentes navegadores. Así como asignarlle unha presentación para diferentes dispositivos de saída (nunha pantalla de computador, en papel, nun teléfono móbil etc).

Estes documentos ou páxinas web poden ser creadas:

• Creando arquivos de texto en HTML, Asp, Aspx, JavaScript, JSP, Python, Ruby.
• Utilizando un programa visual WYSIWYG ou WYSIWYM de creación de páxinas.
• Utilizando Script ao lado do servidor, para xerar a páxina web.

Etapas

Para o deseño de páxinas web debemos ter en conta tres etapas:

1. O deseño visual da información que se desexa editar. Nesta etapa trabállase distribuíndo o texto, os gráficos, os vínculos a outros documentos e outros obxectos multimedia que se consideren pertinentes. É importante que antes de 'escribir' a páxina web se realice un bosquexo ou predeseño. Isto facilitará ter unha orde clara sobre o deseño.
2. Estrutura e relación xerárquica das páxinas do sitio web. Para isto, e fundamentalmente para manexar os vínculos entre documentos, creouse a linguaxe de marcación de hipertexto ou HTML. As ligazóns que aparecen subliñadas neste documento e outros de Wikipedia son exemplos de hipertexto, posto que ao pulsar sobre eles conducen a outras páxinas con información relacionada. A importancia da estrutura e arborescencia web radica en que os usuarios non sempre entran pola páxina principal ou inicial e nese caso o sitio debe darlle a resposta ao que busca rápido, ademais permitirlle navegar polo sitio.
3. Posicionamento en buscadores ou SEO. Esta consiste en optimizar a estrutura do contido para mellorar a posición en que aparece a páxina en determinada procura.

O HTML consta dunha serie de elementos que estruturan o texto e son presentados en forma de hipertexto por axente de usuario ou navegadores. Isto pódese facer cun simple editor de textos (debe gardarse como texto plano, sen ningún tipo de formato e con extensión .html ou .htm). Aprender HTML é relativamente fácil, así que é sinxelo crear páxinas web deste xeito. Esta era a única maneira de xeralas ata que apareceron, a mediados de 1996, algúns editores visuais de HTML, como MS FrontPage e Adobe Dreamweaver. Con estas ferramentas non é necesario aprender HTML (aínda que si aconsellable), co cal o desenvolvedor de software concéntrase no máis importante, o deseño do documento.

Un bo deseño web é aquel que considera dentro do seu desenvolvemento tanto os elementos básicos do deseño gráfico (a diagramación, a cor, os gráficos e as fontes) como os fundamentos técnicos (estrutura, compatibilidade, funcionalidade e interactividade) para crear tanto o impacto visual como a experiencia de usuario óptima para a asimilación do contido.

Fundamentos

O deseño web implica coñecer como se deben utilizar cada un dos elementos permitidos no HTML, é dicir, facer un uso correcto desta linguaxe dentro dos estándares estabelecidos pola W3C e no referente á web semántica. Debido á permisividade dalgúns navegadores web como Internet Explorer, esta premisa orixinal perdeuse. Por exemplo, este navegador permite que non sexa necesario pechar as etiquetas do marcado, utiliza código propietario etc. Isto impide que ese documento web sexa universal e independente do medio que se utilice para ser mostrado.

A web semántica, por outra banda, avoga por un uso lóxico dos elementos segundo o significado para o que foron concibidos. Por exemplo utilizarase o elemento <P> para marcar parágrafos, e <TABLE> para tabular datos (nunca para dispor de maneira visual os diferentes elementos do documento). Na súa última instancia, isto supuxo unha auténtica revolución no deseño web posto que aposta por separar totalmente o contido do documento da visualización.

Desta forma utilízase o documento HTML unicamente para conter, organizar e estruturar a información e as follas de estilo CSS para indicar como se mostrará dita información nos diferentes medios (por exemplo, un monitor de computadora, un teléfono móbil, impreso en papel, lida por un sintetizador de voz etc.). Por lóxica, esta metodoloxía beneficia enormemente a accesibilidade do documento.

Tamén existen páxinas dinámicas, as cales permiten interacción entre a web e o visitante, proporcionándolle ferramentas tales como buscadores, chat, foros, sistemas de enquisas etc. e posúen dun panel de control de administración de contidos. Este permite crear, actualizar e administrar cantidades ilimitadas de contido na mesma.

Accesibilidade

O deseño web debe seguir uns requirimentos mínimos de accesibilidade web que faga que os seus sitios web ou aplicacións poidan ser visitados polo maior número de persoas. Para conseguir estes obxectivos de accesibilidade desenvolvéronse pautas como as do W3C: pautas de accesibilidade ao contido web 1.0 WCAG.a

Historia

Nun principio era só texto, pero a medida que evolucionou a tecnoloxía, tanto os computadores como as redes de telecomunicacións, xeráronse novas formas de desenvolver a web. A inclusión de imaxes foi a máis significativa, pero tamén debemos mencionar o vídeo e a animación, ou os espazos 3D, o que achega valores estilísticos, de deseño e de interactividade xamais imaxinados antes.

O deseño de páxinas web desenvolveuse a medida que evolucionou Internet. En 1992 só había ao redor de 50 sitios web. Estatísticas (2005) afirmaba que a cantidade de sitios web roldaba os 8000 millóns de sitios, aos que diariamente se lles suma por mor de 4400 por día.

Rapidamente, a súa importancia alcanzará as mesmas cotas que a televisión ou o teléfono. Datos recentes estiman que hai ao redor de dous mil millóns de páxinas colgadas e espérase que nos próximos anos chegue aos oito mil millóns, excedendo o número de habitantes do planeta. Con todo, só unha fracción deste número é visitado habitualmente pola maioría dos usuarios (só ao redor de 15 000 sitios webs, o 0,4 % do total).

A partir destes datos pódese entender a necesidade de concentrar os esforzos para atraer e manter a atención dos usuarios. Xunto cun desenvolvemento efectivo da estrutura web e do contido, o deseño e o uso da cor son a chave para atraer e ser identificado, formando vínculos no subconsciente do usuario e xerar esquemas para captar e fidelizar a novos visitantes.

Ao mesmo tempo que a evolución dos aparellos e da súa introdución nos fogares, tamén aumentou a calidade das transmisións a través de Internet e baixou o seu prezo. A medida que a tecnoloxía liquidou estas dificultades, xa non nos atopamos con problemas de forma senón de contido.

HTML 5

A última versión desta linguaxe básica corresponde ao HTML5, onde se introducen novos elementos que melloran a navegación e a usabilidade dos sitios web nos distintos navegadores, por exemplo o uso de <canvas> <video> , ou <footer>.

Esta nova versión non se trata soamente de cambiar e eliminar etiquetas. Vai moito máis aló.

En todo sitio web hai elementos que se utilizan. O encabezado (header), barras laterais (sidebars), o pé de páxina (footer), os menús de navegación, utilizaranse nesta nova versión como etiquetas xa estabelecidas, brindando unha mellora na intuición para o desenvolvemento.

Así mesmo, unha das maiores melloras é a utilización de "Canvas" ou marcos de traballo, que serven para utilizar animacións sen necesidade de instalar plugins nin usar un reprodutor Adobe Flash para vídeos web, estándar considerado de facto. Esta opción é un gran avance, xa que Flash ten grandes desvantaxes nos gráficos web, como que os motores de busca non poidan ler o texto dentro, que pesan moito e tardan en cargar. Ao introducirse con canvas, usarase unicamente código Javascript, alixeirando o peso da páxina.

Tamén quedan obsoletos algúns elementos do HTML 4, razón pola cal é conveniente repasar acerca das novidades que inclúe HTML5, cuxo linguaxe é regulado por W3C.

Véxase tamén

Outros artigos

• Deseño web adaptativo
• WAI
• World Wide Web Consortium
• Accesibilidade web
• W3C
• Posicionamento en buscadores
• Dominio de Internet
• Aloxamento web
• Correo corporativo