Creación de Una Pagina Web

CREACIN DE UNA PAGINA WEB
El servicio World Wide Web es un Sistema de Informacin distribuido por Internet basado en la tecnologa hipertexto/hipermedia; Un documento hipertexto, es un texto en que cualquier palabra puede ser un enlace a otros documentos que contienen ms informacin sobre dicha palabra, se puede acceder a la informacin que nos interese (simplemente haciendo clic con el ratn en la palabra), y de esta forma avanzar de documento en documento hasta encontrar la informacin deseada. Un documento hipermedia es un hipertexto, pero que no incluye slo informacin textual sino tambin informacin multimedia, es decir, puede incluir grficos, vdeo, y sonido. HTML es el acrnimo de HyperText Markup Language (Lenguaje de Marcado de Hipertexto) y es el lenguaje que se utiliza para crear las pginas web. Este lenguaje indica a los navegadores cmo deben mostrar el contenido de una pgina web.
MI PRIMER DOCUMENTO HTML

PASO 1: Abrimos el bloc de notas en INICIO/Todos los Programas/Accesorios/Bloc de Notas
PASO 2: Dentro del bloc de notas se teclea los atributos del lenguaje HTML EJEMPLO: <HTML> <HEAD> <TITLE> MI PRIMERA PAGINA</TITLE> </HEAD> <BODY> <CENTER><H1>Mi primera pagina Web</H1></CENTER> <HR> Esta es mi primera pagina, aunque todava es muy sencilla. <BR>Como el lenguaje HTML no es difcil, pronto estar en condiciones de hacer cosas mas interesantes. <P> Aqu va un segundo prrafo.</P> </BODY> </HTML> PASO 3 Para grabar el archivo seguimos los pasos como vemos: - Nos vamos al Men Archivo y seleccionamos Guardar Como como vemos en la imagen:
ING. CARLOS E. P. DIAZ GANTU
- Seguidamente nos aparecer la ventana de Guardar Como y elegiremos la ruta donde guardaremos el archivo, luego tecleamos el nombre del archivo pero ponindolo siempre al final ,html (Ejem. Mi Primera Pagina.html), y elegiremos en Tipo Todos los Archivos y guardamos:
Al final el archivo se guardara en la ruta especificada y al abrirlo se mostrara la siguiente pantalla:
ESTRUCTURA DE UN DOCUMENTO HTML

Un Documento HTML siempre se compone de las siguientes 2 partes: <HTML> <HEAD> </HEAD> <BODY> </BODY> </HTML>
CABECERA
CONTENIDO DEL DOCUMENTO
ALGUNAS ETIQUETAS Y ATRIBUTOS

