Recensione Quicq: ottimizzazione delle immagini in tempo reale di WordPress
Pubblicato: 2022-02-14Lo sapevi che, in media, le immagini rappresentano circa la metà della dimensione del file di una pagina web media?
Ciò significa che, se stai utilizzando immagini non ottimizzate, tali immagini potrebbero avere un enorme effetto negativo sui tempi di caricamento del tuo sito web.
Quicq è un servizio di Afosto che ti consente di ottimizzare completamente le immagini del tuo sito in tempo reale e di servirle da una rete di distribuzione dei contenuti (CDN) basata su Google Cloud. Oltre alle prestazioni, puoi anche usarlo per manipolare facilmente le immagini, come ritagliarle, aggiungere filigrane e altro.
Funziona con WordPress tramite un plug-in di integrazione dedicato e altre piattaforme come Magento e PrestaShop.
Nella nostra recensione pratica di Quicq, ti mostreremo come funziona Quicq e come puoi usarlo per ottimizzare le immagini del tuo sito WordPress.
Scendiamo...
Recensione Quicq: cosa fa il plugin
Ad alto livello, Quicq si concentra sull'offerta di una soluzione completa per l'ottimizzazione delle immagini di WordPress. È fondamentalmente uno strumento plug-and-play che ti consente di beneficiare di tutte le importanti tattiche di ottimizzazione delle immagini, più su quelle di seguito.
Ci sono due tattiche "principali" a cui la maggior parte delle persone pensa quando si tratta di ottimizzazione delle immagini:
- Ridimensionamento : ridimensionamento delle dimensioni effettive dell'immagine in modo che corrispondano a come la utilizzerai sul tuo sito. Dimensioni più piccole significano meno dati, il che significa una dimensione dell'immagine più piccola.
- Compressione : utilizzo di un algoritmo di compressione per ridurre la dimensione del file dell'immagine senza modificarne le dimensioni, tramite un algoritmo senza perdita ( nessuna modifica della qualità ) o un algoritmo con perdita ( forse una piccola riduzione della qualità ).
Quicq può certamente implementare queste tattiche per te, ma è anche una delle nuove generazioni di plug-in di ottimizzazione delle immagini che vanno oltre il semplice ridimensionamento statico e la compressione delle tue immagini.
Invece, fornisce automaticamente le tue immagini dalla sua CDN basata su Google Cloud e poi le ottimizza in tempo reale per i visitatori.
Non appena attivi Quicq sul tuo sito, ottimizzerà automaticamente tutte le tue immagini con le seguenti ottimizzazioni:
- Servili tramite il CDN Quicq, che è alimentato da Google Cloud. Ciò consente ai visitatori di scaricare le tue immagini dalla posizione CDN più vicina a loro.
- Ridimensiona alla dimensione ottimale in base al dispositivo di ciascun visitatore.
- Comprimi per ridurre le dimensioni del file.
- Convertili in un formato immagine ottimizzato che offre dimensioni inferiori rispetto a JPEG e PNG. Quicq supporta sia WebP che AVIF, un formato immagine più recente che può offrire file di dimensioni ancora più piccole rispetto a WebP. Il supporto AVIF è notevole in quanto non tutti i servizi supportano ancora questo formato immagine più recente.
Tutte queste modifiche porteranno a tempi di caricamento delle immagini molto più rapidi (e, di conseguenza, tempi di caricamento del sito Web).
Perché utilizzare l'ottimizzazione dinamica delle immagini in tempo reale?
Come accennato in precedenza, Quicq utilizza un approccio di ottimizzazione dinamica che ottimizza le immagini in tempo reale.
Cioè, anziché ottimizzare la versione originale dell'immagine sul server del tuo sito WordPress come un plug-in di ottimizzazione tradizionale, Quicq non tocca l'immagine originale ma esegue invece le sue operazioni nel "cloud".
Ci sono alcuni vantaggi in questo approccio di ottimizzazione dinamica.
La cosa più importante è che puoi assicurarti che ogni visitatore veda un'immagine ottimizzata in base alle dimensioni effettive del dispositivo.
Ad esempio, se un visitatore sta navigando sullo schermo di uno smartphone a bassa risoluzione, puoi offrire un'immagine di piccole dimensioni senza influire sulla sua esperienza.
Ma se un visitatore sta navigando su un enorme schermo 4K, il tuo sito può servire senza problemi una versione più grande dell'immagine per assicurarsi che anche lui abbia un'esperienza utente eccezionale.
Poiché Quicq utilizza un approccio di ottimizzazione dinamica e al volo, è in grado di fornire le dimensioni e il formato dell'immagine ottimali per ogni singolo utente.
Questo approccio dinamico è anche molto utile se desideri manipolare le tue immagini perché puoi apportare modifiche all'immagine senza dover modificare il file immagine originale o caricare una nuova versione dell'immagine.
Ad esempio, semplicemente manipolando l'URL di un'immagine, puoi eseguire le seguenti manipolazioni:
- Ritaglia l'immagine in diversi modi.
- Aggiungi una filigrana.
- Sfoca l'immagine.
- Modifica le dimensioni dell'immagine.
- Regola la qualità dell'immagine. Ad esempio, potresti voler utilizzare un'immagine ad alta risoluzione e non compressa in alcuni punti. Puoi farlo facilmente.
- Usa un formato immagine diverso. Ad esempio, WebP o AVIF.
Con Quicq, tutto ciò che devi fare è caricare l'immagine originale una volta. Quindi, puoi eseguire tutte queste manipolazioni aggiungendo alcuni parametri di query aggiuntivi all'URL.
Ad esempio, ecco il link all'immagine originale:
https://cdn.quicq.io/wpmayor/2022/01/pexels-andrea-piacquadio-837358.jpg
Ed ecco un collegamento che ritaglia l'immagine in un quadrato di 1.000 × 1.000:
https://cdn.quicq.io/wpmayor/2022/01/pexels-andrea-piacquadio-837358.jpg?w=1000&h=1000&c=1
Ti mostrerò alcuni esempi reali nella prossima sezione.
Pratica con Quicq: come ottimizzare le immagini di WordPress
Ora che sai cosa fa Quicq, andiamo avanti e ti mostrerò come funziona su WordPress.
Ancora una volta, non è limitato a WordPress, ma offre un plug-in WordPress dedicato che lo rende molto facile da usare con il tuo sito WordPress.
1. Registrati per un account Quicq gratuito
Per iniziare, devi registrarti per un account Quicq/Afosto gratuito. Parlerò poi dei prezzi, ma c'è un generoso piano per sempre gratuito e ottieni anche una prova gratuita illimitata di 14 giorni (senza carta di credito richiesta).
Una volta registrato il tuo account, fai clic sul pulsante Avvia prova gratuita accanto a Quicq nella dashboard di Afosto:
2. Creare un CDN Quicq
Successivamente, devi creare un CDN Quicq, che è essenzialmente ciò che servirà e ottimizzerà le immagini per il tuo sito.
Una volta avviata la versione di prova di Quicq, un'attività per eseguire questa operazione dovrebbe apparire automaticamente nell'elenco delle attività della dashboard principale di Afosto. Se non lo vedi, puoi anche accedere a questa interfaccia facendo clic sull'icona a forma di ingranaggio accanto a Quicq:
Innanzitutto, dovrai inserire l'URL che desideri utilizzare per il tuo Quicq CDN. Le tue immagini verranno caricate da questo URL, quindi ti consigliamo di renderle correlate al tuo sito web.
Ad esempio, se ne stessi creando uno per WP Mayor, creerei l'URL wpmayor .
Quindi, inserisci l'URL diretto a un'immagine esistente sul tuo sito e fai clic su Convalida sito web:
Quicq dovrebbe quindi rilevare automaticamente che stai utilizzando WordPress e generare il percorso delle tue immagini, che dovrebbe essere la cartella dei caricamenti all'interno della cartella wp-content .
Hai anche la possibilità di espandere le Impostazioni avanzate , che ti consentono di controllare il comportamento della cache per le tue immagini. L'impostazione predefinita è 365 giorni, il che dovrebbe andare bene. Ma puoi cambiarlo se lo desideri.
Per finire, fai clic sul pulsante Aggiungi :
3. Installa il plug-in Quicq e aggiungi la chiave URL
Dopo aver creato il tuo account e impostato la tua CDN, puoi installare il plug-in Quicq gratuito da WordPress.org sul tuo sito. Ciò ti consentirà di integrare il tuo sito WordPress con l'immagine CDN che hai appena creato.
Dopo aver attivato il plug-in, vai alla nuova area Quicq nella dashboard di WordPress e aggiungi la chiave URL che hai inserito nel processo di installazione. Cioè, la parte dell'URL CDN che sei stato in grado di personalizzare.
Per il mio esempio, questo è wpmayor .
Quindi, seleziona l'interruttore Quicq attivo e quindi Salva modifiche per renderlo attivo:
E questo è tutto! Il tuo sito WordPress dovrebbe ora iniziare a caricare le sue immagini tramite il CDN di Quicq, che include ottimizzazioni delle immagini in tempo reale.
Una cosa minore che vorrei notare qui è che non penso che l'area del plug-in Quicq dovrebbe essere un'area del menu di primo livello nella dashboard di WordPress. Dal momento che è solo un processo di configurazione una tantum, penso che sarebbe più carino spostarlo in un sottomenu come Impostazioni → Quicq per aiutare gli utenti ad avere un'area di amministrazione più pulita.
4. Manipola immagini con parametri URL (se necessario)
Per la maggior parte dei siti WordPress, non è necessario fare nient'altro per avere immagini ottimizzate. A questo punto, Quicq sta già eseguendo automaticamente le seguenti ottimizzazioni:
- Comprimere/ridimensionare le immagini in modo ottimale in base al dispositivo di ciascun utente.
- Conversione delle immagini nel formato WebP o AVIF a seconda di ciò che funziona meglio.
- Servire le immagini tramite Google Cloud CDN di Quicq.
Tuttavia, come accennato in precedenza, una delle cose interessanti dell'approccio in tempo reale di Quicq è che puoi anche manipolare le tue immagini semplicemente aggiungendo alcuni parametri di query all'URL.
Puoi controllare la pagina della documentazione qui per uno sguardo dettagliato, ma esaminiamo alcuni rapidi esempi di come funziona.
Diciamo che hai un'immagine ampia che usi su una parte del tuo sito. Ora, vuoi usare la stessa immagine, ma ritagliarla in un'immagine quadrata.
Senza Quicq, dovresti aprire il tuo strumento di modifica delle immagini preferito, ritagliare l'immagine e quindi caricare una nuova copia dell'immagine ritagliata da utilizzare.
Con l'elaborazione delle immagini in tempo reale di Quicq, puoi eseguire il ritaglio semplicemente aggiungendo un parametro URL ( e senza influire sull'immagine originale ).
Ecco l'immagine e l'URL originali:
E poi ecco come appare l'immagine quando viene ritagliata in un quadrato di 1000×1000 px aggiungendo questo parametro URL – ?w=1000&h=1000&c=1 :
Ecco un altro esempio...
Diciamo che vuoi fare un ulteriore passo avanti e sfocare l'immagine, oltre a ritagliarla in un quadrato.
Tutto quello che devi fare è aggiungere il parametro sfocatura e impostare quanta sfocatura vuoi usare (da 0 a 3) e la tua immagine sarà sfocata:
Prezzi Quicq
Quicq ha un piano gratuito per sempre piuttosto generoso e quindi piani a pagamento per gli utenti che necessitano di più funzionalità.
Il piano gratuito ti consente di ottimizzare fino a 100.000 immagini al mese* e di servire 25 GB di larghezza di banda CDN al mese per sempre, che dovrebbe essere più che sufficiente per un piccolo sito. Ad esempio, se hai un sito opuscolo/portafoglio di base o un piccolo blog, non credo che lo supererai mai.
*Ricorda, le ottimizzazioni delle immagini avvengono in modo dinamico anziché una volta come un plug-in tradizionale, quindi un'immagine conta come un'ottimizzazione ogni volta che viene caricata.
Se hai bisogno dei piani a pagamento, ti verranno addebitati due parametri:
- Ottimizzazioni : il numero di ottimizzazioni delle immagini che hai al mese.
- Trasferimento dati : la quantità di larghezza di banda che le tue immagini consumano quando vengono servite tramite la CDN.
Questa strategia di fatturazione è un po' più complessa rispetto ad altri plug-in di ottimizzazione delle immagini in tempo reale, che in genere ti fatturano solo in base al numero di visite mensili del tuo sito.
Tuttavia, in realtà mi piace di più questo modello di fatturazione perché penso che sia un modo più equo di fatturazione, anche se rende un po' più difficile stimare il tuo utilizzo.
Con questo approccio, ti verrà addebitato solo in base al tuo utilizzo effettivo, il che probabilmente ti aiuterà a risparmiare denaro.
Per scoprire quanto pagherai, puoi utilizzare il calcolatore nella pagina dei prezzi.
Se non sei sicuro dell'utilizzo del tuo sito, puoi semplicemente utilizzare il piano gratuito per iniziare o c'è anche una prova gratuita di 14 giorni dei piani di utilizzo più elevato, che dovrebbe darti una buona comprensione dell'utilizzo del tuo sito:
Se hai bisogno dei piani premium, puoi ottenere uno sconto del 20% sui primi due mesi su tutti i pacchetti con il nostro codice coupon esclusivo:
Considerazioni finali su Quicq
Nel complesso, so che molti siti stanno passando a questo approccio di ottimizzazione delle immagini in tempo reale.
Penso che questo approccio abbia molto da offrire grazie alla flessibilità che ti offre in termini di manipolazione delle tue immagini e assicurandoti che ogni visitatore veda un'immagine ottimizzata per la sua situazione unica.
Quicq non è il primo plug-in a portarlo su WordPress, ma ha alcune cose utili:
- Ha un livello gratuito molto generoso. Ha il livello gratuito più alto che abbia mai visto.
- Mi piace il suo modello di prezzo per le opzioni premium perché paghi solo in base al tuo utilizzo effettivo. Anche se rende un po' più complicati i prezzi, penso che sia un modo "più equo" per fatturare. Inoltre, puoi sempre utilizzare la prova illimitata di 14 giorni per calcolare l'utilizzo effettivo del tuo sito se non sei sicuro di quanto pagherai.
- Ti consente comunque di eseguire altre manipolazioni dell'immagine come ritaglio, sfocatura e così via. La maggior parte degli altri plugin di WordPress di cui sono a conoscenza si concentrano solo sulle prestazioni o ti danno solo accesso alla filigrana, quindi è bello che Quicq vada oltre. La maggior parte degli utenti occasionali probabilmente non li utilizzerà, ma è utile per utenti e sviluppatori avanzati.
Se vuoi provarlo, Quicq ha un generoso piano gratuito per sempre e una prova gratuita illimitata di 14 giorni per aiutarti a capire il tuo utilizzo. Puoi fare clic sui pulsanti qui sotto per iniziare: