[et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”4.16″ global_colors_info=”{}”][et_pb_row admin_label=”row” _builder_version=”4.16″ background_size=”initial” background_position=”top_left” background_repeat=”repeat” global_colors_info=”{}”][et_pb_column type=”4_4″ _builder_version=”4.16″ custom_padding=”|||” global_colors_info=”{}” custom_padding__hover=”|||”][et_pb_text _builder_version=”4.18.0″ _module_preset=”default” global_colors_info=”{}”]
Strumenti utili per web designer ? Eccoti una lista che può tornarti utile se sei agli inizi o autodidatta.
I migliori strumenti per web designer
Chi fa il lavoro di web designer già da un po’ di tempo, sa che non è possibile svolgere questo lavoro senza specifici software. Ce ne sono tantissimi disponibili online, e a ogni web designer a cui chiederai cosa c’è nella sua “cassetta degli attrezzi” ti risponderà una lista di strumenti.
Ognuno dei professionisti chiamati in causa avrà la sua lista di software.
Certo, quando si parla Web Design ci sono degli strumenti che ti aspetteresti di trovare sempre come PhotoShop, Illustrator, InDesign ecc. Qui non troverai questi strumenti, fermo restando che coloro che operano in questo campo non possono non conoscere PhotoShop & company. Qui vogliamo invece consigliarti altri strumenti particolarmente utili per i web designer.
FFonts
Chi si occupa di Web Design deve anche decidere che tipo di font proporre nelle pagine del sito, dando ovviamente quell’idea di continuità che è alla base di un progetto ben strutturato. Da questo punto di vista, FFonts si conferma come uno strumento assai utile. Stiamo parlando in pratica di una libreria online estremamente nutrita, con decine di migliaia di caratteri tra cui poter scegliere per dare al sito un’identità ben definita.
Google Web Designer
Poteva mancare Google dalla lista degli strumenti per persone che lavorano su internet? Certo che no, e infatti ecco uno strumento che il motore di ricerca più usato al mondo mette a disposizione dei professionisti del Web Design. Lo strumento, chiamato Google Web Designer (giusto per non lasciare adito a dubbi) permette agli “artisti dell’immagine” di creare banner pubblicitari e tutti quegli elementi che devono far parte di una pagina web.
Canva
Uno strumento davvero affascinante, che può aiutare tantissimo i web designer (ma anche graphic e visual designer) a creare delle grafiche da proporre poi sui siti internet o anche su altri canali. Si possono creare banner, cover, documenti, post per i diversi social network, infografiche e tantissime altre cose. Non sarà forse il più indicato per fare Web Design, ma di certo Canva può far parte della “cassetta degli attrezzi” di chi lavora nel campo delle immagini e del fattore visivo della comunicazione. Canva è disponibile sia in versione gratuita che in versione pro.
Elementor
Uno strumento molto famoso che si integra perfettamente con il numero uno dei CMS (stiamo parlando ovviamente di WordPress). Per quel che riguarda Elementor, basti dire che esso è un sitebuilder, utilizzabile con WordPress, che permette ai web designer di fare delle modifiche al sito dal punto di vista dell’aspetto, della disposizione dei vari elementi grafici. Un aspetto di cui tener conto è che questo strumento può essere utilizzato senza mettere mai mano nel codice. Si può infatti lavorare sulla parte grafica, non sul codice.
Balsamiq
Chiudiamo questa lista di strumenti per web designer con Balsamiq, uno dei più interessanti in assoluto. Incentrato sul wireframing, questo tool risulta disponibile in due versioni differenti: una per il destktop, con un’apposita applicazione (chiamata Mockups 3), l’altra con un’applicazione scaricabile sul Cloud e che prende il nome di myBalsamiq. Lo strumento è disponibile per 30 giorni in versione gratuita, dopodiché si potrà scegliere il pacchetto che meglio corrisponde alle proprie esigenze.
Adobe Experience Design CC
Con Experience Design CC puoi creare un prototipo di interfaccia web velocemente. Si può considerare uno strumento “tutto incluso” per la progettazione e creazione di siti web e app per sistemi mobile. Inoltre, puoi testare le anteprime dell’interfaccia che hai disegnato e valutare l’usabilità e l’effetto dell’esperienza utente.
JPEG.io
Un SEO fatto bene impone alle pagine web di essere leggere e quindi di caricarsi velocemente. Esistono certamente software professionali come Adobe Photoshop che con la sua funzione “salva per web” aiuta molto e permette un’ottimizzazione interessante delle immagini (se ben parametrata). Oppure esistono tool web-based come Jpeg.io.
Questo strumento ti permette di convertire le immagini in JPEG ottimizzate per il web.
JPEG.io rende facile convertire qualsiasi formato di immagine grande in un formato JPEG altamente ottimizzato. Basta trascinare e rilasciare i file di immagine (sono accettati i formati JPG, PNG, GIF, SVG, BMP, EPS, PSD, TIFF e WebP) nell’apposito spazio che vedi subito nella home del sito (o importare da Dropbox, Google Drive, o Box) e questi verranno convertiti in JPEG progressivi destinati poi a un’ulteriore ottimizzazione.
Un’ottimo tool gratuito.
Font Reacher
Font Reach è uno strumento di cui non posso fare più a meno: questa piattaforma è in grado di scansionare milioni di siti mostrandoti come risultato finale il font utilizzato in un particolare sito web di tuo interesse. Se sei un web designer e sei rimasto catturato da un particolare font utilizzato all’interno di un sito web allora questo è uno di quei strumenti per il web che fa al caso tuo.
WebFlow
WebFlow è un altro strumento per il web “drag and drop” professionale e indirizzato alla progettazione di siti web. Utilizzando le migliori pratiche di responsive design, il servizio consente alle aziende e ai liberi professionisti di progettare e pubblicare siti web senza alcuna codifica, grazie anche a un sistema di trascinamento di oggetti ed elementi nell’interfaccia molto comodo e versatile.
Material.io
Material Design è un sistema unificato che combina teoria, risorse e strumenti per la creazione di esperienze digitali. Questa è la presentazione di una combinazione di tools gestiti e offerti niente popo di meno che da casa Google.
Parliamo quindi di un insieme di strumenti per il web, ognuno dedicato a una funzione precisa. Tra quelli che puoi vedere nel sito, c’è né uno in particolare che voglio presentarti: Material Resizer.
Molto semplicemente, questo strumento ti permette di verificare quanto è responsive un certo sito web: inserisci l’url del sito che vuoi controllare nel campo che trovi al centro nella barra superiore dopodicché, spostandoti sulla destra, puoi selezionare la modalità di vista a seconda del differente device di navigazione. Strumento utile, veloce e soprattutto visual.
SiteInspire
Cerchi l’ispirazione giusta per disegnare il tuo sito o quello di un tuo cliente? Vuoi realizzare un sito web innovativo, fresco e di tendenza? Allora SiteInspire è lo strumento web che fa per te.
Parliamo di una vetrina fatta di anteprime di siti web di tendenza caricati con cadenza giornaliera dalla piattaforma, e consultabili per stile, tipologia, argomento e caratteristiche.
CSS Nectar
CSS Nectar è un’altra ottima fonte di ispirazione per il tuo web design, con nuovi siti aggiunti alla vetrina principale ogni giorno.
Il motore di ricerca interno è ben fatto e comprende filtri molto precisi che permettono di definire le singole ricerche in funzione del colore preferito, delle caratteristiche tecniche (stili css compresi), paese di sviluppo e categoria di appartenenza. Infine, gli utenti possono votare il sito che preferiscono e questo lo farà salire di ranking nei risultati delle ricerche interne.
CodePen
E’ considerato il ‘parco giochi per il front-end web’ e sembra non delude mai le aspettative. Un esempio di cosa si può ottenere con CodePen? Grazie a una raccolta di 21 progetti HTML pubblicati assieme al codice sorgente (ed è un numero destinato a salire) puoi scoprire come eliminare fastidiosi bug che incontri durante la fase di progettazione e nello stesso tempo hai modo di confrontarti con lavori già chiusi che ti permettono di migliorare il tuo ancora in corso.
Naturalmente puoi trovare ispirazione da esempi e modelli per tutti i tuoi progetti web.
WeLoveIconFonts
WeLoveIconFonts occupa un posto speciale nei cuori di molti web designer. È come una versione open source di Google Fonts, ma invece dei font trovi le icone stilizzate e ottimizzate per il web. Ogni pacchetto di icone/font è libero da diritti di utilizzo e immediatamente scaricabile, può essere inoltre facilmente integrato nel tuo file CSS. Ma attenzione però, perché mentre le icone/font sono semplici da implementare nei tuoi progetti web, si potrebbe rischiare una riduzione della nitidezza e quindi della resa a monitor rispetto ai vettori SVG.
Crayon
Uno dei miei strumenti per web preferiti, Crayon mette a disposizione una collezione estremamente completa di esempi di progettazione web e dati di marketing a corredo praticamente da tutto il web. Per accedervi basta creare un account gratuito e il gioco è fatto.
[/et_pb_text][et_pb_text _builder_version=”4.18.0″ _module_preset=”default” global_colors_info=”{}”]
- Che cosa è la mail marketing
- Che cosa è il video content marketing
- Che cos’è il content marketing
- Cos’è la local seo
- 7 Motivazioni per creare Ecommerce
- 5 Differenze tra ux e ui
[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]