HTML 4

La demanda de conocimientos y aptitudes técnicas relacionadas con Internet y, especialmente, con la Web, nunca ha sido mayor. Incluso los profesionales tienen que mantener al día sus habilidades vigilando los adelantos tecnológicos futuros para no perder el ritmo.

HTML (Hypertext Markup Language) es un sistema para el formato de información que permite integrar en un mismo documento objetos de distintas naturalezas. Es lo suficientemente simple como para ser escrito por personas sin conocimientos muy profundos de protocolos y redes.

Este libro le proporciona una visión detallada y, al mismo tiempo, amplia de la industria de desarrollo Web, tal como se encuentra hoy en día. Ya busque, como lector, algunas aclaraciones e información actual sobre HTML y las tecnologías relacionadas para tratar de mejorar profesionalmente o sea un entusiasta que quiere aumentar sus conocimientos, con este libro como base podrá empezar a utilizar HTML 4.

El CD-ROM adjunto contiene el código fuente de los ejemplos del libro y versiones de evaluación de diferentes programas tanto para Windows como Macintosh.

Sobre la autora
Agradecimientos



Introducción

Quién debe comprar este libro
Cómo está organizado este libro
Convenciones utilizadas en este libro

Convenciones de texto
Diseño para el mundo real
Elementos especiales



Parte I. Qué debe saber

1. Qué es HTML 4.0

Cuantas más cosas cambian…

¿Qué es HTML?
La evolución del HTML

Infraestructura del HTML
Estándares frente a convenciones
El World Wide Web Consortium (W3C)
El estándar 4.0

Objetivos del HTML 4.0
Resumen de los cambios

Resolución de problemas
Diseño para el mundo real

HTML y desarrolladores de Web: intereses del mundo real



2. Uso de HTML 4.0 en el mundo real

Cómo obtener control en un mundo caótico
Plataformas de ordenador
Navegadores Web

Dónde comenzó todo
Estadísticas de navegadores Web

Temas de hardware
Resolución de problemas
Diseño para el mundo real

Estadísticas de navegador y diseño de molly.com



3. Herramientas HTML

Enfoques de la codificación

Codificación a mano
Entornos de edición de HTML
Utilidades de conversión HTML
Aplicaciones WYSIWYG

Resolución de problemas
Diseño para el mundo real

Cree plantillas para obtener velocidad y exactitud
Directrices de compañía y listas de comprobación
Aplicaciones registradas



4. Gestión local de documentos HTML

Importancia de la gestión de archivos
Convenciones de denominación

Nombres de archivo mal escritos
Nombres de archivo poco claros
Longitud de los nombres de archivo
Nombres de prefijo y sufijo correctos

Estructura del directorio de archivos
Guardar archivos
Resolución de problemas
Diseño para el mundo real

Mapas de sitio



Parte II. Elementos básicos de HTML

5. Definición de la sintaxis HTML

Sintaxis y estructura
Etiquetas, atributos y valores

Etiquetas
Atributos
Valores

Caracteres especiales
Código bien escrito

Dependencia de mayúsculas y minúsculas
Comillas
Espacios
Simetría horizontal
El método del contenedor

Resolución de problemas
Diseño para el mundo real

La diferencia de un kilobyte



6. Construcción de documentos HTML

Estructura de documento
Etiquetas de documento
El esqueleto HTML
Estructura de la cabeza
Estructura del cuerpo
Construcción de un esqueleto HTML
Secciones de comentario en un documento HTML
Cómo escribir documentos claros y fáciles de usar
Simetría vertical
Resolución de problemas
Diseño para el mundo real

Un estudio sobre estilos de codificación



7. Formato y alineación de texto

Formato de elementos
Exploración conceptual del texto
Trabajo con cabeceras
Inserción de párrafos e intervalos

Comprensión del enfoque de la etiqueta parágrafo
Trabajo con la etiqueta de intervalo
Creación de espacio con parágrafos e intervalos
Trabajar con la etiqueta de texto con formato previo

Uso de estilos de texto
Creación de formatos especiales de texto
Cómo dar formato a un documento completo de texto
Alineación de texto
Uso del elemento DIV
Uso del elemento parágrafo para alinear texto
Anidamiento del elemento DIV
Resolución de problemas
Diseño para el mundo real

