par Santiago Solano Sanchez Il y a 5 années
187
Plus de détails
Estructura:
Al hablar de la estructura de una página web podemos distinguir dos partes principales, la cabecera y el cuerpo . La cabecera contiene información importante para la propia página pero que el usuario no ve directamente (salvo el título), y en el cuerpo está el contenido visible de la página. Vamos a ver las zonas más importantes que hay dentro de ambas partes, para ello utilizaremos el siguiente esquema: https://www.sitesbay.com/html/images/structure-of-html.png
En la cabecera tenemos etiquetas para definir los metadatos como el juego de caracteres (charset) y el viewport, a continuación el título
Dentro del cuerpo tenemos todo el contenido del página web, por lo tanto podemos incluir en él prácticamente todas las etiquetas de HTML, sin ninguna regla en cuanto al orden de las etiquetas, sin embargo, es conveniente dar una estructura lógica a la página mediante el uso adecuado de las etiquetas semántica. (Las etiquetas semánticas no conllevan ninguna característica de formato ni de ubicación, pero sí tienen un significado semántico que puede ser interpretado por los buscadores y por otro tipo de programas (lectura por voz, accesibilidad, ...)
Vamos a comenzar por escribir una página web muy sencilla. Para ello podemos utilizar cualquier editor de texto sin formato, por ejemplo, el Bloc de Notas (Notepad) incluído en Windows o con el software Sublimetext y/o Dreamweaver de Adobe. En ordenadores Apple puedes usar el TextEdit
Escribiremos el siguiente código:
Una vez escrito, vamos a guardarlo. Pero antes de continuar, debemos de explicar lo que es la extensión de un archivo. La extensión indica de qué tipo es un archivo. La extensión son las tres letras que van después del punto al final del nombre de un archivo (por ejemplo, imagen.gif o documento.doc).
Hola mundo
Una vez escrito, vamos a guardarlo. Pero antes de continuar, debemos de explicar lo que es la extensión de un archivo. La extensión indica de qué tipo es un archivo. La extensión son las tres letras que van después del punto al final del nombre de un archivo (por ejemplo, imagen.gif o documento.doc).
Una vez escrito, vamos a guardarlo. Pero antes de continuar, debemos de explicar lo que es la extensión de un archivo. La extensión indica de qué tipo es un archivo. La extensión son las tres letras que van después del punto al final del nombre de un archivo (por ejemplo, imagen.gif o documento.doc).
Una vez escrito, vamos a guardarlo. Pero antes de continuar, debemos de explicar lo que es la extensión de un archivo. La extensión indica de qué tipo es un archivo. La extensión son las tres letras que van después del punto al final del nombre de un archivo (por ejemplo, imagen.gif o documento.doc).
Pulsamos en el menú Archivo y elegimos Guardar. Introducimos el nombre, por ejemplo primera. Si ahora pulsásemos Guardar, se guardaría con la extensión txt, que indica que es un documento de texto sin formato. Para guardarlo como una página web, debemos de emplear la extensión .html (o .htm). Por lo que completamos el nombre para que quede primerapáginaweb.html y pulsamos Guardar.
Como el archivo tiene extensión .html, se abrirá la página con el navegador que tengamos como predeterminado.
1.1 Introducción
¿Qué es HTML?
HTML es un lenguaje de marcado que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir, Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto. EL HTML se encarga de desarrollar una descripción sobre los contenidos que aparecen como textos y sobre su estructura, complementando dicho texto con diversos objetos (como fotografías, animaciones, etc). Es un lenguaje muy simple y general que sirve para definir otros lenguajes que tienen que ver con el formato de los documentos. El texto en él se crea a partir de etiquetas, también llamadas tags, que permiten interconectar diversos conceptos y formatos. Este lenguaje funciona por medio de etiquetas las cuales permiten construir la estructura de nuestra página web.
1.2 Etiquetas
Las etiquetas (marcas) delimitan cada uno de los elementos que componen un documento HTML. El lenguaje HTML se basa en etiquetas, por eso es importante entender bien la sintaxis de las etiquetas.
Etiquetas vacías
Algunas etiquetas no tienen contenido, y se cierran sobre sí mismas, no tienen etiqueta de cierre, se llaman etiquetas vacias, como la etiqueta
. En estas etiquetas opcionalmente se puede colocar una barra justo antes del signo >, por ejemplo:
. La etiqueta
produce un salto de línea. Las etiquetas vacias no tienen contenido pero si pueden tener atributos. Algunas otras etiquetas vacias son
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
,Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
,Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
,Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
,Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
,Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
yEste no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
. En una etiqueta, la primera palabra que aparece es el nombre de la etiqueta. También podemos encontrar atributos con sus valores, siguiendo el formatoEste no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Etiquetas básicas para la construcción de nuestra página web
Este no va (no supe cómo borrarlo sin que se me borrara lo de abajo)
Subtema
Etiquetas básicas para la construcción de nuestra página web
La etiqueta es el cuerpo de la página, donde va lo que se ve en el navegador al cargar una web. En el body van los textos, las imágenes y todos los contenidos de la web.
Etiqueta
Etiqueta
Etiqueta
Etiqueta
La etiqueta
define un párrafo Ejemplo:
El famoso cuadro Gernika fue pintado por P. Picasso en 1937.
Picasso nació en Málaga.
La etiqueta
define un párrafo Ejemplo:
El famoso cuadro Gernika fue pintado por P. Picasso en 1937.
Picasso nació en Málaga.
La etiqueta
define un párrafo Ejemplo:
El famoso cuadro Gernika fue pintado por P. Picasso en 1937.
Picasso nació en Málaga.
La etiqueta
define un párrafo Ejemplo:
El famoso cuadro Gernika fue pintado por P. Picasso en 1937.
Picasso nació en Málaga.
La etiqueta
define un párrafo Ejemplo:
El famoso cuadro Gernika fue pintado por P. Picasso en 1937.
Picasso nació en Málaga.
Las etiqueta indica que empieza la cabecera de la página. En ella se suele poner el título (
Con la etiqueta pueden realizarse enlaces hacia documentos externos de cualquier tipo, generalmente es usada para definir enlaces hacia otras páginas web. Ejemplo: Texto del enlace
Etiqueta
Esta etiqueta es obligatoria y se muestra en la pestaña del navegador, no forma parte del cuerpo de la página. Sólo se puede escribir texto y es importante para que los buscadores conozcan el tema de la página.
Etiqueta
La etiqueta indica el comienzo del documento HTML.
La etiqueta
sería el elemento que contendría todos los elementos de la tablaEtiquetas de cierre
La etiqueta de cierre está delimitada por el signo < "menor que", a continuación la barra inclinada /, el propio nombre de la etiqueta (en este caso p), y finalmente el signo > "mayor que".
Etiquetas de apertura
La etiqueta de apertura está delimitada por el signo < "menor que", a continuación el propio nombre de la etiqueta (en este caso p), y opcionalmente, un atributo (en este caso class="fondo"), finalmente el signo > "mayor que".
