1 / 10

DISEÑO WEB

DISEÑO WEB. SEM05. Introducción al HTML. Ing. Cesar Requejo. DISEÑO WEB. Introducción al HTML La world wide web tiene una arquitectura cliente / servidor.

shaw
Télécharger la présentation

DISEÑO WEB

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. DISEÑO WEB SEM05. Introducción al HTML. Ing. Cesar Requejo

  2. DISEÑO WEB Introducción al HTML • La world wide web tiene una arquitectura cliente / servidor. • Para que el intercambio de información entre el cliente y el servidor se realice de acuerdo a unos parámetros que ambos puedan entender, se utilizan protocolos de comunicaciones. Internet se fundamenta en el protocolo TCP/IP, sobre el cual se construyen otros protocolos de aplicación. En el caso de la world wide web, el protocolo utilizado es el HTTP (Hipertext Transfer Protocol).

  3. DISEÑO WEB Introducción al HTML • Las páginas que se visualizan están formadas, fundamentalmente, por textos e imágenes, con una estructura y un formato específicos. El HTML (Hipertext Markup Language) es lo que nos permite decirle al navegador cómo debe mostrar la información: formato de los textos, colores, orden de los párrafos, etc.

  4. DISEÑO WEB Introducción al HTML • A menudo observamos como una misma página puede visualizarse de manera diferente (colores, ancho de tablas, formato de textos, etc.) en función del navegador que se utilice: el HTML no es una forma de codificar la información, sino de especificar el formato que debe darse a la información. Por ejemplo, podemos transmitir la palabra "¡Hola!" que tenemos guardada en un fichero de texto. Pero, ¿cómo decirle al navegador que la muestre de color rojo y centrada? El HTML es la respuesta.

  5. DISEÑO WEB El Concepto de Etiqueta (tag) • El HTML describe el aspecto visual que debe tener una página mediante la utilización de etiquetas (tags). Las etiquetas le indicarán al navegador la posición relativa de los elementos de la página, su tamaño, las tipografías y colores a utilizar, etc.Las etiquetas son como instrucciones que le indican al navegador como mostrar la información. Existen dos clases de etiquetas: • Etiquetas vacías • Tiene el siguiente formato: • <etiqueta>

  6. DISEÑO WEB El Concepto de Etiqueta (tag) • Estas etiquetas dan un formato al texto o porción del documento que engloban. Este tipo de etiquetas tiene una marca inicial, y una marca final igual que la inicial, pero con el caracter "/". Todo lo que esté contenido entre ambas marcas quedará sujeto al formato indicado por la etiqueta. Por ejemplo, podemos mostrar la palabra "¡Hola!" en cursiva de la siguiente forma: • <i>¡Hola!</i> La mayoria de estas etiquetas pueden, a su vez, contener otras etiquetas, de cualquiera de los dos tipos. Por ejemplo, para mostrar la palbra "¡Hola!" en cursiva y negrita: • <i><b>¡Hola!</b></i>

  7. DISEÑO WEB El Concepto de Argumento • Las etiquetas pueden especificar, por ejemplo, que cierta palabra aparezca en negrita. Pero si queremos que cierta palabra aparezca de color rojo, necesitamos suministrar un parámetro: el color. La mayoría de las etiquetas tienen parámetros para indicar múltiples aspectos del formato, como el color, el tamaño, la posición, etc. • El formato de una etiqueta con parámetros es el siguiente: • <etiqueta parametro1="valor1" parametro2="valor2" ... > ... </etiqueta> Por ejemplo, para mostrar la palabra "¡Hola!" en rojo, utilizamos la etiqueta font con el parametro color igual a red: • <font color="red">¡Hola!</font>

  8. DISEÑO WEB Mi primera página • Toda página HTML debe comenzar por la etiqueta <html> y terminar con </html>. Todo lo que figure entre estas etiquetas será interpretado por el navegador como un documento HTML. Lo que quede fuera de ellas será, en la mayoría de los casos, ignorado. • El documento HTML se divide siempre en dos partes: cabecera y cuerpo.

  9. DISEÑO WEB Mi primera página • La cabecera figura entre las etiquetas <head> y </head>. En ella se especifica el título, el autor, y otras características del documento que no se muestran físicamente en la página y que sirven para facilitar su indexación (son lo que se conoce como meta tags). En la cabecera también deben incluirse los scripts que necesite el documento (JavaScript, JScript, etc.) y las definiciones de estilos (si se utilizan hojas de estilos).

  10. DISEÑO WEB Mi primera página • El cuerpo es la parte del documento que se circunscribe entre las etiquetas <body> y </body>. En esta parte se incluye la página propiamente dicha. • Teniendo esto en cuenta podemos construir ya nuestra primera página HTML con los elementos mínimos necesarios para que sea interpretada correctamente por un navegador: • <html><head><title>Mi primera pagina HTML</title></head><body>Mi primera página HTML</body></html>

More Related