De Word a HTML limpio

Qué contiene de verdad el portapapeles

Cuando copias en Word, el portapapeles recibe varias versiones de tu selección a la vez. Una es texto sin formato. Otra es HTML, y esa es la que toma un editor web cuando pegas.

El HTML de Word describe cómo se veía la página en tu pantalla. Un solo párrafo llega así:

<p class="MsoNormal" style="margin-bottom:8.0pt;line-height:107%">
  <span style="font-size:11.0pt;font-family:&quot;Calibri&quot;,sans-serif">Hello<o:p></o:p></span>
</p>

Además viene una hoja de estilos de varios cientos de líneas, comentarios condicionales y etiquetas del vocabulario propio de Office. Google Docs es más corto pero no más limpio. Todo va dentro de un contenedor con un identificador docs-internal-guid, y el texto en negrita es un span con font-weight:700. Una vez en un sitio web, esos estilos en línea se imponen al diseño del propio sitio, por eso cada artículo pegado se ve un poco distinto del anterior.

Qué se conserva, se convierte y se elimina

Los títulos siguen una sola regla. El resultado solo usa los niveles 2 a 4, porque en la mayoría de los sitios el título de la página ya ocupa el nivel 1. Si tu documento contiene un Título 1 o un Título, todos los encabezados bajan un escalón. Todo lo que esté por debajo del nivel 4 pasa a ser nivel 4.

Un espacio de no separación solo sobrevive donde tiene una función: antes de ; : ! ? % o de un signo de moneda, y entre una cifra y lo que le sigue. Todos los demás pasan a ser espacios normales.

Cómo leer el resumen

Tras pegar, la primera línea nombra el origen que la herramienta reconoció por huellas en el marcado (Word, Google Docs, LibreOffice u otro) y muestra el tamaño del código antes y después. Una reducción del 80 al 95 por ciento es normal en Word.

Debajo aparecen los recuentos de estilos en línea y clases eliminados, y de listas falsas reconstruidas. Dos líneas te piden que hagas algo:

• Imágenes eliminadas. Una imagen pegada desde Word apunta a un archivo temporal de tu propio ordenador, y una de Google Docs a una dirección que caduca. Tus visitantes no verían ninguna de las dos. Sube la imagen en el editor de tu sitio y escribe allí su texto alternativo.
• Párrafos enteros en negrita. Un párrafo corto (de menos de 90 caracteres) que está en negrita de principio a fin suele ser un título que alguien escribió como texto en negrita. La herramienta no adivina el nivel por ti. Conviértelo en un título de verdad para que los buscadores y los lectores de pantalla vean el esquema.

Dos formas de llevarte el resultado

Copiar para el editor

Pone el contenido limpio en el portapapeles como texto enriquecido. Pégalo en el editor de bloques de WordPress y cada título, párrafo, lista y tabla se convierte en su propio bloque. La mayoría de los editores visuales lo tratan igual.

Código HTML

El código fuente, con sangría y legible. Úsalo en un bloque de HTML personalizado, en la vista de código de un servicio de boletines o en una plantilla.

Si el portapapeles no contiene HTML en absoluto, por ejemplo con texto copiado de una terminal o de un editor de texto sin formato, las líneas en blanco pasan a ser saltos de párrafo y los saltos de línea simples pasan a ser <br>.

Lo que se pierde a propósito

Los colores, el resaltado, la alineación, la sangría, los tamaños de fuente y los diseños en columnas se descartan. También los comentarios y los cuadros de texto. Los enlaces a marcadores dentro del archivo de Word, como las referencias de notas al pie y las entradas del índice, pierden el enlace y conservan el texto. Los bordes de tabla y los anchos de columna también desaparecen, y es tu sitio quien decide cómo se ven las tablas. El ajuste opcional de tipografía está pensado para textos escritos en francés y debe quedar desactivado para otros idiomas.