2.  La primera web fue publicada en el año 1991 por Tim Berners-Lee.
 El padre de la World Wide Web elaboró un documento informático que
rompía con lo anterior porque contenía hipervínculos, es decir, ofrecía
posibilidad de ir a otro texto al pulsar sobre una palabra.
 Trece años después, en el año 2004, el descubrimiento de Berners-Lee
se reinventó, y no porque cambiara de un día para otro, sino porque, como
suele ocurrir en el mundo de Internet, alguien le puso un nuevo nombre:
Web 2.02
 Diseño web 2.0:
una conjunción de estilos cuya máxima es la sutileza y la combinación de
elementos dispares. Grandes masas con volumen, utilizando técnicas de
3D, a la vez que figuras planas; pequeños detalles de luz o degradados
delicados, con grandes tipografías.

3.  Batges:
se trata de una serie de botones con forma de chapas o placas.
Consiste en una estrella con bordes redondeados y que
habitualmente se utilizan para atraer la atención sobre un precio,
una promoción o “un gran mensaje de Beta
 Brillos, destellos y reflejos:
Aportan volumen a los diseños. Al mismo tiempo, las webs se
llenan de objetos con un reflejo de él mismo sobre su base.
 Bordes redondeados:
la llegada de la Web 2.0 ha supuesto el fin de las esquinas,
dando paso a un nuevo arquetipo en el que todos los bordes son
redondeados. Bien sea a través de los programas de diseño o a
través de las hojas de estilo CSS

4.  Degradados:
es una de las técnicas visuales que más han calado
entre dos diseñadores de Web 2.0. Más pronunciados o
más sutiles Líneas diagonales:
 Desenfoques:
se hacen especialmente patentes en las sombras. En
lugar de ser sombras duras, los diseñadores utilizan
leves desenfoques.
 Logotipos reflejados:
Durante un tiempo se convirtieron prácticamente en
un estándar los logotipos reflejados, de forma que
según va separándose el dibujo del reflejo va
desenfocándose como si se tratara de papel mojado.

5.  Simplicidad:
Este principio, conocido como el de la Navaja de Occam, se ha convertido en
la base del diseño. Buscar la opción que haga la navegación más sencilla y
que exijan menos esfuerzo a los usuarios, evitando las interferencias de
elementos superfluos y otorgando una mayor importancia a aquellos en los
que queremos que fijen su atención.
 Diseño centrado:
mientras en la web 1.0 todo el contenido se alineaba a la izquierda, las
páginas 2.0 siempre están centradas, mejorando la visualización de los
contenidos en cualquier tipo de resolución de escritorio.
 Menos columnas:
antes la páginas se estructuraban en un mayor número de columnas, imitando
tal vez el estilo de los periódicos; el diseño actual tiende hacia dos, en el caso
de los blogs, y tres en el caso de las páginas con un mayor volumen de
contenido.
 Separar la navegación:
aunque siempre fueron distintas la zona superior y la inferior, ahora se marca
más visualmente. Al mismo tiempo, cada área está claramente definida para un
tipo de navegación o de interacción y una serie de contenidos.

6.  Navegación simple:
Organizar la página para que el usuario navegue intuitivamente y sepa
para qué sirve cada elemento y con cuáles puede interactuar.
 Tipografías mas grandes:
tras un período en el que la tendencia era emplear fuentes
pequeñas, como indicativo de elegancia, se ha pasado a un modelo en
el que se consigue que las fuentes grandes también sean visualmente
atractivas. Los sites pueden ser bonitos y a la vez respetar los
principios de la usabilidad.
 Leads en negrita:
En general, la negrita se ha convertido en el modo más eficiente de destacar
la información sin recurrir a colores que ensucien la identidad corporativa de la
página.
 Iconos atractivos:
Han dejado de ser un elemento auxiliar del diseño para convertirse en un
componente prioritario. En general, se puede decir que la principal
característica del diseño 2.0 es la sutilidad, los pequeños detalles, y por ello los
iconos son uno de los campos de acción más interesantes para los
diseñadores.

8. Hablar de diseño implica en general referirse a una
estandarización, hablar de escuelas, de tendencias,
de modos de actuar generalizados, pero, al mismo
tiempo, de ruptura y originalidad.
Todos los movimientos artísticos se caracterizan
porque mucha gente hace lo mismo, hasta que
alguien lo rompe y crea algo más innovador. Por esta
razón la Web 2.0 está generando un movimiento en
contra de estos estándares.

9.  Navegadores web
 Un navegador es un programa que se utiliza para
