SlideShare una empresa de Scribd logo
•Qué es HTML
El HTML (Hyper Text Markup Language) es el lenguaje
con el que se escriben las páginas web.
Es un lenguaje de hipertexto, es decir, un lenguaje que
permite escribir texto de forma estructurada, y que está
compuesto por etiquetas, que marcan el inicio y el fin de
cada elemento del documento.
Un documento hipertexto no sólo se compone de texto,
puede contener imágenes, sonido, vídeos, etc., por lo que
el resultado puede considerarse como un documento
multimedia.
•Extensión de los archivos
Los archivos de cada pagina web creada deben tener la
extensión html o htm, para que puedan ser visualizados en
los navegadores (programas que permiten visualizar las
páginas web).
Por ejemplo: pagina1.html , ejercicio1.html
Los navegadores (Por ejemplo Chrome, Internet Explorer)
se encargan de interpretar el código HTML de los archivos
creados, y muestran a los usuarios las páginas web
resultantes del código interpretado.
•Editor de archivos html
Un editor es un programa que nos permiten crear los
archivos html.
Es aconsejable comenzar utilizando una herramienta lo más
sencilla posible, para tener que insertar nosotros mismos el
código HTML, esto permite familiarizarse con el lenguaje,
para poder utilizar algún editor visual posteriormente, como
Macromedia Dreamweaver o Microsoft Frontpage.
Bloc de notas
Note Pad ++
Editores de textos sencillos de
manejar, que nos permitirá crear
páginas a través del código HTML.
•Etiquetas
Las etiquetas o marcas delimitan cada uno de los elementos
que componen un documento HTML, es decir la pagina web
que estamos diseñando. Existen dos tipos de etiquetas, la
de comienzo de elemento y la de fin o cierre de elemento.
La etiqueta de comienzo se define por los caracteres < >.
Está compuesta por el identificador o nombre de la etiqueta,
y puede contener una serie de características opcionales
que permiten añadir ciertas propiedades.
La etiqueta de final está definida por los caracteres </ >.
Está compuesta por el identificador o nombre de la etiqueta,
y no contiene características.
•Estructura general de una pagina web
<html>
<head> </head>
<title> </title>
<body>
Aquí se escriben las etiquetas
para crear la pagina web
</body>
</html>
•Definición de etiquetas principales
<html> Inicio de código html (Obligatorio)
<head> Caracteristicas de encabezados
(opcional)
<title> Titulo de la ventana del
</title> navegador (Obligatorio)
<body> Inicio del cuerpo de la página
(Obligatorio)
</body> Fin del cuerpo de la página
(Obligatorio)
</html> Fin de código html (Obligatorio)
• Etiqueta <font> </font>
Esta es una de las etiquetas principales para crear el cuerpo
de la página web con código HTML.
Esta etiqueta se utiliza especificar el texto que se quiere
mostrar y sus características como el color, tipo de letra,
tamaño y estilo.
Las características del texto se especifican con las
siguientes palabras:
Size : Tamaño
Face : Tipo de letra
Color : Color de la letra
• Colores en una página Web
Para utilizar los colores en html, existen 2 formas de asignarlos:
La primera manera es utilizar la palabra en ingles de los colores
básicos, no son todos, se pueden asignar los siguientes:
Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy,
Olive, Purple, pink, Red, Silver, Teal, White, Yellow.
También se puede aplicar un código para visualizar colores que
resultan de combinación de los colores primarios, estos son 3
ejemplos:
#FF8000 es el color naranja
#339966 es el color verde turquesa
#000080 es el color azul oscuro
ACTIVIDAD
Realizar una búsqueda en Google sobre “Código de colores
en html” entrar a una de las paginas que se muestren en los
resultados, y copiar en su cuaderno minimo 10 códigos de
colores y el nombre del color.
Usted escoge los 10 colores o más que le gusten, estos
serán los colores que utilizará para mostrar en sus páginas
web.
•Ejercicio 1
Crear una página que muestre un texto con la frase “ Hola,
estoy haciendo pruebas”
Se debe visualizar la siguiente página en el navegador:
Como puedes ver, la página resultante es una página que
solamente tiene una línea de texto.
Si observas la barra de título del navegador, verás que el
título de la página es MI PRIMERA PAGINA. Este título ha
sido establecido por la línea:
<title>MI PRIMERA PAGINA</title>.

Más contenido relacionado

PPTX
Clase 1 periodo II html
PPTX
Guia 4 lenguaje html
PPTX
Codigos html y como crear una pagina Web
PPTX
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
PPTX
Expo html alexa
PPTX
Expo html alexandra
PPTX
Expo html alexandra
Clase 1 periodo II html
Guia 4 lenguaje html
Codigos html y como crear una pagina Web
COMO CREAR UNA PAGINA WEB EN HTML SUS PRIMEROS PASOS
Expo html alexa
Expo html alexandra
Expo html alexandra

La actualidad más candente (9)

