X

Lavorare con le immagini, 17 tools online utili per UX e WEB Design

Capita di lavorare su postazioni in cui non abbiamo a disposizione software per il trattamento delle immagini, in questi casi è sempre utile avere a “portata di preferiti” qualche tools online.

In questo articolo vi presento i miei tools preferiti per preparare immagini per post sui social o su un blog e per il foto ritocco (diciamo un fotoritocco di base, quelle poche operazioni che possono esserci utili quando creiamo un post per il nostro blog), anzi direi che sono tools online indispensabili sia per un webmaster sia per chi lavora sui contenuti, è infatti fondamentale non sottovalutare l’importanza degli aspetti visual e grafici.

Piccola nota:

Per quanto riguarda invece gli stock foto che utilizzo per reperire fotografie vi rimando a questo post: I migliori stockphoto gratis gli elementi “visual” sono fondamentali per tutti i progetti web, per aumentare la soddisfazione dei lettori e per incrementare le conversioni sulle schede articoli, ne ho parlato anche in: E-commerce: creare una scheda prodotto che funziona, aiuta l’utente e converte

Tools on-line di foto ritocco e gestione immagini per il web e i social che non possono mancare nei tuoi preferiti!

Ecco alcuni tools indispensabili per ogni webmaster (o webbari come diciamo qui a Firenze) o per chi lavora con il web ed ha necessità di trattare immagini  (per un post sul blog, per trattare una foto di un prodotto, per realizzare un post per Facebook ecc), non sempre infatti abbiamo a disposizione software di grafica installati sul pc dove stiamo lavorando.

Tools online per ottimizzare e comprimere le nostre immagini

La velocità è un elemento fondamentale sia per migliorare l’esperienza di navigazione del nostro sito web sia per la SEO (e come consulente seo spesso noto come l’aspetto dell’ottimizzazione e della compressione corretta delle foto sia un elemento poco curato), iniziamo quindi con alcuni tools online per migliorare la compressione delle immagini e quindi ridurne la dimensioni in termini di KB senza rinunciare alla qualità!

Eccovi una lista, tutti tools per la compressione delle immagini semplicissimi da usare, basta caricare le immagini e il tool pensa alla ottimizzazione facendo salva la qualità dell’immagine

  1. https://compressor.io/
  2. http://compressjpeg.com/it/ (interfaccia in italiano)
  3. https://imagify.io/ (tools professionale per l’ottimizzazione delle immagini del tuo sito web, a pagamento, ma con versione free di prova ottimo per esempio per gli shop online perchè può essere interfacciato sia con CMS open sia con codice custom, in questo modo, ogni volta che viene caricata una immagine questa viene ottimizzata e compressa correttamente, migliorando le performance di caricamento delle pagine web)
  4. https://tinyjpg.com/

Collage di foto, composizioni di immagini e creazioni “visual” per post su Facebook o su blog

Può capitare di dover “aggregare” immagini insieme per costruire elementi visual per post su Facebook oppure per accompagnare un post sul blog, questi tools consentono di creare griglie caricando immagini dal proprio pc, creare composizioni, creare creatività utilizzando elementi e forme grafiche pre-confezionate, aggiungendo anche testo alle proprie composizioni, ve ne propongo alcuni molto semplici ed interessanti da provare:

  1. https://www.befunky.com/create/collage/ (interfaccia web in lingua italiana)
  2. http://www.fotor.com/app.html (uno dei miei preferiti, ottime funzioni anche per il trattamento “base” delle immagini)
  3. https://beta2.createer.com/

Software online per la progettazione grafica e il web design

Infine non potevano mancare dei tools per la progettazione grafica vera e propria, quindi, di fatto, quasi dei software per designer quasi completi, anzi secondo me, più che sufficienti per la realizzazione di elaborazioni grafiche semplici ma efficaci (banner, immagini composte ecc) per il web e per i social network, tra i tanti a disposizione, ve ne segnalo tre che mi è capitato di utilizzare in situazioni di “emergenza”:

  1. https://www.canva.com/it_it/ (Software online per la progettazione grafica davvero semplicissimo da usare con tantissime funzionalità assolutamente da provare, registrazione obbligatoria)
  2. https://www.sumopaint.com/home/#app (l’applicazione online di Sumo Paint, un software di grafica e foto-ritocco che, nell’interfaccia ed in alcune funzionalità come per esempio l’applicazione di filtri e dei livelli / layers, somiglia molto al mitico Photoshop, certo meno funzioni, ma indubbiamente per essere un tools online molto funzionale ed utile)
  3. http://online-photo-editor.com/ (meno completo degli altri due, comunque da segnalare come strumento “basico” per semplici operazione di foto ritocco e ritaglio immagine, con interfaccia in lingua italiana)
  4. https://www.befunky.com/create/

Estensioni per il browser Chrome utili per la grafica web e per il fotoritocco

Ecco alcune estensioni/plugin per Chrome (ma direi tutte hanno il loro corrispettivo per Firefox se preferite tale browser web) davvero fondamentali ed utilissime per la grafica web, ce ne sono davvero tantissime, presto dedicherò un post ad-hoc a questo argomento condividendo con voi le estensioni che utilizzo quotidianamente o quasi nel mio lavoro di webmaster o come consulente di web marketing e SEO, intanto una anticipazione dedicata al fotoritocco e al “trattamento delle immagini” per il web.

  1. Colorzilla: consente di individuare con precisione qualsiasi colore presente su una pagina web, molto utile per elaborare i vostri CSS oppure per “pescare” con esattezza un colore che vorreste riprodurre (http://bit.ly/2fLvJox)
  2. Awesome Screenshot: non proprio una estensione legata al web design o al trattamento delle immagini ma non potevo non segnalarla in questo post. Consente con estrema facilità di creare degli “stamp” della schermata che state visualizzando aggiungendo elementi grafici con estrema facilità: testi, frecce ecc. (http://bit.ly/2ftIH7n)
  3. Fatkun Batch Scarica immagine: consente di scaricare velocemente tutte le immagini di una determinata pagina web (http://bit.ly/2f2OKPT)
  4. Imgus: consente di visualizzare alle sue dimensioni massime una fotografia presente su una pagina internet su cui stiamo navigando (http://bit.ly/2fGRzak)
  5. MeasureIt: consente di carpire le dimensioni di un qualsiasi elemento di una pagina web, quindi anche delle immagini, utile per velocizzare questa tipologia di operazione (http://bit.ly/2ftJCVw)
  6. Search by image: in un click consente di utilizzare la comodissima funzione di Google Image per verificare se una immagine è utilizzata in altri siti web o comunque per cercare su Google tramite una immagine (http://bit.ly/2fL0ypJ)

La lista potrebbe continuare con altri tools online (oppure con altre estensioni per Chrome o per Firefox) ma queste secondo me sono le IMPRESCINDIBILI quelle che non possono mancare nei preferiti di un web designer o di un professionista del web 😉

 

Related Post