acceder a la web. Desde el primer explorador,
llamado NCSA Mosaic de principio de los noventa
hasta hoy, la evolución ha sido espectacular.
 Netscape consiguió ser el navegador de
referencia desde el 1994 hasta que, en el año
 1997, Microsoft introdujo el Internet Explorer en el
Sistema Operativo Windows 98.
 Los otros navegadores
 Hoy en día existen otras aplicaciones que están
ganando importancia como son los navegadores

10.  Los archivos elaborados con el programa de animación 2D
por excelencia en el campo web, Flash, han pasado de ser
la solución definitiva cuando deseamos hacer una web
visualmente atractiva, a una posición mucho más discreta.
 La utilización de este tipo de animaciones ha pasado como
decíamos a una posición secundaria, que es en
animaciones en las cabeceras de las webs, en los banners
o para ilustrar noticias. Como un ingrediente más del
diseño, pero no como plato único. Al mismo tiempo, Flash
si se ha convertido en el gran protagonista de otro campo
del diseño web: los vídeos en línea. Las principales
plataformas de vídeo, como Youtube, Metacafe o
Dailymotion, utilizan los vídeos codificados en Flash Video,
debido a lo poco que pesan los archivos

11.  El término AJAX (Asynchronous JavaScript And
XML), al igual que el de Web 2.0, no es ningún
invento, ni un gran avance tecnológico, es el
nombre que se le puso a una serie de técnicas y
combinación de tecnologías ya existentes. Poco a
poco se ha convertido en una palabra de moda,
que popularizó Jesse James Garrett en su artículo
“Ajax: A New Approach to Web Applications”
 El uso de Ajax ha supuesto una revolución en el
concepto de interacción del usuario con la página
web. Ya podemos mover las ventanas a nuestro
gusto y ponerlas en donde nos apetezca,

12. ¿Qué evolucionó antes? ¿El internauta o la web? Como en el famoso
caso del huevo y la gallina, no está claro quién nació antes, pero
parece evidente que con el surgimiento de las aplicaciones 2.0 los
usuarios comenzaron a exigirlas. Entre una web donde ver vídeos y
otra donde además de ver vídeos puedo comentarlo, compartirlo y
subir los míos propios, el usuario elegirá siempre la segunda opción.
Características:
 1. Utiliza IE, Firefox, Opera, Safari…
 2. Accede desde su PC, PDA, Blackberry, TV, WII…
 3. Se conecta por GPRS, ADSL, Cable…
 4. Busca la operativa en las páginas
 5. Genera información: Blogs, páginas personales…
 6. Publica contenido, lo ordena…

13.  Usabilidad:
 El considerado gran gurú de la Usabilidad, Jacob
Nielsen, la definió así en el año
 2003: “El atributo de calidad que mide lo fáciles que
son de usar las interfaces Web
 Se trata en una disciplina cuyo objetivo es facilitar la
interacción del usuario y, por esta razón, es lógico
que naciera o, más bien, cobrara fuerza, con la
llegada de la Web 2.0. Si el mundo web se sustenta
en que los internautas participen, es necesario
estudiar qué es lo que los estimula.

14.  Eduardo Manchón, co-fundador de Panoramio, interpreta y
esquematiza los principios de la Usabilidad de Bruce Tognazzini13 y
que, a su vez, estaban basados en gran medida en los principios
heurísticos de Jacob Nielsen:
1. Anticipación, el sitio web debe anticiparse a las necesidades del
usuario.
2. Autonomía, los usuarios deben tener el control sobre el sitio web.
Los usuarios sienten que controlan un sitio web si conocen su situación
en un entorno abarcable y no infinito.
3. Los colores han de utilizarse con precaución para no dificultar el
acceso a los usuarios con problemas de distinción de colores (aprox.
un 15% del total).
4. Consistencia, las aplicaciones deben ser consistentes con las
expectativas de los usuarios, es decir, con su aprendizaje previo.

15. 5. Eficiencia del usuario, los sitios web se deben centrar en la
productividad del usuario, no en la del propio sitio web. Por ejemplo,
en ocasiones tareas con mayor número de pasos son más rápidas
de realizar para una persona que otras tareas con menos pasos,
pero más complejas.
6. Reversibilidad, un sitio web ha de permitir deshacer las acciones
realizadas
7. Ley de Fitts indica que el tiempo para alcanzar un objetivo con el
ratón esta en función de la distancia y el tamaño del objetivo. A
menor distancia y mayor tamaño más facilidad para usar un
mecanismo de interacción.
8. Reducción del tiempo de latencia. Hace posible optimizar el tiempo
de espera del usuario, permitiendo la realización de otras tareas
mientras se completa la previa e informando al usuario del tiempo
pendiente para la finalización de la tarea.
9. Aprendizaje, los sitios web deben requerir un mínimo proceso de
aprendizaje y deben poder ser utilizados desde el primer momento.

