Come modificare testo e colori di qualsiasi pagina web
Capita a tutti di imbattersi in un sito web scritto con un carattere minuscolo o con un colore di testo così chiaro che leggere due righe diventa un'impresa. Spesso i webmaster scelgono contrasti fastidiosi o colori accesi che rendono la navigazione faticosa, dimenticando che molte persone soffrono di daltonismo o hanno difficoltà visive. In questi casi, l'estetica del sito diventa un ostacolo alla lettura.
Che si tratti di sistemare l'estetica di un portale, di fare esperimenti per copiare un'idea grafica o semplicemente di fare uno scherzo a un amico inviandogli lo screenshot di un giornale famoso con il suo nome in prima pagina, non servono programmi di grafica. Lo strumento per farlo è già installato nel vostro browser, nascosto tra i comandi per chi crea i siti.
LEGGI ANCHE: Trucchi per browser con i bookmarklet su PC e smartphone
Il tasto Ispeziona per i ritocchi veloci
Il modo più rapido per cambiare qualcosa è usare la funzione di analisi. Basta mettere il mouse sopra la parola, il colore o l'immagine che volete modificare, cliccare con il tasto destro e scegliere la voce Ispeziona (o Analizza elemento).
A questo punto vedrete apparire una colonna piena di codici. Non spaventatevi: il browser evidenzia automaticamente la riga che comanda quel pezzetto di pagina. Se volete cambiare un testo, fate doppio clic sulla frase nel codice, cancellatela, scrivete quello che volete e premete Invio. La modifica apparirà all'istante.
Se invece volete cambiare i colori, cercate nel riquadro dello stile (CSS) voci come color o background-color. Cliccate sul quadratino colorato per sceglierne uno nuovo. Se non sapete quale tinta usare o volete scoprire come sono fatti i colori di un sito che vi piace, potete usare i nostri consigli su come estrarre i codici dei colori da internet.
Trasformare il sito in un foglio di Word
Fare "Ispeziona" su ogni singola parola è un lavoro infinito. Per queste situazioni, la rotta di Navigaweb suggerisce un comando che trasforma l'intera pagina in un documento aperto, proprio come se fosse un file di Word.
Il metodo più veloce è usare la console. Premete il tasto F12, cliccate sulla scheda Console e scrivete questo comando:
document.designMode = "on"
Premendo Invio, potrete cliccare su qualsiasi paragrafo o titolo del sito e modificarlo direttamente, cancellando o scrivendo testi senza più toccare il codice. Se volete rendere questa operazione ancora più rapida, potete creare un bookmarklet: trascinate un link con il comando javascript:document.designMode='on';void 0 nella vostra barra dei preferiti. Così, ogni volta che vorrete modificare un sito, basterà cliccare sul preferito invece di aprire la console.
Modifiche permanenti e personalizzazioni avanzate
Tutti i cambiamenti fatti finora spariscono appena aggiornate la pagina. Se volete che un sito abbia sempre un aspetto diverso, servono strumenti che "iniettino" le vostre modifiche a ogni caricamento.
Un'ottima soluzione è Stylus, che permette di salvare temi personalizzati (come la modalità scura) per ogni sito. Per chi invece vuole andare oltre e cambiare non solo la grafica ma anche il comportamento dei portali, esistono gli script Greasemonkey (o Tampermonkey su Chrome), che permettono di automatizzare modifiche profonde alla struttura delle pagine.
Se invece l'obiettivo è preparare una pagina per la stampa, evitando di sprecare inchiostro con sfondi colorati o pubblicità, l'estensione Print Edit WE è imbattibile. Vi permette di ripulire il sito prima di stamparlo, un'operazione simile a quella che suggeriamo nella nostra guida per stampare i siti internet in nero su bianco.
Strumenti rapidi per annotazioni e grafica
Non tutti i cambiamenti richiedono di toccare il testo. A volte serve solo evidenziare qualcosa o prendere appunti su una pagina. Se usate Microsoft Edge, avete a disposizione uno strumento integrato che permette di disegnare direttamente sopra il sito. Potete tracciare frecce, sottolineare frasi o scrivere note a mano libera per poi salvare il risultato come immagine.
Per chi invece vuole un'esperienza da grafico, VisBug è l'estensione definitiva. Aggiunge una barra degli strumenti che vi permette di trascinare i bottoni, spostare le immagini o cambiare le dimensioni dei caratteri semplicemente usando il mouse.
Dubbi comuni e curiosità sulla modifica delle pagine
Quando si inizia a modificare l'aspetto di internet, nascono spesso le stesse domande. Ecco le risposte ai dubbi più frequenti.
- Gli altri vedono quello che scrivo? No. Le modifiche avvengono solo nella memoria temporanea del vostro computer. Il sito originale sul server resta intatto.
- Ho fatto un casino, come torno indietro? Basta ricaricare la pagina premendo il tasto F5. Tutto tornerà all'originale in un istante.
- Posso salvare la pagina modificata? Sì, potete fare uno screenshot o cliccare con il tasto destro e scegliere Salva con nome per conservare un file HTML locale con le vostre modifiche.
- Perché su alcuni siti non funziona? I siti ad alta sicurezza (come le banche) bloccano l'esecuzione di comandi nella console per evitare che malintenzionati manipolino i dati visualizzati.
diario di bordo di Navigaweb
In passato usavo questi trucchi quasi ogni giorno, soprattutto per "pulire" le pagine web. C'erano siti pieni di banner pubblicitari enormi e fastidiosi che coprivano tutto il testo; invece di installare mille estensioni, preferivo usare l'ispezione per cancellare a mano il blocco di codice che generava il pop-up e leggere l'articolo in santa pace. Oggi le pubblicità sono più aggressive, ma il comando designMode resta per me uno dei giochi più divertenti: l'ho usato spesso per simulare l'aspetto di un nuovo sito prima ancora di iniziare a programmarlo, o semplicemente per creare screenshot assurdi da mandare agli amici per farli ridere. Il mio consiglio è di provarci: è il modo migliore per capire come è fatto internet "sotto il cofano".
Posta un commento