SlideShare una empresa de Scribd logo
1 de 14
CLASE 1:
INTRODUCCIÓN A UN
  SITIO WEB Y HTML


                     Profesor
                     Sebastián
                     Maya Miranda
SITIO WEB

       Un sitio web es una colección de páginas web
relacionadas y comunes a un dominio de Internet o subdominio
en la World Wide Web (WWW) en Internet.

Una página web es un documento HTML/XHTML que es
accesible generalmente mediante el protocolo HTTP de Internet.




 HTTP: Hypertext Transfer Protocol o HTTP (en español
 protocolo de transferencia de hipertexto) es el protocolo
 usado en cada transacción de la World Wide Web.
HTML

HTML, siglas de HyperText
Markup Language («lenguaje
de marcado hipertextual»),
hace referencia al lenguaje de
marcado predominante para
la elaboración de páginas web
que se utiliza para describir y
traducir la estructura y la
información en forma de
texto, así como para
complementar el texto con
objetos tales como imágenes.
HTML

El HTML se escribe en forma de «etiquetas», rodeadas por
corchetes angulares (<,>)
HTML

La estructura básica de una página HTML es :


                  <html>
                  <head>
                  </head>
                  <body>
                  Cuerpo de la página.
                  </body>
                  </html>
HTML

Las instrucciones HTML están encerradas entre los caracteres:
< y >.

Por Ejemplo:

<strong> negrita </strong>

Con esto indicamos que todo lo escrito entre las etiquetas
“<strong></strong>” se vera en negrito/ bold.
HTML

Muchos elementos HTML requieren una marca de comienzo y
otra de finalización. Todo aquello que está fuera de las marcas
del lenguaje se imprime en la pantalla (dentro del navegador) .


          Diseño                       Código
         HOLA QUE TAL     <font color=”blue">Hola que tal</font>


         HOLA QUE TAL     Hola que tal<font color=”blue”></font>
HTML

La estructura básica de una página HTML es :


                  <html>
                  <head>
                  </head>
                  <body>
                  Cuerpo de la página.
                  </body>
                  </html>
<HEAD>

También llamado Cabecera del sitio

El elemento <head> incluye el título para el documento/página,
y puede incluir scripts, estilos css, información meta, y más.

Los siguientes elementos más comunes que pueden ir dentro
del elemento <head></head>:

  <title> (Si o sí en HEAD)
  <style>
  <meta>
  <script>
HTML

La estructura básica de una página HTML es :


                  <html>
                  <head>
                  </head>
                  <body>
                  Cuerpo de la página.
                  </body>
                  </html>
<BODY>

Todo el texto/código dentro del <body> aparece dentro del
navegador tal cual lo hayamos escrito .

Al escribir:

<html>                           ¡HOLA!
<head>
</head>
<body>
¡HOLA!
</body>
</html>
A CONSIDERAR

 HTML no es sensible a mayúsculas y minúsculas.

         <Head> = <head> = <HEAD> = <heaD>… etc.



 No requerimos que se disponga cada marca en una línea, pero
  para “trabajar en limpio” es mejor hacerlo separado.
¡A TRABAJAR!

Entrar al sitio web > www.htmlya.com.ar

       Énfasis a los conceptos:
            2, 3, 4, 7, 9 y 13

Más contenido relacionado

La actualidad más candente

Colegio nicolas esgurra.
Colegio nicolas esgurra.Colegio nicolas esgurra.
Colegio nicolas esgurra.
diego2934
 

La actualidad más candente (19)

HTML
HTMLHTML
HTML
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
 
Trabajo 905
Trabajo 905Trabajo 905
Trabajo 905
 
Html 121
Html 121Html 121
Html 121
 
CSS Hoja de estilo en cascada
CSS   Hoja de estilo en cascadaCSS   Hoja de estilo en cascada
CSS Hoja de estilo en cascada
 
Jessica
JessicaJessica
Jessica
 
