Aspectos

esenciales

en el

DISEO

DE PGINAS

WEB Marta Moreno digital communications and social media

@martaymore

INTRO Una pgina web es el escaparate de nuestro negocio y una

herramienta para conectar con nuestro pblico (clientes)

Diseo acorde a nuestra imagen corporativa y

lnea de negocio

Funcionalidades que aporten valor

necesito un ferrari?

Optimizada para buscadores si no, es

predicar en el desierto

El contenido es el rey, y cada vez ms qu vas a publicar?

Conectada a redes sociales y presencia

online de la marca

Qu nos espera hoy? En las prximas dos horas

cubriremos los siguientes temas.

INTERFAZ

DEL USUARIO

1 Navegacin y uso

2 Arquitectura de la

informacin

3 Usabilidad

4 Accesibilidad

5 Folcsonomas >

etiquetado

DISEO 6 Blueprint* ANALTICA WEB Y MTRICAS 7 Qu medir 8 Googgle Analytics

TCNICAS DE OPTIMIZACIN 9 SEO basics

* Otros aspectos del diseo ya tratados en otro taller

PRCTICA Crear una web bsica Insertar widgets: - Google Maps - Botones sociales Embeber contenidos: - Vdeos - Podcasts Google Analytics en tu web Alta en Google Index

WEB

Os vamos a mostrar cules son los aspectos fundamentales a la hora de

disear u optimizar vuestra pgina web. La corta duracin de este taller

no permite profundizar en cada uno de estos elementos pero intentaremos

que al finalizar el taller sepis qu importancia tiene cada uno de ellos.

Qu elementos formales debes tener

en cuenta a la hora de disear una

pgina web.

INTERFAZ DEL Navegacin y uso

El diseo de la pgina web se realiza teniendo en cuenta el tipo de pgina y la navegacin que mejor se adapta a nuestros contenidos.

1

TIPOLOGA DE WEBSITES

1 Corporativo (indra.es, endesa.es).

2 e-commerce (Amazon).

3 colaborativo (WikiS).

4 herramientas (buscadores, fotos, mapas, etc.).

5 campaas online (El almacn de la ilusin de Coca Cola)

5 transacciones (banca online)

6 noticias (lainformacion.com, el pais.com)

7 Microsites (p.ej. de libros concretos

Portal web

vs

website

Arquitectura de la informacin disciplina encargada del estudio, anlisis, organizacin, disposicin y estructuracin de la informacin en espacios de informacin, y de la seleccin y presentacin de los datos en los sistemas interactivos y no interactivos

Objetivo: organizar los patrones inherentes en los datos, haciendo clara la

complejidad..

2

ASPECTOS BSICOS

1 Establecer la misin y la visin del sitio

2 Determinar el contenido informativo y las funcionalidades tcnicas

3 Definir la forma y los medios mediante los cuales los usuarios encontrarn y accedern a la informacin

contenida en el website

4 Establecer los medios y vas para permitir el crecimiento y desarrollo futuro

INTERFAZ DEL

Usabilidad el atributo de calidad que mide lo fciles que son de usar las interfaces Web Jakob Nielsen

Objetivo: que los usuarios puedan interactuar de la forma ms fcil, cmoda e intuitiva, de forma que no exista, o exista el menor esfuerzo de aprendizaje posible

3

Quieres saber ms?

10 reglas de usabilidad de

Jakob Nielsen

una docena de consejos

sobre usabilidad

QU ANALIZAR

1 Respeto a los estndares web

2 Ergonoma cognitiva y usos comunes en internet

3 Aspectos fsicos de la legibilidad y percepcin en una pantalla

4 Interfaz de usuario

5 Rotulacin y ayudas a la navegacin

INTERFAZ DEL

Accesibilidad acceso a la informacin independientemente del tipo de hardware, software, infraestructura de red, idioma, cultura, localizacin geogrfica y capacidades de los usuarios.

Objetivo: que cualquier usuario pueda acceder a la informacin.

4

ES BUENO SABER

1 Mucho que ver con la programacin

2 Tres niveles de accesibilidad

3. Herramientas gratuitas de verificacin

http://www.tawdis.net/taw3/cms/es http://validator.w3.org

INTERFAZ DEL

Folcsonomas la clasificacin colaborativa por medio de etiquetas simples en un espacio de nombres llano, sin jerarquas ni relaciones de parentesco predeterminadas

Objetivos: que los usuarios tengan la posibilidad de utilizar etiquetas y acceder al contenido a travs de las etiquetas utilizadas.

5

ASPECTOS BSICOS

1 El etiquetado de contenidos favorece su indexacin por buscadores

2 Facilita al usuario encontrar lo que busca

3 Todo el contenido debe estar etiquetado

4 Las nubes de etiquetas ayudan al usuario

Etiqueta Conceptos, temas o cuestiones

sobre los que trata el contenido

Categora Temtica que engloba el

contenido

INTERFAZ DEL

Blueprint tambin conocido como wireframe o diagrama de contenido. Es una representacin esquemtica de una pgina web con elementos grficos que muestran el contenido y comportamiento de las pginas

6

DISEO WEB

7

ANALTICA WEB Analtica web Nos permite conocer el comportamiento de los usuarios en nuestra web y aplicar mejoras

MTRICAS

1 Visitas: visitantes nicos y nuevos, pginas visitadas,

2 Variable Tiempo

3 Fuentes de Trfico: directo, buscadores, enlaces, de pago

4 Tasa de Rebote

5 Tasa de Conversin

8

ANALTICA WEB Google Analytics es un servicio gratuito de estadsticas de sitios web

https://www.google.com/analytics

9

POSICIONAMIENTO Posicionamiento SEO Search engine optimization o dicho en otras palabras optimizacin para buscadores. Tambin se llama posicionamiento natural.

Accesibilidad y

compatibilidad para

buscadores, indexabilidad: facilitar la labor de rastreo a las

araas de los buscadores

Optimizacin de factores: Interactuar con factores bien

ponderados por algoritmos de

posicionamiento

Relevancia y popularidad: contenidos de alta calidad y

captacin de enlaces entrantes

posicionamiento optimizado en buscadores

POSICIONAMIENTO

Arquitectura, diseo, usabilidad son importantes para el SEO

A PASARLO BIEN. Con las manos en la masa la mejor manera de aprender

HEMOS APRENDIDO

El usuario es el que manda.

La usabilidad es un aspecto clave.

Medir s o s.

Aspectos bsicos del posicionamiento.

El contenido es el rey.

Esta presentacin no

pretende ser un estudio

exhastivo sobre los distintos

aspectos del diseo de

pginas web!

El objetivo es que aporte una

pincelada que os ayude a

entender la importancia de

cada fase en el uso futuro de

la web.

Os ha resultado til?

y LISTOS!

BY MARTA.

@martaymore