ACCESIBILIDAD WEB

 Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

INTRODUCCIÓN Según estudios recientes el 90 % de sitios Web sufre problemas de accesibilidad y/o la usabilidad.

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

DEFINICIÓN DE ACCESIBILIDAD WEB “El poderde la Web reside en su universalidad. El acceso por cualquiera independientemente de sus discapacidades es un aspecto esencial” (TimBerners-Lee, uno de los padres de la Web) “Hablar de Accesibilidad Web es hablar del acceso de todos a la Web, independientemente del tipo de hardware, software, infraestructura de red, idioma, cultura, localización geográfica y capacidades de los usuarios.” (W3C, oficina española) Que el mayor número de usuarios puedan acceder a la Web NO existe la “accesibilidad absoluta”

MITO: la accesibilidad web es sólo “para ciegos” FALSO Los criterios de accesibilidad ayudan a personas con deficiencias físicas(visuales, auditivas, motrices), cognitivas, de lenguaje, …etc. PERO TAMBIÉN ES VERDAD QUE: Usuarios con discapacidades temporales. Usuarios de edad avanzada. Dispositivos menos (?) habituales: móviles, PDAs; versiones antiguas SO/navegador; conexiones lentas Entornos especiales (kioskos públicos; entornos ruidosos, fábricas, etc.)

Acceso Universal

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

¿ POR QUÉ NECESITAMOS ACCESIBILIDAD? Razones éticas Razones sociales Razones políticas Razones económicas Razones legales: En algunos países es política de Estado –En los Estados Unidos, por ejemplo, existe la Sección 508 de la Ley de Rehabilitación que exige alojamiento razonable para empleados con problemas de discapacidad, y ese requisito se extiende a la accesibilidad en la Red. –En Europa, a través de la Iniciativa eEurope, a partir del año 2005 los sitios oficiales deben ser accesibles.

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

¿ QUÉ USUARIOS PUEDEN TERNER PROBLEMAS DE ACCESIBILIDAD? La accesibilidad es para todos nosotros y no para el otro.

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

PROBLEMAS DE ACCESIBILIDAD EN LA WEB (1) Personas con problemas visuales (o dispositivos como PDAs, móviles, etc.) Sólo “ven” texto de modo secuencial (usan lectores de pantalla/navegadores por voz, como JAWS, PwWebSpeak, Orca, Home Page Reader o terminales Braille, entre otros.) Necesitan textos grandes No distinguen bien los colores (daltonismo, miopía, etc.) que usan magnificadores de pantalla o navegan en ambientes con deficiente iluminación. –Imágenes sin descripción textual –Tablas y marcos (frames) mal etiquetados –Colores de bajo contraste –Texto no escalable –Ventanas emergentes (pop-up) –No funcionan con teclado

EJEMPLO Con un lector de pantalla o un navegador parlante, el usuario oiría el siguiente texto: “Instrucciones para dar cuerda al reloj bra de una mujer, el perfume del pan. Por Julio Cortázar ¿Qué mas quiere, qué mas quiere? Átelo... pronto a su muñeca, déjelo latir en libertad, Allá al fondo está la muerte, pero no tenga imítelo...”

PROBLEMAS DE ACCESIBILIDAD EN LA WEB (2) Personas con discapacidades cognitivas/ de aprendizaje: Pueden tener problemas para “entender” los contenidos o para concentrarse Problemas de memoria Dislexia, diversos grados de retraso mental o con limitaciones de aprendizaje). Errores de paginas para este tipo de discapacidad: Documentos con estructura mal definida Demasiada información en una página Lenguaje innecesariamente complejo Falta de imágenes para clarificar el texto Animaciones y elementos decorativos superfluos

PROBLEMAS DE ACCESIBILIDAD EN LA WEB (3) Personas con discapacidades auditivas (o en entornos ruidosos o con equipos sin hardware de audio) Pueden tener problemas para acceder a los contenidos sonoros –Audio/vídeo sin descripciones textuales –Frases complejas o demasiado largas

