Logo web design

Cosa considerare quando si progetta un logo per un sito web

Il design di un logo per un sito web segue regole completamente diverse rispetto a quelle della stampa o di altri tipi di comunicazione. I requisiti per i loghi e le insegne sono cresciuti. Ti mostriamo le linee guida e gli strumenti per creare il tuo logo web.

Design del logo per la stampa e il web

Esiste un confine molto permeabile tra il web design e il graphic design. I graphic designer spesso si concentrano sulla stampa, progettando cancelleria aziendale, poster, pubblicità e loghi. I web designer, invece, creano siti web, newsletter, banner e, ovviamente, loghi.

Alcuni mescolano entrambe le aree di business, offrendo design per la stampa e per il web. Non è chiaro al cliente finale chi può fare cosa e forse chi non deve fare cosa. Poi i graphic designer che si trovano più a loro agio con la stampa creano design per i siti web e mettono i loghi della stampa sul web. Al contrario, è piuttosto un'eccezione che i web designer sviluppino interi documenti aziendali.

Dovrebbe essere ovvio per chiunque abbia un "occhio grafico" o una professione di graphic design che un logo su un sito web ha requisiti diversi rispetto a un logo su carta intestata o su un edificio aziendale.

Con l'avvento degli smartphone e dell'internet mobile, i requisiti per i loghi e le insegne (piccoli elementi grafici che possono essere utilizzati come loghi) sul web sono cambiati ancora una volta e sono diventati più specifici, ma anche più severi. Alla fine, non è così complicato. Tuttavia, per sviluppare un buon logo per un sito web ci vogliono esperienza e abilità.

3 Linee guida per la creazione di un logo

Ci sono tre punti fondamentali da considerare quando si progetta un logo:

  • Formato orizzontale: il logo appare in alto a sinistra, questo è ciò che gli utenti si aspettano. A volte è consentito anche nel mezzo del sito web. Ma per risparmiare spazio prezioso e attirare l'attenzione degli utenti sull'essenziale, ha senso tenere conto delle abitudini di visualizzazione delle persone, con un logo in formato orizzontale nella parte superiore del lato sinistro.
  • Strutture chiare: è fondamentale considerare le dimensioni del logo su uno smartphone o un tablet. Ma anche molti desktop e laptop hanno una risoluzione molto alta, cioè molto spazio, oppure una diagonale dell'immagine piuttosto piccola. In entrambi i casi, il logo può apparire piuttosto piccolo. Tuttavia, deve funzionare bene anche in dimensioni ridotte.
  • Nessun reclamo: Molti clienti, ma anche designer, sentono l'inclinazione, a volte irresistibile, di inserire un claim sotto il logo. Il testo nell'immagine, in altre parole. Non ha molto senso. Non è solo una questione di spazio, ma anche di scarsa leggibilità sugli smartphone. Per non parlare del fatto che esclude un testo prezioso dall'indicizzazione di Google (SEO).

Mi rendo conto che queste tre semplici "regole" per creare un buon logo sono aperte al dibattito. Perché ovviamente è possibile trovare alcuni controesempi o marchi che più o meno (vogliono) avere le proprie regole. Ma si tratta di marchi molto speciali e di successo, e anche in questo caso le eccezioni confermano la regola.

Ma cosa rende i loghi belli? Il modo migliore per scoprirlo è osservare i loghi e/o le insegne delle aziende di successo e di grandi dimensioni. I loghi più ingegnosi che conosco sono quelli di Daimler (la stella di Mercedes), Apple (con la mela), VW, BBC o la M di McDonalds. Ovviamente ci sono molti altri esempi. E la maggior parte di essi risale a un'epoca in cui non c'era internet. Tuttavia, i loghi si evolvono nel tempo, proprio come i marchi e le aziende.

logo weblogos design
Il design dei logo è più vario che mai.

Idealmente, ci sono loghi che si adattano ai diversi formati di uscita. Anche i loghi preferiti appena menzionati sono fulgidi esempi di questo. Funzionano ovunque e si adattano ai rispettivi media con i loro requisiti specifici. Logico: una carta intestata ha bisogno di qualcosa di diverso da un'insegna al neon su una casa, e un sito web ha condizioni diverse da un biglietto da visita.

Signet & word mark in rete

Questo post non è un workshop completo su come creare un logo perfetto. C'è certamente di più che leggere un post sul blog. Ma dovrebbe aiutarvi a capire meglio la questione del logo sul vostro sito web - e per questo a trovare soluzioni di maggior successo.

Solo un rapido riassunto: Cos'è un logo? Wikipedia dice:

"Un logo è un segno grafico che rappresenta un soggetto specifico. Può trattarsi di un'azienda, di un'organizzazione, di un privato o di un prodotto".

