SlideShare una empresa de Scribd logo
CURSO DE HTML
MAYDIS
www.maydis.es
https://www.facebook.com/maydisweb
@maydisweb
HOLA MUNDO
INTRODUCCION
• ¿Qué significa HTML?
– HyperText Markup Language («lenguaje de
marcas de hipertexto»).
– HTML es un texto escrito con una sintaxis
particular que el navegador es capaz de leer
y aplicar
HERRAMIENTAS
• Es el lenguaje que se utiliza para hacer
las paginas web
• Las paginas web se pueden hacer a
través de 2 herramientas:
– Programas como Adobe Dreamweaber
– Editores de texto como Notepad ++: Lo vamos
a utilizar en este tutorial.
ELEMENTOS DEL LENGUAJE
• El lenguaje HTML consta de etiquetas
como <img>, atributos como <id> y
elementos anteriores como <center>.
• En los siguientes tutoriales las iremos
explicando hasta lograr nuestra pagina
web.
EMPEZAMOS
• Para crear una pagina web es muy
sencillo.
• Solo hay que tener en cuenta que:
– La pagina web consta de 2 partes:
• <head>
• <body>
<!DOCTYPE>
• Nada mas abrir nuestro editor de texto, lo primero que
vamos a poner es lo siguiente:
– <!DOCTYPE html>
– ¿Qué significa esto?
• Con esto le estamos indicando a nuestro
navegador que interprete el lenguaje HTML, para
que nosotros podamos visualizar correctamente
nuestra futura pagina web.
<HTML>
• A continuación empezamos poniendo la etiqueta <html>,
que indica el comienzo de nuestra pagina web.
• No debemos olvidar en cerrar esta etiqueta de esta
forma </html>
• Todo lo que haya dentro de estas etiquetas sera nuestra
pagina web.
<HEAD>
• A continuación dentro de <html> ponemos la etiqueta
<head>, que significa cabeza.
• Todo lo que ponemos dentro de esta etiqueta es
invisible para los usuarios que ven nuestra pagina web,
pero no para nuestro código fuente.
• No se nos tiene que olvidar el cerrar la etiqueta </head>
<HEAD>
• Dentro de esta etiqueta pondremos los
siguientes elementos:
– <title></title>: Este es el texto que sale en la
pestaña de nuestro navegador
– Metadatos: Estos datos solo son necesarios
para hacer estrategias SEO
<BODY>
• Significa cuerpo.
• Aquí pondremos todo lo que es visible en
nuestra pagina web.
• No se debe olvidar el cerrarla: </body>
HOLA MUNDO
• Para que el texto “Hola Mundo” se vea en nuestra
pagina web, vamos a utilizar la etiqueta de parrafo: <p>
• Esta etiqueta le dice al navegador que escriba la frase
que pongamos dentro de esta etiqueta.
• No hay que olvidarse de cerrarla: </p>
• Mira el ejemplo:
NUESTRO CODIGO FUENTE
Así quedaría todo nuestro código fuente escrito en nuestro
editor de texto
AHORA GUARDA ESE CODIGO FUENTE CON EL
SIGUIENTE PROCEDIMIENTO:
Pinchamos en Lenguaje y seleccionamos H, y a
continuación HTML
Guardamos el documento en: Archivo-Guardar Como, y
le pones el nombre quieras
Una vez guardado, ejecutas en el ordenador el
documento guardado y mira el resultado
Ya tienes tu primera pagina web!!!
Sencillo no…!!!
No olvides mirar el siguiente
tutorial: Como poner una
imagen
HASTA LA PROXIMA!!
www.maydis.es

Más contenido relacionado

La actualidad más candente

Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
Kevin Neisa Gonzalez
 
Colegio nacional nicoles esguerra
Colegio nacional nicoles esguerraColegio nacional nicoles esguerra
Colegio nacional nicoles esguerra
Monsalve Sergio
 
Html00000
Html00000Html00000
Html00000
pxndxpoveda
 
tutorial para una pagina web
tutorial para una pagina webtutorial para una pagina web
tutorial para una pagina webkaren_malik
 
Qué es html
Qué es htmlQué es html
Qué es html
Cesar Sierra
 
Editor de páginas web
Editor de páginas webEditor de páginas web
Editor de páginas web
centro educativo
 
