SlideShare una empresa de Scribd logo
1 de 16
PAGINA S
INDICE

 QUE ES HTML
 CÓMO ESPECIFICAR EFECTOS DEL
  TEXTO
 ESTRUCTURA BÁSICA DE UN
  DOCUMENTO HTML
 ESTILOS Y EFECTOS BÁSICOS
 TÍTULOS
 ATRIBUTOS DEL TEXTO
 LISTAS
 ENLACES Y GRÁFICOS
 QUÉ ES UN URL
 ENLACES
 GRÁFICOS
 REFERNCIA
QUE ES HTML
El HTML o Hypertext Markup, es el
lenguaje utilizado para las páginas
web o de Internet. En español su
traducción vendría a ser Lenguaje de
Etiquetado de Documentos
hipertextual.
CÓMO ESPECIFICAR EFECTOS DEL
TEXTO
El etiquetado se refiere a que los archivos
HTML, además de texto, contienen una serie de
atribuciones o información adicional acerca del
texto. Hipertexto, término acuñado en 1965 por
Ted Nelson, es información no lineal, lo que en
palabras sencillas significa texto con enlaces o
links a otros textos. El lenguaje HTML
estructura la información, que luego es
visualizada utilizando un navegador, como en
Internet Explorer que viene con el sistema
operativo Windows.
ESTRUCTURA BÁSICA DE UN
    DOCUMENTO HTML
   <HTML> Indica el inicio del documento.
        <HEAD> Inicio de la cabecera.
   <TITLE> Inicio del título del documento.
   </TITLE> Final del título del documento.
</HEAD> Final de la cabecera del documento.
  <BODY> Inicio del cuerpo del documento.
  </BODY> Final del cuerpo del documento.
      </HTML> Final del documento.
ESTILOS Y EFECTOS BÁSICOS

Mediante los títulos, en sus diferentes niveles de
importancia, se puede definir el esqueleto del
documento, su estructura básica. HTML tiene seis
niveles de cabeceras numeradas del uno al seis.
<H1>Mucha importancia</H1> Mucha importancia
<H2>Menos importancia</H2> Menos importancia
<H3>Mucha menos importancia</H3> Mucha menos
importancia
TÍTULOS
Para poner el título a un documento html, hacemos uso del tag
<title> que debe ir colocado dentro del encabezado del
documento, es decir, entre los tags <head>.
                      Aquí el ejemplo:
<HTML>
<head>
<title>Título de la página, es lo que se despliega en la parte
superior izquierda del navegador.</title>
</head>
<body>
<p>Cómo poner el título a un documento HTML</p>
</body>
</HTML>
ATRIBUTOS DEL TEXTO

Para indicar atributos del texto (negrilla, subrayado,
etc...) tenemos varias etiquetas. Algunas de ellas no son
reconocidas por determinados navegadores de Internet,
es por ello que según el navegador que este vd.
utilizando, verá el resultado correctamente o no.
Atributo      Etiqueta          Ejemplo            Resultado
                                <B> Texto de
Negrita       <B></B>                              Texto de prueba
                                prueba </B>

                                <I> Texto de
Cursiva       <I></I>                              Texto de prueba
                                prueba </I>

                                <TT> Texto de
Teletype      <TT></TT>                            Texto de prueba
                                prueba </TT>

                                <U> Texto de
Subrayado     <U></U>                              Texto de prueba
                                prueba </U>

                                <S> Texto de
Tachado       <S></S>                              Texto de prueba
                                prueba </S>

                                <BLINK> Texto de
Parpadeo      <BLINK></BLINK>                      Texto de prueba
                                prueba</BLINK>

                                <SUP> Texto de
Superindice   <SUP></SUP>                          Texto de prueba
                                prueba</SUP>

                                <SUB> Texto de
Subindice     <SUB></SUB>                          Texto de prueba
                                prueba</SUB>

              <CENTER></CENTE <CENTER> Texto de
Centrado                                               Texto de prue
              R>              prueba</CENTER>
ENLACES Y GRÁFICOS
Los enlaces en HTML se expresan insertando entre la
directiva <A> el objeto (que puede ser un fragmento de
texto o un gráfico) que vaya a servir como anclaje para el
enlace. Por ejemplo, si se marca con <A> un gráfico,
cuando en el documento final se pulse con el ratón sobre
dicho gráfico se saltará al objeto referenciado en el
enlace: otro documento, un vídeo musical, o cualquier
imagen.
QUÉ ES UN URL

  Las URL se utilizarán para definir el documento de
destino de los hiperenlaces, para referenciar los gráficos
y cualquier otro fichero que se desee incluir dentro de un
documento HTML. Cada elemento de internet tendrá
una URL que lo defina, ya se encuentre en un servidor
de la WWW, FTP, gopher o las News.
             El formato de una URL será:
   servicio://maquina.dominio:puerto/camino/fichero
ENLACES
Para crear un enlace necesitamos la ubicación, o mejor dicho, la
dirección hacia donde nos llevará ese enlace al hacer clic en el,
podemos poner una ruta absoluta (por ejemplo
http://www.comocrearunsitioweb.com/ubicacion-enlace.html) o
bien, una ruta relativa("/enlace.html" si es que el archivo desde
donde enlazamos se encuentra en el mismo directorio del archivo
en el que estamos en ese momento, o sea el "index.html" que
creamos al principio).
La etiqueta para crear enlaces es <a> y </a>, pero claro, aun falta
algo ¿no?, falta poner la dirección hacia donde nos llevará ese
enlace, para eso esta el atributo href, se utiliza de esta forma:
GRÁFICOS
Las imágenes son mucho más impactantes y pueden
transmitir un mensaje mejor y de una forma más clara
y rápida que el texto.
Introducir gráficos en las páginas incrementa de una
manera notable la presentación de las mismas, pero
hay que tener en cuenta que mientras 1K de texto
puede llenar toda la pantalla, este pequeño gráfico de
la derecha ocupa 12Ks

Incluya el atributo ALT="descripción" en todas las
imágenes
REFERENCIAS

La referencia es un conjunto de recursos diseñados para
ayudar a los webmasters a escribir su código HTML.
Por ejemplo, puedes encontrar tablas con codificaciones
de caracteres, códigos de lenguaje, códigos de países,
etc., que puedes utilizar para escribir tus páginas.

La parte más importante de la referencia es la que habla
sobre tags HTML

Más contenido relacionado

La actualidad más candente (15)

Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
Informatika 1111111
Informatika 1111111Informatika 1111111
Informatika 1111111
 
Html
HtmlHtml
Html
 
Etiquetas HTML
Etiquetas HTMLEtiquetas HTML
Etiquetas HTML
 
Temas de html
Temas de htmlTemas de html
Temas de html
 
Qué es html
Qué es htmlQué es html
Qué es html
 
Estructura html
Estructura htmlEstructura html
Estructura html
 
Texto enrriquecido HTML
Texto enrriquecido HTMLTexto enrriquecido HTML
Texto enrriquecido HTML
 
Informatica
InformaticaInformatica
Informatica
 
Etiquetas de xhtml
Etiquetas de xhtmlEtiquetas de xhtml
Etiquetas de xhtml
 
Primeraclase
PrimeraclasePrimeraclase
Primeraclase
 
Practicas html
Practicas htmlPracticas html
Practicas html
 
Etiquetas mas utilizadas del lenguaje html
Etiquetas mas utilizadas del lenguaje htmlEtiquetas mas utilizadas del lenguaje html
Etiquetas mas utilizadas del lenguaje html
 
Listado de etiquetas y atributos html
Listado de etiquetas y atributos htmlListado de etiquetas y atributos html
Listado de etiquetas y atributos html
 
Intro paginasweb
Intro paginaswebIntro paginasweb
Intro paginasweb
 

Similar a Prsentacion (20)

HTML 2011
HTML 2011HTML 2011
HTML 2011
 
Html
HtmlHtml
Html
 
Una Página WEB
Una Página WEBUna Página WEB
Una Página WEB
 
GUIA DE FORMULARIOS HTML - PARA LA ACTIVIDAD 1.pdf
GUIA DE FORMULARIOS HTML - PARA LA ACTIVIDAD 1.pdfGUIA DE FORMULARIOS HTML - PARA LA ACTIVIDAD 1.pdf
GUIA DE FORMULARIOS HTML - PARA LA ACTIVIDAD 1.pdf
 
Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1 Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1
 
Clase Html + CSS
Clase Html + CSSClase Html + CSS
Clase Html + CSS
 
Manual de-html
Manual de-htmlManual de-html
Manual de-html
 
01 estructura
01 estructura01 estructura
01 estructura
 
Html doc. descargado (reparado)
Html doc. descargado (reparado)Html doc. descargado (reparado)
Html doc. descargado (reparado)
 
QUE SON CODIGOS HTML.docx
QUE SON CODIGOS HTML.docxQUE SON CODIGOS HTML.docx
QUE SON CODIGOS HTML.docx
 
Deber k riss
Deber k rissDeber k riss
Deber k riss
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
Retro2011ortegon
Retro2011ortegonRetro2011ortegon
Retro2011ortegon
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
Retro2011brandon
Retro2011brandonRetro2011brandon
Retro2011brandon
 
Retro2011ortegon
Retro2011ortegonRetro2011ortegon
Retro2011ortegon
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Deber vero
Deber veroDeber vero
Deber vero
 

Prsentacion

  • 2. INDICE  QUE ES HTML  CÓMO ESPECIFICAR EFECTOS DEL TEXTO  ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML  ESTILOS Y EFECTOS BÁSICOS  TÍTULOS  ATRIBUTOS DEL TEXTO  LISTAS  ENLACES Y GRÁFICOS  QUÉ ES UN URL  ENLACES  GRÁFICOS  REFERNCIA
  • 3. QUE ES HTML El HTML o Hypertext Markup, es el lenguaje utilizado para las páginas web o de Internet. En español su traducción vendría a ser Lenguaje de Etiquetado de Documentos hipertextual.
  • 4.
  • 5. CÓMO ESPECIFICAR EFECTOS DEL TEXTO El etiquetado se refiere a que los archivos HTML, además de texto, contienen una serie de atribuciones o información adicional acerca del texto. Hipertexto, término acuñado en 1965 por Ted Nelson, es información no lineal, lo que en palabras sencillas significa texto con enlaces o links a otros textos. El lenguaje HTML estructura la información, que luego es visualizada utilizando un navegador, como en Internet Explorer que viene con el sistema operativo Windows.
  • 6.
  • 7. ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML <HTML> Indica el inicio del documento. <HEAD> Inicio de la cabecera. <TITLE> Inicio del título del documento. </TITLE> Final del título del documento. </HEAD> Final de la cabecera del documento. <BODY> Inicio del cuerpo del documento. </BODY> Final del cuerpo del documento. </HTML> Final del documento.
  • 8. ESTILOS Y EFECTOS BÁSICOS Mediante los títulos, en sus diferentes niveles de importancia, se puede definir el esqueleto del documento, su estructura básica. HTML tiene seis niveles de cabeceras numeradas del uno al seis. <H1>Mucha importancia</H1> Mucha importancia <H2>Menos importancia</H2> Menos importancia <H3>Mucha menos importancia</H3> Mucha menos importancia
  • 9. TÍTULOS Para poner el título a un documento html, hacemos uso del tag <title> que debe ir colocado dentro del encabezado del documento, es decir, entre los tags <head>. Aquí el ejemplo: <HTML> <head> <title>Título de la página, es lo que se despliega en la parte superior izquierda del navegador.</title> </head> <body> <p>Cómo poner el título a un documento HTML</p> </body> </HTML>
  • 10. ATRIBUTOS DEL TEXTO Para indicar atributos del texto (negrilla, subrayado, etc...) tenemos varias etiquetas. Algunas de ellas no son reconocidas por determinados navegadores de Internet, es por ello que según el navegador que este vd. utilizando, verá el resultado correctamente o no.
  • 11. Atributo Etiqueta Ejemplo Resultado <B> Texto de Negrita <B></B> Texto de prueba prueba </B> <I> Texto de Cursiva <I></I> Texto de prueba prueba </I> <TT> Texto de Teletype <TT></TT> Texto de prueba prueba </TT> <U> Texto de Subrayado <U></U> Texto de prueba prueba </U> <S> Texto de Tachado <S></S> Texto de prueba prueba </S> <BLINK> Texto de Parpadeo <BLINK></BLINK> Texto de prueba prueba</BLINK> <SUP> Texto de Superindice <SUP></SUP> Texto de prueba prueba</SUP> <SUB> Texto de Subindice <SUB></SUB> Texto de prueba prueba</SUB> <CENTER></CENTE <CENTER> Texto de Centrado Texto de prue R> prueba</CENTER>
  • 12. ENLACES Y GRÁFICOS Los enlaces en HTML se expresan insertando entre la directiva <A> el objeto (que puede ser un fragmento de texto o un gráfico) que vaya a servir como anclaje para el enlace. Por ejemplo, si se marca con <A> un gráfico, cuando en el documento final se pulse con el ratón sobre dicho gráfico se saltará al objeto referenciado en el enlace: otro documento, un vídeo musical, o cualquier imagen.
  • 13. QUÉ ES UN URL Las URL se utilizarán para definir el documento de destino de los hiperenlaces, para referenciar los gráficos y cualquier otro fichero que se desee incluir dentro de un documento HTML. Cada elemento de internet tendrá una URL que lo defina, ya se encuentre en un servidor de la WWW, FTP, gopher o las News. El formato de una URL será: servicio://maquina.dominio:puerto/camino/fichero
  • 14. ENLACES Para crear un enlace necesitamos la ubicación, o mejor dicho, la dirección hacia donde nos llevará ese enlace al hacer clic en el, podemos poner una ruta absoluta (por ejemplo http://www.comocrearunsitioweb.com/ubicacion-enlace.html) o bien, una ruta relativa("/enlace.html" si es que el archivo desde donde enlazamos se encuentra en el mismo directorio del archivo en el que estamos en ese momento, o sea el "index.html" que creamos al principio). La etiqueta para crear enlaces es <a> y </a>, pero claro, aun falta algo ¿no?, falta poner la dirección hacia donde nos llevará ese enlace, para eso esta el atributo href, se utiliza de esta forma:
  • 15. GRÁFICOS Las imágenes son mucho más impactantes y pueden transmitir un mensaje mejor y de una forma más clara y rápida que el texto. Introducir gráficos en las páginas incrementa de una manera notable la presentación de las mismas, pero hay que tener en cuenta que mientras 1K de texto puede llenar toda la pantalla, este pequeño gráfico de la derecha ocupa 12Ks Incluya el atributo ALT="descripción" en todas las imágenes
  • 16. REFERENCIAS La referencia es un conjunto de recursos diseñados para ayudar a los webmasters a escribir su código HTML. Por ejemplo, puedes encontrar tablas con codificaciones de caracteres, códigos de lenguaje, códigos de países, etc., que puedes utilizar para escribir tus páginas. La parte más importante de la referencia es la que habla sobre tags HTML