Ahora, todos juntos



8. Adición de listas

Uso de listas
Etiquetas de lista
El valor de las listas
Listas de boliches
Listas numeradas
Construcción de una página con listas
Listas de definición
Técnicas de lista avanzadas

Anidar listas

Uso de listas para sangrar elementos
Atributos de lista
Resolución de problemas
Diseño para el mundo real

Uso de listas: Dinosauria y Publishers Weekly



9. Vinculación de páginas

La esencia de la Web
La etiqueta ancla
Vínculos absolutos
Vínculos relativos
Vinculación de imágenes
Vinculación interna
Vínculos de correo
Uso de múltiples enlaces en una página
Resolución de problemas
Diseño para el mundo real

Acerca de About.com



10. Trabajo con imágenes

Hacia el diseño
La etiqueta IMG
Atributos de la etiqueta imagen

width y height
Bordes de imagen
Alineación
El atributo alt
Espacio horizontal y vertical

Imágenes flotantes
Alineación de varias imágenes
Vinculación de imágenes
Resolución de problemas
Diseño para el mundo real

Exhiba su trabajo



11. Trabajo con el elemento BODY

El elemento BODY: control global
Gestión del color para fondos, texto y vínculos

Colores de texto y vínculo
Color de fondo
Cómo añadir un gráfico de fondo

Características BODY específicas de navegador
Resolución de problemas
Diseño para el mundo real

Más allá de blanco y negro



12. Trabajo con fuentes

Conceptos tipográficos
Comprensión de los conceptos de tipos

Categorías, familias y estilos de tipos
Tamaño de tipos y proporción
Orientación
Espaciamiento vertical
Kerning y espaciado
Cómo añadir color a las fuentes

El elemento FONT

Atributos del elemento FONT
El atributo size
El atributo color
El atributo face

Consideraciones acerca de los tipos

Alisado y suavización de fuentes
Cómo empotrar fuentes
Fuentes y tablas

Tipografía en HTML 4.0
Resolución de problemas
Diseño para el mundo real

Combinación del HTML con los tipos gráficos



Parte III. Fundamentos de diseño y preparación de HTML

13. Técnicas de Hojas de estilo en cascada

Hojas de estilo: una perspectiva general
Tipos de hojas de estilo

Estilo interno
Estilo empotrado
Estilo vinculado
La cascada: combinación de estilo vinculado, empotrado e interno

Sintaxis de hoja de estilo

Propiedades y valores para texto y espacio
Aplicación de márgenes con STYLE

Cascadas y herencia
Clase y agrupamiento

Trabajo con clase
Uso del agrupamiento

Resolución de problemas
Diseño para el mundo real

Creación de un estilo compatible con navegadores anteriores



14. Diseño de tipos con CSS

Diseño de tipos en HTML 4.0
Familias de fuente de hoja de estilo
Propiedades y valores de tipos

Cómo establecer el tamaño de los tipos
Cómo añadir color
Cómo añadir peso a los tipos
Aplicación de estilo de fuente
Cómo ajustar el espacio
Uso de decoración de texto y fondo

Evolución de la hoja de estilo
Resolución de problemas
Diseño para el mundo real

Estilo complejo hecho fácil



15. Fundamentos de las tablas

La importancia de las tablas
Creación de una tabla sencilla
Atributos y valores de la etiqueta TABLE

Añadir bordes y anchura
CELLPADDING y CELLSPACING
Aplicación de atributos a la etiqueta de fila de tabla
Uso de la etiqueta de celda de tabla y sus atributos

Resolución de problemas
Diseño para el mundo real

Primero dibuje, después planifique la tabla



16. Preparación de tablas avanzadas

Planificación de tablas para diseño

Diseño de tablas
Cómo ver la cuadrícula

Uso de diseño fijo y dinámico

Aplicación de un diseño de tabla fija
Trabajo con diseños de tabla dinámica
Combinación del diseño de tablas fijas y dinámicas

Cómo anidar y apilar tablas
Alineación de tablas
Resolución de problemas
Diseño para el mundo real

Creación de una tabla a partir de una maqueta



17. Trabajo con marcos

Con marcos o sin marcos
Estructura de marcos
La página Frameset
Construcción de una página con marcos
Atributos de las etiquetas FRAMESET y FRAME
Un marco con controles de margen, redimensionamiento y desplazamiento
Apuntar a ventanas

Creación de un marco con los atributos target y name
Nombres mágicos de blanco

Trabajo con marcos sin bordes
Conceptos de marco avanzados
Diseño de marcos fijos y dinámicos
Trabajo con marcos internos (I-Frames)
La etiqueta NOFRAMES y la accesibilidad
Resolución de problemas
Diseño para el mundo real

Construcción de una página con marcos accesible



18. Construcción de formularios

La importancia de los formularios
Uso de sintaxis de formulario apropiada

Elementos y atributos de formulario
Controles

Construcción de un formulario

Cómo añadir un campo de texto
Cómo incorporar un cuadro de comprobación
Cómo añadir un botón de opción
Cómo hacer una lista de menú
Cómo crear un área de texto
Cómo proporcionar botones para restablecer y enviar

Resolución de problemas
Diseño para el mundo real

Método, acción y campos ocultos en molly.com



Parte IV. Tecnologías HTML

19. Utilización de JavaScript

La potencia de los scripts
Qué es el JavaScript

Colocación de JavaScript
Objetos y operadores de JavaScript
Declaraciones y funciones de JavaScript

Aplicaciones JavaScript

Cuadro de mensaje sencillo
Menú de navegación desplegable
Ventana desplegable
Pasos del ratón JavaScript
Prueba de navegador y elección de ruta

Resolución de problemas
Diseño para el mundo real

JavaScript y Hojas de estilo



20. Colocación de elementos y codificado de hoja de estilo

Trabajo con la colocación de hoja de estilo

Conceptos de colocación CSS
Colocación absoluta y relativa

Orden Z
Efectos de colocación

Recorte
Visibilidad
Control del rebosamiento

Resolución de problemas
Diseño para el mundo real

Cómo añadir scripts a las CSS



21. Trabajo con HTML Dinámico (DHTML)

Definición de dinámico
DHTML: hecho y ficción
Aproximación al DHTML

DHTML y HTML
El Modelo de Objeto de Documento
DHTML y codificación
DHTML y Hojas de estilo

Trabajo con el DHTML de Internet Explorer

Sucesos
Manipuladores de suceso
Burbujas de suceso
Efectos especiales

DHTML multinavegador

CSS1
Cómo descubrir información sobre el tipo de navegador, la versión y la plataforma
Otros trucos de DHTML multinavegador

Resolución de problemas
Diseño para el mundo real

El Gurú del DHTML



22. Accesibilidad e internacionalización

Accesibilidad y HTML 4
Directrices de accesibilidad
Desarrollo de páginas accesibles

Creación y enlace de una página sólo texto
Uso de la etiqueta LINK para navegación accesible
Cómo identificar los vínculos con el atributo title
Cómo añadir orden de tabulador a los vínculos
Cómo añadir orden de tabulador a los formularios
Uso de FIELDSET y LEGEND en formularios
Uso de OPTGROUP en formularios
Cómo hacer accesibles las tablas utilizando un titular
Cómo hacer accesibles las tablas utilizando un resumen
Cómo aclarar las abreviaturas con la etiqueta ACRONYM y el atributo title

Creación de acceso a través de la internacionalización
Resolución de problemas
Diseño para el mundo real

HTML y acceso: una entrevista con David Oberhart



23. Qué son XHTML, XML y los lenguajes emergentes

En la X está la diferencia
XHTML: la discusión actual del futuro del HTML
XML: extensibilidad fundamental
Aplicaciones del XML

Estilo extensible con XSL
SMIL, se encuentra en una cámara Web
Otros subgrupos de XML interesantes

Resolución de problemas
Diseño para el mundo real

Organización de las herramientas para el futuro



Parte V. Diseño gráfico Web

24. Diseño de página eficaz

Qué es el diseño de interfaz de usuario
Qué son los medios interactivos

Interactuar con los medios
Linealidad