Html
HtmlHtml
Lenguaje html
Lenguaje htmlLenguaje html
Lenguaje html
Cristian Gonzalez
 
El mejor curso de html lección no.1
El mejor curso de html lección no.1El mejor curso de html lección no.1
El mejor curso de html lección no.1gabrielhernandezvc
 
Index II
Index IIIndex II
Producto 3 "Diseño de una pagina web"
Producto 3 "Diseño de una pagina web" Producto 3 "Diseño de una pagina web"
Producto 3 "Diseño de una pagina web"
AlisonMarinone
 
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOSCOMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
Jenny A
 
Clase 1 periodo II html
Clase 1 periodo II  htmlClase 1 periodo II  html
Clase 1 periodo II html
crisotos
 

La actualidad más candente (18)

Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Index2.
Index2.Index2.
Index2.
 
Colegio nacional nicoles esguerra
Colegio nacional nicoles esguerraColegio nacional nicoles esguerra
Colegio nacional nicoles esguerra
 
Paginas web
Paginas webPaginas web
Paginas web
 
Html00000
Html00000Html00000
Html00000
 
tutorial para una pagina web
tutorial para una pagina webtutorial para una pagina web
tutorial para una pagina web
 
Qué es html
Qué es htmlQué es html
Qué es html
 
Editor de páginas web
Editor de páginas webEditor de páginas web
Editor de páginas web
 
Html
HtmlHtml
Html
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Lenguaje html
Lenguaje htmlLenguaje html
Lenguaje html
 
El mejor curso de html lección no.1
El mejor curso de html lección no.1El mejor curso de html lección no.1
El mejor curso de html lección no.1
 
Index II
Index IIIndex II
Index II
 
Producto 3 "Diseño de una pagina web"
Producto 3 "Diseño de una pagina web" Producto 3 "Diseño de una pagina web"
Producto 3 "Diseño de una pagina web"
 
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOSCOMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
 
Clase 1 periodo II html
Clase 1 periodo II  htmlClase 1 periodo II  html
Clase 1 periodo II html
 
Presentación1
Presentación1Presentación1
Presentación1
 
Nicolas 154
Nicolas 154Nicolas 154
Nicolas 154
 

Similar a TUTORIAL MAYDIS HTML. HOLA MUNDO

Clase 3 HTML
Clase 3 HTMLClase 3 HTML
Clase 3 HTML
Josué Fortis
 
Html
HtmlHtml
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerranicolascristancho
 
Colegio nicolas esguerra edificamos futuro
Colegio nicolas esguerra edificamos futuroColegio nicolas esguerra edificamos futuro
Colegio nicolas esguerra edificamos futuropinillapulido
 
Alexander y diego paginas de html
Alexander y diego paginas de htmlAlexander y diego paginas de html
Alexander y diego paginas de html
alexander polanco
 
Introducción html5
Introducción html5Introducción html5
Introducción html5Ronald Rivas
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerraGinoRomero13
 
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
Lucía Marín
 
Curso HTML desde Cero - Capítulo 1
Curso HTML desde Cero - Capítulo 1Curso HTML desde Cero - Capítulo 1
Curso HTML desde Cero - Capítulo 1
yanburbano
 
Guia#1 info
Guia#1 infoGuia#1 info
Guia#1 info
Sandra Bohorquez
 
etiquetas.pdf
etiquetas.pdfetiquetas.pdf
etiquetas.pdf
JorgeVazquez485210
 

Similar a TUTORIAL MAYDIS HTML. HOLA MUNDO (20)

Clase 3 HTML
Clase 3 HTMLClase 3 HTML
Clase 3 HTML
 
Html
HtmlHtml
Html
 
HTML 2
HTML 2 HTML 2
HTML 2
 
Colegio nacional nicolas esguerra
Colegio  nacional nicolas esguerraColegio  nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra html
Colegio nacional nicolas esguerra htmlColegio nacional nicolas esguerra html
Colegio nacional nicolas esguerra html
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra html
Colegio nacional nicolas esguerra htmlColegio nacional nicolas esguerra html
Colegio nacional nicolas esguerra html
 
Colegio nicolas esguerra edificamos futuro
Colegio nicolas esguerra edificamos futuroColegio nicolas esguerra edificamos futuro
Colegio nicolas esguerra edificamos futuro
 