Etiquetas para estructurar texto en HTML - 4 parte
Etiquetas para estructurar texto en HTML - 4 parteEtiquetas para estructurar texto en HTML - 4 parte
Etiquetas para estructurar texto en HTML - 4 parte
 
¿Qué es CSS?
¿Qué es CSS?¿Qué es CSS?
¿Qué es CSS?
 
Jessica
JessicaJessica
Jessica
 
Manual html
Manual htmlManual html
Manual html
 
Etiquetas para estructurar texto HTML5 - 2 parte
Etiquetas para estructurar texto HTML5 - 2 parteEtiquetas para estructurar texto HTML5 - 2 parte
Etiquetas para estructurar texto HTML5 - 2 parte
 
Introducion a HTML5
Introducion a HTML5Introducion a HTML5
Introducion a HTML5
 
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"
 
html
html html
html
 
Colegio nicolas esguerra
Colegio nicolas esguerraColegio nicolas esguerra
Colegio nicolas esguerra
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
S.p.m
S.p.mS.p.m
S.p.m
 
¿Qué es HTML5?
¿Qué es HTML5?¿Qué es HTML5?
¿Qué es HTML5?
 
Colegio nicolas esgurra.
Colegio nicolas esgurra.Colegio nicolas esgurra.
Colegio nicolas esgurra.
 

Destacado

actividades de la tercera evaluación
actividades de la tercera evaluación actividades de la tercera evaluación
actividades de la tercera evaluación
informatica2013
 
Tema 9 creación de páginas web v2
Tema 9  creación de páginas web v2Tema 9  creación de páginas web v2
Tema 9 creación de páginas web v2
RPVed
 
Tema 10 presentaciones multimedia.v3
Tema 10   presentaciones multimedia.v3Tema 10   presentaciones multimedia.v3
Tema 10 presentaciones multimedia.v3
RPVed
 
Creacion de paginas web con html (Diana Lopez)
Creacion de paginas web con html (Diana Lopez)Creacion de paginas web con html (Diana Lopez)
Creacion de paginas web con html (Diana Lopez)
grupoaac
 
Bukit bintang slides(individual)
Bukit bintang slides(individual)Bukit bintang slides(individual)
Bukit bintang slides(individual)
Darren Tong
 

Destacado (15)

Introducción al HTML
Introducción al HTMLIntroducción al HTML
Introducción al HTML
 
actividades de la tercera evaluación
actividades de la tercera evaluación actividades de la tercera evaluación
actividades de la tercera evaluación
 
Introduccion a html
Introduccion a htmlIntroduccion a html
Introduccion a html
 
Tema 9 creación de páginas web v2
Tema 9  creación de páginas web v2Tema 9  creación de páginas web v2
Tema 9 creación de páginas web v2
 
Proyectos Web 2 Introduccion Html
Proyectos Web   2 Introduccion HtmlProyectos Web   2 Introduccion Html
Proyectos Web 2 Introduccion Html
 
Lenguaje de programación de páginas web
Lenguaje de programación de páginas webLenguaje de programación de páginas web
Lenguaje de programación de páginas web
 
Tema 10 presentaciones multimedia.v3
Tema 10   presentaciones multimedia.v3Tema 10   presentaciones multimedia.v3
Tema 10 presentaciones multimedia.v3
 
Creacion de paginas web con html (Diana Lopez)
Creacion de paginas web con html (Diana Lopez)Creacion de paginas web con html (Diana Lopez)
Creacion de paginas web con html (Diana Lopez)
 
Creacion y publicacion de paginas Web
Creacion y publicacion de paginas WebCreacion y publicacion de paginas Web
Creacion y publicacion de paginas Web
 
Conceptos basicos prog web introduccion a html y css
Conceptos basicos prog web   introduccion a html y cssConceptos basicos prog web   introduccion a html y css
Conceptos basicos prog web introduccion a html y css
 
Inicio al HTML
Inicio al HTMLInicio al HTML
Inicio al HTML
 
Bukit bintang slides(individual)
Bukit bintang slides(individual)Bukit bintang slides(individual)
Bukit bintang slides(individual)
 
