martes, 14 de octubre de 2025

principal

 

PRINCIPAL.HTML.

¡Haz clic para saltar al final!

GOOGLE

El problema de gravar a los ricos

 

Los sistemas fiscales diseñados en torno a los ingresos y el consumo tienen dificultades para captar la riqueza, y los multimillonarios gozan de gran movilidad.

Cuando la revista Forbes publicó su primera lista mundial de multimillonarios en 1987, sólo aparecían 140 nombres. La versión de 2025 incluía a más de 3.000

EXPANSION

 

 

 

Has llegado al final.

Este es el destino del enlace interno.

Ir a la página de Contacto

martes, 7 de octubre de 2025

Texto preformateado


Primera linea

             segunda linea tabulada

             tercera linea con espacios en blanco: 2 3  4   5    6


Poema de Gustavo Adolfo Bécquer


Hoy la tierra y los cielos me sonríen,

hoy llega al fondo de mi alma el sol,

hoy la he visto..., la he visto y me ha mirado...,

¡hoy creo en Dios!

TITULO

Ejemplos de formatos de texto

Ejemplo 1

Ejemplo 1

Ejemplo 1

Ejemplo 1

Ejemplo 1


Este texto forma el primer párrafo de la pagina, los párrafos pueden ocupar varias líneas y el navegador ajusta su longitud al tamaño de la ventana. si se reduce el tamaño de la ventana. si se reduce el tamaño de la ventana del navegador se puede apreciar como se produce este ajuste
esta linea aun pertenece al primer párrafo.

Este es el segundo párrafo de la pagina, se define con la etiqueta ' P '. El navegador se encarga de separar cada párrafo.

sábado, 4 de octubre de 2025

CONSTRUCCION DE PAGINAS WEB

 CONSTRUCCION DE PAGINAS WEB

 <!DOCTYPE html>

<html>
<head>
<title>Mi primer título</title>
</head>
<body>
<!-- Contenido visible de la página -->
</body>
</html>

Tags iniciales o de raíz

  • <!DOCTYPE html> Indica al navegador que el documento está basado en el estándar HTML5

  • <html> </html> Representa la raíz de un documento HTML. Todos los demás elementos de la estructura HTML deben ser recogidos dentro de estas etiquetas.

Metadatos del documento

  • <head> </head> Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo. El resto de etiquetas de metadatos, irán recogidas dentro de las etiquetas de apertura y cierre del head. Importante explicar que estos metadatos del documento, es información para el navegador y no contenido que será visible en la página web. A excepción de la etiqueta <title> que veremos a continuación.

  • <title> </title> Etiqueta usada para definir el título de la página web.

  • <link> Se usa para enlazar recursos externos al documento HTML. El ejemplo más común son las hojas de estilos CSS.

  • <meta> Etiqueta usada para definir otros metadatos que no se pueden definir con una etiqueta HTML especifica. Por ejemplo, para definir el autor del sitio, o la descripción del mismo.

  • <style> </style> Etiquetas usadas para introducir código CSS en línea, es decir, en el propio documento HTML.

Tags de secciones o para estructurar el HTML

  • <body> </body> Al contrario que la etiqueta de metadatos <head>, todo lo que quieras mostrar en la página web debe ir recogido dentro de las etiquetas de apertura y cierre de <body>. Este contenido será el que se muestre en la web.

  • <nav> </nav> Usadas para definir el contenido que será la sección de navegación de la web.

  • <main> </main> Se usa para definir el contenido principal del documento. Solamente puede existir uno por documento.

  • <section> </section> Define una sección del documento

  • <article> </article> Define contenido independiente de la web.

  • <aside> </aside> Dentro de estas etiquetas suele alojarse el contenido adicional de la web. Suele ser contenido relacionado con la web pero de poca importancia

  • <h1>,<h2>,<h3>,<h4>,<h5>,<h6> Son etiquetas HTML muy importantes, ya que son usadas para jerarquizar el contenido de la web. Las etiquetas se usan para explicar brevemente el contenido que irá a continuación.

  • <header> </header> Se usan para definir la cabecera de la página web. Suele contener el logotipo, menú de navegación, etc.

  • <footer> </footer> Usadas para definir el pie de página.