Alexander y diego paginas de html
Alexander y diego paginas de htmlAlexander y diego paginas de html
Alexander y diego paginas de html
 
Introducción html5
Introducción html5Introducción html5
Introducción html5
 
Html
HtmlHtml
Html
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
 
Html 3° medio
Html 3°  medioHtml 3°  medio
Html 3° medio
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 
Escuela Abierta - Taller de Html
Escuela Abierta - Taller de HtmlEscuela Abierta - Taller de Html
Escuela Abierta - Taller de Html
 
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
Introducción a WordPress en WordCamp Bilbao (luciamarin.es)
 
Curso HTML desde Cero - Capítulo 1
Curso HTML desde Cero - Capítulo 1Curso HTML desde Cero - Capítulo 1
Curso HTML desde Cero - Capítulo 1
 
Htlm
HtlmHtlm
Htlm
 
Guia#1 info
Guia#1 infoGuia#1 info
Guia#1 info
 
etiquetas.pdf
etiquetas.pdfetiquetas.pdf
etiquetas.pdf
 

Último

evalaución de reforzamiento de cuarto de secundaria de la competencia lee
evalaución de reforzamiento de cuarto de secundaria de la competencia leeevalaución de reforzamiento de cuarto de secundaria de la competencia lee
evalaución de reforzamiento de cuarto de secundaria de la competencia lee
MaribelGaitanRamosRa
 
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIACONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
BetzabePecheSalcedo1
 
Educar por Competencias GS2 Ccesa007.pdf
Educar por Competencias GS2 Ccesa007.pdfEducar por Competencias GS2 Ccesa007.pdf
Educar por Competencias GS2 Ccesa007.pdf
Demetrio Ccesa Rayme
 
Junio 2024 Fotocopiables Ediba actividades
Junio 2024 Fotocopiables Ediba actividadesJunio 2024 Fotocopiables Ediba actividades
Junio 2024 Fotocopiables Ediba actividades
cintiat3400
 
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNETPRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
CESAR MIJAEL ESPINOZA SALAZAR
 
Testimonio Paco Z PATRONATO_Valencia_24.pdf
Testimonio Paco Z PATRONATO_Valencia_24.pdfTestimonio Paco Z PATRONATO_Valencia_24.pdf
Testimonio Paco Z PATRONATO_Valencia_24.pdf
Txema Gs
 
Horarios Exámenes EVAU Ordinaria 2024 de Madrid
Horarios Exámenes EVAU Ordinaria 2024 de MadridHorarios Exámenes EVAU Ordinaria 2024 de Madrid
Horarios Exámenes EVAU Ordinaria 2024 de Madrid
20minutos
 
Friedrich Nietzsche. Presentación de 2 de Bachillerato.
Friedrich Nietzsche. Presentación de 2 de Bachillerato.Friedrich Nietzsche. Presentación de 2 de Bachillerato.
Friedrich Nietzsche. Presentación de 2 de Bachillerato.
pablomarin116
 
Mapa_Conceptual de los fundamentos de la evaluación educativa
Mapa_Conceptual de los fundamentos de la evaluación educativaMapa_Conceptual de los fundamentos de la evaluación educativa
Mapa_Conceptual de los fundamentos de la evaluación educativa
TatianaVanessaAltami
 
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptxCLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
LilianaRivera778668
 
Fase 2, Pensamiento variacional y trigonometrico
Fase 2, Pensamiento variacional y trigonometricoFase 2, Pensamiento variacional y trigonometrico
Fase 2, Pensamiento variacional y trigonometrico
YasneidyGonzalez
 
Fase 1, Lenguaje algebraico y pensamiento funcional
Fase 1, Lenguaje algebraico y pensamiento funcionalFase 1, Lenguaje algebraico y pensamiento funcional
Fase 1, Lenguaje algebraico y pensamiento funcional
YasneidyGonzalez
 
Automatización de proceso de producción de la empresa Gloria SA (1).pptx
Automatización de proceso de producción de la empresa Gloria SA (1).pptxAutomatización de proceso de producción de la empresa Gloria SA (1).pptx
Automatización de proceso de producción de la empresa Gloria SA (1).pptx
GallardoJahse
 
CALENDARIZACION DEL MES DE JUNIO - JULIO 24
CALENDARIZACION DEL MES DE JUNIO - JULIO 24CALENDARIZACION DEL MES DE JUNIO - JULIO 24
CALENDARIZACION DEL MES DE JUNIO - JULIO 24
auxsoporte
 
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdfFORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
El Fortí
 
