Ufficio

Suggerimenti sull`utilizzo dell`elemento Ispeziona del browser Google Chrome

10 TRUCCHI per GOOGLE CHROME su ANDROID che dovete provare! | Guida ITA | TuttoAndroid

10 TRUCCHI per GOOGLE CHROME su ANDROID che dovete provare! | Guida ITA | TuttoAndroid

Sommario:

Anonim

Google Chrome è progettato non solo per gli utenti regolari di Internet, ma anche per gli sviluppatori web, che creano spesso un sito Web, blog di progettazione, ecc. Ispeziona elemento l`opzione o Ispeziona di Google Chrome aiuta gli utenti a trovare alcune informazioni su un sito Web che è nascosto alla vista. Ecco alcuni suggerimenti su come utilizzare Inspect Element del browser Google Chrome per PC Windows.

Ispeziona elemento di Google Chrome

1] Trova file JavaScript / multimediali nascosti

Molti siti Web mostrano popup se il visitatore rimane sul Web pagina per più di 15 o 20 secondi. Oppure, molte volte un`immagine, un annuncio o un`icona, si apre dopo aver cliccato in un punto a caso. Per trovare questi file nascosti di una pagina Web, è possibile utilizzare la scheda Origini di Inspect Element. Mostra una lista di visualizzazione ad albero sul lato sinistro che può essere esplorata.

2] Ottieni il codice colore HEX / RGB in Chrome

A volte potremmo desiderare un colore e potremmo voler scoprire il suo codice colore. È possibile trovare facilmente il codice colore HEX o RGB utilizzato su una particolare pagina Web, utilizzando l`opzione nativa in Google Chrome. Fai clic con il pulsante destro del mouse sul colore e fai clic su Esamina . Nella maggior parte dei casi, otterrai il codice colore sul lato destro con altri CSS. Se non lo vedi, beh, potresti dover utilizzare un software di selezione colori gratuito.

SUGGERIMENTO : dai un`occhiata anche a questi strumenti online di Color Picker.

3] Ottieni suggerimenti per migliorare le prestazioni della pagina web

Tutti amano atterrare su un sito web che si apre velocemente. Se stai progettando il tuo sito web, dovresti sempre tenerlo a mente. Ci sono molti strumenti per controllare e ottimizzare la velocità di caricamento della pagina. Tuttavia, Google Chrome include anche uno strumento integrato che consente agli utenti di ottenere suggerimenti per migliorare la velocità di caricamento del sito web. Per accedere a questi strumenti, vai alla scheda Audits e assicurati che Utilità di rete , Prestazioni pagina Web e Ricarica pagina e verifica caricamento sono selezionati. Quindi fare clic sul pulsante Esegui . Ricaricherà la pagina e mostrerà alcune informazioni che possono essere utilizzate per rendere la pagina più veloce. Ad esempio, puoi ottenere tutte le risorse che non hanno scadenza della cache, JavaScript che può essere combinato in un unico file e così via.

4] Verifica reattività

Oggigiorno rendere una pagina web reattiva è fondamentale. Ci sono molti strumenti che possono controllare se il tuo sito è completamente reattivo o meno. Tuttavia, questo strumento di Google Chrome aiuta gli utenti a sapere se il sito è reattivo o meno e controlla come apparirà su un particolare dispositivo mobile. Apri un sito Web, ottieni la scheda Ispeziona elemento , fai clic sul mobile , imposta la risoluzione o seleziona il dispositivo desiderato per testare la pagina Web.

5] Modifica sito web live

Supponiamo che tu stia creando una pagina web, ma sei confuso riguardo al colore schema o dimensione del menu di navigazione o contenuto o rapporto barra laterale. Puoi modificare il tuo sito web dal vivo utilizzando l`opzione Controlla elemento di Google Chrome. Sebbene non sia possibile salvare le modifiche su un sito Web attivo, è possibile eseguire tutte le modifiche per poterle utilizzare ulteriormente. Per fare ciò, apri Inspect Element, seleziona la proprietà HTML dal lato sinistro e apporta le modifiche di stile sul lato destro. Se apporti modifiche al CSS, puoi fare clic sul link del file, copiare l`intero codice e incollarlo nel file originale.

Ispeziona l`elemento di Google Chrome è un vero compagno di ogni sviluppatore web. Non importa se stai sviluppando un sito web a una pagina o un sito web dinamico, puoi certamente usare questi suggerimenti.