SlideShare una empresa de Scribd logo
1 de 5
TUTORIAL DE HTML
HTML, siglas de HyperText Markup Language («lenguaje de marcado de
hipertexto»), es el lenguaje de marcado predominante para la elaboración de páginas
web. Es usado para describir la estructura y el contenido en forma de texto, así como
para complementar el texto con objetos tales como imágenes. El HTML se escribe en
forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede
describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un
script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores
web y otros procesadores de HTML.
 Introducción
 El HTML no es más que una aplicación del SGML (Standard Generalized Markup
Language), un sistema para definir tipos de documentos estructurados y lenguajes de marcas para
representar esos mismos documentos. El término HTML se suele referir a ambas cosas, tanto al
tipo de documento como al lenguaje de marcas.
A medida que nos afianzamos en el manejo de Internet cada uno de nosotros pasa por tres
etapas diferentes: Al principio solamente conocemos unas pocas páginas, luego nos damos
cuenta que existen buscadores lo cual lo hace más interesante y por último nos damos cuenta que
en Internet no solamente se puede ver la información sino que también se puede publicar. ¿y qué
otra manera más fácil y más sencilla? Si Internet tiene acceso a todos los rincones del mundo.
Para que varias personas se comuniquen es necesarios que éstas hablen un mismo idioma. El
lenguaje que utilizan las computadoras que están conectadas a Internet es HTML. A través de
esta monografía explicaremos que es HTML, sus orígenes y el proceso de creación de una página
web.
    Códigos HTML básicos

    Artículo principal: Anexo:Etiquetas HTML/XHTML5.

    <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser
interpretado como código HTML. Esto es así de facto, ya que en teoría lo que define el tipo de documento es el
DOCTYPE, significando la palabra justo tras DOCTYPE el tag de raíz, por ejemplo:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
"http://www.w3.org/TR/html4/strict.dtd">

    <script>: incrusta un script en una web, o se llama a uno mediante src="url del script". Se recomienda incluir el
tipo MIME en el atributo type, en el caso de JavaScript text/javascript.

    <head>: define la cabecera del documento HTML; esta cabecera suele contener información sobre el documento
que no se muestra directamente al usuario. Como por ejemplo el título de la ventana del navegador. Dentro de la
cabecera <head> podemos encontrar:

    Un ejemplo de código HTML con coloreado de sintaxis.

    <title>: define el título de la página. Por lo general, el título aparece en la barra de título encima de la ventana.

    <link>: para vincular el sitio a hojas de estilo o iconos. Por ejemplo:<link rel="stylesheet" href="/style.css"
type="text/css">.

    <style>: para colocar el estilo interno de la página; ya sea usando CSS, u otros lenguajes similares. No es necesario
colocarlo si se va a vincular a un
    <h1> a <h6>: encabezados o títulos del documento con diferente relevancia.
    <table>: define una tabla.
    <tr>: fila de una tabla.
    <td>: celda de una tabla (debe estar dentro de una fila).
    <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo
href. Por ejemplo: <a href="http://www.wikipedia.org" title="Wikipedia" target="_blank" tabindex="1">Wikipedia</a> se
representa como Wikipedia).
    <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido.
    <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img
src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo".
    <li><ol><ul>: etiquetas para listas.
    <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>).
    <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>).
    <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>).
    <u>: texto subrayado.
    ML Básicos
 Etiquetas de parrafos
 Formato:
<B> y </B> Sirve para colocar un texto en Negrita.
<U> y < /U> Sirve para subrayar un texto
<STRIKE> y </STRIKE> Sirve para tachar un texto.
<STRONG> y </STRONG> Cumple la misma función que <B>
<I> y <I> Para colocar un texto en cursiva.
<EM>texto con énfasis</EM> texto con énfasis
<CITE>citación</CITE> citación
<DFN>definición</DFN> definición
<KBD>teclado</KBD> teclado
<SAMP>ejemplo</SAMP> ejemplo
SIZE: Regula el tamaño de los caracteres.

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

Emily
EmilyEmily
Emily
 
Taller 1 mariana barreto
Taller 1 mariana barretoTaller 1 mariana barreto
Taller 1 mariana barreto
 
HTML HyperText Markup Language
HTML HyperText Markup LanguageHTML HyperText Markup Language
HTML HyperText Markup Language
 
Presentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTMLPresentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTML
 
Investigacion de html y xml
Investigacion de html y xmlInvestigacion de html y xml
Investigacion de html y xml
 
Html, Css y JavaScript
Html, Css y JavaScriptHtml, Css y JavaScript
Html, Css y JavaScript
 
Introducción al HTML
Introducción al HTMLIntroducción al HTML
Introducción al HTML
 
Helen Valverde 2C3
Helen Valverde 2C3Helen Valverde 2C3
Helen Valverde 2C3
 
Lenguajes de programacion
Lenguajes de programacionLenguajes de programacion
Lenguajes de programacion
 
Lissette lainez
Lissette lainezLissette lainez
Lissette lainez
 
Lissette lainez
Lissette lainezLissette lainez
Lissette lainez
 
Aprender El Lenguaje Html
Aprender El Lenguaje HtmlAprender El Lenguaje Html
Aprender El Lenguaje Html
 
05 Introduccion a HTML
05 Introduccion a HTML05 Introduccion a HTML
05 Introduccion a HTML
 
HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?HTML ¿qué es y para que sirve?
HTML ¿qué es y para que sirve?
 
Introduccion a html
Introduccion a htmlIntroduccion a html
Introduccion a html
 
Deber de htmly xml
Deber de htmly xmlDeber de htmly xml
Deber de htmly xml
 
Presentación html
Presentación htmlPresentación html
Presentación html
 
Diseño de página web
Diseño de página webDiseño de página web
Diseño de página web
 
Toala Miguel 2C3
Toala Miguel 2C3Toala Miguel 2C3
Toala Miguel 2C3
 

Destacado

revista elavorada en scribus
revista elavorada en scribusrevista elavorada en scribus
revista elavorada en scribusrubenescarcia
 
Estudo mercado imobiliário - TV Aratu Digital
Estudo mercado imobiliário - TV Aratu DigitalEstudo mercado imobiliário - TV Aratu Digital
Estudo mercado imobiliário - TV Aratu DigitalSabrina
 
VYATTA USERS MEETING Spring 2014 NIFTY Cloud
VYATTA USERS MEETING Spring 2014 NIFTY CloudVYATTA USERS MEETING Spring 2014 NIFTY Cloud
VYATTA USERS MEETING Spring 2014 NIFTY Cloud雄也 日下部
 
Algebra Distributive Property
Algebra  Distributive PropertyAlgebra  Distributive Property
Algebra Distributive PropertyTed Hughes
 
Histórico das tecnologias no ensino de línguas
Histórico das tecnologias no ensino de línguasHistórico das tecnologias no ensino de línguas
Histórico das tecnologias no ensino de línguaszielziel
 
Atividadesclubeeuropeu2014 2015
Atividadesclubeeuropeu2014 2015Atividadesclubeeuropeu2014 2015
Atividadesclubeeuropeu2014 2015Natercia
 
Trabajo twd
Trabajo twdTrabajo twd
Trabajo twd17022001
 
Doce preferido diana
Doce preferido dianaDoce preferido diana
Doce preferido dianaNatercia
 
Naturaleza
NaturalezaNaturaleza
Naturalezadiosyely
 
Novela Ribatejana A Princesa, Má, TomáSia
Novela Ribatejana  A Princesa, Má, TomáSiaNovela Ribatejana  A Princesa, Má, TomáSia
Novela Ribatejana A Princesa, Má, TomáSiaxannoka
 

Destacado (20)

Evernote
EvernoteEvernote
Evernote
 
revista elavorada en scribus
revista elavorada en scribusrevista elavorada en scribus
revista elavorada en scribus
 
Estudo mercado imobiliário - TV Aratu Digital
Estudo mercado imobiliário - TV Aratu DigitalEstudo mercado imobiliário - TV Aratu Digital
Estudo mercado imobiliário - TV Aratu Digital
 
Diagrama causa efecto
Diagrama causa efectoDiagrama causa efecto
Diagrama causa efecto
 
ApresentaçãO
ApresentaçãOApresentaçãO
ApresentaçãO
 
VYATTA USERS MEETING Spring 2014 NIFTY Cloud
VYATTA USERS MEETING Spring 2014 NIFTY CloudVYATTA USERS MEETING Spring 2014 NIFTY Cloud
VYATTA USERS MEETING Spring 2014 NIFTY Cloud
 
Algebra Distributive Property
Algebra  Distributive PropertyAlgebra  Distributive Property
Algebra Distributive Property
 
Comentario a Kuentalibros
Comentario a KuentalibrosComentario a Kuentalibros
Comentario a Kuentalibros
 
Histórico das tecnologias no ensino de línguas
Histórico das tecnologias no ensino de línguasHistórico das tecnologias no ensino de línguas
Histórico das tecnologias no ensino de línguas
 
Atividadesclubeeuropeu2014 2015
Atividadesclubeeuropeu2014 2015Atividadesclubeeuropeu2014 2015
Atividadesclubeeuropeu2014 2015
 
O Pote
O PoteO Pote
O Pote
 
Trabajo twd
Trabajo twdTrabajo twd
Trabajo twd
 
GASTRONOMIAA
GASTRONOMIAA GASTRONOMIAA
GASTRONOMIAA
 
Cplus
CplusCplus
Cplus
 
Apresentação1
Apresentação1Apresentação1
Apresentação1
 
Doce preferido diana
Doce preferido dianaDoce preferido diana
Doce preferido diana
 
Elsword
Elsword Elsword
Elsword
 
Paganini
PaganiniPaganini
Paganini
 
Naturaleza
NaturalezaNaturaleza
Naturaleza
 
Novela Ribatejana A Princesa, Má, TomáSia
Novela Ribatejana  A Princesa, Má, TomáSiaNovela Ribatejana  A Princesa, Má, TomáSia
Novela Ribatejana A Princesa, Má, TomáSia
 

Similar a danny (20)

Acerca de html
Acerca de htmlAcerca de html
Acerca de html
 
Html
HtmlHtml
Html
 
Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
 
etiquetas basicas de html
etiquetas basicas de htmletiquetas basicas de html
etiquetas basicas de html
 
Israel
IsraelIsrael
Israel
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
Produccion de material educ. diapositivas html
Produccion de material educ. diapositivas htmlProduccion de material educ. diapositivas html
Produccion de material educ. diapositivas html
 
Clase HTML.pptx
Clase HTML.pptxClase HTML.pptx
Clase HTML.pptx
 
Html y xml
Html y xmlHtml y xml
Html y xml
 
Qué es el html
Qué es el htmlQué es el html
Qué es el html
 
Html
HtmlHtml
Html
 
Html presentacion
Html presentacionHtml presentacion
Html presentacion
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Definiciones
DefinicionesDefiniciones
Definiciones
 
HTML
HTMLHTML
HTML
 
Expo html
Expo htmlExpo html
Expo html
 

danny

  • 1. TUTORIAL DE HTML HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.
  • 2.  Introducción  El HTML no es más que una aplicación del SGML (Standard Generalized Markup Language), un sistema para definir tipos de documentos estructurados y lenguajes de marcas para representar esos mismos documentos. El término HTML se suele referir a ambas cosas, tanto al tipo de documento como al lenguaje de marcas. A medida que nos afianzamos en el manejo de Internet cada uno de nosotros pasa por tres etapas diferentes: Al principio solamente conocemos unas pocas páginas, luego nos damos cuenta que existen buscadores lo cual lo hace más interesante y por último nos damos cuenta que en Internet no solamente se puede ver la información sino que también se puede publicar. ¿y qué otra manera más fácil y más sencilla? Si Internet tiene acceso a todos los rincones del mundo. Para que varias personas se comuniquen es necesarios que éstas hablen un mismo idioma. El lenguaje que utilizan las computadoras que están conectadas a Internet es HTML. A través de esta monografía explicaremos que es HTML, sus orígenes y el proceso de creación de una página web.
  • 3. Códigos HTML básicos  Artículo principal: Anexo:Etiquetas HTML/XHTML5.  <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML. Esto es así de facto, ya que en teoría lo que define el tipo de documento es el DOCTYPE, significando la palabra justo tras DOCTYPE el tag de raíz, por ejemplo:  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd">  <script>: incrusta un script en una web, o se llama a uno mediante src="url del script". Se recomienda incluir el tipo MIME en el atributo type, en el caso de JavaScript text/javascript.  <head>: define la cabecera del documento HTML; esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario. Como por ejemplo el título de la ventana del navegador. Dentro de la cabecera <head> podemos encontrar:  Un ejemplo de código HTML con coloreado de sintaxis.  <title>: define el título de la página. Por lo general, el título aparece en la barra de título encima de la ventana.  <link>: para vincular el sitio a hojas de estilo o iconos. Por ejemplo:<link rel="stylesheet" href="/style.css" type="text/css">.  <style>: para colocar el estilo interno de la página; ya sea usando CSS, u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un
  • 4. <h1> a <h6>: encabezados o títulos del documento con diferente relevancia.  <table>: define una tabla.  <tr>: fila de una tabla.  <td>: celda de una tabla (debe estar dentro de una fila).  <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo href. Por ejemplo: <a href="http://www.wikipedia.org" title="Wikipedia" target="_blank" tabindex="1">Wikipedia</a> se representa como Wikipedia).  <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido.  <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo".  <li><ol><ul>: etiquetas para listas.  <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>).  <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>).  <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>).  <u>: texto subrayado.  ML Básicos
  • 5.  Etiquetas de parrafos  Formato: <B> y </B> Sirve para colocar un texto en Negrita. <U> y < /U> Sirve para subrayar un texto <STRIKE> y </STRIKE> Sirve para tachar un texto. <STRONG> y </STRONG> Cumple la misma función que <B> <I> y <I> Para colocar un texto en cursiva. <EM>texto con énfasis</EM> texto con énfasis <CITE>citación</CITE> citación <DFN>definición</DFN> definición <KBD>teclado</KBD> teclado <SAMP>ejemplo</SAMP> ejemplo SIZE: Regula el tamaño de los caracteres.