Post on 15-Dec-2015
DISEÑO DE PÁGINAS WEB
Ing. Bretnerys Millán
Objetivo 1Conceptos Básicos
¿Qué es Diseñar?
Página Web
Una página web es una fuente de información adaptada para la World Wide Web (www) y accesible mediante un navegador de Internet. Esta información se presenta generalmente en formato HTML y puede contener hiperenlaces a otras páginas web, constituyendo la red enlazada de la World Wide Web.
Las páginas Web son combinaciones de documentos multimedia y de hipertexto.
Son documentos multimedia porque incorporan imágenes, vídeos, animaciones, sonidos, textos de todo tipo; y son documentos de hipertexto, porque incorporan enlaces con otras páginas.
Diseño de página web
Se trata básicamente de realizar un documento con información hiperenlazado con otros documentos y asignarle una presentación para diferentes dispositivos de salida (en una pantalla de computador, en papel, en un teléfono móvil, etc).
Para diseñar una página web , no es necesario de utilizar un programa específico, si conocemos el código HTML, podríamos desarrollar nuestras páginas web incluso, desde el Block de Notas que viene con el Windows.
Ejemplo:
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
Guardar el archivo en Escritorio con el nombre: mipagina.html
Abrir el archivo guardado
HTML (Lenguaje de Marcación de
Hipertexto) Es el lenguaje en el que se diseñan las
páginas que se visualizan a través del navegador. Este lenguaje se basa en etiquetas (instrucciones que le dicen al navegador como deben mostrarse) y atributos (parámetros que dan valor a la etiqueta).
Entendiendo el código HTML de una Página web Básica
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
Para iniciar siempre una página web, debemos empezar a por la etiqueta <html>, esta etiqueta es necesaria para que nuestros navegadores puedan identificar el contenido que va a mostrar.
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
La etiqueta HEAD la contienen todos los documentos y es la cabecera de información. Siempre aparece en la parte superior del documento.
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
Se encuentra situado entre la etiqueta HEAD y es la que le da el título al documento. Por lo general aparece en la parte superior.
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
Este es el cierre de la etiqueta Head; es necesario cerrar cada una de las etiquetas para que no existan errores.
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
La etiqueta BODY se coloca después de la estructura HEAD y dentro del la etiqueta BODY se coloca todo el contenido de la página web: imágenes, textos, links, etc. La etiqueta BODY es importante para que no se pierdan los parámetros de otras etiquetas.
<html><head><title>Mi página web</title></head><body>Contenido de mi página web</body></html>
Esta frase es el contenido de la página web.
Etapas para el Diseño de una Página Web
Los programas que existen en el mercado, simplemente lo que hacen es escribir el código HTML solo con hacer unos simples click’s desde el programa.
Los más utilizados son: Macromedia Dreamweaver, Microsoft Front Page, Adobe GoLive, Web Developer, etc.
¿Preguntas?
Investigar
Objetivo 2Macromedia Dreamweaver
¿Qué es Dreamweaver?
Es un editor HTML profesional para diseñar, codificar y desarrollar sitios, páginas y aplicaciones Web. Tanto si desea controlar manualmente el código HTML como si prefiere trabajar en un entorno de edición visual, Dreamweaver proporciona útiles herramientas para la creación Web.
Las funciones de edición visual de Dreamweaver permiten: