PrólogoLa Web frente a la impresión: Una nota sobre los URL
Introducción
1. Pantallazo
Conocer el Medio
Ampliar horizontes
Trabajar en la Red... sin una red
Rompa sus altares
2. Diseñar para el Medio
¿Aliento de menta? o ¿caramelo de menta?
¿Dónde está el mapa?
Marte y Venus
La física de la Web: acción e interacción
Finalidades distintas, metodologías distintas
Agnosticismo sobre la Web
Abrir los estándares, ya no son sólo para los expertos en informática
Punto 1: La Web es una plataforma agnóstica
Punto 2: La Web es independiente del dispositivo
Punto 3: La Web se mantiene unida por los estándares
Los 18 meses de embarazo
La benevolencia de la Web
La sencillez es una virtud
Democracia, ¡Qué concepto!
Destino inmediato
El mundo entero en sus manos
Simplemente hágalo: la Web como actividad humana
Las reglas del espectador
El servidor lo sabe
Es por el ancho de banda, estúpido
Las páginas web no tienen secretos
¡La Web es para todos!
Todavía se trata del ancho de banda, estúpido
Cambie las imágenes por texto y código
Recorte esos archivos de imagen
Haga más con menos
Reduzca la redundancia
Todo lo que Cache pueda
Mucho ruido sobre los 5K
Espacio disponible de visualización
Diseño fluido
Colorear mi Web
Miles de llantos
Gamma, gamma ¡eh!
Tipografía
La solución del 97 por ciento
Puntos de diferenciación
Año 2000, navegadores al rescate
Factor contacto
Diseño gráfico apropiado
Accesibilidad, la vergüenza oculta de la Web
Los conocimientos del usuario
3. ¿Dónde estoy? Navegación e interfaz
¿De qué color es su concepto?
Los negocios tan (crueles y) habituales
El auge del Departamento de Interfaz
Forma y función
Copiones y pseudo-científicos
Caos y claridad
Un diseño Koan: las interfaces son un medio, confundido demasiado a menudo con un objetivo
Cuerpo universal del documento y otras quimeras
La interfaz como arquitectura
Diez (bueno, tres) puntos de luz
Fáciles de aprender
Mantener la coherencia
Suministrar feedback continuamente
GUI, GUI, mascable, mascable
Es el navegador, estúpido
La claridad en la página de inicio
Pienso con iconos, pienso con iconos
Etiquetas estructurales: plegar la silla del director
El alma de la brevedad
Hipertexto o texto nefasto
Desplazarse y hacer clic
Stock Options (proporcionar alternativas)
Jerarquía y la llamada Regla de los tres clics
La llamada Regla del Cinco
Puntos resaltados y migajas
Colocación coherente
¡Marque eso, bobo!
4. Cómo empezó esto de la Web
1452
1836
1858
1876
Por qué mencionamos estas cosas
1945
1962
1965
1966
1978
1981
1984
1986
1988
1989
1990
1991
1993
1994
1995
1996
1997
1998
1999
2000. El año en el que se rompieron los estándares web, 1
El año en el que se rompieron los estándares web, 2
El año en el que se rompieron los estándares web, 3
El año en el que la burbuja estalló
2001
5. El glosario obligatorio
Jerga de la Web
Extranet
HTML
Hipertexto, hipervínculos y vínculos
Internet
Intranet
JavaScript, ECMAScript, CSS, XML, XHTML, DOM
Página web
Sitio web
Terminología adicional
Roles y responsabilidades en el mundo de la Web
Desarrollador / programador web
Director de proyecto
Administrador de sistemas (sysadmin) y administrador de red (netadmin)
Técnico web
Su rol en la Web
6. De todas formas, ¿Qué es un diseñador web?
Lo que tenemos aquí es una oportunidad para comunicar
La definición definida
Apariencia y comportamiento
De empresa a empresa
De empresa al consumidor
Resolver los problemas de comunicación
Identidad de la marca
Específica para la Web
Tecnología
Trabaja con miembros del equipo
Visual y emocionalmente atractivo
Compatibles con las necesidades de los visitantes
Accesibles para una amplia variedad de navegadores y otros dispositivos web
¿Sabe manejarlo?
7. Implicación en el ciclo de vida del proyecto
¿Qué es el ciclo de vida?
¿Por qué tener un método?
Nunca olvidamos una fase
Análisis (o "hablar con el cliente")
La primera fase
Definición de requisitos
Diseño
Aportación de ideas y solución de problemas
Traducir las necesidades en soluciones
Vender ideas al cliente
Identificar las composiciones de color
Crear las composiciones de color / demostración del concepto
Presentar las composiciones de color y demostración del concepto
Recibir la aprobación del diseño
Desarrollo
Crear todas las composiciones de color
Comunicar la funcionabilidad
Trabajar con plantillas
Diseñar para un mantenimiento sencillo
Pruebas
Implantación
El juego de actualización
Crear y proporcionar documentación y guías de estilo
Proporcionar formación al cliente
Aprender los métodos de su cliente
Trabajar el procedimiento
8. HTML, los bloques de construcción de la propia vida
Guerras de código
La tabla habla
XHTML marca el sitio
Preste atención a sus "p" y q
Mirar hacia el futuro
Primeros pasos
Ver el código
Un plus de Netscape
La madre de todos los trucos para ver el código fuente
Hágalo en Netscape
Hágalo en Internet Explorer
Hablando de forma absoluta, todo es relativo
¿Qué es un buen marcado?
¿Qué es un marcado razonable?
HTML como herramienta de diseño
Plug-ins y tablas y marcos, ¡Dios mío!
Los marcos del azar
Por favor enmarque de forma segura
Enmarque su arte
"META" "META" ¡oh!
Búsqueme
Recibir una recarga
Un comentario sobre "COMMENTS"
WYSIWYG, mi tía Marta dejó de andar
Código de deshonor
WYS no es necesariamente WYG
Incompatibilidades del navegador: ¿no podemos llevarnos todos bien?
¡Publique eso, bobo!
HTML: un infierno más que un lenguaje
9. Herramientas visuales
Aspectos fundamentales de Photoshop: una introducción
Preparación de la composición
Tratar con las paletas de color
Exportar a formatos apropiados para la Web
Compensación Gamma
Preparar la tipografía
Recorte y ornamentación
Rollovers (intercambios de imagen)
Animación GIF
Crear modelos de fondo ininterrumpidos (mosaicos)
Colorear mi Web: romance con Cube
Fusióneme esto
¿Muerte de la paleta de color Web-safe?
Un hexadecimal en sus dos casas
Era ciego, pero ahora veo
De la teoría a la práctica
Formatee esto: GIF, JPEG y similares
GIF
Adora los logotipos, la tipografía y los largos paseos por el bosque
Los GIF en Photoshop
JPEG, la otra carne de cordero
Optimizar los GIF y los JPEG
Aumentar la compresión
Reduzca el tamaño de sus JPEG
Combinar la nitidez y la difuminación
Tipos de estilo de compresión: pensar en el Medio
PNG
Los GIF animados
Crear animaciones en ImageReady
Tipografía
El ABC del texto web
Suavizado de bordes
Especificar el suavizado de bordes para el texto
Recomendaciones generales
Sugerencias generales en texto
Los sin del tiempo
Patrulla del espacio
Para que no fallemos al repetirnos
Accesibilidad, su nombre es texto
Navegación: trazar el trayecto del visitante
Cortar y adornar
Pensar semánticamente
10. Hojas de estilo para los diseñadores
Sopa de etiquetas y Crackers
CSS al rescate...más o menos
Diseñar con estilo: Cascading Style Sheets (CSS)
Separar el estilo del contenido
Inconvenientes de los métodos tradicionales del diseño web
Ventajas de CSS: a corto plazo
Ventajas de CSS: a largo plazo
Problemas de compatibilidad: una introducción
Trabajar con hojas de estilo
Tipos de hojas de estilo
Hojas de estilo externas
Incorporar una hoja de estilo
Añadir estilos inline
Problemas en el paraíso: cuestiones de compatibilidad CSS
Miedo a las hojas de estilo: CSS y diseño
Miedo a las hojas de estilo: interlineado y superposición de imágenes
Miedo a las hojas de estilo: CSS y tipografía
Prometer y actuar
Desafíos del tamaño de fuente
Puntos de contienda
Punto sin retorno: los navegadores del año 2000
Píxeles por diversión y utilidad
Palabras clave de tamaño absoluto
Un tamaño que no se ajusta a nadie
Small quiere decir medium, guerra quiere decir paz
Palabras clave relativas
Unidades de longitud
Unidades de porcentaje
Perspectivas de futuro
11. El placer de JavaScript
¿Qué es eso llamado JavaScript?
La Web antes de JavaScript
JavaScript, ayer y hoy
JavaScript, ¡uh! ¿Para qué sirve?
Suena genial, pero yo soy un artista. ¿De verdad tengo que aprender esto?
Enseñando JavaScript a Rita
¡No se asuste!
Los aspectos fundamentales de JavaScript para los diseñadores web
El temido rollover de texto
El horizonte del manejador de eventos
Estatus Quo
Una nota de advertencia
Niños, probad esto en casa
La buena impresión
El regreso del hijo de la buena impresión
La impresión no tan buena
El siempre popular efecto rollover de imagen
Un script rollover de Project Cool
Ventanas en el mundo
Reúna sus "HEAD"
Evitar la angustia de la vinculitis
Compensación del navegador
¡JavaScript al rescate!
Location, location, location
Observar la detección
Globalidad con JavaScript
Aprender más
12. Nunca se puede decir adiós
Ansiedad ante la separación
De la sopa de etiquetas a la sopa de chismes: listas de correo y foros online
A List Apart
Astounding Websites
The Babble List
Dreamless
Evolt
Metafilter
Redcricket
Webdesign-l
Cuando todo lo demás falla
Un regalo para la vista y la mente: páginas formativas y edificantes
Diseño, programación, contenido
Los Grandes Kahunas
Belleza e inspiración
¡El creador de contenido independiente se niega a morir!