Fin qui tutto bene. Un logo può essere un marchio verbale, come Coca Cola, Google o Acer. Può essere una firma, come nel caso di Playboy, Shell e Mercedes. Nella maggior parte dei casi, tuttavia, i loghi sono costituiti da una parola e da un segno distintivo. Negli esempi di firma sopra riportati, c'è sempre una variante con e senza il marchio.

Questo vale anche per McDonalds, ad esempio, con la caratteristica M che tutti conoscono. Il logo McDonalds è disponibile con il nome e con il claim (lo adoro), ma la M è sempre presente. Sul sito web di McDonalds, per i motivi sopra citati, hanno risolto il problema in modo tale da trovare questa M solo in alto a sinistra nella navigazione - e la navigazione si sposta quando si scorre. Solo la M è ancora presente ad un certo punto. Lo trovo intelligente e poco ingombrante, perché la cosa più importante è sempre visibile: il sigillo, la "M".

Guardiamo il logo del sito web del WWF, per fare un esempio più politicamente corretto. Il famoso panda, che potrebbe anche stare in piedi da solo, è posizionato sopra le lettere WWF, l'abbreviazione del World Wildlife Fund. Trovo che il sito web sia abbastanza riuscito (TYPO3, tra l'altro), ma non riescono a definire la navigazione principale. Questo problema è stato risolto in modo intelligente. Occupa un po' di spazio, ma contiene tutto l'essenziale.

Grazie alla tecnologia Mega Menu, il secondo livello di navigazione mostra tutto ciò che c'è da vedere sul sito. Se apri il mega menu con il mouse, rimane visibile solo il panda. Si tratta di un logo verticale, ma la sua realizzazione è impeccabile. Anche questo logo risale a un'epoca in cui non esistevano i siti web. Sono sicuro che oggi il WWF avrebbe creato un logo diverso, in formato orizzontale.

"*" indica i campi obbligatori

Consenso*
Questo campo è per la convalida e non deve essere modificato.

Esempi con logo in formato orizzontale

Raidboxes è un interessante esempio di design di logo. Un marchio di parole, ovviamente in formato orizzontale, altrimenti non riusciresti a leggerlo. Per me questo logo è un successo. Perché ha un alto valore di riconoscimento, che è l'essenza di un buon logo. Inoltre, funziona anche in formato ridotto sui dispositivi mobili. Questo vale per molti siti della rete moderna, come Google, Facebook, Amazon, Microsoft, YouTube e molti altri.

Raidboxes logo design del logo
Il logo di Raidboxes: Design del logo

Possiamo dire la stessa cosa del WordPress.org dire. Esistono delle specifiche per la presentazione del logo di WordPress che sono visibili a tutti: una guida di stile. Il logo presenta la W come un'insegna e la parola mark in formato orizzontale, ma anche sul bordo. Sul sito web, il logo verticale è ovviamente omesso. Per buone ragioni, il logo con la sigla non solo viene mostrato in orizzontale, ma anche relativamente grande sopra la navigazione. Anche in questo caso il menu non è fisso, il che non pregiudica l'usabilità del sito.

Il nostro rilancio su Raidboxes

Nuovo logo, nuovo sito web, nuovi colori e stesso nome. Stiamo festeggiando il nostro rilancio su Raidboxes ! Insieme alla nostra agenzia partner 360Vier, abbiamo ripensato la nostra identità aziendale e dato una nuova mano di vernice al nostro sito web.

Esempi di siti web con WordPress

Un altro sito web affascinante che ci serve da esempio è VOGUE America. Trovo che l'implementazione sia coerente e adeguata al marchio. Ma piuttosto debole nella navigazione fissa dopo lo scorrimento. Questo perché il grande logo al centro scompare e appare in Klein in alto a sinistra, dove ci aspettiamo che sia. Si tratta di una sfida generale con i marchi di parole che devono essere ridimensionati sul sito web. I bordi si "sfilacciano" e diventano sfocati.

Lo stesso fenomeno si può osservare su SPIEGEL Online (SPON). Per entrambi, la scusa può essere che i loghi sono stati creati prima dell'era di internet. La stessa cosa accade con VOGUE alla rivista americana TIME, che funziona su WordPress.

Ha un aspetto un po' diverso all'open NASA, anch'esso alimentato da WordPress e anche con un logo. Tuttavia, circondato da un bell'elemento grafico. Questo logo - questa volta all'interno di una navigazione fissa - è abbastanza grande da mostrare l'elemento di un'orbita ancora riconoscibile. Lo trovo riuscito, anche se si può vedere lo sfrangiamento delle lettere anche qui. Ecco perché non sono un fan dei marchi di parole puri, preferisco le insegne con abbreviazioni.

BBC AMERICA è anche un sito WordPress. Ha fatto un ottimo lavoro con il design e il logo. Sì, sono un fan della BBC. Ma trovo anche che il logo sia ingegnoso e memorabile, in quanto esempio riuscito di design di logo in formato orizzontale. A proposito, anche questo sito fa a meno di una navigazione fissa dopo lo scorrimento: qui il contenuto è in primo piano.