DOC
Curso de html
PDF
Unidad 1
PPTX
Lenguaje html
PPT
Semana 5 html
PPTX
Como crear una pagina web
DOCX
HTML
DOCX
Colegio nicolas esguerra222
PDF
Introducion a HTML5
DOCX
Trabajo informatica 4,periodo
Curso de html
Unidad 1
Lenguaje html
Semana 5 html
Como crear una pagina web
HTML
Colegio nicolas esguerra222
Introducion a HTML5
Trabajo informatica 4,periodo
Publicidad

Similar a Lenguaje html (20)

PPTX
Diseño WEB 1.pptx
DOCX
Colegio nacional nicolás esguerra
DOCX
Colegio nacional nicolas esguerra
DOCX
Colegio nacional nicolas esguerra
DOCX
Colegio nacional nicolas esguerra
DOCX
Qué es html
DOCX
Meneses martines
DOCX
Colegio nacional nicolas esguerra
DOCX
Colegio nacional nicolas esguerra
PDF
Manual de-html
DOCX
Colegio nacional nicolás esguerra
DOCX
Colegio nacional nicolás esguerra
DOCX
Arias
DOCX
Navegadores
DOCX
Trabajo informatica 4,periodo
PDF
Tutorial html
DOCX
Codigo html
PDF
Clase 1 de html
Diseño WEB 1.pptx
Colegio nacional nicolás esguerra
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
Qué es html
Meneses martines
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
Manual de-html
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
Arias
Navegadores
Trabajo informatica 4,periodo
Tutorial html
Codigo html
Clase 1 de html
Publicidad

Más de Cristian Gonzalez (9)

PPTX
Guia 3 hosting y dominio
PPTX
Tema 3 conceptos basicos de electricidad
PPTX
Conceptos Básicos
PPT
Formato diapositivas ufps
PPTX
Hosting y dominio
PPTX
Consultas en access
PPT
Redes protocolo - tipos de redes
PPTX
Programación en Visual Basic - Conceptos Básicos
PPTX
Magnitudes electricas y equivalencias
Guia 3 hosting y dominio
Tema 3 conceptos basicos de electricidad
Conceptos Básicos
Formato diapositivas ufps
Hosting y dominio
Consultas en access
Redes protocolo - tipos de redes
Programación en Visual Basic - Conceptos Básicos
Magnitudes electricas y equivalencias

Último (20)

PDF
Punto Critico - Brian Tracy Ccesa007.pdf
PDF
Fundamentos_Educacion_a_Distancia_ABC.pdf
PDF
Crear o Morir - Andres Oppenheimer Ccesa007.pdf
PDF
Romper el Circulo de la Creatividad - Colleen Hoover Ccesa007.pdf
PDF
Cronograma de clases de Práctica Profesional 2 2025 UDE.pdf
PDF
ciencias-1.pdf libro cuarto basico niños
PDF
DI, TEA, TDAH.pdf guía se secuencias didacticas
DOCX
UNIDAD DE APRENDIZAJE 5 AGOSTO tradiciones
PDF
OK OK UNIDAD DE APRENDIZAJE 5TO Y 6TO CORRESPONDIENTE AL MES DE AGOSTO 2025.pdf
PDF
Escuelas Desarmando una mirada subjetiva a la educación
PDF
Breve historia de los Incas -- Patricia Temoche [Temoche, Patricia] -- Breve ...
PPTX
AGENTES PATÓGENOS Y LAS PRINCIPAL ENFERMEAD.pptx
PDF
PFB-MANUAL-PRUEBA-FUNCIONES-BASICAS-pdf.pdf
PDF
IDH_Guatemala_2.pdfnjjjkeioooe ,l dkdldp ekooe
PDF
Salcedo, J. et al. - Recomendaciones para la utilización del lenguaje inclusi...
PDF
Escuela de Negocios - Robert kiyosaki Ccesa007.pdf
PDF
CONFERENCIA-Deep Research en el aula universitaria-UPeU-EduTech360.pdf
PDF
SESION 12 INMUNIZACIONES - CADENA DE FRÍO- SALUD FAMILIAR - PUEBLOS INDIGENAS...
PDF
Integrando la Inteligencia Artificial Generativa (IAG) en el Aula
PDF
Híper Mega Repaso Histológico Bloque 3.pdf
Punto Critico - Brian Tracy Ccesa007.pdf
Fundamentos_Educacion_a_Distancia_ABC.pdf
Crear o Morir - Andres Oppenheimer Ccesa007.pdf
Romper el Circulo de la Creatividad - Colleen Hoover Ccesa007.pdf
Cronograma de clases de Práctica Profesional 2 2025 UDE.pdf
ciencias-1.pdf libro cuarto basico niños
DI, TEA, TDAH.pdf guía se secuencias didacticas
UNIDAD DE APRENDIZAJE 5 AGOSTO tradiciones
OK OK UNIDAD DE APRENDIZAJE 5TO Y 6TO CORRESPONDIENTE AL MES DE AGOSTO 2025.pdf
Escuelas Desarmando una mirada subjetiva a la educación
Breve historia de los Incas -- Patricia Temoche [Temoche, Patricia] -- Breve ...
AGENTES PATÓGENOS Y LAS PRINCIPAL ENFERMEAD.pptx
PFB-MANUAL-PRUEBA-FUNCIONES-BASICAS-pdf.pdf
IDH_Guatemala_2.pdfnjjjkeioooe ,l dkdldp ekooe
Salcedo, J. et al. - Recomendaciones para la utilización del lenguaje inclusi...
Escuela de Negocios - Robert kiyosaki Ccesa007.pdf
CONFERENCIA-Deep Research en el aula universitaria-UPeU-EduTech360.pdf
SESION 12 INMUNIZACIONES - CADENA DE FRÍO- SALUD FAMILIAR - PUEBLOS INDIGENAS...
Integrando la Inteligencia Artificial Generativa (IAG) en el Aula
Híper Mega Repaso Histológico Bloque 3.pdf

