Lenguaje HTML
HTML es un lenguaje de marcado mediante el cuál se estructura la base y contenido de cualquier página web. A continuación aprenderás, no sólo los detalles principales de HTML, sino también de sus temáticas relacionadas como posicionamiento SEO, accesibilidad, usabilidad, compatibilidad entre navegadores, etc.
Comienza a aprender
¿...o prefieres un roadmap?
Comienza a practicar
¿Ya sabes la teoría? ¡Es hora de ponerse a practicar!
Textos en trayectos
En algún caso nos podría interesar añadir textos que sigan un trayecto particular. Para ello se combinan dos etiquetas que explicaremos en esta sección.
La etiqueta HTML <code>
Es posible que necesitemos indicar un fragmento de código literalmente en un documento. Te explico el funcionamiento de la etiqueta <code>.
La etiqueta <base>
La etiqueta <base> sirve para modificar la URL de los enlaces relativos de una página. También es posible que indicar si queremos que se abra en otra pestaña los enlaces.
La etiqueta HTML <input>
Los campos de entrada de texto de un formulario son necesarios para que el usuario introduzca información. Veamos que tipos hay.
Rectángulos y cuadrados
SVG permite crear formas básicas como rectángulos o cuadrados mediante la etiqueta <rect>. Aprende como funciona y que atributos puedes utilizar.
Forma del trazo
Mediante el atributo stroke-linecap y algunos otros, podemos indicar la forma que tendrá el trazo de una figura. Te explico como utilizarla.
Estructura de una etiqueta HTML
Descubre los atributos comunes en HTML5 que puedes utilizar en casi cualquier etiqueta. Conoce cuáles son y cómo aplicarlos correctamente en tus proyectos web.
Organización de campos
Existen una serie de etiquetas para organizar y relacionar textos y campos de un formulario, tanto semánticamente como visualmente.
Líneas y polígonos
SVG permite dibujar líneas, líneas múltiples o formas poligonales, tanto abiertas como cerradas. En este artículo te explico como entender el código para hacerlo.
Elemento o etiqueta SVG
El elemento SVG es la etiqueta padre contenedora que contiene a toda la imagen vectorial. Siempre debe ser la etiqueta raíz.
Patrones en trazos
Los atributos stroke-dasharray y stroke-dashoffset sirven para establecer patrones de repetición en los trazos e incluso animarlos.
Trazos (stroke)
Mediante el atributo stroke de SVG podemos indicar trazos en las diferentes figuras o formas creadas, con un color, grosor, estilo, opacidad, etc...
Agrupaciones
La etiqueta <g> de SVG nos permite agrupar varias etiquetas para aplicar características en conjunto o para reutilizar estructuras.
Invocadores HTML (Invokers)
Los invokers HTML nos permiten invocar funciones desde HTML sin necesidad de utilizar Javascript, muy útiles para ventanas de diálogo o elementos emergentes (popovers).
Transformaciones SVG
En SVG puedes realizar transformaciones SVG, que son muy similares a las de CSS, pero con algunas diferencias.
Círculos y elipses
SVG incorpora varias etiquetas para crear círculos y ellipses u óvalos de una forma muy sencilla. Los explicamos en este artículo.
Trayectos relativos
Es muy común que los trayectos de una imagen SVG se creen con etiquetas <path> con coordenadas absolutas, pero también podemos utilizar coordenadas relativas. Te lo explico.
La etiqueta HTML <audio>
¿Cómo colocar música o audio en una página HTML? ¿Qué formatos de audio debo utilizar?
La etiqueta HTML <mark>
En algunas ocasiones necesitaremos destacar textos como cuando utilizamos rotulares de colores. La etiqueta mark sirve para ello.
Videos
¿Prefieres contenido de video? ¡Echa un vistazo a mi canal!
¿Quién soy yo?
Soy Manz, vivo en Tenerife (España) y soy streamer partner en Twitch y profesor. Me apasiona el universo de la programación web, el diseño y desarrollo web y la tecnología en general. Aunque soy full-stack, mi pasión es el front-end, la terminal y crear cosas divertidas y locas.
Puedes encontrar más sobre mi en Manz.dev