16. 10. El uso adecuado de metáforas facilita el aprendizaje de un
sitio web, pero un uso inadecuado de estas puede dificultar
enormemente el aprendizaje.
11. La protección del trabajo de los usuarios es prioritario, se
debe asegurar que los usuarios nunca pierden su trabajo
como consecuencia de un error.
12. Legibilidad, el color de los textos debe contrastar con el del
fondo, y el tamaño de fuente debe ser suficientemente
grande.
13. Seguimiento de las acciones del usuario. Conociendo y
almacenando información sobre su comportamiento previo se
ha de permitir al usuario realizar operaciones frecuentes de
manera más rápida.
14. Interfaz visible. Se deben evitar elementos invisibles de
navegación que han de ser inferidos por los usuarios, menús
desplegables, indicaciones ocultas, etc.

17.  La Usabilidad se desarrolla con la parte izquierda del cerebro y
representa la razón y la acción lógica; por lo tanto se
corresponde con Marte. Por su parte, el Diseño reside en la
parte derecha del cerebro y se identifica con lo emocional y la
acción intuitiva, así que se corresponde con Venus.
 Decimos aparentemente porque el paso del tiempo ha
demostrado que ninguna web puede prescindir de la Usabilidad,
porque el usuario se frustra y se va si no sabe manejar la
interface y, al mismo tiempo, si algo no es atractivo visualmente
para el internauta es difícil que se desarrolle como producto: no
se diferenciaría de los demás, parecería anticuado, nadie
recordaría la web, etc.
 Por lo tanto se trata de dos disciplinas que se necesitan una a la
otra. El diseño necesita que la Usabilidad le diga cómo navega
el usuario, y la Usabilidad necesita que el diseño le ayude a
jerarquizar la información, a organizar contenidos y, en conjunto,
a mejorar el producto.

18. Tomando como punto de partida el artículo de Iain Barker titulado
“What is information architecture?”15, podemos definir los
siguientes como los pasos necesarios para una arquitectura de la
información acertada:
1. Entender el contenido de la web, determinar los servicios que se
ofrecen y a quién está dirigida la web.
2. Realizar estudios de card sorting. Se trata de un ejercicio que consiste
en utilizar a usuarios potenciales de nuestra para web para que organicen
el contenido a través de fichas, ordenándolo según sus esquemas
mentales. Esto hace que la estructura resultante se adecúe más a lo que el
internauta espera encontrarse.
3. Elaborar un borrador del árbol de la web, agrupando la información y
estableciendo jerarquías.
4. Evaluar la correspondencia entre nuestro árbol y los resultados del card
sorting.
5. Crear el mapa del sitio.
6. Definir las funcionalidades de la página y cómo se llega a ellas.

19.  son las normas que permiten que las webs se puedan
visionar no sólo en Internet Explorer o Mozilla Firefox,
sino también en los navegadores para personas
ciegas o dispositivos móviles como PDA o teléfonos
móviles, así como para los internautas que utilizan
velocidades de transferencia baja.
 CCS (Cascading Style Sheets):
son un lenguaje usado para definir la presentación de
un documento estructurado escrito en HTML o XML.
Consiste en uno o varios documentos en los que se
escriben las características que va a tener cada uno
de los elementos de la página: titulares, párrafos,
columnas, enlaces, etc., de modo que afectan o
pueden afectar al conjunto del site.

20.  El XHTML (Lenguaje de Marcado de Hipertexto Extensible) es el
lenguaje de marcado pensado para sustituir al HTML, pero aún
le queda camino por recorrer. Cuando se daba por muerto el
HTML 4.0 surge una nueva revisión del W3C el HTML 5.0 lo que
hace que seguramente convivan durante un largo periodo de
tiempo ambos.
 El XHTML es una versión más estricta del código HTML para
conseguir reducir las posibilidades de su uso y que la
interpretación por los distintos dispositivos sea más simple, y
que pequeños dispositivos, con menor capacidad que los
ordenadores de mesa tradicionales puedan soportar, como los
móviles.
 Las principales ventajas que aportan son:
• La compatibilidad con navegadores antiguos
• La independencia del diseño. Pudiendo adoptar
presentaciones distintas según el dispositivo.
• Facilidad de edición del código y su mantenimiento
• Mejoras de rendimiento.