• COLECCIONES
  • EBOOKS
  • PROGRAMACIÓNFicha del libroimprimir

    HTML y CSS

    Portada

    Reseña

    Hoy en día, cualquier persona puede crear su propio sitio web y presentarlo al público en Internet. Utilizando el lenguaje HTML bien estructurado para el contenido y CSS para la presentación, obtendrá no sólo un sitio web excelente, sino que accederán a él diferentes usuarios en un amplio rango de plataformas: desde aquéllos que navegan en ordenadores normales hasta, quienes acceden a la Web con los últimos dispositivos móviles.

    Con este libro aprenderá a crear páginas web válidas en cualquier navegador presente o futuro, utilizando herramientas sencillas que en la mayoría de los casos, además, son gratuitas. Comprenderá los fundamentos de la práctica del diseño web contemporáneo y conocerá todo lo que tiene que saber para avanzar en su viaje como estandarista web.

    Ficha del libro

    • Colección: PROGRAMACIÓN
    • Autor: Christopher Murphy, Nicklas Persson
    • Nº de páginas: 432
    • Formato: Papel
    • Tamaño: 17,5 x 22,5
    • I.S.B.N: 978-84-415-2611-2
    • Código Comercial: 2318092
    • Precio sin IVA: 35,19€
    • Precio con IVA: 36,60€
    • Fecha de Publicación: 14/09/2009
    • Nivel: Medio/Avanzado

    Índice cerrar índice [x]

       Agradecimientos
       Sobre los autores
       Sobre el revisor técnico

    Introducción
       Antecedentes
       ¿A quién va dirigido este libro?
       Qué vamos a conseguir
       Convenciones
       Código fuente


    Parte I. Fundamentos de XHTML

    1. ¿Es usted un estandarista Web?
       Breve historia de la World Wide Web
         -  Ha nacido la Web
         -     La Web perfecta
         -     La caótica Web
         -  Origen de HTML
         -  HTML evolucionado
         -     La X en XHTML
       Estándar Web
         -  ¿Qué son los estándares?
         -  ¿Estándares Web?
       ¿Por qué utilizar estándares Web?
         -  Separar contenido y presentación
         -  Eficiencia con un reducido etiquetado
         -  Mayor accesibilidad
         -  Compatibilidad en navegadores
         -  Compatibilidad fuera de los navegadores
         -  Compatibilidad en el futuro
       El enfoque de los estandaristas Web
         -  "Dar cera… pulir cera"
         -  ¿Por qué utilizar XHTML?
         -  Ventajas de CSS
       Caja de herramientas de los estandaristas Web
         -  No somos WYSIWYG
         -  ¿Cuál es su editor de texto sin formato favorito?
         -  ¿Mac OS X, Windows o Linux?
       Resumen
       Ejercicio: Establecer el entorno de trabajo

    2. Crear páginas Web básicas
       HTML: etiquetas en acción
         -  ¿Qué son etiquetas?
         -  Las etiquetas suelen venir de dos en dos
         -  Se trata de un elemento, mi querido Watson
       Su primera página Web: Hello World!
       Para marcar una página Web, simplemente escriba
         -  El etiquetado hace la página Web
         -  Aprender de otros: cómo ver el código fuente
       Todas las páginas tienen un <head> y un <body>
         -  La importancia de utilizar el elemento title
       Definir el tipo de documento
         -  Todo comienza con un DOCTYPE
         -     Breve definición de Quirks Mode
         -     Todo está en un namespace
         -     Sólo una cosa más
         -  Todo esto no hay que memorizarlo
         -     Hello World!: Edición DOCTYPE
       Las etiquetas también tienen estructura: elementos anidados
       Etiquetado fácil de seguir
         -  Comentar el etiquetado
         -  Espacios en blanco
       Resumen
       Ejercicio: Cree su primera página XHTML sobre un mono espacial

    3. Etiquetado estructurado
       Añadir estructura y significado
       ¿Qué es etiquetado estructurado?
         -  ¿Qué es etiquetado semántico?
         -  Etiquetado con significado
         -  POSH
       Signposts for Reading
         -  Crear estructura con encabezados y párrafos
         -  Aplicar jerarquía de información
         -  Caso práctico: el guardián
       Introducción a elementos de frase
         -  ¿Qué es un elemento?
         -  Añadir significado a fragmentos de texto
         -  Añadir énfasis: <em> y <strong>
         -  Otros elementos de frase
       Elementos block-level e inline-level
         -  Imagine una caja
         -  Diferencia entre elementos block-level e inline-level
       El código válido es etiquetado compatible con los navegadores
         -  W3C Markup Validation Service
         -  El código válido no es necesariamente código bien estructurado
       Facilitar la búsqueda
       Resumen
       Ejercicio: Presentar a Miss Baker

    4. Etiquetado que aporta significado
       Listas: organizadores de primer nivel
         -  ¿Por qué utilizar listas?
         -  Listas ordenadas y sin ordenar
         -  Lista ordenada
         -  Anidar listas
         -  Listas de definición
       Tablas: las buenas, las malas y las alternativas
         -  ¿Qué son datos tabulares?
         -  <table>, <tr> y <td>
         -  Mejorar la accesibilidad de las tablas
         -  Añadir un resumen descriptivo a una tabla
       Entrecomillar texto
         -  ¿Qué es <blockquote>?
         -  Citas (o <cite>)
         -  Entrecomillados (o <q>)
       Otras etiquetas
         -  Abreviaturas
         -  El caso de <hr />
         -  Etiquetas de auto cierre
         -  <code> y <pre>
         -  Etiquetar cambios con <del> y <ins>
         -  <sup> y <sub>
       Resumen
       Ejercicio: La aventura de Gordo

    5. Imágenes
       Etiqueta <img />
         -  Ejemplo de etiqueta <img />
         -  Añadir a las imágenes atributos de anchura, de altura y de título
       Trabajar con imágenes
         -  ¿Qué editor de imágenes?
         -     Photoshop
         -     Fireworks
         -     Photoshop Express
         -     GIMP (y sus amigos)
       Optimización de imágenes
         -  Por qué es importante comprimir las imágenes
         -  Guardar para la Web
       Formatos de imagen para la Web
         -  JPG: Fotografías
         -  GIF: Gráficos y tipos
         -  PNG
         -     PNG-8
         -     PNG-24
       Un píxel es un píxel
         -  Tamaño
         -  Las limitaciones de los mapas de bits
         -  Gráficos vectoriales
       Encontrar la imagen adecuada
         -  Imágenes de bajo coste
         -  Flickr y Creative Commons
       Resumen
       Ejercicio: Una imagen vale más que mil palabras

    6. Crear vínculos con anclas
       Etiqueta <a>
         -  Utilizar texto descriptivo en el vínculo
         -  Atributo title
       ¡Vamos a crear algunos vínculos!
         -  Vínculos externos
         -     El temido & y el validador
         -     Comprobar los vínculos
         -     El (maldito) atributo target
         -  Vínculos locales
         -  Vínculos internos
         -  Vínculos de correo electrónico
         -  Recapitulación
       Vínculos absolutos vs. vínculos relativos
       Estructurar el sitio Web
         -  Organizar los archivos y carpetas
         -  Archivo mágico de índice
       Vincular diferentes carpetas de nuestro sitio entre sí
         -  Vincular dentro de una carpeta
         -  Vincular a una subcarpeta
         -  Vincular a una carpeta "progenitora"
         -  Vincular hacia arriba y después hacia abajo
       Resumen
       Ejercicio: Orden primero, vínculos después

    7. Su sitio online
       Su dirección en la Web
         -  ¿Qué es un nombre de dominio?
         -  ¿Qué es un TLD?
         -  ¡Piense un nombre!
         -  Registrar un nombre de dominio
       Hosting en la Web
         -  ¿Hosting gratuito en la Web?
         -  El equilibrio adecuado
         -  Aspectos que debe tener una compañía de hosting
         -     Espacio de disco
         -     Ancho de banda
         -     Correo electrónico
         -     Panel de control
         -     Soporte
         -  Cambiar de compañía de hosting
       Subir archivos
         -  Local frente a remoto
         -  FTP (File Transfer Protocol)
         -  Propagación
       Herramientas que utilizamos
         -  ¿Qué cliente FTP?
         -  Transferir archivos al servidor
         -  ¿Qué necesitamos?
         -     La dirección del servidor
         -     El nombre de usuario
         -     La contraseña
         -  Comenzar
         -  Demostración online
       Resumen
       Ejercicio: Subir el sitio online


    Parte II. Añadir estilo con CSS

    8. CSS 101
       Añadir estilo
         -  HTML: breve repaso
         -  CSS no es nuevo
         -  ¿Sopa de etiquetas o simplificado y optimizado?
         -  CSS al rescate
       Introducción a CSS
         -  Anatomía de una regla de CSS
         -  Formato
         -  Regla un poco más compleja
       Añadir CSS a una página Web
         -  Añadir una hoja de estilo insertada
       Procedimiento sencillo
         -  Colores
         -  Aplicar estilo a <body>
         -  Aplicar estilo a los encabezados: <h1> y <h2>
         -  Aplicar estilo a <p>
         -  Comentarios en CSS
       Resumen
       Ejercicio: Añadir CSS a la página Web de Gordo

    9. Aplicar estilo al texto
       Tipografía en la Web
         -  ¿Qué es tipografía?
         -  CSS: Nuestro amigo flexible
         -  Hacer accesible el texto
       Herencia y especificidad
         -  Herencia
         -  Especificidad
       Especificar fuentes en la Web
         -  Fuentes Web básicas
         -  Escribir reglas de CSS más fiables para especificar fuentes
         -     Serif
         -     Sans serif
         -     Monospace
         -     Cursive
         -     Fantasy
       Tamaño
         -  Tamaño de texto con píxeles
         -  Tamaño de texto con ems
       Escribir reglas más eficientes
       Añadir más reglas
         -  Especificar un tipo de letra
         -  Vamos a perder peso
         -  Transformar texto
         -  Espacio entre letras
       Aplicar estilo a párrafos
         -  Establecer un alto de línea
         -  Añadir sangría a párrafos
         -  Alinear texto utilizando text-align
       Aplicar estilo a los vínculos
         -  Utilizar pseudo clases para aplicar estilo a vínculos
         -  LoVe HAte
       Resumen
       Ejercicio: Mejorar la tipografía de Gordo

    10. Presentación a una columna con CSS
       La cascada en Cascading Style Sheets
         -  ¿Qué es exactamente la cascada?
         -  El orden de sus reglas de CSS es importante
       Márgenes, bordes y relleno
         -  Modelo de cajas
         -  Aplicar márgenes, bordes y relleno
         -  Usar CSS abreviado para márgenes, bordes y relleno
         -  Aplicar estilo a <blockquote>
       Dividir el documento
         -  Identificar las secciones del documento
         -  Elementos div y span con atributos id y class
         -     Elementos div y span
         -     Atributos id y class
         -  Todo está en un nombre
       Elementos div para crear presentaciones con CSS
         -  Presentación a una columna con CSS
         -  Selectores descendientes para minimizar el etiquetado
       Aplicar estilo a detalles con el elemento span
         -  Utilizar un span para aplicar estilo al contenido inline
         -  El lustroso símbolo & de Dan Cederholm
       Aplicar estilo con atributos class
       Perfeccionar el diseño añadiendo imágenes de fondo con CSS
         -  Añadir una imagen de fondo al body
         -  Utilizar imágenes de fondo con otros elementos
       Resumen
       Ejercicio: Crear una presentación a una columna con CSS

    11. Presentación a dos columnas con CSS
       Presentación con CSS basada en floats
         -  Divs flotantes
         -  Aplicar floats a las presentaciones
         -   [...]

    Complementos cerrar complementos [x]