Índice

Personalizar el contenido

Ahora que ha tomado la medida de esta plantilla de página con Responsive Web Design, podrá personalizarla y modificarla si es preciso. Para ello, sírvase del panel DOM. Ese panel permite ver toda estructura de las páginas. Bastará con que seleccione los elementos de contenido para poder verlos en modo Diseño.

Utilizando el panel DOM, seleccione el título de la página, el elemento <h1>.

Dreamweaver selecciona el contenido en modo Diseño y el elemento HTML en modo Código. De esa forma sabrá exactamente lo que está haciendo, tendrá total control de la edición de la página.

images/22OWT-06B.PNG

Haga lo mismo con todos los elementos de redacción de la página. Observe que Dreamweaver indica el tamaño ideal de las imágenes.

images/18C22-015.png

Este es un ejemplo de personalización en Dreamweaver:

images/22OWT-07.PNG

Este es el resultado a pantalla completa:

images/22OWT-08.PNG

Este es el resultado en una tableta:

images/22OWT-09.png

Este es el resultado en una pantalla de smartphone:

images/22owt-10.png