Critica Web Design # 27 Idea Arts

Ogni settimana diamo un'occhiata a un nuovo sito Web e analizziamo il design. Indicheremo sia le aree che sono fatte bene che quelle che potrebbero utilizzare del lavoro. Finalmente, finiremo chiedendoti di fornire il tuo feedback.

Il sito di oggi è Idea Arts.

Se desideri inviare il tuo sito web in una futura Critica del design, ci vogliono solo pochi minuti. Facciamo pagare $ 24 per criticare il tuo design - molto meno di quanto paghi per un consulente per dare un'occhiata al tuo sito! Puoi saperne di più qui.

Informazioni su Idea Arts

Idea Arts è il portfolio personale Goran Ilic, un graphic designer con una passione per la tecnologia per tutta la vita. Il suo sito mostra il suo lavoro recente e i servizi offerti dalla sua compagnia.

Ecco uno screenshot della homepage:

Prima impressione

Idea Arts è, per la maggior parte, un sito attraente. Ci sono alcune buone idee qui al lavoro che hanno portato il design ad un inizio davvero forte. Il contenuto è suddiviso in sezioni chiaramente definite e segue una progressione logica. Ci sono anche alcuni elementi grafici attraenti che catturano in modo efficace l'attenzione dell'utente.

Tuttavia, ci sono molte opportunità per la raffinatezza. Il design è abbastanza solido che non consiglio di ricominciare da capo, ma diversi aspetti potrebbero usare un po 'più di attenzione per portarli alla pari. Di seguito daremo un'occhiata ad alcuni di questi.

Tipografia

Il problema più grande che vedo con questo sito è la tipografia. Per i principianti, nella sola home page vediamo una decina di diverse varianti di dimensione, larghezza, stile, ecc. Questa è quasi sempre una caratteristica negativa. È una buona regola per mantenere i caratteri tipografici a circa 2-3 variazioni per disegno.

Decidi i caratteri tipografici che puoi usare su intestazioni, sottotitoli e copia del corpo. Quindi rendili coerenti per tutto il tuo design piuttosto che trattare ogni sezione come un'area indipendente che può avere le sue caratteristiche uniche.

Inoltre, davvero passare del tempo a costruire il tipo per sembrare attraente. Ciò comporta un'attenta pianificazione di opzioni come l'altezza della linea, il colore e persino le interruzioni di riga. Tutti questi sono piuttosto approssimativi nell'esempio qui sotto.

Per i principianti, l'azzurro non è in contrasto con lo sfondo. Questo può essere facilmente risolto oscurando quel colore fino a quando non si separa veramente dal colore chiaro dietro di esso. Inoltre, la copia più piccola potrebbe usare un po 'più di respiro. L'altezza della linea è semplicemente troppo bassa e rende difficile la lettura, un po 'di rilievo qui e la leggibilità aumenterà notevolmente.

Tuttavia, fai attenzione perché in altre aree del sito l'altezza della linea sembra eccessivamente alta. Raccomando di utilizzare uno strumento online gratuito come Typograph - Scale & Rhythm (mostrato sotto) per aiutare con il flusso dei tuoi paragrafi.

Infine, guarda le interruzioni di riga. È interessante notare che, non solo devi guardare per scomode interruzioni nella formulazione, dovresti prestare attenzione alla forma del paragrafo. Quella sopra sembra un po 'strana e potrebbe facilmente essere ritrasmessa a qualcosa di simile alla versione qui sotto.

Lo spazio bianco

Un'altra area del design che potrebbe utilizzare alcuni tweaking è l'uso di spazi bianchi. Come con la tipografia, questo può essere complicato ed è in gran parte soggettivo. Tuttavia, ci sono alcuni principi di base che possono guidarti lungo la strada.

Ad esempio, ogni volta che si dispone di una raccolta distribuita di elementi, sia verticali che orizzontali, provare a raggruppare gli oggetti visivamente per poi disporli in modo uniforme. Ad esempio, nell'esempio qui sotto, la versione originale ha una spaziatura disparata tra le icone e il testo e gli elementi che dovrebbero essere distinti si incontrano l'un l'altro. Con un po 'di aggiustamenti, creiamo una dichiarazione grafica molto più chiara.

La differenza è sottile ma molto importante. Nota quanto è facile dire quale riga di testo va con quale icona. Ci sono alcune altre aree in tutto il design che potrebbero utilizzare una dose analoga di analisi spaziale. Ad esempio, il testo sottostante si blocca quasi alla fine del suo dispositivo di contenimento. Assicurati sempre di dare molto spazio a elementi come questo.

Come abbiamo visto con i numeri precedenti, questo va in entrambe le direzioni. Il logo, per esempio, sembra che abbia troppa spazio bianco incorporato nello spazio tra le parole.

Tweak, Tweak, Tweak

La morale della storia qui è che anche se decidi di aver creato una pagina di grande effetto, il diavolo è nei dettagli. Mai correre attraverso le piccole cose come la tipografia e la spaziatura. In effetti, potresti dover dedicare più tempo a ottenere questi diritti che a battere il tuo concetto visivo iniziale!

Vale sicuramente la pena investire nel tempo per completare correttamente il tuo sito. Constatare costantemente questa abitudine renderà i vostri progetti molto più raffinati e darà loro una maggiore resistenza al controllo.

Il tuo turno!

Ora che hai letto i miei commenti, inseriscici e dacci una mano dando al designer qualche ulteriore consiglio. Facci sapere cosa pensi sia importante per il design e cosa pensi possa essere più forte. Come sempre, ti chiediamo di essere rispettoso del designer del sito e di offrire una consulenza chiara e costruttiva priva di insulti.