Estructura de sitio
Diseño de interfaz de usuario

Metáfora
Claridad

Análisis de la intención de un sitio

Intención del diseño
La audiencia
Cómo establecer objetivos

Concepción del diseño

Páginas comunes dentro de un sitio Web

Técnicas de preparación de página

Preparación de página dibujada a mano
Uso de Photoshop u otro programa de imagen

Resolución de problemas
Diseño para el mundo real

Diseño de una página eficaz
Uso de capas en Photoshop



25. Conceptos relacionados con el color

Teoría del color

Color substractivo
Síntesis aditiva
Representación del color por los ordenadores

Elementos de color

Categorías de color
Propiedades del color
Relaciones de color
Efectos especiales de color
Significado del color

Tecnología del color Web

Conversión de RGB a hexadecimal
La paleta segura

Contraste y legibilidad
Resolución de problemas
Diseño para el mundo real

Trabajo con la paleta segura



26. Resolución Gamma y entorno visual

La pantalla del ordenador
Resolución de pantalla

Cómo gestionar la resolución

Color en pantalla y Gamma
Trabajo con el espacio en la pantalla

Administración del espacio

Resolución de problemas
Diseño para el mundo real

Calibración del monitor para equilibrar los colores



27. Formatos gráficos Web y herramientas profesionales

Buenos gráficos y buenas herramientas
Formato de Intercambio de Gráficos (GIF)
Joint Photographic Experts Group (JPEG)
Optimización de gráficos

Optimización de un GIF
Optimización de un archivo JPEG

Técnicas gráficas adicionales

Reproducción progresiva
Transparencia
Paleta adaptativa frente a paleta Web
PNG y otros formatos gráficos que están surgiendo

Herramientas gráficas profesionales

Programas de imágenes e ilustraciones
Programas de animación GIF
Herramientas de optimización
Programas y plug-in de realce de gráficos
Fuentes de material gráfico

Resolución de problemas
Diseño para el mundo real

Creación de un gráfico de fondo: comparación y contraste
Con Photoshop
Con PhotoImpact
Con Paint Shop Pro
Photoshop
PhotoImpact
Paint Shop Pro



28. Creación de gráficos Web profesionales

Cómo utilizar imágenes en sus páginas
Técnicas de escáner y utilización de imágenes

Cómo escanear imágenes
Selección de imágenes existentes

Construcción de gráficos Web

Fondos
Cabeceras gráficas
Botones
Barras y reglas
Imágenes independientes

Resolución de problemas
Diseño para el mundo real

Un enfoque profesional del diseño en la Web: entrevista con la diseñadora Amy Burnham



29. Tipos gráficos para la Web

Creación de gráficos vectoriales y de tipografía para la Web

Vectores gráficos y curvas Bézier
Cómo dibujar curvas Bézier

Todo acerca de la tipografía digital

Fuentes de pantalla
Fuentes con nombre de ciudad
Fuentes con ajuste de escala
Fuentes PostScript
Fuentes residentes y de sistema
Fuentes a descargar

Edición de tipos
El aspecto de los vectores
Illustrator y HTML 4.0

Color
La paleta de muestras Web
Cómo hacer archivos preparados para la Web con Illustrator

Cómo asignar URL a objetos
Manos a la obra: Adobe Illustrator 8.0 y efectos de tipos

Creación del texto
Creación de los gráficos

Resolución de problemas
Diseño para el mundo real

Cómo preparar la imagen para la Web



30. Mapas de imagen, animaciones y técnicas gráficas especiales

Exploración de gráficos especiales
Qué son los mapas de imagen

Mapas de imagen de cliente y servidor
Herramientas de mapa de imagen
Mapa de imagen paso a paso

Creación de GIF animados
Creación de marquesinas publicitarias
Resolución de problemas
Diseño para el mundo real

¿Funcionan las marquesinas?



Parte VI. Multimedia y objetos empotrados

31. Audio, vídeo y medios fluyentes

Audio, vídeo y la Web
Creación de archivos de audio y vídeo

Archivos de audio
Archivos de vídeo

Formatos de archivos a descargar

Formatos de audio
Formatos de vídeo

