Sunteți pe pagina 1din 18

CREACION DE PÁGINAS WEB BÁSICAS

Aprende como crear tu propia Página Web...

¿Sabias que puedes crear


una página web sencilla
con el Bloc de Notas?

Aquí aprenderás como hacerlo, solo necesitas saber HTML...


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

¿Que es una página web?


Es un documento electrónico que
cuenta con imágenes, texto,
video, audio y demás recursos
multimediales para comunicar
información a través de la web o
internet.

y... ¿para que me sirve una página web?


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

¿Para que sirve una página web?


Las páginas web, te permiten
navegar de una página de
documento a otra, compartir
informacion con millones de
personas en el mundo asi
como también ellos pueden
ver la información de tu
página. Son creadas
básicamente con código HTML.

ahora... ¿conoce el HTML?


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

¿Que es HTML?
HTML (HyperText Markup
Language ó Lenguaje de Marcado
de Hipertexto).

Es el lenguaje con que se definen


las páginas web, contiene un
conjunto de instrucciones que
sirven para incluir el texto y otros
elementos que contienen la
página web.

¿Como utilizar el HTML?


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

Estructura Lógica
Toda página web empieza con la
etiqueta <HTML> dentro de la cual
se almacena todo el código de la
página web.

Recuerda que las instrucciones


HTML deben abrirse con los
operadores < > y cerrarse con </ >,
asi como se muestra en la imagen.

¿Que es el Head?
CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

Estructura Lógica
A continuación se ubica el
<HEAD>, o cabecera, dentro de la
cual se ubica el título de la página
web, este es reconocido, en una
de sus pestañas, por el navegador
que permite visualizarla.

Titulo de la pagina web

¿Que es el Body?
CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

Estructura Lógica
El <Body> permite almacenar todo
el código que necesitas para
insertar tablas, párrafos,
imágenes, colores, enlaces, y
demás recursos que necesite tu
página web, lo que se encuentre
aquí se visualizará en pantalla.

No olvides que todas las


instrucciones que abras (<body>)
necesitaran cerrarse (</body>).

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


A continuación crearemos una
página web paso a paso, para que
puedas comprender mejor.

PASO 1.
Abrir el editor de texto sin
formato (bloc de notas).

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 2.
Iniciar la estructura de la página
web con el código HTML.

Abre la instrucción <html> y no


olvides cerrarla </html>.

Dentro de ella se almacenara


todo el código de la página HTML.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 3.
Ubicate dentro de las
instrucciones <html> y abre
una nueva instrucción:
<head>, no olvides cerrarla
</head>.

Aquí ubicaremos el título de la


página que aparecerá en una
pestaña del navegador.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 4.
Dentro de las instrucciones
<head> ubicamos una nueva:
<title> la cual establecerá el
título de la página, no olvides
cerrarla </title>.

Puedes escribir el título de tu


página dentro de estas
instrucciones. En este caso se
llamará MIPAGINA, sin espacios.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB

PASO 5.

Abre la instrucción <body>


dentro de esta irá todo el
cuerpo de la página web, solo
lo que se enuentre aquí se
pordra visualizar en pantalla,
no olvides cerrarla </body>.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 6.
Ubícate dentro de la
instrucción <body> para
incluir un titulo a tu página,
hazlo con la instrucción <h1>
que sirve para agregar
encabezados, no olvides
cerrar la intruccion </h1>.

Dentro de ellas puedes


escribir un título.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 7.
Aun dentro de la
instrucción <body> agrega
párrafos con la instrucción
<p>, no olvides cerrarla
</p>.

Escríbe un pequeño
párrafo.

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

HAGAMOS UNA PÁGINA WEB


PASO 8.
Le hace falta un color de
fondo ¿verdad?
Utiliza la instrucción
Bgcolor, añade al <body>
asi como se muestra en la
imagen.
El color debe escribirse en
ingles o hexadecimal (es el
color codificado en letras y
números).

!Hagamos una página web!


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

GUARDAR LA PÁGINA WEB


Haz clic en Archivo,
Guardar Como:
Index.html
porque es una página
de inicio, y escoges en
Tipo de documento:
Todos los
archivos.
Ubica el archivo en el
escritorio para que sea
de facil acceso.
¡Y a Guardar y ejecutar nuestra página web!
CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

¡PROBEMOS!
Si ubicaste el archivo en el
escritorio de tu computador,
solo debes ir allí y hacer
doble clic en el archivo, el
cual tendrá un icono con la
imagen de tu navegador.
Y a disfrutar de tu pequeña
pagina web.

Veamos como resultó la pagina web... por ahora


CREACION DE PÁGINAS WEB BÁSICAS
Aprende como crear tu propia Página Web...

¡PROBEMOS!
¡MI PAGINA WEB!

Vé y practica más diseños a tu gusto...

S-ar putea să vă placă și