PROBLEMAS DE ACCESIBILIDAD EN LA WEB (4) Personas con discapacidades motoras (que le impidan usar el mouse (o ratón) y/o el teclado, o que no tengan mouse (terminales UNIX, telefonía móvil, PDA’s, iPhone, smartphones, Blackberry, etc.) o teclado (WebTV, terminales callejeros o kioscos informáticos, etc.). Tienen que usar el teclado u otros dispositivos (reconocimiento de voz) –Páginas que no funcionan con teclado

PROBLEMAS DE ACCESIBILIDAD EN LA WEB (5) Edad de las personas -no poseen todas sus capacidades (físicas y/o mentales) en su mejor nivel Problemas debido a su educación formal, con analfabetismo, o con pocos años de formación, o hablen otro idioma Computadoras antiguas, poca memoria RAM, procesador antiguo, etc. Software antiguo (o Software muy moderno ) Hardware no estándar, como teléfonos celulares, iPhone, smartphones, terminales Braille, terminales UNIX, PDA’s, Blackberry, etc. Conexiones lentas y costosas. Conexiones y equipos ajenos.

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

Cómo se consigue una WEB accesible? Conociendo y cumpliendo los estándares De los lenguajes utilizados (HTML, CSS; etc.) Específicos de accesibilidad Testeando Diferentes entornos (navegadores, sistemas operativos, etc.) Con usuarios reales

MITO: para ser accesible basta con tener una versión “sólo texto” FALSO Sólo para determinados usuarios Suponen una discriminación (“entrar por la puerta trasera”) Problemas por contenidos duplicados: –mantenimiento –indexación en buscadores Se descuida la accesibilidad de la versión “normal” ¿Cómo llego a la versión accesible? MEJOR: si es posible, una única versión que cumpla los estándares de accesibilidad

EJEMPLO

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

¿Qué ESTÁNDARES? (1) Lenguajes/técnicas utilizados: –HTML válido –CSS válido –JavaScript “no obstructivo” –Etc. IMPORTANTE: separar contenido vs. aspecto El mismo contenido para todos los usuarios Aspecto en función de las condiciones particulares

Con el mismo contenido HTML

¿Qué ESTÁNDARES? (2) Section 508 (USA) WAI(Web Accessibility Initiative) –Internacionales, W3C –Sugeridas por la Comisión Europea UNE “Requisitos de accesibilidad para contenidos Web”(España). Basada en WAI

WAI (Web Accessibility Initiative) Forma parte del W3C(World Wide Web Consortium) Recomendaciones y directrices sobre: –Contenido web(WCAG) Contenidos weba ccesibles –Herramientas de autor (ATAG) Herramientas de creación accesibles y que generen contenidos accesibles –Agentes usuario (navegadores) (UAAG) Navegadores accesibles –Aplicaciones XML (XAG) Para aplicaciones XML (draft)

WCAG (Web Content Accessibility Guidelines) Cómo crear contenidos web accesibles 14 principios generales (guidelines) – Cada guideline incluye puntos de verificación (checkpoints) – Cada checkpoint tiene una prioridad: 1.Debe satisfacerse; requerimientos básicos (14) 2.Debería satisfacerse; eliminar barreras significativas (30) 3.Puede satisfacerse; acceso mejorado (19) Además: técnicas, ejemplos, enlaces, etc.

WCAG guidelines(1) 1. Proporcione alternativas equivalentes para el contenido visual o auditivo. 2. No se base solo en el color. 3. Utilice marcadores y hojas de estilo y hágalo adecuadamente. 4. Identifique el idioma usado. 5. Cree tablas que se transformen correctamente. 6. Asegúrese de que las páginas que incorporan nuevas tecnologías se transformen correctamente. 7. Asegure al usuario el control sobre los cambios de los contenidos tempo- dependientes. 8. Asegure la accesibilidad directa de las interfaces de usuario incrustadas. 9. Diseñe para la independencia de dispositivo. 10. Utilice soluciones provisionales. 11. Utilice las tecnologías y pautas del W3C. 12. Proporcione información de contenido y presentación. 13. Proporcione mecanismos claros de navegación. 14. Asegúrese de que los documentos sean claros y simples.

WCAG: ejemplo guideline Guideline 2. Don't rely on color alone. Ensure that text and graphics are understandable when viewed without color. –If color alone is used to convey information, people who cannot differentiate between certain colors and users with devices that have non-color or non-visual displays will not receive the information. When foreground and background colors are too close to the same hue, they may not provide sufficient contrast when viewed using monochrome displays or by people with different types of color deficits. Checkpoints: 2.1 Ensure that all information conveyed with color is also available without color, for example from context or markup. [Priority1] Techniques for checkpoint Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen. [Priority2 for images, Priority3 for text]. Techniques for checkpoint 2.2

WCAG: ejemplo técnicas 2.1 Ensure that all information conveyed with color is also available without color, for example from context or markup. [Priority1] (Checkpoint 2.1) – Core Techniques: Structure vs. Presentation –CSS Techniques: Ensuring information is not in color alone […] For example, when asking for input from users, do not write "Please select an item from those listed in green." Instead, ensure that information is available through other style effects (e.g., a font effect) and through context (e.g,. comprehensive text links). […]

No confiar únicamente en el color

WCAG: niveles de cumplimiento A, AA y AAA -3 niveles de cumplimiento de las guidelines WCAG por parte de páginas o sitios web: Conformidad nivel “A” Cumplen todos los checkpointsde prioridad 1(“deben”) Conformidad nivel “AA” Cumplen todos los checkpointsde prioridad 1 y 2 (“deberían”) Conformidad nivel “AAA” Cumplen todos los checkpointsde prioridad 1, 2 y 3 (“pueden”) -Las declaraciones de conformidad (“los sellos”) se incluyen por decisión propia(W3C NO las verifica) -Habitualmente se intenta alcanzar el nivel “AA”

Cuadro de Comparaciones – Prioridad 1

Cuadro de Comparaciones – Prioridad 2

Cuadro de Comparaciones – Prioridad 3

¿CÓMO SE SABE SI UNA PÁGINA WEB ES ACCESIBLE? 1. Revisar la página con, al menos, un validador automático de accesibilidad. 2. Revisar manualmente los posibles problemas de accesibilidad que no puedan ser testeados por los validadores automáticos. 3. Navegar la página con distintos navegadores, desde diversos sistemas operativos (incluyendo navegadores visuales, parlantes, textuales, WebTV, teléfonos celulares, PDA’s, etc.) y desde distintos hardware. 4. Revisar el uso del color en la página. 5. Navegar la página con las imágenes deshabilitadas. 6. Navegar la página con el sonido desconectado. 7. Navegar la página con Javascript deshabilitado. 8. Navegar la página con applets de Java deshabilitado. 9. Navegar la página sólo con el teclado, sin el mouse. 10. Revisar el código de la página para ver si es válido. 11. Navegar la página con conexiones lentas. 12. Navegar la página con computadoras antiguas. 13. Por último, pero (obviamente) no menos importante, pedirle a personas con diversos problemas de discapacidad (visuales, motrices, cognitivos) que naveguen la página.

HERRAMIENTAS AUTOMÁTICAS DE VALIDACIÓN Online y offline Para comprobar sintaxis de HTML, CSS, etc. –W3C (HTML Validation Service; CSS Validation Service; etc.) –Otras herramientas (HTML Tidy; etc.) Para validación de accesibilidad –WebXACT/Bobby; CynthiaSays; TAW; eXaminator –Comprueban si se cumplen determinados checkpoints de WCAG –Sirven como herramienta de apoyo, pero NO son suficientes para evaluar la accesibilidad

MITO: los validadores automáticos indican si una página es accesible o no FALSO Los validadores comprueban la sintaxis (HTML, CSS, etc.) Los validadores comprueban algunos checkpoints PERO… Muchos checkpoints son interpretables y necesitan validación manual. Las herramientas automáticas pueden producir “falsos negativos” y “falsos positivos” Guidelines, checkpoints, validadores automáticos y sellos son herramientas e indicadores, NO un objetivo Lo importante: la accesibilidad real

EJEMPLOS DE HERRAMIENTAS AUTOMATICAS TAW (Fundación CTIC). Se trata de la herramienta de evaluación automática de accesibilidad de habla hispana más extendida. Para más información puede consultarse el ANEXO “TAW – Test de Accesibilidad Web”. Bobby (Watchfire) Es el validador automático de accesibilidad más utilizado a nivel mundial. La comprobación de accesibilidad se basa tanto en las pautas WCAG 1.0 como en las de la sección 508 (Estados Unidos). HERA (Fundación Sidar) Herramienta online diseñada para facilitar a los desarrolladores la tarea de la revisión manual de accesibilidad de las páginas Web según las WCAG Cynthia Says : Se trata de un proyecto educacional promovido por varias organizaciones y empresas creado para divulgar la accesibilidad Web entre los desarrolladores. Se basa tanto en las pautas WCAG 1.0 como en la sección The Wave : Herramienta de validación y de reparación que se basa en las WCAG y en la sección 508. No realiza un análisis exhaustivo de las páginas, sino que sirve de ayuda a los desarrolladores en determinadas comprobaciones.

HERRAMIENTAS MANUALES Web Developer Toolbar – Firefox Accessibility Extension – Web Accessibility Toolbar (Internet Explorer) – –Opera: about.html Internet Explorer Developer Toolbar – milyid=e59c d-4511-bb3e- 2d5e1db91038&displaylang=en

Extensiones de Firefox Firebug Esta extensión permite a los desarrolladores modificar directamente el código fuente HTML, CSS, JavaScript, etc. contenido en la página Web. También permite ver el código del documento de forma dinámica, según es generado o modificado por los scripts.

Extensiones de Firefox Document Map Esta extensión permite desplegar la estructura de encabezados de cada página Web.

Extensiones de Firefox Fangs Esta extensión muestra el contenido de la página emulando un lector de pantalla. La página Web se convierte en una página solo texto en la que se detalla tanto el contenido del documento como los mensajes propios de los lectores de pantalla (identificando enlaces, imágenes, encabezados, listas, tablas, etc.).

EXTENSIONES FIREFOX Metatags Esta extensión muestra los metadatos de una Web con cómodo acceso a los vínculos como ficheros CSS y los datos relevantes como el MIME type, Content-type, keywords, strict-mode, etc.

EXTENSIONES FIREFOX HMTL Validator Tidy

Herramientas de evaluación de color y contraste Colour Contrast Analyser Para comprobar las combinaciones de color de primer plano y color de fondo (contraste) se puede utilizar la herramienta Colour Contrast Analyser. La aplicación Colour Contrast Analyser trabaja con dos algoritmos: el de diferencia de brillo y color y el de luminosidad, siendo el primero el que se debe usar ya que el algoritmo de luminosidad aún se encuentra en fase experimental. Se considerará como válida la combinación de color de primer plano y fondo siempre y cuando supere los umbrales mínimos (125 para el diferencial de brillo y 500 para el diferencial de color).

Herramientas de evaluación de color y contraste Fujitsu ColorDoctor Es una aplicación que emula los diferentes tipos de daltonismo: deuteranopia, protanopia y tritanopia. Además convierte a escala de grises la página Web. y/assistance/cd/

Herramientas de evaluación de color y contraste Fujitsu ColorSelector Es una herramienta que permite determinar la combinación de color de primer plano y color de fondo más accesible. cessibility/assistance/cs/

Simuladores de discapacidades Vischeck colour blindness Simulator Herramienta online que permite emular los diferentes tipos de daltonismo.

Simuladores de discapacidades Visual Impairment Simulator Es una herramienta que simula diferentes tipos de deficiencias visuales (glaucoma, degeneración macular, hyperopia, etc)

NAVEGADORES Los navegadores gráficos principales son: Internet Explorer, Mozilla Firefox, Opera, Netscape, Galeon, Konqueror, Safari BrowserCam ( que permiten comprobar cómo se visualizarían las páginas en diferentes navegadores y sistemas operativos. Navegador de texto: LYNX Con los navegadores de texto se puede observar si el contenido de la página está bien estructurado y en su correcto orden de lectura. De esta forma se comprueba que toda la información ofrecida en un navegador visual también está disponible en uno de texto. LYNX es gratuito y está disponible para diversos sistemas operativos como VMS, Windows, Linux o Unix. Este navegador puede instalarse en una máquina local o utilizar algún servicio online de emulación como Delorie Lynx Viewer o Lynx-me

HERRAMIENTAS DE APOYO Al revisar la accesibilidad de un sitio Web se deben emplear productos de apoyo para comprobar que, en un caso de uso real, no existen problemas de acceso a los contenidos. Los lectores de pantalla permiten a las personas con discapacidad visual la navegación y la interacción con el sistema operativo y sus aplicaciones, incluyendo los navegadores Web. Los navegadores de voz sólo proporcionan acceso a Internet. Ambos transforman el texto en voz.

HERRAMIENTAS DE APOYO JAWS for Windows (Freedom Scientific): Es uno de los lectores de pantalla más conocidos. Esta herramienta permite a los usuarios con discapacidad visual usar su ordenador, el sistema operativo y todas las aplicaciones, así como acceder a Internet. ware_jaws.asp Desventajas de JAWS: Uso complicado

HERRAMIENTAS DE APOYO Window-Eyes (GW Micro): Es posiblemente el segundo lector de pantalla más usado, después de JAWS. Home Page Reader (IBM): Esta herramienta es un navegador de voz para personas invidentes o con otras discapacidades visuales.

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

Comprobar que es accesible… Leyendo el contenido: –Lenguaje sencillo –Abreviaturas, idiomas, … –¿Se entiende? Comprobar navegadores gráficos –Firefox, Internet Explorer, Opera, Safari, … –Diferentes plataformas, versiones y sistemas operativos –Diferentes configuraciones: Desactivando imágenes, CSS, JavaScript, sonido, etc. Diferentes resoluciones de pantalla, tamaños de texto, combinaciones de colores o B/N, etc. Usar navegadores sólo texto; lectores de pantalla Usar dispositivos alternativos (sólo con teclado)

Pruebas con usuarios Similares a los tests de usabilidad: –Observación de usuarios reales mientras se enfrentan al sitio web Proporcionan mucha información útil, pero son muy complejos: –Definir tareas representativas –Existe gran cantidad de tipologías de discapacidad

TAW - TEST DE ACCESIBILIDAD WEB TAW (Test de Accesibilidad Web), desarrollado por la Fundación CTIC es la herramienta de evaluación automática de accesibilidad de habla hispana más extendida. Dispone de una versión online y de otra descargable que permite trabajar sin conexión a Internet, siendo ambas versiones gratuitas. Además existe una extensión para Firefox: TAW3 en un clic ( )

TAW - TEST DE ACCESIBILIDAD WEB En el resumen el TAW muestra: -Un listado con los problemas de accesibilidad encontrados (ordenados por prioridad) y su descripción. -El número de línea de la página en la que se produce el error. -La etiqueta HTML que genera problemas de accesibilidad.

EJERCICIO VALIDANDO LA PAGINA DE LA FIEC CON TAW

EJERCICIO VALIDANDO LA PAGINA DE LA FIEC CON EJERCICIO VALIDANDO LA PAGINA DE LA FIEC CON HERA

EJERCICIO VALIDANDO LA PAGINA DE LA FIEC CON EJERCICIO VALIDANDO LA PAGINA DE LA FIEC CON Cynthia Says

EJERCICIO W EJERCICIO Web Page Speed Report

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

WCAG 2.0 Hasta ahora hemos usado las WCAG 1.0 WCAG 2.0 son public working draft(borrador de trabajo público) para su revisión por la comunidad –Sin cambios radicales respecto a 1.0 –Más genéricas, aplicables a diferentes tecnologías –Requisitos más comprobables; lenguaje más claro –Cambios en terminología: Principios de diseño (nuevo) Guidelines –Criterios de éxito (checkpoints) Algunas críticas –Demasiado voluminosas –Demasiado genéricas

RIAs (Rich Internet Applications) Conseguir interfaces “de escritorio” en la web Algunas aplicaciones: –Google(Gmail; GoogleMaps); Flickr; YouTube;... Tecnologías: –AJAX; Flash; Java; DHTML; etc. Ya no son interfaces “insertados” en una página web, sino que son la propia interfaz. WAI-ARIA(WAI AccessibleRichInternet Applications) en desarrollo Mientras tanto… –Estándares para conseguir degradación progresiva –Proporcionar versión alternativa

¿“Demasiada accesibilidad”? (1) WCAG 1.0, checkpoint 13.1 [P2] “Clearly identify the target of each link” “...content developers may further clarify the target of a link with an informative link title”

¿“Demasiada accesibilidad”? (2) Permite cambiar el tamaño del texto,pero… –Duplica funcionalidad del navegador –No funciona en otras páginas –El usuario no sabe/aprende cómo hacerlo con el navegador

¿“Demasiada accesibilidad”? (3)

ACCESIBILIDAD WEB  Introducción  ¿Qué es la accesibilidad Web?  ¿Por qué necesitamos accesibilidad?  ¿Qué usuarios pueden tener problemas de accesibilidad?  Problemas de accesibilidad en la Web.  ¿Cómo se consigue?  Estándares  ¿Cómo se sabe si una página web es accesible?  Testeando  Retos  Conclusiones

CONCLUSIONES Permite que el mayor número posible de personas acceda a los contenidos (no sólo discapacitados). Beneficia a todos los usuarios, haciéndoles más fácil el acceso a las páginas (mejor usabilidad). Reduce costes de mantenimiento/desarrollo: –Una única versión para todas las plataformas –Es más fácil hacer cambios (contenido vs. presentación) –Mayor “vida útil”de los contenidos –Las técnicas se pueden aplicar a diferentes sitios Cumplir estándares mejora la visibilidad en Internet (buscadores).

MITO: las páginas accesibles son feas

POSICIONAMIENTO WEB

 Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

INTRODUCCIÓN Lo más importante a la hora de crear una página web es su optimización web y el posicionamiento conseguido en los motores de búsqueda, posicionamiento Existen gran cantidad de trucos no legales para la optimización de una página Web que la mayoría de los buscadores penalizan por ser ilegales. Confunden a los usuarios y no ofrecen información útil sobre las consultas.

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

El contenido es la clave Buenos contenidos ¿Por qué necesito buenos contenidos? ¿Debo actualizar constantemente los contenidos? A Google le gustan los sitios que renuevan y actualizan sus contenidos.

Palabras Claves Son las palabras para las cuales quieres aparecer en la primera posición de los resultados de un buscador. Por ejemplo, "coches usados", "abogados en caracas" o "sms gratis". Se recomienda 2 o 3 por página, y no exceder de 10. ¿Qué palabras claves (keywords) utilizo? Existen herramientas que nos ayudan a escoger palabras claves para nuestras páginas – – Otras páginas que muestran las palabras más buscadas: – – –

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

TECNOLOGÍA WEB Estar informado de las últimas novedades en cuanto a servidores o lenguajes de programación.

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

SENCILLEZ Al robot de Google no le gustan las páginas con excesivas decoraciones y simplemente busca textos legibles y contenidos claros.robot de Google

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

sters/tools/ El primer paso para conseguir una buena posición en Google es aparecer en el buscador. Descubre cómo hacerlo.

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

ENLACES Y PAGERANK Es el pilar fundamental para obtener un PageRank alto. Intenta aparecer en los principales directorios (Yahoo! y DMOZ) y que te enlacen desde otros sitios web. PageRank

POSICIONAMIENTO WEB  Introducción  El contenido es la clave.  Tecnología web.  Sencillez.  Google  Enlaces y Pagerank.  Penalizaciones  Recomendaciones

Google sabe que muchas personas le intentan engañar, y está empezando a tomar medidas contra páginas web que realizan prácticas poco éticas para mejorar su posicionamiento.

PENALIZACIÓN Cloaking: devolver contenidos distintos, dependiendo de si visita la página el robot de Google o un usuario en busca de información que no va a encontrar en sitios web con esta técnica de engaño a los buscadores. Enlaces Ocultos: son una variante del texto oculto realizada por webmasters que quieren promocionar otros sitios Web y, al no poder conseguir enlaces externos, utilizan sus propias páginas. Popularidad Artificial: es una técnica que aumenta, de forma artificial, el posicionamiento en la recuperación de búsquedas de motores Web. Hay diferentes modalidades: Spam en weblogs y libros de firmas Texto oculto: consiste en la inserción de multitud de palabras clave en sus páginas web ocultándolas con el mismo color del fondo, con etiquetas meta o dentro del código fuente. Abuso de palabras claves: situar palabras clave en un montón de elementos de una página web. Si bien es cierto, estos métodos son muy usados, ahora estan penalizados por Google, quien elimina de su base de datos a los sitios que "compran" pagerank.

RECOMENDACIONES LOS TÍTULOS : (que no superen los 50 caracteres), y no repetir más de 3 veces la misma palabra (Google lo puede considerar 'spam'). Un buen título para una página de venta de productos ganaderos podría ser: ALT URL: que contenga las keywords deseadas, pero no abusar y no intentar que el dominio, subdominio y nombre de la página contengan las mismas

LOS META-TAGS Cada página, al igual que ocurría con el título, debe poseer su propio meta, y su contenido debe describir de forma clara y breve la temática central de la página. Como ya se ha comentado, la repetición de tags no es una buena práctica desde el punto de vista del posicionamiento, por lo que en este caso interesa de nuevo que cada página posea su propio meta-tag. Este texto puede ser mostrado en las SERPs como resumen asociado a un resultado, por lo que vale la pena escribirlo de forma que el usuario del buscador, al leerlo, entienda de forma clara que le podemos ofrecer si accede a nuestro Site. Una buena implementación del meta-tag, asociada al ejemplo anterior, podría ser

LOS META-TAGS HEADINGS: –Diseñar páginas que respeten la estructura HTML, incluyendo los encabezados en el orden correcto, y utilizando al menos siempre el primero de ellos en cada página. –De nuevo, no repetir los encabezados es todas las páginas. Además en este caso es importante no utilizar más de un por página, ya que podemos incurrir en penalizaciones por parte de los buscadores, y no demasiados (un valor por debajo de 10 es aceptable) por el mismo motivo. –Utilizar palabras clave en los encabezados, sobre todo en el, ya que el texto descrito en este tag adquiere una especial relevancia en los algoritmos de puntuación utilizados por los buscadores. –Una buena utilización de encabezados, asociada al ejemplo anterior, podría ser:

LOS META-TAGS –La existencia de este meta-tag es beneficiosa para nuestros Site, por lo que conviene que todas las páginas lo contengan, y éste refleje de forma exacta las palabras clave que identifican el contenido de cada página particular, y las genéricas del Site. –Por la repercusión negativa que ya se ha comentado, no es nada recomendable que se repita el contenido de este meta-tag en las páginas del Site. –En este meta-tag no caben todas las palabras clave del Site, por lo que no deberemos abusar de él de forma indiscriminada, recomendando no incluir más de 10 palabras clave por página. –Usar en este campo, además de las palabras clave de la página concreta, las Keywords genéricas del Site. –Una buena implementación del meta-tag, asociada al ejemplo que venimos utilizando, podría ser:

REFERENCIAS GENERALES World Wide Web Consortium (W3C). Oficina Española W3C. Página principal de WAI Página principal de la Iniciativa de Accesibilidad Web del W3C, donde se puede encontrar la información más actual sobre accesibilidad Web. Centro Estatal de Autonomía Personal y Ayudas Técnicas.

REFERENCIAS TECNICAS Pautas de Accesibilidad al Contenido en la Web 1.0. Explica en detalle cómo hacer una página Web accesible para personas con diferentes tipos de discapacidad. Web ContentAccessibilityGuidelines2.0: Norma UNE :2004, “Aplicaciones informáticas para personas con discapacidad. Requisitos de accesibilidad para contenidos en la Web”. a/DescargaUNE_139803

REFERENCIAS TECNICAS Grupo SQUaC: W3C MarkupValidationService: WebXACT: CynthiaSays: TAW: HERRAMIENTAS DE EVALUACIÓN DE LA ACCESIBILIDAD - Instituto Nacional de Tecnologías de la Comunicación –Marzo 2008 Accesabilidad e Internet - Claudio Fabián Segovia ACCESIBILIDAD WEB: principios, mitos, y algunos ejemplos prácticos - Jordi Sánchez Instituto Tecnológico de Informática (ITI) Guía de Recomendaciones SEO de Posicionamiento - Copyright © 2007 Instituto Nacional de Tecnologías de la comunicación (INTECO) – Septiembre

GRACIAS Cualquier consulta: