Tutorial Monsters - Diseño Web, Photoshop, Wordpress, CSS, Lightroom
  • Html5
  • CSS3
  • PHP
  • Photoshop
  • WordPress
  • SEO
  • eCommerce
  • Marketing
  • Store
Sin Resultado
Ver Todos los Resultados
Tutorial Monsters - Diseño Web, Photoshop, Wordpress, CSS, Lightroom
  • Html5
  • CSS3
  • PHP
  • Photoshop
  • WordPress
  • SEO
  • eCommerce
  • Marketing
  • Store
Sin Resultado
Ver Todos los Resultados
Tutorial Monsters - Diseño Web, Photoshop, Wordpress, CSS, Lightroom
Sin Resultado
Ver Todos los Resultados
Home Webmaster Html

Introducción al HTML

10 diciembre, 2010
en Html
0
Manual HTML: Cómo crear y hacer tablas en HTML (con ejemplos prácticos)
Share on FacebookShare on Twitter

Resumen del Contenido

  • ¿Qué son los archivos HTML?
  • ¡Vamos a hacer una pequeña prueba!
    • Si está usando Windows, abre el «Block de Notas«, para los usuarios de Mac, abrir «Simpletext«.
  • Expliquemos el ejemplo

¿Qué son los archivos HTML?

  • HTML (HyperText Markup Language) o «Lenguaje para Marcado de Hipertexto».
  • Los archivos HTML deben tener una extensión htm o html.
  • Para crear un archivo HTML solo hace falta un editor de texto.
  • Un archivo HTML está compuesto por etiquetas.
  • Las etiquetas le dicen al navegador (Ej: Internet Explorer, Firefox, Mozilla, etc.) como mostrar la información en la página.

¡Vamos a hacer una pequeña prueba!

Si está usando Windows, abre el «Block de Notas«, para los usuarios de Mac, abrir «Simpletext«.

Escribe, el siguiente texto:

<html>
<head>
<title>Mi primera página Web</title>
</head>
<body>
Hola a todos.
</body>
</html>

Guarda el archivo como «pagina1.html» (las extensiones «.htm» o «.html» tienen el mismo significado y nos indican que se trata de un archivo HTML).

  • Abre el navegador Internet (Internet Explorer, Firefox, Opera, Safari,..etc.).
  • Seleccione «Archivo» y luego «Abrir».
  • Buscar el archivo que acabas de guardar -«pagina1.html»- presione «Abrir».
  • Presione «OK» y el navegador mostrará la página.

Expliquemos el ejemplo

<html> –> Indica al navegador que abre un archivo HTML.
<head>
–> Apertura de la cabecera del documento. Sección que no se muestra en la pantalla.
<title>Mi primera página Web</title>
–> Título de la página.
</head>
–> Cierre de la cabecera del documento.
<body>
–> Apertura del cuerpo del documento. Esta sección aparece en la pantalla.
Hola a todos.
–> Texto que va a ser mostrado por el navegador.
</body>
–> Cierre del cuerpo del documento.
</html>
–> Cierre del archivo HTML

La primera etiqueta del archivo es <html>. Esto le indica al navegador que se trata de un archivo HTML. Para cerrar el archivo usamos </html>. Todo lo que se encuentra entre las dos etiquetas es el código HTML de la página.

Luego vemos la etiqueta <head>. Lo que sigue a continuación hasta su cierre </head>, es la cabecera del documento y no se muestra en la pantalla. Aquí colocamos información tal como el título de la página(<title>Mi primera página Web</title>), palabras claves para los motores de búsqueda, una descripción de la página y otros datos del documento. Entre las etiquetas <body> y </body> se encuentra el cuerpo del documento y el contenido que se coloque en esta sección es el que veremos en pantalla, como por ejemplo, «Hola a todos.»
Nota: observa que todas las etiquetas de cierre se diferencian de las de apertura por llevar «/» antes del nombre.

Etiquetas: bodycabeceraetiquetasheadhmtHTMLtitle
ANUNCIO
Post anterior

El color en la web

Próximo Post

Elementos y etiquetas de HTML

Otros Posts

Web semantica con HTML5

Enlace para llamar por teléfono HTML5

13 marzo, 2016
1

¿Sabes marcar un número de teléfono desde un enlace? Te decimos como hacerlo con una etiqueta HTML5

Manual HTML: Cómo crear y hacer tablas en HTML (con ejemplos prácticos)

Manual HTML: Cómo insertar espacios en blanco y saltos de línea

20 febrero, 2016
0

Continuamos con nuestro manual de HTML, en esta ocasión veremos los espacios en blanco y los saltos de línea. en su día ya vimos como dar formato básico a un texto con HTML, hoy terminaremos...

Recomendados

Qué debe tener un texto SEO para que posicione en Google

Qué debe tener un texto SEO para que posicione en Google

31 mayo, 2021
Adobe Photoshop Lightroom

La interfaz del módulo Biblioteca

5 febrero, 2012
350 iconos pixel-perfect en PSD para descargar. Glyphs Icons

Google propociona 750 iconos y material de diseño gráfico de forma gratuita

14 octubre, 2014
magento

Magento: Chuleta básica

18 febrero, 2011

Tutotial Monsters

Somos un equipo creativo apasionado por brindar los mejores recursos gratuitos y premium a la comunidad de diseño.
PADAWAN

  • Home
  • Política de privacidad
  • Política de Cookies
  • Aviso Legal
  • Contactar

© 2020 Tutorial Monsters - Estamos para Colaborar SEOConsultora.

Sin Resultado
Ver Todos los Resultados
  • Html5
  • CSS3
  • PHP
  • Photoshop
  • WordPress
  • SEO
  • eCommerce
  • Marketing
  • Store
Este sitio web utiliza cookies. Al continuar utilizando este sitio web, usted da su consentimiento para que se utilicen cookies. Visite nuestra Política de privacidad y cookies .