Crea (fai creare) un buon logo per il web

Così ora potete vedere molto chiaramente che i loghi non sono una stregoneria e a volte sono molto semplici. Derivano il loro genio dalla semplicità e dalla coerenza per riflettere un marchio indipendente. Un buon logo è quindi molto facile da fare, ma non facile da pensare o da trovare.

Grafico o no: puoi creare un buon logo per te e per i tuoi clienti con il tuo occhio esperto di grafica e alcune semplici regole. Naturalmente, il modo più semplice è assumere un grafico. Questo è il metodo più sicuro e di qualità garantita - le eccezioni confermano la regola. Ma è anche l'opzione più costosa.

In rete, abbiamo indovinato, ci sono portali che esternalizzano questi servizi all'estero. In questo modo puoi acquistare un buon design grafico in paesi con salari orari più bassi e alta qualità. Ad esempio, dall'Ucraina, dall'India, dall'Indonesia, dal Sud America, ma anche dagli Stati Uniti, ecc. Gli svantaggi sono rappresentati dalla situazione legale in caso di controversie. Gli svantaggi sono la situazione legale in caso di controversie, la comunicazione e quindi a volte anche il coordinamento.

Dato che ho un occhio di riguardo per la grafica e voglio fare il più possibile da sola, ho scelto una strada diversa per il mio logo su PUBLISHING ON THE NET. Ho cercato e trovato un'insegna su Envato. Pensavo di riuscire a creare un logo per l'azienda. Perché il bracciale che mi piaceva aveva il contenuto sbagliato. Un logo deve assolutamente adattarsi al tema e al carattere della tua azienda.

Così ho trovato un segno @ che volevo utilizzare, ma con una "P" nel cerchio @. All'inizio ho provato a farlo da solo, ma ho poca esperienza con i vettori in Illustrator. Così, senza ulteriori indugi, ho chiesto allo sviluppatore della scritta tramite Envato se poteva farlo per me e a quale prezzo. Era possibile e il costo era assolutamente ragionevole. Ora ho questa "P" con la scritta in formato orizzontale:

Esempio di logo online
Il logo di PUBLIZIEREN IM NETZ

Logo design: Strumenti di ricerca

Questo è esattamente il modo in cui procedo per i miei clienti. Se si desidera creare un logo, suggerisco di scegliere prima di tutto un segno che si adatti all'idea di business e al nome. Non uso solo Envato o Envato Elements. Cerco i loghi anche su Google o su Iconfinder, iStockPhoto e altri fornitori di grafica di piccole dimensioni. Poi li mostro al cliente, ne scelgo uno o due insieme a lui e costruisco un logo in formato orizzontale.

Fai attenzione al copyright, il tuo logo non deve essere troppo simile a uno già esistente. Anche se compri dei firmacopie, devi controllare (o far controllare) la licenza: La licenza è valida per i tuoi scopi professionali senza restrizioni temporali o geografiche? E anche per usarlo come logo?

I buoni loghi sono semplici ed esprimono il più possibile l'idea aziendale. Funzionano sul sito web perché sono in formato orizzontale. Possono essere visualizzati in bianco e nero. E possono essere visualizzati su una carta intestata o su un biglietto da visita - leggermente modificati e adattati, magari con un claim sotto.

Sommario: Progettazione di loghi per siti web

Creare un buon logo è relativamente facile. Devi avere un concetto chiaro e un'idea eccellente. Puoi trarre ispirazione da altri marchi e siti web di successo. Anche parlare con i tuoi colleghi e amici può aiutarti a trovare un'idea semplice e brillante. Ma siamo onesti: non è necessario che sia brillante, può essere sufficiente un livello adeguato, un buon livello sarebbe già più che sufficiente. Puoi cercare i loghi o le insegne sulle piattaforme grafiche.

Naturalmente, i segni più o meno astratti dovrebbero avere qualcosa a che fare con la professione che rappresentano. Ma ci possono essere anche combinazioni divertenti. Oppure le derivazioni coerenti, ad esempio quando pensiamo alla famosa mela di Apple. Chi avrebbe mai pensato di prendere una mela con un morso mancante. Ma questo piccolo e divertente "perturbatore" è ciò che rende questo logo così ingegnoso.

Spero che ora tu abbia qualche spunto per creare un prossimo fantastico logo per il World Wide Web. Ti auguro buona fortuna e buon divertimento.

Le tue domande sul design del logo

Hai domande sul design di un logo per siti web? Sentiti libero di utilizzare la funzione di commento. Vuoi essere informato sui nuovi articoli sul web design e su WordPress? Allora seguici su Twitter, Facebook o tramite la nostra newsletter.

Ti è piaciuto l'articolo?

Con la tua valutazione ci aiuti a migliorare ancora di più il nostro contenuto.

Scrivi un commento

Il tuo indirizzo e-mail non sarà pubblicato. I campi obbligatori sono contrassegnati da *.