Los valores son estimaciones y pueden variar. La puntuación del rendimiento se calcula directamente a partir de estas métricas.Ver calculadora.
0–49 50–89 90–100
Métricas
First Contentful Paint
6,8 s
El primer renderizado con contenido indica el momento en el que se renderiza el primer texto o la primera imagen. Más información sobre la métrica Primer renderizado con contenido
Renderizado del mayor elemento con contenido
11,0 s
El renderizado del mayor elemento con contenido indica el tiempo que se tarda en dibujar el texto o la imagen de mayor tamaño. Más información sobre la métrica Renderizado del mayor elemento con contenido
Total Blocking Time
1070 ms
Suma de los periodos, en milisegundos, entre FCP y Time to Interactive cuando la duración de la tarea excede los 50 ms. Más información sobre la métrica Total Blocking Time
Cambios de diseño acumulados
0.1
Los cambios de diseño acumulados miden el movimiento de los elementos visibles dentro del viewport. Más información sobre la métrica Cambios de diseño acumulados
Speed Index
8,5 s
Speed Index indica la rapidez con la que se puede ver el contenido de una página. Más información sobre la métrica Speed Index
Mostrar auditorías relacionadas con:
Diagnósticos
Minimiza el trabajo del hilo principal 2,7 s
Te recomendamos que reduzcas el tiempo de análisis, compilación y ejecución de JavaScript. Para ello, puedes utilizar cargas útiles de JavaScript más pequeñas. Consulta cómo minimizar el trabajo del hilo principalTBT
Categoría | Duración |
---|---|
Script Evaluation | 1247 ms |
Other | 936 ms |
Rendering | 302 ms |
Style & Layout | 178 ms |
Parse HTML & CSS | 20 ms |
Script Parsing & Compilation | 17 ms |
Renderizado del mayor elemento con contenido 10.950 ms
Este es el mayor elemento con contenido renderizado en el viewport. Más información sobre el renderizado del mayor elemento con contenidoLCP
Elemento |
---|
Do better web tester page <h2 id="toppy" style="background-image:url('');"> |
Fase | Porcentaje de LCP | Tiempos |
---|---|---|
TTFB | 0% | 10 ms |
Retraso de carga | 73% | 7960 ms |
Tiempo de carga | 27% | 2920 ms |
Retraso de renderizado | 1% | 60 ms |
Usa un tamaño adecuado para las imágenes Ahorro potencial de 456 KiB
Muestra imágenes con un tamaño adecuado para ahorrar datos móviles y mejorar el tiempo de carga. Consulta cómo cambiar el tamaño de las imágenesFCPLCP
Sube imágenes directamente a la biblioteca multimedia para asegurarte de que estén disponibles los tamaños de imagen necesarios y, después, insértalas desde esa biblioteca multimedia o utiliza el widget de imagen para usar los tamaños de imagen óptimos (incluidos los tamaños de los puntos de interrupción adaptables). Evita usar imágenes
Full Size
, a no ser que las dimensiones sean las adecuadas para su uso. Más informaciónURL | Tamaño del recurso | Ahorro potencial | |
---|---|---|---|
localhost Propio | 550,3 KiB | 456,2 KiB | |
body > img <img src="lighthouse-1024x680.jpg?iar1" width="120" height="15"> | /dobetterweb/lighthouse-1024x680.jpg?iar1 (localhost) | 110,1 KiB | 109,2 KiB |
body > img <img loading="lazy" src="lighthouse-1024x680.jpg?iar2" width="120" height="80" fetchpriority="low"> | /dobetterweb/lighthouse-1024x680.jpg?iar2 (localhost) | 110,1 KiB | 105,4 KiB |
body > img <img src="lighthouse-1024x680.jpg?isr2" width="120" height="80" style="position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg?isr2 (localhost) | 110,1 KiB | 105,4 KiB |
body > img <img src="lighthouse-1024x680.jpg?isr3" width="360" height="240" style="image-rendering: pixelated; position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg?isr3 (localhost) | 110,1 KiB | 68,1 KiB |
body > img <img src="http://localhost:10200/dobetterweb/lighthouse-1024x680.jpg" srcset="lighthouse-1024x680.jpg 2x" width="360" height="240" style="position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg (localhost) | 110,1 KiB | 68,1 KiB |
Habilita la compresión de texto Ahorro potencial de 143 KiB
Los recursos de texto se deberían publicar comprimidos (gzip, deflate o brotli) para minimizar el total de bytes de la red. Más información sobre la compresión de textoFCPLCP
Puedes habilitar la compresión de texto en la configuración de tu servidor web.
URL | Tamaño de la transferencia | Ahorro potencial |
---|---|---|
localhost Propio | 179,8 KiB | 143,4 KiB |
…third_party/aggressive-promise-polyfill.js (localhost) | 162,4 KiB | 131,7 KiB |
/dobetterweb/dbw_tester.html (localhost) | 17,4 KiB | 11,7 KiB |
Publica imágenes con formatos de próxima generación Ahorro potencial de 312 KiB
Los formatos como WebP y AVIF suelen comprimir mejor las imágenes que los formatos PNG o JPEG, lo que hace que se descarguen más rápido y consuman menos datos. Más información sobre formatos de imagen modernosFCPLCP
Puedes usar el complemento Performance Lab para convertir automáticamente las imágenes JPEG que subas a WebP siempre que sea posible.
URL | Tamaño del recurso | Ahorro potencial | |
---|---|---|---|
localhost Propio | 708,5 KiB | 312,3 KiB | |
body > img <img src="lighthouse-1024x680.jpg?iar1" width="120" height="15"> | /dobetterweb/lighthouse-1024x680.jpg?iar1 (localhost) | 110,1 KiB | 47,8 KiB |
body > img <img src="lighthouse-1024x680.jpg?isr2" width="120" height="80" style="position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg?isr2 (localhost) | 110,1 KiB | 47,8 KiB |
body > img <img src="lighthouse-1024x680.jpg?isr3" width="360" height="240" style="image-rendering: pixelated; position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg?isr3 (localhost) | 110,1 KiB | 47,8 KiB |
body > img <img src="http://localhost:10200/dobetterweb/lighthouse-1024x680.jpg" srcset="lighthouse-1024x680.jpg 2x" width="360" height="240" style="position: absolute;"> | /dobetterweb/lighthouse-1024x680.jpg (localhost) | 110,1 KiB | 47,8 KiB |
body > img <img loading="lazy" src="lighthouse-1024x680.jpg?iar2" width="120" height="80" fetchpriority="low"> | /dobetterweb/lighthouse-1024x680.jpg?iar2 (localhost) | 110,1 KiB | 47,8 KiB |
110,1 KiB | 47,8 KiB | ||
body > img <img src="lighthouse-480x318.jpg?isr1" width="400" height="360" style="position: absolute;"> | /dobetterweb/lighthouse-480x318.jpg?isr1 (localhost) | 24,0 KiB | 12,7 KiB |
/dobetterweb/lighthouse-480x318.jpg?async (localhost) | 24,0 KiB | 12,7 KiB |
Minifica los recursos JavaScript Ahorro potencial de 81 KiB
Si minificas los archivos de JavaScript, se puede reducir el tamaño de la carga útil y el tiempo de análisis de la secuencia de comandos. Consulta cómo minificar JavaScriptFCPLCP
Hay varios complementos de WordPress que pueden concatenar, minificar y comprimir tus secuencias de comandos para acelerar tu sitio web. Te recomendamos que, si es posible, uses un proceso de creación para realizar la minificación de forma anticipada.
URL | Tamaño de la transferencia | Ahorro potencial |
---|---|---|
localhost Propio | 162,4 KiB | 81,5 KiB |
…third_party/aggressive-promise-polyfill.js (localhost) | 162,4 KiB | 81,5 KiB |
Reduce el contenido JavaScript que no se use Ahorro potencial de 92 KiB
Reduce el contenido JavaScript que no se use y retrasa la carga de secuencias de comandos hasta que se necesiten. Así, se reducirán los bytes consumidos por la actividad de red. Consulta cómo reducir el contenido de JavaScript que no se useFCPLCP
Puedes reducir o cambiar la cantidad de complementos de WordPress que cargan código de JavaScript sin usar en tu página. Para identificar los complementos que añaden código de JavaScript externo, ejecuta la cobertura de código en DevTools de Chrome. Puedes identificar el tema o complemento concreto en la URL de la secuencia de comandos. Presta atención a los complementos con varias secuencias de comandos en la lista y con muchos elementos en rojo en la cobertura de código. Un complemento solo debería poner en cola una secuencia de comandos (si esta se usa en la página).
URL | Tamaño de la transferencia | Ahorro potencial |
---|---|---|
localhost Propio | 162,4 KiB | 92,0 KiB |
…third_party/aggressive-promise-polyfill.js (localhost) | 162,4 KiB | 92,0 KiB |
Evita usar JavaScript antiguo en navegadores modernos Ahorro potencial de 26 KiB
Los polyfills y los transforms permiten que los navegadores antiguos utilicen las nuevas funciones de JavaScript. Sin embargo, muchos de estos polyfills y transforms no son necesarios para los navegadores modernos. Para tu JavaScript empaquetado, adopta una estrategia moderna de implementación de secuencias de comandos usando la detección de funciones module/nomodule para reducir la cantidad de código que se envía a los navegadores modernos sin perder la compatibilidad con los navegadores antiguos. Consulta cómo utilizar JavaScript modernoFCPLCP
URL | Ahorro potencial | |
---|---|---|
localhost Propio | 26,0 KiB | |
…third_party/aggressive-promise-polyfill.js (localhost) | 26,0 KiB | |
Object.defineProperty | ||
Object.defineProperties |
La página ha impedido la restauración de la caché de páginas completas 1 motivo del error
Muchos desplazamientos consisten en volver a una página anterior o regresar a una página posterior. La caché de páginas completas (bfcache) puede acelerar estos desplazamientos de regreso. Más información sobre la caché de páginas completas
Motivo del error | Tipo de error |
---|---|
La página tiene un controlador de descarga en el marco principal. | Se puede solucionar |
/dobetterweb/dbw_tester.html (localhost) |
Precargar la imagen de renderizado del mayor elemento con contenido Ahorro potencial de -40 ms
Si el elemento LCP se añade de forma dinámica a la página, tendrás que precargar la imagen para mejorar el LCP. Más información sobre cómo precargar los elementos LCPLCP
URL | Ahorro potencial | |
---|---|---|
localhost Propio | -40 ms | |
Do better web tester page <h2 id="toppy" style="background-image:url('');"> | -40 ms |
Los elementos de imagen no tienen width
y height
explícitos
width
y height
explícitos En los elementos de imagen, especifica un ancho y una altura explícitos para reducir los cambios de diseño y mejorar el CLS. Consulta cómo configurar las dimensiones de una imagenCLS
URL | |
---|---|
localhost Propio | |
body > img <img src="blob:http://localhost:10200/fa49e413-bc80-4876-b31d-38a24f51cff7"> | blob:http://localhost:10200/fa49e413-bc80-4876-b31d-38a24f51cff7 |
body > img <img src="filesystem:http://localhost:10200/temporary/empty-0.9307734889843826.png"> | filesystem:http://localhost:10200/temporary/empty-0.9307734889843826.png |
Usa formatos de vídeo para incluir contenido animado Ahorro potencial de 666 KiB
Los GIFs de gran tamaño no son eficientes para mostrar contenido animado. Para usar menos bytes de la red, te recomendamos que utilices los formatos de vídeo MPEG4 o WebM para incluir animaciones y los formatos PNG o WebP para añadir imágenes estáticas en lugar del formato GIF. Más información sobre formatos de vídeo eficientesFCPLCP
Considera subir tu GIF a un servicio que permita insertarlo como un vídeo HTML5.
URL | Tamaño del recurso | Ahorro potencial |
---|---|---|
localhost Propio | 912,4 KiB | 666,0 KiB |
/dobetterweb/lighthouse-rotating.gif (localhost) | 912,4 KiB | 666,0 KiB |
Publica recursos estáticos con una política de caché eficaz Se han encontrado 20 recursos
Una duración en caché más larga puede aumentar el número de visitas repetidas a tu página. Más información sobre las políticas de caché eficaces
Consulta más información sobre el almacenamiento en la memoria caché del navegador en WordPress.
URL | Tiempo de vida en caché | Tamaño de la transferencia |
---|---|---|
localhost Propio | 1791 KiB | |
/dobetterweb/lighthouse-rotating.gif (localhost) | None | 913 KiB |
…third_party/aggressive-promise-polyfill.js (localhost) | None | 163 KiB |
/dobetterweb/lighthouse-1024x680.jpg (localhost) | None | 110 KiB |
/dobetterweb/lighthouse-1024x680.jpg?iar1 (localhost) | None | 110 KiB |
/dobetterweb/lighthouse-1024x680.jpg?iar2 (localhost) | None | 110 KiB |
/dobetterweb/lighthouse-1024x680.jpg?isr2 (localhost) | None | 110 KiB |
/dobetterweb/lighthouse-1024x680.jpg?isr3 (localhost) | None | 110 KiB |
None | 110 KiB | |
/dobetterweb/lighthouse-480x318.jpg?async (localhost) | None | 24 KiB |
/dobetterweb/lighthouse-480x318.jpg?isr1 (localhost) | None | 24 KiB |
None | 1 KiB | |
/dobetterweb/dbw_tester.css?delay=100 (localhost) | None | 1 KiB |
None | 1 KiB | |
/dobetterweb/dbw_tester.css?delay=2200 (localhost) | None | 1 KiB |
None | 1 KiB | |
None | 1 KiB | |
None | 1 KiB | |
/dobetterweb/dbw_tester.js (localhost) | None | 0 KiB |
/dobetterweb/empty_module.js?delay=500 (localhost) | None | 0 KiB |
/dobetterweb/empty.css (localhost) | None | 0 KiB |
No usa listeners pasivos para mejorar el desplazamiento
Se recomienda que los procesadores de eventos táctiles y de la rueda sean
passive
para mejorar el desplazamiento de tu página. Más información sobre cómo adoptar procesadores de eventos pasivosFuente |
---|
localhost Propio |
/dobetterweb/dbw_tester.html:318:5 (localhost) |
Elimina los recursos que bloqueen el renderizado Ahorro potencial de 0 ms
Hay recursos que bloquean el primer renderizado de tu página. Te recomendamos que muestres los elementos de JavaScript y CSS críticos insertados y pospongas todos los que no sean esenciales. Consulta cómo eliminar recursos que bloquean el renderizadoFCPLCP
Existen varios complementos de WordPress que pueden ayudarte a insertar recursos fundamentales o posponer recursos menos importantes. Ten en cuenta que las optimizaciones que ofrecen estos complementos pueden bloquear funciones de tu tema o tus complementos, así que seguramente tengas que hacer cambios en el código.
URL | Tamaño de la transferencia | Ahorro potencial |
---|---|---|
localhost Propio | 2,4 KiB | 5140 ms |
/dobetterweb/dbw_tester.css?delay=100 (localhost) | 0,6 KiB | 730 ms |
/dobetterweb/unknown404.css?delay=200 (localhost) | 0,0 KiB | 880 ms |
/dobetterweb/dbw_tester.css?delay=2200 (localhost) | 0,6 KiB | 880 ms |
0,6 KiB | 880 ms | |
/dobetterweb/dbw_tester.js (localhost) | 0,5 KiB | 880 ms |
/dobetterweb/fcp-delayer.js?delay=5000 (localhost) | 0,0 KiB | 880 ms |
Evitar document.write()
document.write()
Las secuencias de comandos externas inyectadas dinámicamente mediante
document.write()
pueden retrasar la carga de la página varias decenas de segundos en conexiones lentas. Consulta cómo evitar el elemento document.write()Fuente |
---|
localhost Propio |
/dobetterweb/dbw_tester.html:285:11 (localhost) |
/dobetterweb/dbw_tester.html:286:11 (localhost) |
/dobetterweb/dbw_tester.html:287:11 (localhost) |
Tiempo de ejecución de JavaScript 1,3 s
Te recomendamos que reduzcas el tiempo de análisis, compilación y ejecución de JavaScript. Para ello, puedes utilizar cargas útiles de JavaScript más pequeñas. Consulta cómo reducir el tiempo de ejecución de JavaScriptTBT
URL | Tiempo de CPU total | Evaluación de la secuencia de comandos | Análisis de la secuencia de comandos |
---|---|---|---|
localhost Propio | 2273 ms | 1238 ms | 17 ms |
/dobetterweb/dbw_tester.html (localhost) | 2176 ms | 1150 ms | 8 ms |
…third_party/aggressive-promise-polyfill.js (localhost) | 96 ms | 88 ms | 9 ms |
No atribuible | 412 ms | 4 ms | 0 ms |
Unattributable | 412 ms | 4 ms | 0 ms |
Evita tareas largas del hilo principal 3 tareas largas encontradas
Enumera las tareas más largas del hilo principal, lo que es útil para identificar las que más contribuyen a la latencia. Consulta cómo evitar tareas largas del hilo principalTBT
URL | Hora de inicio | Duración |
---|---|---|
localhost Propio | 1290 ms | |
/dobetterweb/dbw_tester.html (localhost) | 6871 ms | 1121 ms |
…third_party/aggressive-promise-polyfill.js (localhost) | 7996 ms | 98 ms |
/dobetterweb/dbw_tester.html (localhost) | 6800 ms | 71 ms |
Evitar cambios de diseño importantes 2 cambios de diseño detectados
Estos son los mayores cambios de diseño que se han observado en la página. Cada entrada de la tabla representa un solo cambio de diseño y muestra el elemento que más ha cambiado. Debajo de cada elemento se indican las posibles causas que han provocado el cambio de diseño. Puede que algunos de estos cambios de diseño no se incluyan en el valor de la métrica de CLS debido a la normalización. Descubre cómo mejorar el CLSCLS
Elemento | Puntuación del cambio de diseño |
---|---|
Do better web tester page
Hi there! <div> | 0,060 |
Una solicitud de red tardía ha cambiado el diseño de la página | |
Do better web tester page
Hi there! <div> | 0,039 |
Medidas y marcas de User Timing 41 tiempos de usuario
Te recomendamos que uses la API User Timing en tu aplicación para calcular su rendimiento real durante las principales experiencias de usuario. Más información sobre las marcas de User Timings
Nombre | Tipo | Hora de inicio | Duración |
---|---|---|---|
Zone | Measure | 8006,37 ms | 1,93 ms |
Zone:ZoneAwarePromise | Measure | 8009,76 ms | 2,04 ms |
Zone:toString | Measure | 8011,87 ms | 0,03 ms |
Zone:util | Measure | 8012,71 ms | 0,89 ms |
Zone:legacy | Measure | 8013,63 ms | 10,87 ms |
Zone:registerElement | Measure | 8013,75 ms | 0,75 ms |
Zone:EventTargetLegacy | Measure | 8014,63 ms | 9,87 ms |
Zone:queueMicrotask | Measure | 8024,53 ms | 0,47 ms |
Zone:timers | Measure | 8024,99 ms | 0,81 ms |
Zone:requestAnimationFrame | Measure | 8025,90 ms | 0,70 ms |
Zone:blocking | Measure | 8026,93 ms | 0,18 ms |
Zone:EventTarget | Measure | 8027,15 ms | 0,95 ms |
Zone:MutationObserver | Measure | 8028,11 ms | 1,19 ms |
Zone:IntersectionObserver | Measure | 8029,37 ms | 0,73 ms |
Zone:FileReader | Measure | 8030,24 ms | 0,76 ms |
Zone:on_property | Measure | 8031,94 ms | 59,06 ms |
Zone:customElements | Measure | 8091,10 ms | 0,91 ms |
Zone:XHR | Measure | 8092,04 ms | 0,06 ms |
Zone:geolocation | Measure | 8092,16 ms | 0,64 ms |
Zone:PromiseRejectionEvent | Measure | 8092,87 ms | 0,54 ms |
Zone | Mark | 8006,37 ms | |
Zone:ZoneAwarePromise | Mark | 8009,76 ms | |
Zone:toString | Mark | 8011,87 ms | |
Zone:util | Mark | 8012,71 ms | |
Zone:legacy | Mark | 8013,63 ms | |
Zone:defineProperty | Mark | 8013,68 ms | |
Zone:registerElement | Mark | 8013,75 ms | |
Zone:EventTargetLegacy | Mark | 8014,63 ms | |
Zone:queueMicrotask | Mark | 8024,53 ms | |
Zone:timers | Mark | 8024,99 ms | |
Zone:requestAnimationFrame | Mark | 8025,90 ms | |
Zone:blocking | Mark | 8026,93 ms | |
Zone:EventTarget | Mark | 8027,15 ms | |
Zone:MutationObserver | Mark | 8028,11 ms | |
Zone:IntersectionObserver | Mark | 8029,37 ms | |
Zone:FileReader | Mark | 8030,24 ms | |
Zone:on_property | Mark | 8031,94 ms | |
Zone:customElements | Mark | 8091,10 ms | |
Zone:XHR | Mark | 8092,04 ms | |
Zone:geolocation | Mark | 8092,16 ms | |
Zone:PromiseRejectionEvent | Mark | 8092,87 ms |
Evita las animaciones no compuestas 1 elemento animado encontrado
Las animaciones no compuestas pueden aparecer entrecortadas e incrementar el CLS. Consulta cómo evitar las animaciones no compuestasCLS
Elemento | Nombre |
---|---|
hi <div id="animated-boi"> | |
Propiedades CSS no admitidas: margin-left, height | badanim |
El tiempo de respuesta inicial del servidor fue breve El documento raíz ha tardado 0 ms
Mantén breve el tiempo de respuesta del servidor para el documento principal, puesto que todas las demás solicitudes dependen de él. Más información sobre la métrica Tiempo hasta el primer byteFCPLCP
Los temas, los complementos y las especificaciones del servidor afectan al tiempo de respuesta. Puedes buscar un tema más optimizado, seleccionar un complemento de optimización o actualizar tu servidor.
URL | Duración |
---|---|
localhost Propio | 0 ms |
/dobetterweb/dbw_tester.html (localhost) | 0 ms |
Evita cargas útiles de red de gran tamaño Tamaño total: 1827 KiB
Si la carga útil de la red es muy grande, los usuarios consumen más datos móviles y las páginas tardan más en cargarse. Consulta cómo reducir el tamaño de la carga útil
Puedes mostrar fragmentos en tus listas de entradas (por ejemplo, mediante la etiqueta "more"), reducir la cantidad de entradas que se muestran en cada página, dividir tus entradas más largas en múltiples páginas o usar un complemento para posponer la carga de los comentarios.
URL | Tamaño de la transferencia |
---|---|
localhost Propio | 1785,6 KiB |
/dobetterweb/lighthouse-rotating.gif (localhost) | 912,6 KiB |
…third_party/aggressive-promise-polyfill.js (localhost) | 162,7 KiB |
/dobetterweb/lighthouse-1024x680.jpg (localhost) | 110,3 KiB |
/dobetterweb/lighthouse-1024x680.jpg?iar1 (localhost) | 110,3 KiB |
/dobetterweb/lighthouse-1024x680.jpg?iar2 (localhost) | 110,3 KiB |
/dobetterweb/lighthouse-1024x680.jpg?isr2 (localhost) | 110,3 KiB |
/dobetterweb/lighthouse-1024x680.jpg?isr3 (localhost) | 110,3 KiB |
110,3 KiB | |
/dobetterweb/lighthouse-480x318.jpg?async (localhost) | 24,3 KiB |
/dobetterweb/lighthouse-480x318.jpg?isr1 (localhost) | 24,3 KiB |
Evita un tamaño excesivo de DOM 151 elementos
Los DOM de gran tamaño aumentan el uso de memoria, hacen que los cálculos de estilo duren más y generan costosas redistribuciones del diseño. Consulta cómo evitar un tamaño de DOM excesivoTBT
Estadística | Elemento | Valor |
---|---|---|
Total de elementos DOM | 151 | |
Profundidad máxima de DOM | body > div > svg.social-facebook > title#social-facebook-5 <title id="social-facebook-5"> | 4 |
Número máximo de elementos secundarios | body > div#shadow-root-container <div id="shadow-root-container"> | 100 |
Evita encadenar solicitudes críticas Se han encontrado 11 cadenas
Las cadenas de solicitud crítica que se muestran a continuación indican qué recursos son de alta prioridad. Te recomendamos que reduzcas la longitud de las cadenas, disminuyas el tamaño de los recursos o pospongas la descarga de recursos innecesarios para mejorar la carga de la página. Consulta cómo evitar encadenar solicitudes críticas
Latencia de ruta crítica máxima: 7963,211 ms
Navegación inicial
/dobetterweb/dbw_tester.html
(localhost)
/dobetterweb/dbw_tester.css?delay=100
- 568,125 ms, 0,65 KiB (localhost)
/dobetterweb/unknown404.css?delay=200
- 579,06 ms, 0,23 KiB (localhost)
/dobetterweb/dbw_tester.css?delay=2200
- 2203,468 ms, 0,65 KiB (localhost)
- 581,839 ms, 0,68 KiB
- 3022,122 ms, 0,65 KiB
- 3575,183 ms, 0,65 KiB
…third_party/aggressive-promise-polyfill.js
- 2337,159 ms, 162,67 KiB (localhost)
- 1062,336 ms, 0,65 KiB
/dobetterweb/dbw_tester.js
- 1141,251 ms, 0,47 KiB (localhost)
/dobetterweb/empty_module.js?delay=500
- 1150,137 ms, 0,24 KiB (localhost)
/dobetterweb/fcp-delayer.js?delay=5000
- 6157,644 ms, 0,24 KiB (localhost)
Reducir el uso de código de terceros El código de un tercero ha bloqueado el hilo principal durante 0 ms
El código externo puede afectar mucho a la velocidad de carga. Limita el número de proveedores externos redundantes e intenta cargar el código externo cuando se haya completado la carga principal de tu página. Consulta cómo minimizar el impacto de tercerosTBT
Proveedor externo | Tamaño de la transferencia | Tiempo de bloqueo del hilo principal |
---|---|---|
[::1] | 0 KiB | 0 ms |
0 KiB | 0 ms |
Auditorías aprobadas (12) Mostrar Ocultar
Auditorías aprobadas (12)
Mostrar Ocultar
Pospón la carga de imágenes que no aparecen en pantalla
Te recomendamos que uses la carga en diferido con imágenes ocultas y que no aparecen en pantalla una vez que todos los recursos críticos hayan terminado de cargarse para reducir el tiempo que pasa hasta que la página es interactiva. Consulta cómo posponer las imágenes que no aparecen en pantallaFCPLCP
Instala un complemento de carga en diferido de WordPress con la capacidad de posponer imágenes que no aparecen en la pantalla, o cambia a un tema con esa función. También puedes usar el complemento de AMP.
Minifica los archivos CSS
Si minificas los archivos CSS, se puede reducir el tamaño de la carga útil de la red. Consulta cómo minificar archivos CSSFCPLCP
Hay varios complementos de WordPress que pueden concatenar, minificar y comprimir tus estilos para acelerar tu sitio web. Te recomendamos que, si es posible, uses un proceso de creación para realizar la minificación de forma anticipada.
Reduce el contenido CSS que no se use
Reduce las reglas que no se usen de las hojas de estilo y retrasa las reglas CSS que no se utilicen para el contenido de la parte visible a primera vista. Así, se reducirán los bytes consumidos por la actividad de red. Consulta cómo reducir el contenido de CSS que no se useFCPLCP
Puedes reducir o cambiar la cantidad de complementos de WordPress que cargan archivos CSS sin usar en tu página. Para identificar los complementos que añaden archivos CSS externos, ejecuta la cobertura de código en DevTools de Chrome. Puedes identificar el tema o complemento concreto en la URL de la hoja de estilo. Presta atención a los complementos con varias hojas de estilo en la lista y con muchos elementos en rojo en la cobertura de código. Un complemento solo debería poner en cola una hoja de estilo (si esta se usa en la página).
Codifica las imágenes de forma eficaz
Las imágenes optimizadas se cargan más rápido y consumen menos datos móviles. Consulta cómo codificar imágenes de forma eficazFCPLCP
Puedes utilizar un complemento de optimización de imágenes de WordPress que comprima tus imágenes conservando la calidad.
Establece conexión previamente con los orígenes necesarios
Puedes añadir sugerencias de recursos
preconnect
o dns-prefetch
para establecer conexiones previas con orígenes importantes de terceros. Consulta cómo establecer conexión previamente con orígenes necesariosLCPFCP Evita que haya varias redirecciones de página
Las redirecciones provocan retrasos adicionales antes de que la página se pueda cargar. Consulta cómo evitar las redirecciones de página.LCPFCP
Usa HTTP/2
HTTP/2 ofrece muchas ventajas con respecto a HTTP/1.1, como los encabezados binarios y la multiplexación. Más información sobre HTTP/2LCPFCP
Quita los módulos duplicados de los paquetes de JavaScript
Quita los módulos de JavaScript grandes y duplicados de los paquetes para reducir el número de bytes innecesarios que consume la actividad de red. FCPLCP
Todo el texto permanece visible mientras se carga la fuente web
Usa la función CSS
font-display
para asegurarte de que los usuarios puedan ver el texto mientras se cargan las fuentes web. Más información sobre font-display
Cargar recursos de terceros en diferido con fachadas
Algunas inserciones de terceros se pueden cargar en diferido. Puedes sustituirlas por una fachada hasta que sean necesarias. Consulta cómo posponer elementos de terceros con una fachadaTBT
La imagen del renderizado del mayor elemento con contenido no se ha cargado en diferido
Las imágenes de la parte visible a primera vista que se cargan en diferido se renderizan más tarde en el ciclo de vida de la página, lo que puede retrasar el renderizado del mayor elemento con contenido. Más información sobre la carga en diferido óptimaLCP
Contiene una etiqueta <meta name="viewport">
con width
o initial-scale
<meta name="viewport">
con width
o initial-scale
El
<meta name="viewport">
no solo optimiza tu aplicación para los tamaños de pantalla de los dispositivos móviles, sino que también evita el retraso de 300 milisegundos de las entradas del usuario. Más información sobre cómo usar la etiqueta meta de viewportEstas comprobaciones permiten identificar oportunidades para mejorar la accesibilidad de tu aplicación web. La detección automática solo puede detectar un subconjunto de problemas y no garantiza la accesibilidad de tu aplicación web, por lo que también te recomendamos que hagas pruebas manuales.
Nombres y etiquetas
Los elementos de imagen no tienen ningún atributo [alt]
[alt]
Los elementos informativos deberían incluir textos alternativos cortos y descriptivos. Los elementos decorativos se pueden omitir usando un atributo "alt" vacío. Más información sobre el atributo
alt
Elementos con errores |
---|
body > img <img src="lighthouse-1024x680.jpg?iar1" width="120" height="15"> |
body > img <img loading="lazy" src="lighthouse-1024x680.jpg?iar2" width="120" height="80" fetchpriority="low"> |
body > img <img src="lighthouse-480x318.jpg?isr1" width="400" height="360" style="position: absolute;"> |
body > img <img src="lighthouse-1024x680.jpg?isr2" width="120" height="80" style="position: absolute;"> |
body > img <img src="lighthouse-1024x680.jpg?isr3" width="360" height="240" style="image-rendering: pixelated; position: absolute;"> |
body > img <img src="http://localhost:10200/dobetterweb/lighthouse-1024x680.jpg" srcset="lighthouse-1024x680.jpg 2x" width="360" height="240" style="position: absolute;"> |
body > img <img src="lighthouse-rotating.gif" width="811" height="462"> |
body > img <img src="blob:http://localhost:10200/fa49e413-bc80-4876-b31d-38a24f51cff7"> |
body > img <img src="filesystem:http://localhost:10200/temporary/empty-0.9307734889843826.png"> |
Los elementos de formulario no tienen ninguna etiqueta asociada
Las etiquetas facilitan que las tecnologías asistenciales, como los lectores de pantalla, puedan leer los controles de los formularios de forma correcta. Más información sobre las etiquetas de elementos de formulario
Elementos con errores |
---|
body > input <input type="password" onpaste="event.preventDefault();"> |
body > input <input type="password"> |
body > input <input type="password" onpaste="return false;"> |
Los enlaces no tienen nombres reconocibles
Usar textos de enlace (y textos alternativos para las imágenes, si estas se usan como enlaces) que sean reconocibles, únicos y que se puedan seleccionar mejora la experiencia de navegación de los usuarios de lectores de pantalla. Consulta cómo hacer que los enlaces sean accesibles
Elementos con errores |
---|
body > a <a href="javascript:void(0)" target="_blank"> |
body > a <a href="mailto:inbox@email.com" target="_blank"> |
Internacionalización y localización
El elemento <html>
no tiene un atributo [lang]
<html>
no tiene un atributo [lang]
Si no se especifica ningún atributo
lang
en una página, el lector de pantalla asumirá que la página está en el idioma predeterminado que el usuario eligió al configurarlo. Si el idioma de la página es diferente del predeterminado, es posible que el lector de pantalla no lea correctamente el texto de la página. Más información sobre el atributo lang
Elementos con errores |
---|
html <html> |
Prácticas recomendadas
Las áreas táctiles no tienen un tamaño o un espaciado suficientes.
Las áreas táctiles con un tamaño y un espaciado suficientes ayudan a los usuarios con posibles dificultades para usar controles pequeños a activarlos. Más información sobre las áreas táctiles
Elementos con errores |
---|
body > input <input type="password" onpaste="event.preventDefault();"> |
external link <a href="https://www.google.com/" target="_blank"> |
external link that uses rel noopener <a href="https://www.google.com/" target="_blank" rel="noopener"> |
external link that uses rel noopener and noreferrer <a href="https://www.google.com/" target="_blank" rel="noopener noreferrer"> |
body > input <input type="password"> |
external link <a href="https://www.google.com/" target="_blank"> |
external link that uses rel noopener <a href="https://www.google.com/" target="_blank" rel="noopener"> |
body > input <input type="password" onpaste="return false;"> |
external link <a href="https://www.google.com/" target="_blank"> |
external link that uses rel noopener <a href="https://www.google.com/" target="_blank" rel="noopener"> |
body > input <input type="password" onpaste="event.preventDefault();"> |
Elementos adicionales que se deben comprobar manualmente (10) Mostrar Ocultar
Elementos adicionales que se deben comprobar manualmente (10)
Mostrar Ocultar
Interactive controls are keyboard focusable
Custom interactive controls are keyboard focusable and display a focus indicator. Learn how to make custom controls focusable.
Interactive elements indicate their purpose and state
Interactive elements, such as links and buttons, should indicate their state and be distinguishable from non-interactive elements. Learn how to decorate interactive elements with affordance hints.
The page has a logical tab order
Tabbing through the page follows the visual layout. Users cannot focus elements that are offscreen. Learn more about logical tab ordering.
Visual order on the page follows DOM order
DOM order matches the visual order, improving navigation for assistive technology. Learn more about DOM and visual ordering.
User focus is not accidentally trapped in a region
A user can tab into and out of any control or region without accidentally trapping their focus. Learn how to avoid focus traps.
The user's focus is directed to new content added to the page
If new content, such as a dialog, is added to the page, the user's focus is directed to it. Learn how to direct focus to new content.
HTML5 landmark elements are used to improve navigation
Landmark elements (
<main>
, <nav>
, etc.) are used to improve the keyboard navigation of the page for assistive technology. Learn more about landmark elements. Offscreen content is hidden from assistive technology
Offscreen content is hidden with display: none or aria-hidden=true. Learn how to properly hide offscreen content.
Custom controls have associated labels
Custom interactive controls have associated labels, provided by aria-label or aria-labelledby. Learn more about custom controls and labels.
Custom controls have ARIA roles
Custom interactive controls have appropriate ARIA roles. Learn how to add roles to custom controls.
Auditorías aprobadas (16) Mostrar Ocultar
Auditorías aprobadas (16)
Mostrar Ocultar
Los atributos [aria-*]
coinciden con sus funciones
[aria-*]
coinciden con sus funciones Cada
role
de ARIA admite un subconjunto determinado de atributos aria-*
. Si no coinciden, los atributos aria-*
se invalidarán. Consulta cómo asociar atributos ARIA a sus funciones [aria-hidden="true"]
no se encuentra en el documento <body>
[aria-hidden="true"]
no se encuentra en el documento <body>
Las tecnologías asistenciales, como los lectores de pantalla, funcionan de forma inestable cuando se establece
aria-hidden="true"
en el documento <body>
. Consulta cómo afecta aria-hidden
al cuerpo del documento Todos los elementos [role]
tienen los atributos [aria-*]
obligatorios
[role]
tienen los atributos [aria-*]
obligatorios Algunas funciones de ARIA incluyen atributos obligatorios que describen el estado del elemento a los lectores de pantalla. Más información sobre las funciones y los atributos obligatorios
Los atributos [aria-*]
tienen valores válidos
[aria-*]
tienen valores válidos Las tecnologías asistenciales, como los lectores de pantalla, no pueden interpretar los atributos ARIA cuyos valores no sean válidos. Más información sobre los valores válidos de los atributos ARIA
Los atributos [aria-*]
son válidos y están bien escritos
[aria-*]
son válidos y están bien escritos Las tecnologías asistenciales, como los lectores de pantalla, no pueden interpretar los atributos ARIA con nombres no válidos. Más información sobre los atributos ARIA válidos
[user-scalable="no"]
no se utiliza en el elemento <meta name="viewport">
y el valor del atributo [maximum-scale]
no es inferior a 5.
[user-scalable="no"]
no se utiliza en el elemento <meta name="viewport">
y el valor del atributo [maximum-scale]
no es inferior a 5. Inhabilitar el zoom provoca problemas a los usuarios con baja visión que necesitan ampliar la pantalla para poder ver correctamente el contenido de las páginas web. Más información sobre la etiqueta meta de viewport
Los atributos ARIA se usan como se especifica para la función del elemento
Algunos atributos de ARIA solo se permiten en un elemento si se cumplen ciertas condiciones. Más información sobre los atributos ARIA condicionales
Los elementos solo usan atributos ARIA permitidos
El uso de atributos ARIA en funciones donde están prohibidos puede impedir que se comunique información importante a los usuarios de tecnologías asistenciales. Más información sobre los roles de ARIA prohibidos
Los valores de [role]
son válidos
[role]
son válidos Las funciones de ARIA deben tener valores válidos para realizar las funciones de accesibilidad correspondientes. Más información sobre las funciones de ARIA válidas
Los colores de fondo y de primer plano tienen una relación de contraste adecuada
Los textos con poco contraste resultan difíciles o imposibles de leer para muchos usuarios. Consulta cómo crear suficiente contraste de color
El documento tiene un elemento <title>
<title>
Los títulos proporcionan una idea general sobre la página a los usuarios de lectores de pantalla. Además, los usuarios de buscadores se basan principalmente en los títulos para determinar si una página es relevante para su búsqueda o no. Más información sobre los títulos de documentos
Los enlaces se distinguen sin depender del color.
Los textos con poco contraste resultan difíciles o imposibles de leer para muchos usuarios. Usar textos de enlace que sean reconocibles mejora la experiencia para los usuarios con baja visión. Obtén más información sobre cómo crear enlaces distinguibles.
Los elementos de encabezado aparecen en orden secuencial descendente
Los títulos ordenados correctamente que no saltan niveles transmiten la estructura semántica de la página, lo que facilita la navegación y la comprensión para los usuarios que usan tecnologías asistenciales. Más información sobre el orden de los encabezados
Uses ARIA roles only on compatible elements
Many HTML elements can only be assigned certain ARIA roles. Using ARIA roles where they are not allowed can interfere with the accessibility of the web page. Learn more about ARIA roles.
No se han usado roles de ARIA obsoletos
Es posible que la tecnología asistencial no procese correctamente los roles de ARIA obsoletos. Más información sobre los roles de ARIA obsoletos
Los elementos de imagen no tienen atributos [alt]
que sean texto redundante.
[alt]
que sean texto redundante. Los elementos informativos deberían incluir textos alternativos cortos y descriptivos. Si el texto alternativo es idéntico al texto situado junto a un enlace o una imagen, puede resultar confuso para los usuarios de lectores de pantalla, ya que el texto se leerá dos veces. Más información sobre el atributo
alt
No aplicable (36) Mostrar Ocultar
No aplicable (36)
Mostrar Ocultar
Los valores de [accesskey]
son únicos
[accesskey]
son únicos Las claves de acceso permiten a los usuarios dirigirse rápidamente a una parte concreta de la página. Para facilitar una navegación correcta, las claves de acceso deben ser únicas. Más información sobre las claves de acceso
Los elementos button
, link
y menuitem
tienen nombres accesibles
button
, link
y menuitem
tienen nombres accesibles Si un elemento no tiene un nombre accesible, los lectores de pantalla lo leen diciendo un nombre genérico, lo que hace que el elemento no resulte útil a los usuarios que necesitan lectores de pantalla. Consulta cómo hacer que los elementos de comando sean más accesibles
Los elementos con role="dialog"
o role="alertdialog"
tienen nombres accesibles.
role="dialog"
o role="alertdialog"
tienen nombres accesibles. Los elementos del cuadro de diálogo de ARIA sin nombres accesibles pueden impedir que los usuarios de lectores de pantalla distingan la finalidad de esos elementos. Consulta cómo hacer que los elementos del cuadro de diálogo de ARIA sean más accesibles.
Los elementos [aria-hidden="true"]
no contienen ningún elemento inferior seleccionable
[aria-hidden="true"]
no contienen ningún elemento inferior seleccionable Los elementos inferiores enfocables que están dentro de un elemento
[aria-hidden="true"]
evitan que esos elementos interactivos estén disponibles para los usuarios de tecnologías asistenciales, como lectores de pantalla. Consulta cómo aria-hidden
afecta a los elementos enfocables. Los campos de entrada ARIA tienen nombres accesibles
Si un campo de entrada no tiene un nombre accesible, los lectores de pantalla lo leerán en voz alta con un nombre genérico, lo que hace que el campo no resulte útil a los usuarios que necesitan lectores de pantalla. Más información sobre las etiquetas de campos de entrada
Los elementos meter
de ARIA tienen nombres accesibles
meter
de ARIA tienen nombres accesibles Si un elemento medidor no tiene un nombre accesible, los lectores de pantalla lo leen diciendo un nombre genérico, lo que hace que no resulte útil para los usuarios que necesitan lectores de pantalla. Consulta cómo asignar un nombre a los elementos
meter
. Los elementos progressbar
de ARIA tienen nombres accesibles
progressbar
de ARIA tienen nombres accesibles Si un elemento
progressbar
no tiene un nombre accesible, los lectores de pantalla lo leen diciendo un nombre genérico, lo que hace que no resulte útil a los usuarios que necesitan lectores de pantalla. Consulta cómo etiquetar elementos progressbar
Los elementos con un [role]
ARIA que requieren que los elementos secundarios contengan un [role]
específico tienen todos los elementos secundarios necesarios.
[role]
ARIA que requieren que los elementos secundarios contengan un [role]
específico tienen todos los elementos secundarios necesarios. Algunas funciones principales de ARIA deben contener funciones secundarias específicas para llevar a cabo las funciones de accesibilidad correspondientes. Más información sobre las funciones y los elementos secundarios obligatorios
Los atributos [role]
están incluidos en los elementos principales correspondientes
[role]
están incluidos en los elementos principales correspondientes Algunas funciones secundarias de ARIA se deben incluir dentro de funciones principales concretas para poder llevar a cabo las funciones de accesibilidad correspondientes. Más información sobre las funciones de ARIA y el elemento superior obligatorio
Los elementos con el atributo role=text
no tienen descendientes enfocables.
role=text
no tienen descendientes enfocables. Añadir
role=text
alrededor de un nodo de texto dividido por etiquetas permite que VoiceOver lo trate como una sola frase, pero no se anunciarán los descendientes enfocables de ese elemento. Obtén más información sobre el atributo role=text
. Los campos de interruptores ARIA tienen nombres accesibles
Si un campo de interruptor no tiene un nombre accesible, los lectores de pantalla lo leerán en voz alta con un nombre genérico, lo que hace que el campo no resulte útil a los usuarios que necesitan lectores de pantalla. Más información sobre los campos de interruptores
Los elementos tooltip
de ARIA tienen nombres accesibles
tooltip
de ARIA tienen nombres accesibles Si un elemento de descripción emergente no tiene un nombre accesible, los lectores de pantalla lo leen diciendo un nombre genérico, lo que hace que no resulte útil para los usuarios que necesitan lectores de pantalla. Consulta cómo asignar un nombre a los elementos
tooltip
. Los elementos treeitem
de ARIA tienen nombres accesibles
treeitem
de ARIA tienen nombres accesibles Si un elemento
treeitem
no tiene un nombre accesible, los lectores de pantalla lo leen diciendo un nombre genérico, lo que hace que no resulte útil a los usuarios que necesitan lectores de pantalla. Más información sobre cómo etiquetar elementos treeitem
Los botones tienen nombres accesibles
Si un botón no tiene un nombre accesible, los lectores de pantalla lo leerán en voz alta como "botón", lo que hace que el botón no resulte útil a los usuarios que necesitan lectores de pantalla. Consulta cómo hacer que los botones sean más accesibles
La página contiene un encabezado, un enlace de omisión o una región de punto de referencia
Incluir maneras de omitir el contenido repetitivo permite a los usuarios con teclado navegar por la página de forma más eficaz. Más información sobre cómo omitir bloques
Los elementos <dl>
contienen únicamente grupos de <dt>
y <dd>
o elementos <script>
, <template>
o <div>
ordenados correctamente.
<dl>
contienen únicamente grupos de <dt>
y <dd>
o elementos <script>
, <template>
o <div>
ordenados correctamente. Si las listas de definiciones no están bien marcadas, es posible que los lectores de pantalla las interpreten de forma confusa o imprecisa. Consulta cómo estructurar las listas de definición correctamente
Los elementos de la lista de definiciones están incluidos dentro de elementos <dl>
<dl>
Los elementos de la lista de definiciones (
<dt>
y <dd>
) deben estar incluidos en un elemento <dl>
superior para asegurarte de que los lectores de pantalla puedan leerlos en voz alta correctamente. Consulta cómo estructurar las listas de definición correctamente Los ID de ARIA son únicos
El valor de un ID de ARIA debe ser único para evitar que las tecnologías asistenciales omitan otras instancias. Consulta cómo corregir IDs de ARIA duplicados
Ningún campo de formulario tiene varias etiquetas
Las tecnologías asistenciales, como los lectores de pantalla, pueden leer de forma confusa los campos de formulario que tienen varias etiquetas, ya que pueden usar la primera etiqueta, la última o todas. Consulta cómo utilizar las etiquetas de formularios
Los elementos <frame>
o <iframe>
tienen un título
<frame>
o <iframe>
tienen un título Los usuarios de lectores de pantalla confían en que los títulos describan el contenido de los marcos. Más información sobre los títulos de los marcos
El atributo [lang]
del elemento <html>
tiene un valor válido
[lang]
del elemento <html>
tiene un valor válido Especificar un idioma BCP 47 válido permite a los lectores de pantalla leer el texto correctamente en voz alta. Consulta cómo utilizar el atributo
lang
El elemento <html>
tiene un atributo [xml:lang]
con el mismo idioma base que el atributo [lang]
.
<html>
tiene un atributo [xml:lang]
con el mismo idioma base que el atributo [lang]
. Si la página web no indica un idioma de forma coherente, es posible que el lector de pantalla no lea correctamente el texto de la página. Más información sobre el atributo
lang
Los botones de entrada tienen texto reconocible.
Añadir texto reconocible y accesible a los botones de entrada puede ayudar a los usuarios de lectores de pantalla a entender la finalidad de estos botones. Más información sobre los botones de entrada
Los elementos <input type="image">
tienen texto [alt]
<input type="image">
tienen texto [alt]
Cuando se usa una imagen como botón
<input>
, resulta útil proporcionar un texto alternativo para permitir que los usuarios de lectores de pantalla entiendan cuál es la función del botón. Más información sobre añadir texto alternativo a las imágenes Las listas contienen únicamente elementos <li>
y elementos que admiten secuencias de comandos (<script>
y <template>
).
<li>
y elementos que admiten secuencias de comandos (<script>
y <template>
). Los lectores de pantalla leen las listas en voz alta de una forma concreta. Se recomienda utilizar una estructura de listas adecuada para que los lectores de pantalla puedan leer las listas de forma correcta. Más información sobre estructuras de listas adecuadas
Los elementos de lista (<li>
) están incluidos dentro de elementos superiores <ul>
, <ol>
o <menu>
<li>
) están incluidos dentro de elementos superiores <ul>
, <ol>
o <menu>
Los lectores de pantalla requieren que los elementos de lista (
<li>
) estén incluidos dentro de un elemento superior<ul>
, <ol>
o <menu>
para poder leerlos correctamente en voz alta. Más información sobre estructuras de listas adecuadas El documento no usa <meta http-equiv="refresh">
<meta http-equiv="refresh">
Los usuarios no esperan que las páginas se actualicen automáticamente. Si es así, se les volverá a dirigir a la parte superior de la página. Esto puede dar lugar a una experiencia frustrante o confusa. Más información sobre la etiqueta meta de actualización
Los elementos <object>
tienen texto alternativo
<object>
tienen texto alternativo Los lectores de pantalla no pueden traducir contenido que no sea texto. Si añades texto alternativo a los elementos
<object>
, los lectores de pantalla podrán transmitir su significado a los usuarios. Más información sobre el texto alternativo de los elementos object
Los elementos <select> tienen elementos <label> asociados.
Los elementos <form> sin <label> eficaz pueden causar experiencias frustrantes para los usuarios de lectores de pantalla. Obtén más información sobre el elemento
select
. Los enlaces de salto son enfocables.
Incluir un enlace de salto puede ayudar a los usuarios a ir directamente al contenido principal para ahorrar tiempo. Más información sobre los enlaces de salto
No hay ningún elemento con un valor de [tabindex]
superior a 0
[tabindex]
superior a 0 Si el valor es superior a 0, significa que el orden de navegación es explícito. Aunque técnicamente es válido, esto suele producir experiencias frustrantes para los usuarios que necesitan usar tecnologías asistenciales. Más información sobre el atributo
tabindex
Las tablas tienen contenido diferente en el atributo summary y en <caption>
.
<caption>
. El atributo summary debe describir la estructura de la tabla y
<caption>
debe tener el título en pantalla. Etiquetar las tablas de forma precisa ayuda a los usuarios de lectores de pantalla. Más información sobre summary y caption Las celdas de un elemento <table>
que usan el atributo [headers]
hacen referencia a otras celdas de la misma tabla.
<table>
que usan el atributo [headers]
hacen referencia a otras celdas de la misma tabla. Los lectores de pantalla incluyen funciones para facilitar la navegación por las tablas. Asegurarse de que las celdas
<td>
que usan el atributo [headers]
solo hacen referencia a otras celdas de la misma tabla mejora la experiencia de los usuarios de lectores de pantalla. Más información sobre el atributo headers
Los elementos <th>
y los elementos con atributos [role="columnheader"/"rowheader"]
contienen las celdas de datos que describen.
<th>
y los elementos con atributos [role="columnheader"/"rowheader"]
contienen las celdas de datos que describen. Los lectores de pantalla incluyen funciones para facilitar la navegación por las tablas. Si te aseguras de que los encabezados de las tablas siempre hagan referencia a un conjunto de celdas, puedes mejorar la experiencia de los usuarios de lectores de pantalla. Más información sobre los encabezados de tabla
Los atributos [lang]
tienen un valor válido
[lang]
tienen un valor válido Especificar un idioma BCP 47 en los elementos ayuda a asegurar que los lectores de pantalla pronuncien correctamente las palabras del texto. Consulta cómo utilizar el atributo
lang
Confianza y seguridad
No usa HTTPS Se ha encontrado 1 solicitud poco segura
Todos los sitios deberían estar protegidos con el protocolo HTTPS, incluso los que no gestionen datos sensibles. Esto incluye evitar el contenido mixto, en el que algunos recursos se cargan mediante HTTP a pesar de que la solicitud inicial se haya servido mediante HTTPS. HTTPS evita que los intrusos manipulen o escuchen de forma pasiva las comunicaciones entre tu aplicación y tus usuarios. Además, es un requisito previo para poder usar HTTP/2 y las APIs de muchas plataformas web nuevas. Más información sobre HTTPS
URL poco segura | Resolución de solicitudes |
---|---|
[::1] | |
Permitida |
Solicita el permiso de geolocalización al cargar la página
Los usuarios dudan o desconfían de los sitios web que solicitan su ubicación sin contexto. Como alternativa, puedes vincular la solicitud a una acción del usuario. Más información sobre el permiso de geolocalización
Fuente |
---|
localhost Propio |
/dobetterweb/dbw_tester.html:347:24 (localhost) |
/dobetterweb/dbw_tester.html:351:40 (localhost) |
Solicita el permiso de notificación al cargar la página
Los usuarios dudan o desconfían de los sitios que solicitan enviar notificaciones sin contexto. Como alternativa, puedes vincular la solicitud a los gestos de los usuarios. Más información sobre cómo obtener permiso para recibir notificaciones de forma responsable
Fuente |
---|
localhost Propio |
/dobetterweb/dbw_tester.html:357:15 (localhost) |
Asegura que la CSP sea efectiva frente a ataques XSS
Una política de seguridad de contenido (CSP) sólida reduce considerablemente el riesgo de ataques de cross-site scripting (XSS). Consulta cómo usar una CSP para prevenir XSS
Descripción | Directiva | Gravedad |
---|---|---|
No se ha encontrado ninguna CSP en el modo obligatorio | Alta |
General
Usa API obsoletas Se han encontrado 2 advertencias
Las APIs obsoletas se eliminarán del navegador en el futuro. Más información sobre las APIs obsoletas
Desactivación/Advertencia | Fuente |
---|---|
localhost Propio | |
Synchronous `XMLHttpRequest` on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. | /dobetterweb/dbw_tester.html:385:6 (localhost) |
UnloadHandler | /dobetterweb/dbw_tester.html:400:9 (localhost) |
Se han registrado errores del navegador en la consola
Los errores registrados en la consola indican que hay problemas sin resolver. Pueden proceder de solicitudes fallidas de la red y otros errores del navegador. Más información sobre estos errores en la auditoría de diagnóstico de la consola
Fuente | Descripción |
---|---|
localhost Propio | |
/dobetterweb/dbw_tester.html:64:53 (localhost) | Error: A distinctive error at http://localhost:10200/dobetterweb/dbw_tester.html:64:54 |
/dobetterweb/dbw_tester.html:67:37 (localhost) | Error: An ignored error at http://localhost:10200/dobetterweb/dbw_tester.html:67:38 |
/dobetterweb/dbw_tester.html:511:10 (localhost) | Error! Error! |
/dobetterweb/unknown404.css?delay=200:1:0 (localhost) | Failed to load resource: the server responded with a status of 404 (Not Found) |
/dobetterweb/fcp-delayer.js?delay=5000:1:0 (localhost) | Failed to load resource: the server responded with a status of 404 (Not Found) |
/favicon.ico:1:0 (localhost) | Failed to load resource: the server responded with a status of 404 (Not Found) |
[::1] | |
Failed to load resource: net::ERR_CONNECTION_REFUSED |
Bibliotecas de JavaScript detectadas
Todas las bibliotecas frontend de JavaScript detectadas en la página. Más información sobre esta auditoría de diagnóstico de detección de bibliotecas de JavaScript
Nombre | Versión |
---|---|
jQuery | 2.1.1 |
WordPress |
Experiencia de usuario
Impide que los usuarios peguen texto en campos de entrada
Impedir que los usuarios peguen datos afecta negativamente a la experiencia de usuario y reduce la seguridad porque bloquea los gestores de contraseñas.Más información sobre los campos de entrada fáciles de usar
Elementos con errores |
---|
body > input <input type="password" onpaste="event.preventDefault();"> |
body > input <input type="password" onpaste="return false;"> |
Muestra imágenes con una relación de aspecto incorrecta
Las dimensiones de las imágenes mostradas deberían mantener su relación de aspecto natural. Más información sobre la relación de aspecto de imagen
URL | Relación de aspecto (mostrada) | Relación de aspecto (real) | |
---|---|---|---|
localhost Propio | |||
body > img <img src="lighthouse-1024x680.jpg?iar1" width="120" height="15"> | /dobetterweb/lighthouse-1024x680.jpg?iar1 (localhost) | 120 x 15
(8.00) | 1024 x 678
(1.51) |
body > img <img src="lighthouse-480x318.jpg?isr1" width="400" height="360" style="position: absolute;"> | /dobetterweb/lighthouse-480x318.jpg?isr1 (localhost) | 400 x 360
(1.11) | 480 x 318
(1.51) |
Muestra imágenes con una resolución baja
Para maximizar la claridad de la imagen, las dimensiones normales de la imagen deberían ser proporcionales al tamaño de la pantalla y a la proporción de píxeles. Consulta cómo proporcionar imágenes adaptables
URL | Tamaño mostrado | Tamaño real | Tamaño esperado | |
---|---|---|---|---|
localhost Propio | ||||
body > img <img src="lighthouse-480x318.jpg?isr1" width="400" height="360" style="position: absolute;"> | /dobetterweb/lighthouse-480x318.jpg?isr1 (localhost) | 400 x 360 | 480 x 318 | 600 x 540 |
Auditorías aprobadas (7) Mostrar Ocultar
Auditorías aprobadas (7)
Mostrar Ocultar
No usa cookies de terceros
La compatibilidad con cookies de terceros se eliminará en una futura versión de Chrome. Más información sobre la eliminación progresiva de las cookies de terceros
Contiene una etiqueta <meta name="viewport">
con width
o initial-scale
<meta name="viewport">
con width
o initial-scale
El
<meta name="viewport">
no solo optimiza tu aplicación para los tamaños de pantalla de los dispositivos móviles, sino que también evita el retraso de 300 milisegundos de las entradas del usuario. Más información sobre cómo usar la etiqueta meta de viewport El documento usa tamaños de fuente legibles El 100 % del texto es legible
Las fuentes con un tamaño inferior a 12 px son demasiado pequeñas y poco legibles, lo que obliga a los visitantes que acceden con dispositivos móviles a pellizcar la pantalla para ampliarla y poder leer el texto. Intenta que más del 60 % del texto de la página tenga un tamaño igual o superior a 12 px. Más información sobre los tamaños de fuente legibles
Fuente | Selector | % de texto de página | Tamaño de fuente |
---|---|---|---|
Texto legible | 100.00% | ≥ 12px |
La página tiene el DOCTYPE de HTML
Especificar un DOCTYPE evita que el navegador cambie al modo Quirks. Más información sobre la declaración de DOCTYPE
El conjunto de caracteres está definido correctamente
Es necesario declarar una codificación de caracteres. Puedes hacerlo utilizando una etiqueta
<meta>
situada en los primeros 1024 bytes del código HTML o en el encabezado de respuesta HTTP Content-Type. Más información sobre cómo declarar la codificación de caracteres No hay ningún problema en el panel Issues
de las herramientas para desarrolladores de Chrome
Issues
de las herramientas para desarrolladores de Chrome Los problemas registrados en el panel
Issues
de las herramientas para desarrolladores de Chrome indican que hay errores sin resolver. Pueden proceder de solicitudes fallidas de red, controles de seguridad insuficientes y otros errores del navegador. Abre el panel Issues de las herramientas para desarrolladores de Chrome para obtener más información sobre cada error. La página tiene mapas de origen válidos
Los mapas de origen traducen el código minificado al código fuente original. Esto ayuda a los desarrolladores a depurar en producción. Además, Lighthouse puede proporcionar sugerencias adicionales. Plantéate desplegar mapas de origen para disfrutar de estas ventajas. Más información sobre los mapas de origen
No aplicable (1) Mostrar Ocultar
No aplicable (1)
Mostrar Ocultar
Redirige el tráfico HTTP a HTTPS
Asegúrate de redirigir todo el tráfico HTTP a HTTPS para habilitar funciones web seguras para todos los usuarios. Más información
Estas comprobaciones aseguran que tu página siga las recomendaciones básicas sobre optimización en buscadores. Hay muchos otros factores adicionales que Lighthouse no valora aquí y que pueden afectar a tu posicionamiento en las búsquedas, como el rendimiento en las Métricas web principales. Consulta más información sobre las Directrices básicas de la Búsqueda de Google.
Prácticas recomendadas de contenido
El documento no tiene una metadescripción
Se pueden incluir metadescripciones en los resultados de búsqueda para resumir brevemente el contenido de la página. Más información sobre la metadescripción
Los elementos de imagen no tienen ningún atributo [alt]
[alt]
Los elementos informativos deberían incluir textos alternativos cortos y descriptivos. Los elementos decorativos se pueden omitir usando un atributo "alt" vacío. Más información sobre el atributo
alt
Elementos con errores |
---|
body > img <img src="lighthouse-1024x680.jpg?iar1" width="120" height="15"> |
body > img <img loading="lazy" src="lighthouse-1024x680.jpg?iar2" width="120" height="80" fetchpriority="low"> |
body > img <img src="lighthouse-480x318.jpg?isr1" width="400" height="360" style="position: absolute;"> |
body > img <img src="lighthouse-1024x680.jpg?isr2" width="120" height="80" style="position: absolute;"> |
body > img <img src="lighthouse-1024x680.jpg?isr3" width="360" height="240" style="image-rendering: pixelated; position: absolute;"> |
body > img <img src="http://localhost:10200/dobetterweb/lighthouse-1024x680.jpg" srcset="lighthouse-1024x680.jpg 2x" width="360" height="240" style="position: absolute;"> |
body > img <img src="lighthouse-rotating.gif" width="811" height="462"> |
body > img <img src="blob:http://localhost:10200/fa49e413-bc80-4876-b31d-38a24f51cff7"> |
body > img <img src="filesystem:http://localhost:10200/temporary/empty-0.9307734889843826.png"> |
Rastrear e indexar
Los enlaces no son rastreables
Es posible que los buscadores usen atributos
href
en los enlaces para rastrear sitios web. Asegúrate de que el atributo href
de los elementos de ancla enlace con un destino adecuado para que se puedan descubrir más páginas del sitio. Consulta cómo hacer que los enlaces sean rastreablesEnlace no rastreable |
---|
external link <a target="_blank"> |
body > a <a href="javascript:void(0)" target="_blank"> |
Elementos adicionales que se deben comprobar manualmente (1) Mostrar Ocultar
Elementos adicionales que se deben comprobar manualmente (1)
Mostrar Ocultar
Los datos estructurados son válidos
Ejecuta la Herramienta de prueba de datos estructurados y la herramienta Structured Data Linter para validar los datos estructurados. Más información sobre los datos estructurados
Auditorías aprobadas (6) Mostrar Ocultar
Auditorías aprobadas (6)
Mostrar Ocultar
No se ha bloqueado la indexación de la página
Los buscadores no pueden incluir tus páginas en los resultados de búsqueda si no tienen permiso para rastrearlas. Más información sobre las directivas del rastreador
El documento tiene un elemento <title>
<title>
Los títulos proporcionan una idea general sobre la página a los usuarios de lectores de pantalla. Además, los usuarios de buscadores se basan principalmente en los títulos para determinar si una página es relevante para su búsqueda o no. Más información sobre los títulos de documentos
El código de estado HTTP de la página es válido
Es posible que las páginas con códigos de estado HTTP no válidos no estén bien indexadas. Más información sobre los códigos de estado HTTP
Los enlaces tienen texto descriptivo
El texto descriptivo de los enlaces ayuda a los buscadores a entender tu contenido. Consulta cómo hacer que los enlaces sean más accesibles
robots.txt es válido
Si el formato del archivo robots.txt no es correcto, es posible que los rastreadores no puedan interpretar cómo quieres que se rastree o indexe tu sitio web. Más información sobre robots.txt
El documento tiene un atributo hreflang
válido
hreflang
válido Los enlaces "hreflang" indican a los buscadores qué versiones de las páginas deben incluir en los resultados de búsqueda de una zona o un idioma determinados. Más información sobre
hreflang
No aplicable (1) Mostrar Ocultar
No aplicable (1)
Mostrar Ocultar
El documento tiene un atributo rel=canonical
válido
rel=canonical
válido Los enlaces canónicos sugieren qué URL se debe mostrar en los resultados de búsqueda. Más información sobre los enlaces canónicos