Atributos del BODY - Bgcolor: Especifica el color del fondo - Background: Ingresa un color o imagen de fondo - Text: Indica el color del texto Algunos Cdigos de Colores:
BLANCO VIOLETA AMARILLO AZUL MARRN PRPURA VERDE ROJO NEGRO #FFFFFF #EE82EE #FFFF00 #0000FF #A52A2A #800080 #008000 #FF0000 #000000
Algunas Etiqueta y Atributos a usar: <html></html> Abre y cierra un documento HTML <head></head> Encabezado de la pgina. <body></body> Dentro de esta etiqueta va todo el cuerpo de la pgina web. Etiquetas del Encabezado <title></title> El ttulo de la pgina web. Atributos de la etiqueta Body <body bgcolor=?> Configura el color de fondo de la pgina, usando el valor del cdigo de color hexadecimal. <body text=?> Configura el color por defecto del texto, usando el valor del cdigo de color hexadecimal. Etiquetas HTML de Texto <pre></pre> Texto pre-formateado <h1></h1> Ttulo ms grande <h6></h6> Ttulo ms pequeo <b></b> Negritas <u></u> Subrayado <i></i>
Cursivas <cite></cite> Cita, en cursiva <font face=?></font> Coloca el tipo de letra: por ejemplo, arial, verdana, courier,etc. <font size=?></font> Coloca tamao de letra, de 1 a 7 <font color=?></font> Configura el color, usand valor hexadecimal o nombre directo (blue, green, etc.) Ligas <a href="URL"></a> Hipervnculo Formato y presentacin <p></p> Nuevo prrafo <p align=?> Alinea el prrafo hacia la izquierda, derecha o al centro <br> Inserta un interlineado suave. Crea otra lnea Elementos Grficos <img src="name"> Incorpora una imagen <img src="name" align=?> Alinea la imagen: izquierda, derecha y centro <img src="name" border=?> Determina el contorno de la imagen. Un valor 0 no tendr contorno <body background="URL o ruta de archivo"></body> Coloca la imagen como fondo de la pgina <hr> Linea horizontal <marquee> texto u objeto a desplazarse </marquee>
Etiquetas Apertura <A> <BASEFONT SIZE> <BGSOUND> <BIG> <BLINK> Accin Hipervnculo. Tamao de la fuente base. Sonido de fondo. Aumenta el tamao. Hace parpadear el texto. Da formato con sangra a un prrafo Cuerpo del documento. Centrar. Sonido de Fondo. Definicin de la fuente. Tamao de letras del 1 al 6. Lnea horizontal. Itlica (Cursiva). Cargar imgenes. Atributos HREF, NAME, REL, REV, TITLE Ninguno SRC, LOOP. Ninguno Ninguno </A> NO NO - Internet Explorer </BIG> </BLINK> - Netscape Cierre
<BLOCKQUOTE>
Ninguno BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK Ninguno SRC, WIDTH, HEIGHT, AUTOSTART, LOOP. SIZE, COLOR. Internet Explorer: FACE.
</BLOCKQUOTE>
<BODY> <CENTER> <EMBED> <FONT>
</BODY> </CENTER> NO - Netscape </FONT>
<H1 ...H6>
HTML 3.0: LEFT, CENTER, RIGHT NOSHADE, SIZE, WIDTH, ALIGN. Internet Explorer: COLOR Ninguno ALIGN, SRC, ALT, ISMAP, WIDTH, HEIGHT, VSPACE, HSPACE ALIGN, BEHAVIOR, BGCOLOR, DIRECTION, HEIGHT, WIDTH, HSPACE, VSPACE, LOOP, SCROLLAMOUNT, SCROLLDELAY. Ninguno LEFT, CENTER, RIGHT Ninguno Ninguno Ninguno Ninguno
</H1 .../H6>
<HR> <I> <IMG>
NO </I> NO
<MARQUEE>
Marquesina.
</MARQUEE> Internet Explorer NO </P> </S> </SUB> </SUP> </TITLE>
<P> <P ALIGN> <S> <SUB> <SUP> <TITLE>
Salto a otro parrafo. Alineacin de texto. Texto tachado. Subndice. Superndice. Ttulo dentro de HEAD.
Atributos Nombre HREF SRC <IMAGE> ALT BGCOLOR BACKGROUND TEXT ALIGN ALIGN SIZE WIDTH SIZE COLOR FACE HEIGHT WIDTH <EMBED>, <IMAGE>, <MARQUEE>, <TD>, <TH> <FONT> <HR> <H1..H6>, <P ALIGN>, <TD>, <TH>, <TR>, <DIV>, <BODY> Etiqueta Direccin del URL local o remoto. Accin href="www.hp.com" Nombre del grfico Nombre que reemplaza a la imgen cuando sta no puede ser cargada. Color de fondo Imgen de fondo Color del texto Alinear el texto: LEFT, RIGHT, CENTER Alinear el texto: LEFT, RIGHT, CENTER Valor de la altura en pixels o porcentaje Valor del ancho en pixels o porcentaje Tamao de la letra de 1 a 7 Color de la letra Fuente del texto (Internet Explorer) Valor de la altura en pixels o porcentaje Valor del ancho en pixels o porcentaje src="imagen.gif" alt="Nombre de Imgen" bgcolor="#FFFFFF" (blanco) background="foto.gif" text="#000000" (negro) align=center align=center size=3 width=50% size=6 color="#000000" (negro) face="helv" (helvtica) heigth=80 width=50% Valor

Creación de Una Pagina Web

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Creación de Una Pagina Web

Uploaded by

Copyright:

Available Formats

CREACIN DE UNA PAGINA WEB

MI PRIMER DOCUMENTO HTML

ING. CARLOS E. P. DIAZ GANTU

Al final el archivo se guardara en la ruta especificada y al abrirlo se mostrara la siguiente pantalla:

ESTRUCTURA DE UN DOCUMENTO HTML

CONTENIDO DEL DOCUMENTO

ING. CARLOS E. P. DIAZ GANTU

ALGUNAS ETIQUETAS Y ATRIBUTOS

ING. CARLOS E. P. DIAZ GANTU

ING. CARLOS E. P. DIAZ GANTU

<BODY> <CENTER> <EMBED> <FONT>

</BODY> </CENTER> NO - Netscape </FONT>

<HR> <I> <IMG>

</MARQUEE> Internet Explorer NO </P> </S> </SUB> </SUP> </TITLE>

<P> <P ALIGN> <S> <SUB> <SUP> <TITLE>

ING. CARLOS E. P. DIAZ GANTU

ING. CARLOS E. P. DIAZ GANTU

You might also like