C1

HTML
HyperText Markup Languaje

Your Logo
HTML
Siglas de HyperText Markup Language
(Lenguaje de Marcas de Hipertexto), es el
lenguaje de marcado predominante para la
construccin de pginas web.
HERE COMES YOUR FOOTER PAGE 2
Your Logo
HTML
Se escribe en forma de "etiquetas", rodeadas por
corchetes angulares (< , >).
HTML tambin puede describir, la apariencia de un
documento, y puede incluir un script (por ejemplo
Javascript), el cual puede afectar el
comportamiento de navegadores web y otros
procesadores de HTML.
Your Logo
HTML
Your Logo
Los elementos son la estructura bsica de HTML.
Los elementos tienen dos propiedades bsicas:
atributos y contenido. Cada atributo y contenido
tiene ciertas restricciones para que se considere
vlido al documento HTML.
Un elemento generalmente tiene una etiqueta de
inicio <nombre-de-elemento> y una etiqueta de
cierre </nombre-de-elemento>
Your Logo
Los atributos del elemento estn contenidos en la
etiqueta de inicio y el contenido est ubicado entre
las dos etiquetas <nombre-de-elemento
atributo="valor"> Contenido </nombre-de-
elemento>
Algunos elementos, tales como , no tienen
contenido ni llevan una etiqueta de cierre.
Your Logo
Your Logo
Estructura
El marcado estructural describe el propsito
del texto.
Por ejemplo, <h2>Golf</h2> establece a
"Golf" como un encabezamiento de segundo
nivel, el cual se mostrara en un navegador
de una manera similar al ttulo
Your Logo
El marcado presentacional describe la
apariencia del texto, sin importar su funcin.
Por ejemplo, negrita indica que los
navegadores web deben mostrar el texto en
negrita negrita
Your Logo
La mayora de los atributos de un elemento son
pares nombre-valor, separados por un signo de
igual "=" y escritos en la etiqueta de comienzo
de un elemento, despus del nombre de ste, el
valor debe estar rodeado por comillas dobles.
<p(etiqueta) align(atributo)=center(variable)>
Your Logo
As, si desesemos introducir un texto alineado a la izquierda escribiramos:
Texto alineado a la izquierda
El resultado seria:
Texto alineado a la izquierda
Para una justificacin al centro:
Texto alineado al centro
que dara:
Texto alineado al centro
Para justificar a la derecha:
Texto alineado a la derecha
cuyo efecto seria:
Texto alineado a la derecha
Your Logo
Algunos de los atributos de la etiqueta P son:
id - identificador nico
class - nombre de clase a la que pertenece
title - texto a mostrar en un "tool tip"
style - estilos css
dir - direccin del texto (de izquierda a derecha o viceversa)
lang - cdigo del lenguaje (si es diferente al especificado para la pgina)
Partes de la esturctura web
Your Logo
Esencialmente las pginas web se dividen en 4 partes:
inicio, cabecera, cuerpo, final.
Your Logo
Inicio <html>
Se le indica al navegador que comienza un nuevo
cdigo HTML, para ello se utiliza la etiqueta <html>
Your Logo
Cabecera <head> y <title>
Esta parte se ocupa entre otras cosas para poner el
ttulo de la pgina web (el cual se muestra en la pestaa del
navegador).
Primero le indicamos que comienza la cabecera con la
etiqueta <head>, luego el ttulo de la pgina es lo que
va entre <title> y </title>, finalmente indicamos que se
acaba la parte de la cabecera con </head>
Your Logo
En html se escribira:
<title> ttulo de la pgina </title><head>cabecera de la
pgina</head>
Cuerpo <body>
Esta parte es lo que realmente se ve en los
navegadores, es decir el es cuerpo del documento, para
indicar que comienza se utiliza la etiqueta <body>
Your Logo
Luego se pone el contenido de la pgina web, por ahora
pondremos slo un texto, para ello ocupamos algunas
etiquetas como y , que sirve para indicar el
inicio de un prrafo; todo lo que va entre estas
etiquetas (<body> y </body>) es lo que el navegador
mostrar en pantalla.
Your Logo
Fin </html>
Luego le indicamos que hasta aqu llega la pgina web,
esto lo hacemos con la etiqueta </html>
Ejemplo
Your Logo
<html> 
<head>
<title>Mi primera pgina</title> 
</head>
<body> Hola mundo  </body>
</html> 
Para indicar un comentario, ponemos ! dentro de >< va el comentario.
Tarea
Your Logo
Fecha de entrega:
Martes 2 de Septiembre mximo a las 20 Horas (8 de la
noche).
Mtodo de entrega:
Archivo Excel, pdf, Word, en alguno de los siguientes
correos:
marco@cubecd.com
info@cubecd.com
Your Logo
Buscar mnimo 20
Etiquetas
Atributos
Variables
En un excel, ordenadas y bien distribuidas.
<p(etiqueta) align(atributo)=center(variable)>
Your Logo
Realizar el rbol de navegacin de un sitio web (tal como
lo vimos la primer clase), y poner la referencia del sitio
(www.patitos.com).
El formato es rbol vertical y no se permiten sitios
creados a base de plantillas como Wix, WordPress,
Mex, etc.

C1

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

C1

Cargado por

Copyright:

Formatos disponibles

HTML

HyperText Markup Languaje

También podría gustarte