Cómo añadir audio y vídeo a una página Web
Plug-in de audio y vídeo
Medios fluyentes

Sonido fluyente
Vídeo fluyente

Cómo añadir medios fluyentes a una página Web

Adición de sonido fluyente a una página Web
Trabajo con vídeo fluyente

Resolución de problemas
Diseño para el mundo real

Exploración de las opciones fluyentes



32. Trabajo con Shockwave Flash

Multimedia y Web
Temas básicos de Macromedia Director, Shockwave y Flash
Exploración detallada de Flash
Trabajar con Flash

Creación de una animación Flash
Publicación con Flash 4
Publicación con Aftershock

Resolución de problemas
Diseño para el mundo real

¡Austin Powers utiliza Shockwave!



33. Utilización de applets Java y componentes ActiveX

Acerca de Java
Historia de Java

Aplicaciones de Java

Escritura de un subprograma
Controles ActiveX

ActiveX frente a Java
Tecnología de controles ActiveX
Herramientas para desarrollo de controles ActiveX

Ejemplo: un control ActiveX basado en ATL utilizando AppWizard

Cómo añadir propiedades a un control
Cómo añadir generadores de suceso y manipuladores a un control
Cómo añadir el control a un documento HTML

Resolución de problemas
Diseño para el mundo real

Cómo añadir un subprograma Java a una página



34. Realidad virtual y medios especializados

Aplicaciones especializadas
Realidad virtual

Lenguaje de Modelado de Realidad Virtual
Programación en VRML
Realidad virtual simulada

Tecnología Push
Canales
Resolución de problemas
Diseño para el mundo real

Construcción de un canal



Parte VII. Aplicaciones de servidor y de última generación

35. Fundamentos de CGI y preprocesado

La Interfaz de Puerta Común (CGI)
Elección de los lenguajes CGI

Lenguajes compilados
Lenguajes interpretados

Cómo funciona la CGI

Conexiones HTTP y cabeceras
Cómo enviar los datos a su aplicación CGI
Los métodos de solicitud get y post
Cómo agregar información a los URL
El método post y la introducción de datos estándar
Variables de entorno
Pares nombre/valor
Codificación de URL
Devolución de datos por su aplicación CGI
Creación de la cabecera de respuesta
Cómo llamar a aplicaciones CGI

Uso de scripts y aplicaciones populares

Manejo de las entradas en un formulario
Creación de libros de visitas
Manejo de las entradas en un formulario

Técnicas de preprocesado con Include del lado del servidor (SSI)
Resolución de problemas
Diseño para el mundo real

Creación de un contador de acceso de sólo texto



36. Páginas de servidor activo (ASP) y herramientas relacionadas

Cómo empezar a utilizar ASP
Uso de scripts del lado del cliente frente a scripts del lado del servidor

Scripts del lado del cliente
Scripts del lado del servidor

Revisión de las variables y objetos ASP
Técnicas y componentes de servidor activo
Integración de bases de datos y ASP
Uso de herramientas ASP
Temas ASP

Seguridad
Optimización del rendimiento
Elección de la base de datos correcta
Elección del método de acceso a datos apropiado
Soporte de navegador
Recursos adicionales

Resolución de problemas
Diseño para el mundo real

Qué es la depuración
Qué hacer y qué no hacer en la depuración



37. Elementos básicos de bases de datos

Acerca de los sistemas de bases de datos

Comparación entre bases de datos de servidor de archivos y RDBMS

Exploración de varios productos de bases de datos

Bases de datos de servidor de archivos
RDBMS

Elección de las herramientas de desarrollo de bases de datos

Lenguaje de Modelado Universal
Microsoft Visual Modeler

Trabajo con aplicaciones de base de datos

Exploración de la arquitectura N-Hilera
Normalización de datos
Relaciones entre bases de datos
Uso de restricciones

Uso de bases de datos

Procedimientos guardados y disparadores

Qué hacer y qué no hacer para ajustar el rendimiento
Otros temas de bases de datos

Minimización del tráfico en la red
Configuraciones de hardware
Duplicación

Resolución de problemas
Diseño para el mundo real

CDnow.com



Contenido del CD-ROM

Índice alfabético