Core Web Vitals Annotazioni in Chrome con OffiDocs

DESCRIZIONE

Questa estensione sovrapporrà le annotazioni al tuo sito Web per evidenziare gli attributi della pagina che hanno avuto un impatto sulle metriche delle prestazioni di Core Web Vitals, First Input Delay (FID), Largest Contentful Paint (LCP) e Cumulative Layout Shift (CLS).

Riporta inoltre le metriche Core Web Vitals per la pagina, utilizzando le soglie con codice colore consigliate da Google.

Due tipi di annotazioni verranno sovrapposti agli elementi di una pagina Web: 1. Elementi che hanno subito un cambio di layout e hanno contribuito al punteggio Cumulative Layout Shift.

A seconda della gravità del cambiamento, le annotazioni saranno codificate a colori dall'impatto più basso a quello più alto: giallo -> arancione -> arancione scuro -> rosso.

Nell'angolo in alto a sinistra di ogni annotazione troverai il punteggio di spostamento.

2. L'elemento con la pittura più ricca di contenuto verrà evidenziato con un'annotazione viola tratteggiata.

Includerà il tempo di disegno nell'angolo in alto a sinistra dell'annotazione.

Il popup dell'estensione dovrebbe aprire una griglia con i tempi delle metriche FID, LCP e CLS.

Nella parte inferiore del popup è presente un pulsante per rimuovere le annotazioni dal sito web.

Fatta eccezione per il più grande dipinto di contenuto, le metriche di Core Web Vitals sono avviate dall'utente.

Prendere nota di quanto segue quando si utilizza il plug-in e si esegue il debug del sito Web: - Il primo ritardo di input viene acquisito dopo che un utente fa clic o tocca un tasto sulla pagina Web.

Se apri l'estensione prima di una di queste azioni, noterai che la metrica non è presente nella griglia.

Per ottenere il First Input Delay, chiudi l'estensione, esegui un'azione utente sulla pagina, quindi riapri.

- Cumulative Layout Shift è un accumulo di turni sulla pagina.

Mentre scorri la pagina, potresti vedere ulteriori turni e l'estensione aggiungerà nuove annotazioni in modo dinamico.

Anche la griglia popup che riporta il punteggio totale aumenterà man mano che si accumulano più turni.

- Le annotazioni Cumulative Layout Shift evidenziano un elemento che si è spostato, **non l'elemento che ha causato lo spostamento**.

Ad esempio, se un annuncio viene caricato in ritardo sulla pagina, potrebbe spingere alcuni elementi sottostanti verso il basso, provocando uno spostamento.

Verranno probabilmente evidenziati gli elementi sotto l'annuncio e possibilmente l'annuncio.

- Dato l'esempio dell'annuncio precedente, più elementi della pagina potrebbero essere stati spostati dopo il caricamento dell'annuncio.

In tal caso, verrà registrato un solo punteggio di turno, ma tutti gli elementi interessati verranno evidenziati con un'annotazione.

In questo caso, dovresti vedere una freccia (↳) accanto al punteggio di spostamento annotato che denota un raggruppamento di elementi che si sono spostati insieme.

Informazioni aggiuntive:

- Offerto da delambo
- Valutazione media: 5 stelle (mi è piaciuto molto)
- Sviluppatore Questo indirizzo e-mail è protetto dallo spam bot. Abilita Javascript per vederlo.

Core Web Vitals Annotazioni web extension integrato con OffiDocs Chromium online