Definición y funcionamiento de la Web 2.0
Definición y funcionamiento de la Web 2.0Definición y funcionamiento de la Web 2.0
Definición y funcionamiento de la Web 2.0
 
Diapositivas Html
Diapositivas HtmlDiapositivas Html
Diapositivas Html
 
Html
HtmlHtml
Html
 

Similar a Sitio Web / Introducción a HTML

Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
DITHOR
 
Producto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no aProducto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no a
JoonLee2000
 

Similar a Sitio Web / Introducción a HTML (20)

Programación en html 1
Programación en html 1Programación en html 1
Programación en html 1
 
HTML
HTMLHTML
HTML
 
El lenguaje html
El lenguaje htmlEl lenguaje html
El lenguaje html
 
Html
HtmlHtml
Html
 
HTML 2011
HTML 2011HTML 2011
HTML 2011
 
Html
HtmlHtml
Html
 
Pagina web 1
Pagina web 1Pagina web 1
Pagina web 1
 
Programación Avanzada
Programación AvanzadaProgramación Avanzada
Programación Avanzada
 
Estructura de una página
Estructura de una páginaEstructura de una página
Estructura de una página
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Producto 3
Producto 3Producto 3
Producto 3
 
Producto 3 "Diseño de pagina WEB"
Producto 3 "Diseño de pagina WEB"Producto 3 "Diseño de pagina WEB"
Producto 3 "Diseño de pagina WEB"
 
Producto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no aProducto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no a
 
Producto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no aProducto 3 joon y jorge 9no a
Producto 3 joon y jorge 9no a
 
Clase 2 Desarrollo Web
Clase 2 Desarrollo Web Clase 2 Desarrollo Web
Clase 2 Desarrollo Web
 
Introduccion a programacion html
Introduccion a programacion htmlIntroduccion a programacion html
Introduccion a programacion html
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Producto 3 "Diseño de paginas web"
Producto 3 "Diseño de paginas web"Producto 3 "Diseño de paginas web"
Producto 3 "Diseño de paginas web"
 
Código htlm
Código htlmCódigo htlm
Código htlm
 

Más de SebaMaya

Más de SebaMaya (9)

Aparato de golgi
Aparato de golgiAparato de golgi
Aparato de golgi
 
Introducción a la Computación
Introducción a la ComputaciónIntroducción a la Computación
Introducción a la Computación
 
Hierro, Deficit y más
Hierro, Deficit y másHierro, Deficit y más
Hierro, Deficit y más
 
Problemas relacionados al deficit Hierro
Problemas relacionados al deficit HierroProblemas relacionados al deficit Hierro
Problemas relacionados al deficit Hierro
 
Ovogenesis de las Aves
Ovogenesis de las AvesOvogenesis de las Aves
Ovogenesis de las Aves
 
Sistema Tegumentario (Tegumento) de los Peces Oseos
Sistema Tegumentario (Tegumento) de los Peces OseosSistema Tegumentario (Tegumento) de los Peces Oseos
Sistema Tegumentario (Tegumento) de los Peces Oseos
 
Sistema Respiratorio de los Peces Condrictios
Sistema Respiratorio de los Peces Condrictios Sistema Respiratorio de los Peces Condrictios
Sistema Respiratorio de los Peces Condrictios
 
Sistema Excretor de las Aves
Sistema Excretor de las AvesSistema Excretor de las Aves
Sistema Excretor de las Aves
 
Mamiferos: Sistema Cardiovascular
Mamiferos: Sistema CardiovascularMamiferos: Sistema Cardiovascular
Mamiferos: Sistema Cardiovascular
 

Último

RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptxRESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
pvtablets2023
 
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
EliaHernndez7
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
Wilian24
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
RigoTito
 
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
jlorentemartos
 

Último (20)

Power Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptxPower Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptx
 
semana 4 9NO Estudios sociales.pptxnnnn
semana 4  9NO Estudios sociales.pptxnnnnsemana 4  9NO Estudios sociales.pptxnnnn
semana 4 9NO Estudios sociales.pptxnnnn
 
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptxRESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
 
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
🦄💫4° SEM32 WORD PLANEACIÓN PROYECTOS DARUKEL 23-24.docx
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
Los avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtualesLos avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtuales
 