Lenguaje html

  • 1. •Qué es HTML El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las páginas web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que está compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del documento. Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse como un documento multimedia.
  • 2. •Extensión de los archivos Los archivos de cada pagina web creada deben tener la extensión html o htm, para que puedan ser visualizados en los navegadores (programas que permiten visualizar las páginas web). Por ejemplo: pagina1.html , ejercicio1.html Los navegadores (Por ejemplo Chrome, Internet Explorer) se encargan de interpretar el código HTML de los archivos creados, y muestran a los usuarios las páginas web resultantes del código interpretado.
  • 3. •Editor de archivos html Un editor es un programa que nos permiten crear los archivos html. Es aconsejable comenzar utilizando una herramienta lo más sencilla posible, para tener que insertar nosotros mismos el código HTML, esto permite familiarizarse con el lenguaje, para poder utilizar algún editor visual posteriormente, como Macromedia Dreamweaver o Microsoft Frontpage. Bloc de notas Note Pad ++ Editores de textos sencillos de manejar, que nos permitirá crear páginas a través del código HTML.
  • 4. •Etiquetas Las etiquetas o marcas delimitan cada uno de los elementos que componen un documento HTML, es decir la pagina web que estamos diseñando. Existen dos tipos de etiquetas, la de comienzo de elemento y la de fin o cierre de elemento. La etiqueta de comienzo se define por los caracteres < >. Está compuesta por el identificador o nombre de la etiqueta, y puede contener una serie de características opcionales que permiten añadir ciertas propiedades. La etiqueta de final está definida por los caracteres </ >. Está compuesta por el identificador o nombre de la etiqueta, y no contiene características.
  • 5. •Estructura general de una pagina web <html> <head> </head> <title> </title> <body> Aquí se escriben las etiquetas para crear la pagina web </body> </html>
  • 6. •Definición de etiquetas principales <html> Inicio de código html (Obligatorio) <head> Caracteristicas de encabezados (opcional) <title> Titulo de la ventana del </title> navegador (Obligatorio) <body> Inicio del cuerpo de la página (Obligatorio) </body> Fin del cuerpo de la página (Obligatorio) </html> Fin de código html (Obligatorio)
  • 7. • Etiqueta <font> </font> Esta es una de las etiquetas principales para crear el cuerpo de la página web con código HTML. Esta etiqueta se utiliza especificar el texto que se quiere mostrar y sus características como el color, tipo de letra, tamaño y estilo. Las características del texto se especifican con las siguientes palabras: Size : Tamaño Face : Tipo de letra Color : Color de la letra
  • 8. • Colores en una página Web Para utilizar los colores en html, existen 2 formas de asignarlos: La primera manera es utilizar la palabra en ingles de los colores básicos, no son todos, se pueden asignar los siguientes: Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy, Olive, Purple, pink, Red, Silver, Teal, White, Yellow. También se puede aplicar un código para visualizar colores que resultan de combinación de los colores primarios, estos son 3 ejemplos: #FF8000 es el color naranja #339966 es el color verde turquesa #000080 es el color azul oscuro
  • 9. ACTIVIDAD Realizar una búsqueda en Google sobre “Código de colores en html” entrar a una de las paginas que se muestren en los resultados, y copiar en su cuaderno minimo 10 códigos de colores y el nombre del color. Usted escoge los 10 colores o más que le gusten, estos serán los colores que utilizará para mostrar en sus páginas web.
  • 10. •Ejercicio 1 Crear una página que muestre un texto con la frase “ Hola, estoy haciendo pruebas”
  • 11. Se debe visualizar la siguiente página en el navegador: Como puedes ver, la página resultante es una página que solamente tiene una línea de texto. Si observas la barra de título del navegador, verás que el título de la página es MI PRIMERA PAGINA. Este título ha sido establecido por la línea: <title>MI PRIMERA PAGINA</title>.