¿Cómo construir mi primer página web en HTML?
¿Siempre quisiste aprender a crear una pagina web? Pues en este tutorial y los que le persiguen, en un curso de HTML, te voy a enseñar cómo convertirse en un maestro en HTML y integrarte en el desarrollo web para aprender a crear una página web y trucos html para páginas web de forma muy profesional. Empezamos primero por la definición del HTML (abreviación de Hyper Text Markup Language).
¿Qué es un documento HTML?
- Un texto bruto.
- Referencias a objetos (imágenes, música, vídeo, enlaces…).
- Comandos (balizas o tags) que nos permiten de organizar la presentación.
Todo esto se refiere a un documento HTML que es un lenguaje de etiquetas que da generalmente la estructura de una página web.
¿Porqué lo necesito?¿Y qué relación tiene con crear una página web?
Lo necesitas, porque antes de entrar en este post y leer estas líneas quisiste siempre aprender y saber cómo pueden los programadores de la tecnología web crear una página web. Y aquí tienes la respuesta:
En el mundo del desarrollo web existe una enorme cantidad de sitios webs que son compuestos de miles de páginas webs y cada sitio web fue construido por varios lenguajes de programación, por lo que algunos de ellos son muy indispensables y como ejemplo tenemos al HTML (Ya que realmente el HTML no es un lenguaje de programación sino de etiquetas). Ten en cuenta que el HTML es indispensable para crear una pagina web pero no es el único.
También destacamos otros ejemplos de esos lenguajes que son: CSS, PHP, JAVASCRIPT, XTML, JQUERY, SQL, etc. Estos lenguajes les propongamos luego sus tutoriales. También aprenderemos un poco de CSS que es un lenguaje que da vida y efectos para paginas web html.
Resumen histórico del HTML:
1990: Primera versión del HTML fundida por Tim BERNERS-LEE o CERN.
1994: HTML2.0 norme IETF (Internet Engeneering Task Force).
1996 : HTML3.2 norme W3C.
1997 : HTML4.0 norme W3C.
2008 : HTML 5.
Preparar el espacio de trabajo para crear una página web
Empezamos sin tardar mucho con las introducciones. Entonces para crear una pagina web tenemos que preparar el espacio de trabajo. Primero lo que solamente necesitas ahora
es: un editor de texto (existen muchos como: Bloc Note, Notepad++, Geany, etc). Yo prefiero trabajar con el Geany y Notepad++ porque ayudan mucho en el momento de crear una pagina web, de organizarla y distinguir las balizas del código HTML con colores. Y mas de eso, un
explorador o navegador como Internet Explorer, Google Chrome, Mozilla FireFox, Opera,
Safari (Yo prefiero el FireFox)
Aquí os invito a
descargar el Notepad++ y Mozilla FireFox:
![]() |
| descargar notepad++ |
![]() |
| descargar mozilla firefox |
Teoría y aplicación para crear una pagina web
Hay
que aprender, o mejor dicho memorizarlo no solo en el cerebro sino en el corazón,
la estructura general de un documento HTML y sin ello no nos vamos a adelantar ningún pasito. Por eso, por
favor, memorizarlo bien para seguir más con nosotros para crear una pagina web.
Antes no
quisiera ponerlo en la introducción,
pero como los acentos, tildes y símbolos
son también muy importantes he propuesto
de no dejarlo a lo más tarde y empezar con ellos al lado de la estructura
general de un documento HTML.
Pueda que algunas
personas no sepan de que estamos hablando (acentos, tildes, símbolos,…), pero
sí, para que los acentos los acentos, tildes y símbolos aparezcan en la pagina web no hay que escribirlos directamente en el
documento HTML sino que existe una forma indirecta de introducirlos. ¡Adelante!
La estructura general de un documento HTML:
![]() |
| Estructura general de un documento html |
Como podemos
notar hay dos tipos de balizas: monolíticas y
dobles.
- Monolíticas: <baliza>.
- Dobles: <baliza> texto </baliza>. Observamos que este tipo de balizas debe cerrarse con el </baliza> al contrario de las monolíticas.
La
segunda notación es que no hay ninguna diferencia entre minúsculas y
mayúsculas al momento de marcar el nombre de las balizas. Por ejemplo,
es lo mismo escribir <html> que escribir <HTML> y no afecta nada en el momento de crear una pagina web. ¡Memorizarlo bien!
Los caracteres acentuados:
- Código reconocido por todas las plataformas: ASCII (7 bits, 128 caracteres).
- La no existencia de los caracteres acentuados implica a inventar códigos.
La ausencia de caracteres acentuados presenta un
gran problema en el momento de leer una pagina web. Pero hay soluciones particulares en forma de un código para cada
acento o tildes. Ya sabemos que los acentos varían según el idioma y por eso
os pondremos la siguiente lista compuesta por acentos en la que cada uno
es perseguido por su código en el HTML y que os va servir muchísimo al momento de construir vuestra pagina web.
Lista de códigos:
é
|
é
|
è
|
è
|
ê
|
ê
|
ù
|
ù
|
û
|
û
|
à
|
&grave ;
|
â
|
â ;
|
ï
|
ï ;
|
ô
|
ô ;
|
Caracteres claves del HTML:
Lista de códigos:
La ausencia
de los símbolos en documento HTML también presenta un problema en el momento de leer una pagina web. En las
siguientes líneas os presento las representaciones particulares de algunos
caracteres claves, mejor dicho símbolos, perseguidos a sus códigos:
<
|
<
|
>
|
>
|
&
|
&
|
"
|
"
|
Aquí llegamos a
terminar el primer tema del tutorial para el HTML y lo podemos resumir en:
- HTML es un lenguaje de programación para crear páginas webs pero no es único.
- El espacio del trabajo está compuesto por un editor de texto y un explorador.
- Estructura general del documento HTML.
- Códigos para los acentos y símbolos.