¿Quieres saber cómo crear tu propia página con HTML? Te enseñamos a crearla desde 0.
¡Descubre cómo!

Tags para la agrupación de contenido

  • <p> </p> Etiqueta usada para escribir párrafos de texto.

  • <hr> Etiqueta utilizada para «romper» entre dos secciones de una web. Usada comúnmente como separador.

  • <pre> </pre> Usada para pegar texto manteniendo el pre formato propio del texto.

  • <blockquote> </blockquote> Se usan para indicar que el contenido es texto citado.

  • <ol> </ol> Etiquetas para crear una lista ordenada

  • <ul> </ul> Etiquetas para crear una lista des-ordenada

  • <li> </li> Etiquetas que recogen el contenido de un elemento de una lista, sea ordenada o no.

  • <dl> </dl> Usada para crear una lista de definiciones.

  • <dt> </dt> Representa un término definido por la siguiente etiqueta <dd>

  • <dd> </dd> Se usa para definir los términos listados antes que él.

  • <figure> </figure> Indica una figura ilustrada como parte del documento HTML5.

  • <figcaption> </figcaption> Utilizada para definir la leyenda de una figura.

  • <div> </div> Etiqueta común utilizada para crear un contenedor genérico.

Complementa este listado de etiquetas con nuestro listado de todos los atributos HTML que existen.

Etiquetas semánticas para texto

  • <a> </a> Etiqueta utilizada para crear hiperenlaces en el documento HTML

  • <strong> </strong> Etiqueta para definir una palabra o conjunto de ellas como importantes. Tiene una fuerte importancia en el SEO de la página.

  • <small> </small> Utilizada para dejar un comentario aparte, del tipo una nota de derechos de autoría, u otros textos que no son esenciales para la comprensión del documento.

  • <cite> </cite> Para indicar el título de una obra

  • <sub> </sub> y <sup> </sup> Etiquetas utilizadas para representar un subíndice o superíndice.

  • <mark> </mark> Usada para resaltar texto

  • <span> </span> Etiqueta HTML sin ningún significado específico. Se usa conjuntamente con los atributos «class» o «id» para atribuirle ciertas características.

  • <br> Etiqueta utilizada para crear un salto de línea

Etiquetas para incrustar contenido

  • <img> Etiqueta para «pintar» una imagen en la página web.

  • <iframe> </iframe> Es una etiqueta que sirve para anidar otro documento HTML dentro del documento principal.

  • <embed> Usada para integrar una aplicación o contenido interactivo externo que no suele ser HTML.

  • <object> </object> Utilizada llamar a un recurso externo de la web. Este recurso será tratado como una imagen, o un recurso externo para ser procesado por un plugin.

  • <video> </video> Se usa para reproducir video en la página web junto a sus archivos de audio y capciones asociadas.

  • <audio> </audio> Usada para cargar en una web un archivo de audio o stream de audio.

  • <source> Permite a autores especificar recursos multimedia alternativos para las etiquetas de <video> o <audio>

  • <svg> </svg> Se usa para llamar a una imagen vectorizada.

Etiquetas para la creación de tablas

  • <table> </table> Etiquetas de apertura y cierre de una tabla. El resto de etiquetas de la tabla han de ir siempre recogidas entre estas dos etiquetas.

  • <caption> </caption> Usada para indicar el título de la tabla.

  • <colgroup> </colgroup> Etiqueta utilizada para agrupar dos o más columnas de una tabla.

  • <tbody> </tbody> Usada para describir los datos concretos de una tabla.

  • <thead> </thead> Indica el bloque de filas que describen las etiquetas de las columnas de la tabla.

  • <tfoot> </tfoot> Indica los bloques de filas que describen los resúmenes, o datos totales de una columna de una tabla.

  • <tr> </tr> Se usa para indicar una fila de celdas de una tabla.

  • <td> </td> Usada para definir una celda de una tabla.

  • <th> </th> Etiqueta que se usa para definir el encabezado de una celda

