NorfiPC
WordPress

Solucionar advertencias al validar el código HTML de WordPress

Como eliminar el atributo “type” de los scripts y “role” de varios elementos del código de mi blog, para que validen correctamente mis páginas en Validador del W3C.
Solucionar advertencias al validar el código HTML de WordPress
Al tratar de validar el código de las páginas de nuestro sitio de WordPress en el Validador HTML del W3C, el oficial, recibiremos varios mensajes de advertencia.
Aunque no se trata de errores, esto nos molesta a los más exigentes y detallistas, los que deseamos que la validación sea completamente correcta.
Como todos sabemos, de esa forma nos aseguramos que las páginas de nuestro sitio, se vean correctamente en cualquier lector o dispositivo.
En este artículo comparto como yo he resuelto esta situación.



Advertencias del Validador HTML en páginas de WordPress

Las advertencias más comunes al tratar de validar el HTML de las páginas de nuestro blog, son las siguientes.

Atributo type innecesario

“Warning: The type attribute is unnecessary for JavaScript resources”.
Advertencia del uso del atributo type en el Validador HTML
Se debe a que el atributo “type” ya no es necesario y resulta obsoleto, en las etiquetas script, tanto como en las <style></style>.
Se considera que un script aunque no se declare su tipo, el valor predeterminado es javascript.
Atributos obsoletos e innecesarios en HTML



Propiedad role es innecesaria

“Warning: The banner role is unnecessary for element XXXXX”.
Advertencia del uso del atributo role en el Validador HTML



Como eliminar el atributo type de los scripts automáticamente

Usando un script se puede remover el atributo “type” de todas las etiquetas scripts y al mismo tiempo eliminar algo de peso extra al HTML de las páginas.
Para eso se debe agregar las siguientes instrucciones al archivo “functions.php” en el tema Child o en un plugin personal.
Usa cualquiera de los enlaces anteriores para conocer como usar estos métodos.
//Eliminar atributos type en etiquetas scripts y style
add_action('wp_loaded', 'output_buffer_start');
function output_buffer_start() { 
    ob_start("output_callback"); 
}
add_action('shutdown', 'output_buffer_end');
function output_buffer_end() { 
 if (ob_get_length() > 0) { ob_end_clean();}
 }
function output_callback($buffer) {
    return preg_replace( "%[ ]type=[\'\"]text\/(javascript|css)[\'\"]%", '', $buffer );
}
El código anterior elimina tanto la propiedad “type” de los scripts, como de las etiquetas “style”.



Eliminar la propiedad role del HTML en WordPress

No he encontrado ningún método de eliminar del código HTML la propiedad “role”, la que es completamente innecesaria.
Por eso la he removido manualmente, del código fuente de las plantillas del tema Twenty Seventeen que uso.
Para eso lógicamente es necesario hacer previamente una copia de todos los archivos que relaciono y situarlos en el tema Child.
Los archivos que se necesita modificar son los siguientes.
header.php – Se debe eliminar role=”banner” de la etiqueta <header>.
footer.php – Eliminar role=”contentinfo” de la etiqueta <footer>.
front-page.php – Eliminar role=”main” de la etiqueta <main> .
navigation-top.php (situado en template-parts/navigation ) – Eliminar role=”navigation” de la etiqueta <nav>.
sidebar.php – Eliminar role=”complementary” de la etiqueta <aside>.
single.php – Eliminar role=”main” de la etiqueta <main>.



Validación correcta del HTML

Después de las acciones anteriores, mi blog valida correctamente en el Validador HTML, sin ninguna advertencia, ni error.
Validación correcta en el Validador HTML
Espero que a los más exigentes les ayude esta publicación.
Usa el siguiente enlace para comprobar su correcta validación: Validar en Html Checker.

Otras páginas relacionadas

Como modificar y personalizar mi tema de WordPress
Como usar y configurar WordPress sin plugins
Convertir los enlaces externos en NoFollow en WordPress


Comparte