Highwire di Web Design Critique # 25

Benvenuti alla nostra 25a critica del design! Ogni settimana diamo un'occhiata a un nuovo sito Web e analizziamo il design. Indicheremo sia le aree che vengono fatte bene, sia quelle che potrebbero usare del lavoro. Finalmente, finiremo chiedendoti di presentare e fornire il tuo feedback. Vota nel sondaggio in fondo a questa pagina e / o lascia un commento con i tuoi pensieri!

Il sito di oggi è Highwire.com, una piattaforma di negozio online personalizzata.

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 Highwire

? Creare il proprio negozio e-commerce non è mai stato così facile e conveniente. Iscriviti per una prova gratuita oggi e inizia a costruire il tuo negozio in pochi minuti !?

Ecco uno screenshot della homepage:

Impressione generale

Se ti fermi oggi per sentirmi fregare sul cattivo design, sarai deluso. Penso che questo potrebbe essere solo il miglior design del sito web presentato ancora per una critica del design.

Highwire è semplicemente un sito stupendo ed è così ben fatto che saremo costretti a usarlo come uno strumento di insegnamento più positivo di uno negativo. Continua a leggere perché c'è un sacco che possiamo imparare analizzando questo design. E non preoccuparti, ci sono alcune piccole cose che suggerirò di migliorare lungo la strada.

Palette dei colori

La dichiarazione più audace fatta su questo sito è il colore. La qualità delle immagini è eccellente, ma è il colore che attira davvero la tua attenzione non appena carichi la pagina. I colori base usati qui non stanno esattamente rompendo lo stampo: verde, rosso, blu, grigio e un po 'arancione, ma sono mescolati in modo molto attraente.

Notate però che hanno scelto una tonalità super luminosa di ogni colore che salta davvero fuori dalla pagina. Una miscela di gradienti radiali e lineari fa sembrare i colori molto più vibranti e vivi mentre portano una sottile suggestione di consistenza.

Layout e allineamento

Il layout di questo sito è solido e sfrutta davvero l'uso corretto degli spazi bianchi e della distribuzione del peso visivo. Si noti nell'immagine modificata sotto come sono state stabilite le linee verticali per assicurarsi che tutto sia bello e stretto.

Si noti inoltre che il progettista ha scelto un allineamento a sinistra e bloccato su di esso. Tutto il testo è allineato a sinistra e anche i pulsanti sotto le miniature seguono questa tendenza. I tuoi disegni tendono a sembrare molto più coerenti e coerenti quando si evita di cambiare allineamenti a inversioni casuali in tutto il progetto.

Nonostante siano diverse sezioni del codice, l'intestazione e il piè di pagina usano la stessa sfumatura in modo da ottenere l'illusione di uno sfondo continuo che il contenuto fluttua sopra. Sembra che abbiano semplicemente stilizzato il body tag, ma ha il vantaggio della semantica di mantenere in realtà una forte intestazione e piè di pagina.

Ombre e riflessioni

Riflessi, sfumature e ombre morbide hanno recentemente lasciato il posto a tinte piatte e ombre spesso dure e non piumate. Nel momento in cui iniziamo a lasciare dietro di sé il web 2.0 maltrattato e maltrattato, spostandoci sulla nostra prossima vittima, è comunque bello vedere qualcuno tirare lo stile nel modo in cui doveva essere.

Sia le ombre che i riflessi qui sono piuttosto sottili e sono stati strutturati con cura per sembrare realistici e semplicemente belli. Se vuoi aggiungere un tocco visivo a un elemento, vale la pena dedicare del tempo per modificare e sperimentare fino a ottenere qualcosa che aggiunge davvero finezza e lucentezza a una pagina rispetto a uno strato di trucco sciatto.

The Burst: Evolved

Una cosa che impari quando progetti per un'importante società di marketing è che gli esperti di marketing amano assolutamente le raffiche. Qualcosa di grosso e appuntito che viola il design e attira quindi l'attenzione del cliente. Se i dipartimenti di marketing, e in effetti molti progettisti avevano la loro strada, tutto sarebbe come questo:

Solo così sai, dal punto di vista del design, questo è cliché, brutto, overdone, obsoleto e ogni altro aggettivo negativo che puoi immaginare. Come regola generale, non mettere mai uno starburst su qualcosa.

Questo designer ha fortunatamente compreso questa regola e ha trovato una soluzione molto più moderna e attraente, mostrata di seguito. Questo nastro 3D avvolge una barra che descrive la nuova funzione. In modo significativo viola il design abbastanza da catturare la tua attenzione, ma non abbastanza da ridimensionare l'aspetto dell'intera pagina.

Miglioramento suggerito

Come ho già detto più volte, questo è un progetto talmente grande che è difficile trovare qualcosa di sbagliato in esso. Tuttavia, ci sono un paio di cose che prenderei in considerazione di migliorare.

Per cominciare, il sito utilizza Cufon per la tipografia personalizzata. Mi sono lamentato di questo nella nostra ultima critica e continuerò a fare lo stesso argomento ovunque io veda Cufon in uso. @ font-face è una soluzione migliore, punto. @ il testo di font-face è completamente selezionabile, Cufon no. @ font-face usa puro CSS, Cufon richiede JavaScript per essere abilitato. Come ho sottolineato l'ultima volta, quando il sito web di Cufon suggerisce invece di usare @ font-face, sai che è ora di gettare la spugna e saltare a bordo.

L'altra cosa che mi infastidisce è la barra di Facebook in alto. Se si disegna una linea attraverso il centro del testo in questa barra, come ho fatto sotto, si può vedere che il logo di Facebook è scomodo decentrato. Non sono sicuro che sia stato intenzionale o un incidente, in entrambi i casi, l'avrei trovato vicino al centro.

Altre pagine

Ti chiudiamo dando una rapida occhiata ad alcune delle altre pagine del sito. Come puoi vedere, sono ugualmente attraenti e tutti ben progettati. Mi piacciono particolarmente le tabelle dei prezzi!

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.