Extractor de Recursos HTML, Imágenes y Markdown

Analiza HTML en bruto en busca de scripts, hojas de estilo, imágenes y enlaces. Incluye URLs de imágenes de fondo en línea de atributos style y etiquetas style — también extrae el texto visible de la página como Markdown limpio, útil para leer artículos detrás de paywalls simples del lado del cliente.

Cargando simulación interactiva...

Algorithmic Parsing of Document Object Models 🖖

Extracting embedded assets from HTML requires recursive traversal of the Document Object Model tree structure. By utilizing precise regular expressions and tag-specific targeting, the algorithm segregates image URIs and structural elements. It then algorithmically converts hierarchical nodes into equivalent Markdown syntax. This systematic reduction process efficiently transforms a complex, nested presentation language into a streamlined, logically ordered plain-text mathematical structure.

Las imágenes se esconden en más que etiquetas img 🖖

Mucha gente cree que una imagen web vive siempre en una etiqueta `<img>`, pero los navegadores también pintan imágenes a partir de reglas CSS `background-image`, listas responsivas `srcset`, etiquetas `<meta>` de vista previa e incluso arrays dentro de JavaScript. Esta herramienta rastrea todos esos lugares a la vez. La conclusión práctica: una foto que ves claramente en pantalla puede no tener ninguna etiqueta `<img>` — la dibuja una hoja de estilos, y por eso a veces falla 'clic derecho, guardar imagen'.

Un muro de pago blando oculta texto ya enviado 🖖

Muchos muros de 'suscríbete para seguir leyendo' son puro teatro. El artículo completo suele venir ya en el HTML de la página y solo queda tapado por una superposición o un desenfoque — las palabras cruzaron la red antes de que te pidieran pagar. Como este extractor lee el texto visible directamente del marcado analizado y lo convierte en Markdown, ese contenido reaparece intacto. Es un recordatorio de que ocultar algo con CSS no es lo mismo que retenerlo.

Problemas de ejemplo

  • galería responsiva - Página de aterrizaje con un bloque JSON-LD ImageObject de schema.org y un <img srcset> responsivo: muestra la extracción de imágenes a partir de datos estructurados, además de la deduplicación de variantes de resolución de una misma imagen.
  • fondos CSS - Página cuyas únicas imágenes están en declaraciones CSS background-image, una dentro de un bloque <style> y otra en un atributo style en línea: el tipo de recurso que un simple escaneo de <img> pasaría por alto.
  • carrusel generado por JS - Carrusel de imágenes construido enteramente en tiempo de ejecución por JavaScript, sin etiquetas <img> en el marcado: muestra cómo el extractor recupera las URL de las imágenes a partir de un simple arreglo literal de JS dentro de un bloque <script>.