Validación HTML: No se permite el atributo "xmlns:serif" aquí.

Acerca de este problema HTML

En HTML5, los únicos atributos de namespace reconocidos en elementos SVG son xmlns (para el namespace SVG) y xmlns:xlink (para XLink, aunque xlink está ahora ampliamente obsoleto en favor de atributos planos). Cualquier otra declaración de namespace personalizada — como xmlns:serif, xmlns:inkscape, o xmlns:sketch — no está permitida por la especificación HTML y provocará un error de validación.

Las herramientas de diseño como Affinity Designer, Adobe Illustrator, Inkscape y Sketch a menudo incluyen declaraciones de namespace propietarias y atributos de metadatos en los archivos SVG exportados. Estos sirven como marcadores internos para la aplicación de diseño (por ejemplo, para preservar nombres de capas o configuraciones específicas del editor) pero no tienen significado en un navegador web. Los navegadores simplemente los ignoran, por lo que añaden bytes innecesarios a tu página sin proporcionar ningún beneficio.

Eliminar estos atributos es importante por varias razones:

Cumplimiento de estándares: El analizador HTML5 tiene una lista fija de declaraciones de namespace permitidas. Las personalizadas violan la especificación.
Marcado limpio: Los metadatos propietarios inflan tus archivos SVG con información que solo importa dentro de la herramienta de diseño original.
Mantenibilidad: Eliminar artefactos específicos de herramientas hace que tus SVG sean más fáciles de leer, editar y optimizar.

Para solucionarlo, abre tu archivo SVG (o el archivo HTML que contiene SVG en línea) y elimina el atributo xmlns:serif del elemento <svg>. También deberías buscar y eliminar cualquier atributo con prefijo serif: (como serif:id) a lo largo del SVG, ya que estos dependen de la declaración de namespace ahora eliminada.

Para un enfoque más automatizado, considera usar SVGO o herramientas similares de optimización SVG, que eliminan los metadatos del editor y las declaraciones de namespace innecesarias por defecto.

Ejemplos

Incorrecto — atributo de namespace personalizado presente

<svg xmlns="http://www.w3.org/2000/svg"
  xmlns:serif="https://www.serif.com/"
  viewBox="0 0 100 100">
  <circle serif:id="MainCircle" cx="50" cy="50" r="40" fill="blue" />
</svg>

Esto provoca dos tipos de errores: xmlns:serif no está permitido en el elemento <svg>, y serif:id no es un atributo reconocido en <circle>.

Correcto — namespace personalizado y atributos con prefijo eliminados

<svg xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 100 100">
  <circle cx="50" cy="50" r="40" fill="blue" />
</svg>

Incorrecto — múltiples namespaces propietarios

Las herramientas de diseño a veces añaden varios namespaces personalizados a la vez:

<svg xmlns="http://www.w3.org/2000/svg"
  xmlns:serif="https://www.serif.com/"
  xmlns:xlink="http://www.w3.org/1999/xlink"
  viewBox="0 0 200 200">
  <g serif:id="Layer1">
    <rect x="10" y="10" width="80" height="80" fill="red" />
  </g>
</svg>

Correcto — solo namespaces estándar conservados

<svg xmlns="http://www.w3.org/2000/svg"
  viewBox="0 0 200 200">
  <g>
    <rect x="10" y="10" width="80" height="80" fill="red" />
  </g>
</svg>

Ten en cuenta que xmlns:xlink también fue eliminado en este ejemplo. Aunque no siempre provocará un error de validación por sí mismo, es innecesario si no se usan atributos xlink:href — y el uso moderno de SVG en HTML5 favorece href plano sobre xlink:href de todos modos.