Presentación Revistas y Periódicos Digitales
Presentación Revistas y Periódicos DigitalesPresentación Revistas y Periódicos Digitales
Presentación Revistas y Periódicos Digitales
nievesjiesc03
 
El Liberalismo económico en la sociedad y en el mundo
El Liberalismo económico en la sociedad y en el mundoEl Liberalismo económico en la sociedad y en el mundo
El Liberalismo económico en la sociedad y en el mundo
SandraBenitez52
 
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptxc3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
Martín Ramírez
 
Introducción a la ciencia de datos con power BI
Introducción a la ciencia de datos con power BIIntroducción a la ciencia de datos con power BI
Introducción a la ciencia de datos con power BI
arleyo2006
 
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdfHABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
DIANADIAZSILVA1
 

Último (20)

evalaución de reforzamiento de cuarto de secundaria de la competencia lee
evalaución de reforzamiento de cuarto de secundaria de la competencia leeevalaución de reforzamiento de cuarto de secundaria de la competencia lee
evalaución de reforzamiento de cuarto de secundaria de la competencia lee
 
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIACONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
CONCLUSIONES-DESCRIPTIVAS NIVEL PRIMARIA
 
Educar por Competencias GS2 Ccesa007.pdf
Educar por Competencias GS2 Ccesa007.pdfEducar por Competencias GS2 Ccesa007.pdf
Educar por Competencias GS2 Ccesa007.pdf
 
Junio 2024 Fotocopiables Ediba actividades
Junio 2024 Fotocopiables Ediba actividadesJunio 2024 Fotocopiables Ediba actividades
Junio 2024 Fotocopiables Ediba actividades
 
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNETPRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
PRESENTACION DE LA SEMANA NUMERO 8 EN APLICACIONES DE INTERNET
 
Testimonio Paco Z PATRONATO_Valencia_24.pdf
Testimonio Paco Z PATRONATO_Valencia_24.pdfTestimonio Paco Z PATRONATO_Valencia_24.pdf
Testimonio Paco Z PATRONATO_Valencia_24.pdf
 
Horarios Exámenes EVAU Ordinaria 2024 de Madrid
Horarios Exámenes EVAU Ordinaria 2024 de MadridHorarios Exámenes EVAU Ordinaria 2024 de Madrid
Horarios Exámenes EVAU Ordinaria 2024 de Madrid
 
Friedrich Nietzsche. Presentación de 2 de Bachillerato.
Friedrich Nietzsche. Presentación de 2 de Bachillerato.Friedrich Nietzsche. Presentación de 2 de Bachillerato.
Friedrich Nietzsche. Presentación de 2 de Bachillerato.
 
Mapa_Conceptual de los fundamentos de la evaluación educativa
Mapa_Conceptual de los fundamentos de la evaluación educativaMapa_Conceptual de los fundamentos de la evaluación educativa
Mapa_Conceptual de los fundamentos de la evaluación educativa
 
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptxCLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
CLASE N.1 ANÁLISIS ADMINISTRATIVO EMPRESARIAL presentación.pptx
 
Fase 2, Pensamiento variacional y trigonometrico
Fase 2, Pensamiento variacional y trigonometricoFase 2, Pensamiento variacional y trigonometrico
Fase 2, Pensamiento variacional y trigonometrico
 
Fase 1, Lenguaje algebraico y pensamiento funcional
Fase 1, Lenguaje algebraico y pensamiento funcionalFase 1, Lenguaje algebraico y pensamiento funcional
Fase 1, Lenguaje algebraico y pensamiento funcional
 
Automatización de proceso de producción de la empresa Gloria SA (1).pptx
Automatización de proceso de producción de la empresa Gloria SA (1).pptxAutomatización de proceso de producción de la empresa Gloria SA (1).pptx
Automatización de proceso de producción de la empresa Gloria SA (1).pptx
 
CALENDARIZACION DEL MES DE JUNIO - JULIO 24
CALENDARIZACION DEL MES DE JUNIO - JULIO 24CALENDARIZACION DEL MES DE JUNIO - JULIO 24
CALENDARIZACION DEL MES DE JUNIO - JULIO 24
 
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdfFORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
FORTI-JUNIO 2024. CIENCIA, EDUCACION, CULTURA,pdf
 
