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!
La etiqueta HTML <datalist>
Mediante la etiqueta <datalist> podemos crear listas de datos predefinidas para incluir en otras etiquetas HTML, potenciando dichas etiquetas.
Estilos CSS y Javascript
En un documento SVG, al igual que en un documento HTML, podemos utilizar etiquetas <style> y <script> para añadir estilos CSS y código Javascript. Te lo explico.
Agrupaciones
La etiqueta <g> de SVG nos permite agrupar varias etiquetas para aplicar características en conjunto o para reutilizar estructuras.
Flechas (markers)
Los elementos <marker> nos permiten crear flechas o marcadores en el inicio, final o uniones de los trayectos o trazos de ciertas formas. Te explico como funciona.
Rellenos (fill)
Los atributos fill nos permiten indicar como será el relleno de una forma o elemento, ya sea color, opacidad u otros aspectos.
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.
El atributo pattern (RegExp)
En HTML5 es posible realizar validaciones de cliente para intentar que el usuario escriba correctamente la información en los campos de texto, sin Javascript.
La etiqueta HTML <h1> ... <h6>
Mediante las etiquetas <h1>, <h2>, <h3>, <h4>, <h5> y <h6> puedes establecer titulares con diferentes grados de importancia. Explicamos como funcionan.
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>.
Plantillas reutilizables (símbolos)
Mediante los símbolos podemos crear plantillas reutilizables para nuestros SVG, de forma que podamos reutilizar código.
La etiqueta HTML <time> y <data>
¿Qué etiqueta necesitaríamos usar para representar una fecha o ciertos datos en un documento web? En esta página te explico cuales existen y como usarlas.
¿Qué son las etiquetas head?
La primera parte de un documento HTML es la cabecera, la etiqueta head. En ella podemos establecer relaciones con otros documentos o archivos.
Patrones en trazos
Los atributos stroke-dasharray y stroke-dashoffset sirven para establecer patrones de repetición en los trazos e incluso animarlos.
La etiqueta HTML <div>
Descubre todo sobre la etiqueta HTML div. Agrupaciones y divisiones de secciones de código en capas o grupos relacionados. Formas de uso y ejemplos.
La etiqueta HTML <meter>
En HTML5 se incluyen nuevas etiquetas que permiten crear facilmente medidores y barras de progreso que indiquen información al usuario.
Textos en SVG
En SVG se pueden utilizar varias etiquetas para indicar textos, como <text> o <tspan>. Cada una con un propósito diferente. Te explico mo utilizarlas.
La etiqueta HTML <select>
Si deseas mostrar una lista de opciones y que el usuario seleccione la más apropiada, necesitas una etiqueta select.
La etiqueta HTML <address>
Mediante la etiqueta <address> podemos definir información de contacto, no sólo virtual como un correo, sino también física, como una ubicación.
Trayectos lineales
Mediante la etiqueta <path> se pueden realizar trayectos personalizados, y es una de las etiquetas más potentes de SVG. Te explico como funciona.
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