origen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioorigen y desarrollo del ensayo literario
origen y desarrollo del ensayo literario
 
Infografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdfInfografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdf
 
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPCTRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
TRABAJO FINAL TOPOGRAFÍA COMPLETO DE LA UPC
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
 
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 
INSTRUCCION PREPARATORIA DE TIRO .pptx
INSTRUCCION PREPARATORIA DE TIRO   .pptxINSTRUCCION PREPARATORIA DE TIRO   .pptx
INSTRUCCION PREPARATORIA DE TIRO .pptx
 
Factores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdfFactores que intervienen en la Administración por Valores.pdf
Factores que intervienen en la Administración por Valores.pdf
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
 
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdfFeliz Día de la Madre - 5 de Mayo, 2024.pdf
Feliz Día de la Madre - 5 de Mayo, 2024.pdf
 
Biografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfBiografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdf
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
 

Sitio Web / Introducción a HTML

  • 1. CLASE 1: INTRODUCCIÓN A UN SITIO WEB Y HTML Profesor Sebastián Maya Miranda
  • 2. SITIO WEB Un sitio web es una colección de páginas web relacionadas y comunes a un dominio de Internet o subdominio en la World Wide Web (WWW) en Internet. Una página web es un documento HTML/XHTML que es accesible generalmente mediante el protocolo HTTP de Internet. HTTP: Hypertext Transfer Protocol o HTTP (en español protocolo de transferencia de hipertexto) es el protocolo usado en cada transacción de la World Wide Web.
  • 3.
  • 4. HTML HTML, siglas de HyperText Markup Language («lenguaje de marcado hipertextual»), hace referencia al lenguaje de marcado predominante para la elaboración de páginas web que se utiliza para describir y traducir la estructura y la información en forma de texto, así como para complementar el texto con objetos tales como imágenes.
  • 5. HTML El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>)
  • 6. HTML La estructura básica de una página HTML es : <html> <head> </head> <body> Cuerpo de la página. </body> </html>
  • 7. HTML Las instrucciones HTML están encerradas entre los caracteres: < y >. Por Ejemplo: <strong> negrita </strong> Con esto indicamos que todo lo escrito entre las etiquetas “<strong></strong>” se vera en negrito/ bold.
  • 8. HTML Muchos elementos HTML requieren una marca de comienzo y otra de finalización. Todo aquello que está fuera de las marcas del lenguaje se imprime en la pantalla (dentro del navegador) . Diseño Código HOLA QUE TAL <font color=”blue">Hola que tal</font> HOLA QUE TAL Hola que tal<font color=”blue”></font>
  • 9. HTML La estructura básica de una página HTML es : <html> <head> </head> <body> Cuerpo de la página. </body> </html>
  • 10. <HEAD> También llamado Cabecera del sitio El elemento <head> incluye el título para el documento/página, y puede incluir scripts, estilos css, información meta, y más. Los siguientes elementos más comunes que pueden ir dentro del elemento <head></head>: <title> (Si o sí en HEAD) <style> <meta> <script>
  • 11. HTML La estructura básica de una página HTML es : <html> <head> </head> <body> Cuerpo de la página. </body> </html>
  • 12. <BODY> Todo el texto/código dentro del <body> aparece dentro del navegador tal cual lo hayamos escrito . Al escribir: <html> ¡HOLA! <head> </head> <body> ¡HOLA! </body> </html>
  • 13. A CONSIDERAR  HTML no es sensible a mayúsculas y minúsculas. <Head> = <head> = <HEAD> = <heaD>… etc.  No requerimos que se disponga cada marca en una línea, pero para “trabajar en limpio” es mejor hacerlo separado.
  • 14. ¡A TRABAJAR! Entrar al sitio web > www.htmlya.com.ar Énfasis a los conceptos: 2, 3, 4, 7, 9 y 13