Presentación Revistas y Periódicos Digitales
Presentación Revistas y Periódicos DigitalesPresentación Revistas y Periódicos Digitales
Presentación Revistas y Periódicos Digitales
 
El Liberalismo económico en la sociedad y en el mundo
El Liberalismo económico en la sociedad y en el mundoEl Liberalismo económico en la sociedad y en el mundo
El Liberalismo económico en la sociedad y en el mundo
 
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptxc3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
c3.hu3.p3.p2.Superioridad e inferioridad en la sociedad.pptx
 
Introducción a la ciencia de datos con power BI
Introducción a la ciencia de datos con power BIIntroducción a la ciencia de datos con power BI
Introducción a la ciencia de datos con power BI
 
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdfHABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
HABILIDADES MOTRICES BASICAS Y ESPECIFICAS.pdf
 

TUTORIAL MAYDIS HTML. HOLA MUNDO

  • 2. INTRODUCCION • ¿Qué significa HTML? – HyperText Markup Language («lenguaje de marcas de hipertexto»). – HTML es un texto escrito con una sintaxis particular que el navegador es capaz de leer y aplicar
  • 3. HERRAMIENTAS • Es el lenguaje que se utiliza para hacer las paginas web • Las paginas web se pueden hacer a través de 2 herramientas: – Programas como Adobe Dreamweaber – Editores de texto como Notepad ++: Lo vamos a utilizar en este tutorial.
  • 4. ELEMENTOS DEL LENGUAJE • El lenguaje HTML consta de etiquetas como <img>, atributos como <id> y elementos anteriores como <center>. • En los siguientes tutoriales las iremos explicando hasta lograr nuestra pagina web.
  • 5. EMPEZAMOS • Para crear una pagina web es muy sencillo. • Solo hay que tener en cuenta que: – La pagina web consta de 2 partes: • <head> • <body>
  • 6. <!DOCTYPE> • Nada mas abrir nuestro editor de texto, lo primero que vamos a poner es lo siguiente: – <!DOCTYPE html> – ¿Qué significa esto? • Con esto le estamos indicando a nuestro navegador que interprete el lenguaje HTML, para que nosotros podamos visualizar correctamente nuestra futura pagina web.
  • 7. <HTML> • A continuación empezamos poniendo la etiqueta <html>, que indica el comienzo de nuestra pagina web. • No debemos olvidar en cerrar esta etiqueta de esta forma </html> • Todo lo que haya dentro de estas etiquetas sera nuestra pagina web.
  • 8. <HEAD> • A continuación dentro de <html> ponemos la etiqueta <head>, que significa cabeza. • Todo lo que ponemos dentro de esta etiqueta es invisible para los usuarios que ven nuestra pagina web, pero no para nuestro código fuente. • No se nos tiene que olvidar el cerrar la etiqueta </head>
  • 9. <HEAD> • Dentro de esta etiqueta pondremos los siguientes elementos: – <title></title>: Este es el texto que sale en la pestaña de nuestro navegador – Metadatos: Estos datos solo son necesarios para hacer estrategias SEO
  • 10. <BODY> • Significa cuerpo. • Aquí pondremos todo lo que es visible en nuestra pagina web. • No se debe olvidar el cerrarla: </body>
  • 11. HOLA MUNDO • Para que el texto “Hola Mundo” se vea en nuestra pagina web, vamos a utilizar la etiqueta de parrafo: <p> • Esta etiqueta le dice al navegador que escriba la frase que pongamos dentro de esta etiqueta. • No hay que olvidarse de cerrarla: </p> • Mira el ejemplo:
  • 12. NUESTRO CODIGO FUENTE Así quedaría todo nuestro código fuente escrito en nuestro editor de texto
  • 13. AHORA GUARDA ESE CODIGO FUENTE CON EL SIGUIENTE PROCEDIMIENTO: Pinchamos en Lenguaje y seleccionamos H, y a continuación HTML Guardamos el documento en: Archivo-Guardar Como, y le pones el nombre quieras Una vez guardado, ejecutas en el ordenador el documento guardado y mira el resultado Ya tienes tu primera pagina web!!! Sencillo no…!!! No olvides mirar el siguiente tutorial: Como poner una imagen