Etiquetas para la creación de formularios

  • <form> </form> Etiqueta de apertura y cierre de un formulario de una página web. El resto de etiquetas de formulario deben ir siempre recogidas entre estas etiquetas de apertura y cierre de formulario.

  • <fieldset> </fieldset> Etiqueta que representa un conjunto o agrupación de elementos de un formulario. «Pinta» un recuadro alrededor de las etiquetas que estén contenidas dentro del <fieldset>

  • <legend> </legend> Etiqueta ligada a <fieldset>. Indica el título del <fieldset>

  • <label> </label> Se usa para definir el nombre o título de un control del formulario.

  • <input> Pinta un campo de introducción de datos para el usuario. Es de las principales etiquetas de un formulario.

  • <button> </button> Etiqueta utilizada para representar un botón en el formulario.

  • <select> </select> Input que permite una selección entre un conjunto de opciones.

  • <option> </option> Etiqueta ligada a <select>. Permite añadir diferentes opciones al <select>

  • <textarea> </textarea> Añade un campo al usuario para que pueda introducir texto en unas líneas máximas de texto que el desarrollador puede definir.

Conclusión

Además de las etiquetas HTML que aquí te he mostrado, existen muchas más. Pero sinceramente, creo que con este listado de tags HTML podrás hacer el 99% de las páginas web. Y si tienes dudas con alguna etiqueta, o bien has encontrado alguna de la que no te he hablado aquí y quieres saber más, consulta la página de W3C. Como le digo a mis alumnos del curso de diseño web, son la referencia donde consultar primero cualquier duda sobre HTML y CSS.

¡Nos vemos en la próxima!







Página web básica HTML

El ejemplo siguiente muestra una página web básica HTML escrita con sintaxis HTML.

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>HTML</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="estilo.css">
</head>

<body>
  <p>Esta página web es una página HTML válida.</p>
</body>
</html>



En este código se pueden reconocer algunos bloques anidados en el que cada bloque corresponde a una etiqueta:

   <!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <title>HTML</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="estilo.css">
</head>
 
<body>
  <p>Esta página web es una página HTML válida.</p>
</body>
</html>
 

  • La primera etiqueta <!DOCTYPE ... > es obligatoria e indica el tipo de documento (DOCTYPE) de la página. Existen varios tipos de documentos que corresponden a las diferentes versiones de HTML y XHTML. El tipo "html" es el que corresponde al HTML.
  • La etiqueta <html> ...</html> engloba todo el documento html.
  • Un documento html se divide en dos partes, la cabecera <head> ...</head> y el cuerpo <body> ...</body>
    • La cabecera <head> ...</head> contiene información de identificación y control que en general no se muestra en la ventana del navegador, aunque puede afectar a la presentación (por ejemplo, los enlaces a hojas de estilo).
      • Las etiquetas <meta> están pensadas para proporcionar información sobre el documento a los programas que analicen la página y por ello existen muchas etiquetas <meta> diferentes. Por ejemplo, la etiqueta <meta name="keywordscontent="..."> está pensada para informar a los buscadores de los temas tratados en la página pero, por desgracia, se ha abusado mucho de esta etiqueta así que los buscadores no la toman prácticamente en cuenta).
        • La primera etiqueta <meta> del ejemplo informa del juego de caracteres empleado en la página, en este caso UTF-8.
        • La segunda etiqueta <meta> del ejemplo se utiliza para mejorar la presentación de las páginas webs en las pantallas de los teléfonos móviles y, en general, en las pantallas de alta densidad.
      • La etiqueta de título <title> ...</title> es obligatoria y debe incluirse en todas las páginas web. Contiene el texto que se muestra en la pestaña del navegador, como muestra el siguiente ejemplo. Si el texto es largo, la pestaña sólo mostrará el principio, pero situando el ratón sobre la pestaña, el texto completo se mostrará en una pequeña ventana flotante.