Para empezar haremos un click derecho sobre nuestro escritorio y crearemos una carpeta.
Adentro de la carpeta crearemos un archivo nuevo de texto.
Lo llamaremos Index.html.
Si nos aparece un mensaje con la leyenda que el archivo ya no se podrá usar, hacemos click on yes o si en español.
Ahora ya tenemos nuestra página web, si damos click en este archivo se abrirá en el navegador de nuestra elección, notaremos que solo es un documento en blanco.
Editando nuestra primer página web.
Hacemos click derecho y seleccionamos -> abrir con -> Bloc de notas o notepad
La estructura básica del código HTML es la siguiente:
Una vez escrito el código en nuestro archive Index.html, lo guardamos haciendo click en File -> Save, o simplemente presionando la tecla CTRL+S
Para nuestro ejemplo utilizaremos un formato de un curriculum vitae, el cual se verá así una vez terminado:
HTML es un lenguaje de etiquetas para describir documentos web, o bien páginas web, que juntamente estructuran nuestra página.
Las etiquetas HTML son palabras clave con corchetas angulares <etiqueta> </etiqueta>, la última etiqueta “</etiqueta>” se cierra con una diagonal antes de la palabra clave.
Los navegadores web, solo interpretan estas etiquetas, no se mostrara literalmente, para esto utilizamos editores HTML, como Dreamweaver, Notepad, Notepad++, entre otros.
Hacemos click derecho y seleccionamos -> abrir con -> Bloc de notas o notepad
La estructura básica del código HTML es la siguiente:
Una vez escrito el código en nuestro archive Index.html, lo guardamos haciendo click en File -> Save, o simplemente presionando la tecla CTRL+S
Para nuestro ejemplo utilizaremos un formato de un curriculum vitae, el cual se verá así una vez terminado:
El código es el siguiente:
<html>
<head>
<title> Mi primera página
web. </title>
</head>
<body>
<h1> Curriculum Vitae </h1>
<hr>
<h2>Información Personal</h2>
<p> <strong> Nombre: </ strong > Javier Gonzalez </ p >
<p> <strong>Ocupación: </ strong > Diseñador web </
p >
<p> <strong> Fecha de nacimiento: </
strong > 01/01/1900
</ p >
<p> <strong>Dirección: </
strong > </ br
>
Calle las lomas 5435
</br>
Colonia 1 </br>
<hr>
<h2>Educación</h2>
<ul>
<li> UPV</li>
<ul>
<li> Information Tech </li>
</ul>
</ul>
<hr>
<h2> Habilidades</h2>
<p> Conocimiento en tecnologías web </p>
<hr>
<h2> Trabajos
anteriores</h2>
<ul>
<li> Diseñador
web </li>
<li> Tecnologías </li>
<li> Ejemplo
3 </li>
<ul>
<body>
<html>
Explicación:
Las etiquetas HTML son palabras clave con corchetas angulares <etiqueta> </etiqueta>, la última etiqueta “</etiqueta>” se cierra con una diagonal antes de la palabra clave.
Los navegadores web, solo interpretan estas etiquetas, no se mostrara literalmente, para esto utilizamos editores HTML, como Dreamweaver, Notepad, Notepad++, entre otros.
<html>: Hyper Text
Markup Languaje, con esta etiqueta, estamos mandando la instrucción que se
trata de una pagina web.
<head>: Provee Información
acerca del archive HTML.
<title>:
Es el
título de nuestra página web.
<body>: Es el cuerpo de nuestro contenido, como el mensaje en una carta.
<h1>: Describe una cabecera
<h2>: Describe una cabecera de menor tamaño que h1
<p>: El texto entre <p> y </p>, describe un parágrafo.
<strong>:
Texto tipo
Bold
<br>: Salto de línea.
<hr>
<ul>: Una lista desordenada
empieza con la etiqueta <ul>, cada lista debe empezar con la
etiqueta <li>
<li>: Lista las palabras dentro de la etiqueta <ul>
Hasta aquí este tutorial, espero que haya sido de su agrado y si tienen alguna duda o comentario favor de escribir en la sección de comentarios, ¡Hasta Luego!
Hasta aquí este tutorial, espero que haya sido de su agrado y si tienen alguna duda o comentario favor de escribir en la sección de comentarios, ¡Hasta Luego!
