Durante la fase di progettazione del tuo sito web e quando dovrai andare a definire il design, potrebbero tornarti utili alcuni tool e in questa lezione ti voglio mostrare i tool che utilizzo ogni giorno per gestire al meglio il design e alcune funzionalità per i siti web.

Il primo tool di cui ti voglio parlare si chiama è un tool che contiene qualsiasi cosa di tipo grafico a livello ispirazione, dal web design, dalla stampa, dalle illustrazioni alle animazioni.

Insomma, veramente qualsiasi cosa è molto semplice, basta inserire una parola chiave, come ad esempio freelance o social media market o ristoranti, eccetera, eccetera e si viene indirizzati una serie di risultati.

E questi risultati sono siti web di autori di template o di siti web che sono stati creati per altri clienti da cui possiamo trarre semplicemente ispirazione.

Quindi è già un buon punto di partenza da cui iniziare.

Una altro tool molto interessante si chiama checklist punto design ed è un tool al cui interno puoi trovare una lista di controllo, quindi delle checklist per qualsiasi tipo di elemento da inserire all'interno del tuo sito web, ad esempio, magari stai inserendo un pulsante e vuoi essere sicuro di aver rispettato tutti i criteri design oppure per una tabella e all'interno di questo tool ti aiuterà a raggruppare tutti quei tutti quegli elementi che sono essenziali per creare la tabella nel migliore dei modi, sia per quanto riguarda il design e sia per quanto riguarda l'usabilità un altro tool importante, eh, In questo caso per scegliere i font si chiama fonds punto com.

Se sei stanco di utilizzare i classici font di Google, potresti considerare questo tool dove ci sono dei font, un po' più particolari e sicuramente anche meno visti nel web.

In generale, il tool colos punto com è un tool che è in grado di generare palette di colori diverse e organizzarle anche in varie modalità.

Quindi, se sei alla ricerca di colore, lo puoi utilizzare per scegliere palette di colori per i tuoi progetti di web design.

Poi ho messo Pixabay che è un sito web di foto stock sia a pagamento che gratuite, dove se ti servono delle immagini per il tuo sito web, puoi semplicemente effettuare una ricerca per parola chiave e scaricarle in varie definizioni.

Mi raccomando, in linea generale, quando stai sviluppando un sito web, una delle cose migliori che puoi fare è quella di inserire foto reali, quindi o foto tue personali o foto dell'azienda o scattate comunque da un professionista.

Quindi in linea generale cerca di non utilizzare Photo Stock.

Un altro tool interessante che ti voglio mostrare è tini p N G.

Tieni P N G è un tool che in mezzo secondo è in grado di comprimere e ottimizzare un'immagine Vi faccio vedere proprio un esempio Io adesso trascinerò un'immagine all'interno del tool e da Duecentoquarantadue Kappa la comprime a Attendiamo un secondo a cinquantotto K ridotta del settantasei per cento e questo è un tool molto molto potente che funziona tramite intelligenza artificiale ed è in grado di comprimere e ridurre il peso delle immagini.

Sappiamo benissimo che i tempi di apertura dei siti web sono importanti e più le immagini pesano e più il nostro sito web sa lento.

Quindi in linea generale, quando carichi una foto, se non vuoi comprimere e ottimizza con il tuo programma, ad esempio Camba o Photoshop, puoi utilizzare questo tool ti scarichi la tua immagine.

Ovviamente la dovrai ridimensionare della dimensione corretta che verrà poi mostrata nel tuo sito web.

La passi all'interno di questo tool la comprimi della percentuale che in automatico farà il sistema e poi la scarica e quindi questo è un processo molto veloce per ottimizzare le tue immagini.

Poi c'è Tamba, che probabilmente alcuni di voi conosceranno è un tool che ti consentirà di creare qualsiasi cosa a livello grafico, come ad esempio un logo, un layout di un sito web, un PD F dei post per Facebook, una copertina di YouTube veramente qualsiasi cosa e io lo utilizzo ogni giorno per generare le grafiche per i miei progetti.

Un altro tool molto interessante è Reve B G ed è un tool che tramite l'intelligenza artificiale è in grado di rimuovere automaticamente lo sfondo dalle immagini e vi faccio vedere come è sufficiente trascinare l'immagine all'interno di questa sezione.

Attendere il caricamento e in pochissimo tempo l'immagine viene scontornata automaticamente.

Potrete ovviamente scaricare la versione di questa immagine non in una versione di alta qualità, ma comunque già una buona parte di partenza.

Se volete chiaramente scaricare in alta definizione, è sufficiente sottoscrivere un piano in abbonamento.

L'ultimo tool di cui voglio parlarvi è Flat icone flat icone.

Lo utilizzo quotidianamente per trovare le icone.

Per i miei progetti di siti web è molto semplice.

Basta collegarsi su flat icone punto com ed effettuare una ricerca per parole chiave.

Ad esempio, sto cercando Un'icona per mostrare l'indirizzo di una determinata azienda, quindi posso cercare senza problemi map.

Aspettiamo il caricamento e riceveremo i tutti i risultati di ricerca.

Okay, una volta che i risultati saranno caricati, troverete tante icone per quanto riguarda le icone Outline con colori pieni e potete anche filtrarle, ad esempio, magari vogliamo inserire nel nostro progetto delle icone minimali.

Posso tranquillamente filtrarle per Outline e il sistema mi filtrerà solo le icone di eh questa versione.

Quindi anche qui ci sono veramente tante tante icone.

Ad esempio ho cercato icona map e ho trovato più di sessantanovemila icone disponibili.

Anche questo tool è un tool sia gratuito che a pagamento, ma io nella maggior parte dei casi lo utilizzo nella versione free e mi trovo molto, molto bene.

Un altro tool di di cui voglio parlarvi si chiama Vector Eset appunto a I ed è un tool che vi consentirà di migliorare alcune immagini, ma nella maggior parte dei casi io lo utilizzo per convertire delle icone o immagini da p N G o JPEG al formato S V G ad esempio quando, um come nell'esempio precedente, voglio inserire una icona a forma di mappa per mostrare l'indirizzo di una determinata azienda.

Ovviamente potrei inserire nel sito tranquillamente l'immagine di icona Un p n G o un J P G va già bene e probabilmente peserà anche poco.

Però per ridurre il peso di quell' icona posso anche considerare di convertire quell'immagine in S V G l' S V G è un formato generato tramite alcuni codici H T M L che mostrerà semplicemente l'icona e il formato di un'icona S S V G.

Chiaramente è molto più veloce a caricare rispetto a un'icona p n G o J P G.

Vi mostro un esempio molto veloce di come funziona il sistema.

Io adesso caricherò l'icona una classica di WordPress.

Aspettiamo un attimo il caricamento per convertire questa icona da UM P n G a S V G.

Come vedete, il risultato è praticamente identico e potete procedere tranquillamente al download.

Potete inserire anche um come volete esportare l'immagine, ad esempio P N G ed eseguire ed infine il il download.

Questo questa operazione chiaramente la potete eseguire anche per un logo del vostro web.

Se è un logo non troppo complesso, come ad esempio il logotipo, dove ha semplicemente una un testo.

Potete considerare di inserire un S V G, quindi in linea generale nel vostro sito web, se utilizzate delle icone o qualche tipo di infografica, considerate di convertirle da classico formato i p n G o G p g l S V G per migliorare i tempi di apertura e quindi di ridurre il peso e la dimensione della vostra pagina.