3.3
DISEÑO DE SITIOS WEB USABLESDISEÑO DE SITIOS WEB USABLES
A continuación, se muestran los aspectos más importantes que hay que tener en cuenta para crear un sitio web usable:
Secciones del sitio webSecciones del sitio web:
- Tiene una página principal.
- Existe un buscador de los contenidos del sitio.
- Tiene un mapa de la página e índice de contenidos que están siempre accesibles.
- Se ofrece ayuda a la navegación.
- El sitio cuenta con una zona de novedades. - Tiene un menú accesible.
- Tiene páginas de ayuda.
Para cada páginaPara cada página:
- Tiene un título que describe el contenido de la página.
- Incluye elcopyright y el logotipo del sitio.
© STARBOOK CAPÍTULO 3. TÉCNICAS DE ACCESIBILIDAD Y USABILIDAD 85
- Se mantiene la coherencia y consistencia en todas las páginas del sitio.
- Elegir una selección de colores lo más apropiado posible, con el mayor contraste para los contenidos y respetando los colores corporativos.
AccesibilidadAccesibilidad:
- Todas las páginas del sitio web son accesibles desde la página principal.
- Cualquier contenido debe ser accesible con tres clics desde la página principal.
- El sitio está diseñado de forma eficiente y sencilla.
- Se ha validado el sitio según la W3C. FormulariosFormularios:
- Se validan los datos de los formularios antes de enviar.
- Si se disponen de formularios largos se indica en qué estado del proceso se encuentra (paso 1 de 3).
TextoTexto:
- Utilizar fuentes redondeadas, ya que son más legibles en pantalla, tipo: arial ,
verdana, etc.
- No utilizar más de 3 tipos de fuente distintos en el sitio.
- Utilizar sólo la negrita para los textos importantes.
Enlaces:Enlaces:Se diferencian entre los enlaces visitados y los no visitados.
ImágenesImágenes: Las imágenes tienen los tamaños adecuados y poseen información alternativa.
Hojas de estiloHojas de estilo: Las hojas de estilo ha sido validadas (ver Apartado 7.7
Accesibilidad y usabilidad ).
Aunque el principio fundamental es que el usuario debe alcanzar sus objetivos con el mínimo esfuerzo y máximos resultados, siempre adaptándose al usuario y no al contrario, siendo los más consistente posible.
86 CONSTRUCCIÓN DE PÁGINAS WEB © STARBOOK
ACTIVIDAD 3.3 ACTIVIDAD 3.3
Realiza un resumen de los criterios más importantes que debe cumplir un
sitio web accesible.
Realiza un resumen de los criterios más importantes que debe cumplir un
sitio web usable.
Realiza un resumen de los criterios más importantes que debe cumplir un
sitio web accesible.
Realiza un resumen de los criterios más importantes que debe cumplir un
sitio web usable.
TTTTTTEEEEEESSSSSSTTTTTT D DDDDDEEEEEE C CCCCCOOOOOONNNNNNOOOOOOCCCCCCIIIIIIMMMMMMIIIIIIEEEEEENNNNNNTTTTTTOOOOOOSSSSSS
1.
1. Indica cuál de las siguientes acciones pone en peligro la accesibilidad de una web.
a)
a) Proporcionar alternativas equivalentes para los contenidos audiovisuales.
b)
b) Evitar el movimiento y refresco automático de la página.
c)
c) Realizar un diseño basado en imágenes.
d)
d) Proporcionar información de contexto y orientación.
2.
2. ¿Qué criterio cumple una página de nivel AA?
a)
a) Atajos de teclado para los vínculos.
b)
b) Identificación del idioma.
c)
c) Página web vinculada a cada imagen con una descripción de la misma.
d)
d) El mapa del sitio web o la tabla de contenido.
3.
3. ¿Qué nivel de conformidad es el más alto?
a) a) El nivel W3C. b) b) El nivel A. c) c) El nivel AA. d) d) El nivel AAA. 1.
1. Indica cuál de las siguientes acciones pone en peligro la accesibilidad de una web.
a
a roporcionar alternativas equivalentes para los contenidos audiovisuales.
b)
b) vitar el movimiento y refresco automático de la página.
c)
c) ealizar un diseño basado en imágenes.
d)
d) roporcionar informaci n de contexto y orientaci n.
2.
2. ¿Qué criterio cumple una página de nivel AA?
a)
a) Atajos de teclado para los vínculos.
b)
b) Identificaci n del idioma.
c)
c) ágina web vinculada a cada imagen con una descripción de la misma. l mapa del sitio web o la tabla de contenido.
3.
3. ¿Qué nivel de conformidad es el más alto?
a) a) l nivel W3C. b b l nivel A. c) c) l nivel AA. l nivel AAA.
© STARBOOK CAPÍTULO 3. TÉCNICAS DE ACCESIBILIDAD Y USABILIDAD 87
4.
4. Indique cuál de las siguientes afirmaciones es falsa.
a)
a) La usabilidad implica facilidad de aprendizaje.
b)
b) La usabilidad empeora la imagen corporativa al hacer páginas más simples.
c)
c) La usabilidad conlleva la reducción del número de errores del usuario.
d)
d) La usabilidad aumenta la satisfacción del cliente.
5.
5. Si se cumplen las pautas de accesibilidad se asegura. Indique cuál de las siguientes afirmaciones es falsa:
a)
a) Que cualquier usuario pueda acceder a la página.
b)
b) Que es accesible independientemente del hardware utilizado.
c)
c) Se obtiene peor posicionamiento porque la página se hace más ilegible y pesada, al tener mucho más código.
d)
d) Normalmente se llega a más público aumentando el número de visitantes.
4.
4. Indique cuál de las siguientes afirmaciones es falsa.
a
a a usabilidad implica facilidad de aprendizaje.
b)
b) a usabilidad empeora la imagen corporativa al hacer páginas más simples.
c)
c) a usabilidad conlleva la reducción del número de errores del usuario.
d)
d) a usabilidad aumenta la satisfacci n del cliente.
5.
5. Si se cumplen las pautas de accesibilidad se asegura. Indique cuál de las siguientes afirmaciones es falsa:
a)
a) Que cualquier usuario pueda acceder a la página.
b)
b) Que es accesible independientemente del hardware utilizado.
c)
c) Se obtiene peor posicionamiento porque la página se hace más ilegible y pesada, al ener mucho más código.
d)
d) ormalmente se llega a más público aumentando el número de visitantes.
EEEEEEJJJJJJEEEEEER R R R R R CCCCCCIIIIIICCCCCCIIIIIIOOOOOOSSSSSS P PPPPPR R R R R R OOOOOOPPPPPPUUUUUUEEEEEESSSSSSTTTTTTOOOOOOSSSSSS
1.
1. Realice el test de accesibilidad a tres páginas de portales web famosos e indique el número de fallos generados para cada nivel de prioridad.
2.
2. Realice un test a una de las páginas web desarrollada en el ejercicio 1 del tema 2, y corrija los errores hasta adaptarla a un nivel de accesibilidad 3.
3.
3. Escoja tres herramientas para validar la accesibilidad y compárelas realizando un análisis para un mismo sitio. Indique cuál ha sido la mejor herramienta.
4.
4. Instala la versión de escritorio de TAW y genera los informes de resumen y TAW para una página web de su elección.
1.
1. Realice el test de accesibilidad a tres páginas de portales web famosos e indique el número de fallos generados para cada nivel de prioridad.
2.
2. Realice un test a una de las p ginas web desarrollada en el ejercicio 1 del tema 2, y corrija los errores hasta adaptarla a un nivel de accesibilidad 3.
3.
3. Escoja tres herramientas para validar la accesibilidad y compárelas realizando un análisis para un mismo sitio. Indique cuál ha sido la mejor herramienta.
4.
4. Instala la versi n de escritorio de TAW y genera los in formes de resumen y TAW para una p gina web de su elecci n.
4
4
CapítuloCapítulo
4
HERRAMIENTAS DE EDICIÓN WEB
HERRAMIENTAS DE EDICIÓN WEB
OBJETIVOS: OBJETIVOS:
Conocer los diferentes tipos de herramientas web.
Utilizar herramientas para crear páginas web.
Utilizar herramientas para editar los diferentes elementos multimedia.
4.1
4.1
INTRODUCCIÓNINTRODUCCIÓN
Para crear páginas web, es necesario utilizar diferentes tipos de herramientas que facilitan el trabajo. Para crear páginas no es necesario utilizar únicamente herramientas de edición HTML ya que además, la página web incorpora imágenes, sonido, etc.
En la tabla 4.1 se muestran las herramientas más utilizadas para la creación de páginas web y que se clasifican en las siguientes categorías: edición HTML, edición de imágenes, edición de sonido, edición de vídeo y animaciones.
Otra forma de clasificar las herramientas es a través de su licencia. Básicamente se pueden clasificar en herramientas comerciales o basadas en software libre. Aunque las herramientas comerciales suelen tener una mayor funcionalidad, hoy en día las herramientas basadas en software libre proporcionan unas grandes funcionales que permiten crear sin problemas cualquier sitio web.
A lo largo del libro va a aprender a utilizar las herramientas más importantes de edición de páginas web, de imágenes y de sonido, aunque nos centraremos en el uso de herramientas basadas ensoftware libre.
90 CONSTRUCCIÓN DE PÁGINAS WEB © STARBOOK
Tabla 4.1. Herramientas más utilizadas Tabla 4.1. Herramientas más utilizadas
Nombre
Nombre Licencia Licencia URLURL Edición web
Edición web
FrontPage Comercial http://www.microsoft.com/latam/office/frontpage/prodinfo/default.mspx
Dreamweaver Comercial http://www.adobe.com/es/products/dreamweaver.html?promoid=BPBIM
Netbeans Libre http://netbeans.org/
Eclipse Libre http://www.eclipse.org/
NVU Libre http://net2.com/nvu/
Bluefish Libre http://bluefish.openoffice.nl/index.html
Edición de imágenes Edición de imágenes
Gimp Libre http://www.gimp.org.es/
Photoshop Comercial http://www.adobe.com/es/products/photoshop.html
CorelDraw Comercial http://www.corel.com/es
Inkscape Libre http://inkscape.org/?lang=es
Edición de sonido Edición de sonido
Audacity Libre http://audacity.sourceforge.net/?lang=es
GoldWave Comercial http://www.blender.org/
Edición de vídeo Edición de vídeo
Adobe Premiere Comercial http://www.adobe.com/es/products/premiere.html?promoid=BPBJH
Avidemux Libre http://avidemux.sourceforge.net/
Animaciones Animaciones
Adobe Flash Comercial http://www.adobe.com/es/products/flash.html
Openlaszlo Libre http://www.openlaszlo.org/
© STARBOOK CAPÍTULO 4. HERRAMIENTAS DE EDICIÓN WEB 91