Web Design Critique # 2

Oggi continueremo la nostra nuova serie di critiche sul web design, dove daremo uno sguardo approfondito a un sito web in diretta e ne indicheremo sia i punti di forza che le aree che potrebbero essere migliorate.

Top Test Prep, il sito che visioneremo oggi, è stato il nostro primo cliente, ma le richieste sono state versate in modo da essere sicuri di essere presto in lista!

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.

Preparazione al test superiore

Incontra Top Test Prep, una società privata di tutoring che vanta di avere alcuni dei migliori e più brillanti tutor in circolazione. Il design della loro home page è abbastanza semplice; un layout centrato chiaramente diviso in diverse sezioni.

Prima di entrare in ciò che potrebbe essere migliore del design, diamo un'occhiata ad alcune cose che sono state fatte bene.

Slider e fotografia

Sono uno schifo per i cursori di immagini jQuery. Aggiungono un livello dinamico a un design e movimento appena sufficiente per dare vita a una pagina statica senza creare troppa distrazione.

La fotografia utilizzata nel cursore è davvero carina. I volti sorridenti attirano immediatamente l'attenzione e i colori vivaci con una profondità di campo bassa indicano un fotografo professionista. La terza immagine dei tre laureati sembra un po 'foto-ish ma comunica fortemente il messaggio che stai cercando, quindi funziona.

In effetti, mi piacerebbe vedere una versione in cui il cursore dell'immagine occupa l'intero spazio occupato dalla casella orizzontale in alto. The? Parla con un esperto? le informazioni potrebbero essere spostate immediatamente al di sotto di essa. Questo potrebbe incidere un po 'la gente di usabilità, ma penso che avrebbe un po' esaltato l'estetica.

Allineamento

Il layout potrebbe utilizzare un po 'di lavoro, ma la maggior parte degli elementi sulla pagina sono chiaramente allineati e le sezioni sono visivamente distinte. Potrebbe sembrare un problema minore, ma rimarrai sorpreso dal fatto che molti designer professionisti sappiano poco o nulla riguardo alle corrette tecniche di allineamento.

Miglioramento

Ora diamo un'occhiata ad alcune modifiche che potrebbero essere apportate per rafforzare l'attrazione visiva del sito.

Logo e cornice pagina

Prima di tutto, il logo è un po 'un pugno nell'occhio e potrebbe utilizzare un aggiornamento visivo. Se non stai cercando di cambiare la tua immagine in questo momento, per lo meno prestare attenzione al logo attuale. La crenatura deve essere più stretta dopo le maiuscole e le due righe di testo devono essere allineate a sinistra. L'attuale allineamento al centro lascia la slogan bloccata nella terra di nessuno ed è un po 'imbarazzante.

Per quanto riguarda il frame della pagina, sembra un po 'incoerente. Mi piace il colore audace utilizzato nella navigazione, ma sembra strano che questo si estende su tutta la pagina e il piè di pagina non lo fa. Il mio consiglio è di eliminare le ombre creando completamente il frame finto e allungando sia l'intestazione che il piè di pagina lungo tutta la pagina.

Inoltre, per dare al sito un punto di contrasto ancora più forte e un'intestazione chiara, avrei allungato il gradiente di navigazione fino in cima alla pagina e invertito il logo / copia. Ecco un mockup semplificato di cosa intendo:

Eliminare la cornice della pagina potrebbe fornire molto più spazio per distanziare un po 'le cose e dare al design un po' di respiro aumentando lo spazio bianco.

The? Parlare con un esperto? Scatola

Sentivo che quest'area avrebbe potuto essere rinnovata. Mi piace molto lo stile e il design del pulsante come pezzo autonomo, ma non sembra adattarsi bene al resto del sito. Prenderò in considerazione la possibilità di diminuire il raggio degli angoli arrotondati (o semplicemente di renderli di 90 gradi) e di abbassare il colore più scuro dall'intestazione.

Inoltre, la testa fluttuante è un po 'strana. Posso capire concettualmente perché un volto deve essere qui, ma dal punto di vista del design, non funziona. Penso che questo sia dovuto principalmente al taglio di stile angolare che sta accadendo alla sua destra e al suo lato inferiore. Dà a questa area altrimenti perfetta una cornice superficiale che esiste solo in quel punto. O vai fuori tutto e crea una cornice visibile o nix completamente la testa fluttuante.

Le tre colonne

Vedo due problemi primari con quest'area, evidenziata nella foto qui sotto.

Prima di tutto, dovrebbe essere un elenco puntato mai essere allineato al centro. Separa il proiettile e il contenuto ed è una violazione di ciò che un elenco puntato è destinato a realizzare: leggibilità facile e veloce. Inoltre, poiché tutto il testo della pagina è allineato a sinistra, è una buona idea mantenere la tendenza.

Infine, l'immagine del piccolo libro all'estrema destra sembra fluttuare nello spazio. Non c'è spiegazione di cosa sia, perché sia ​​lì o perché dovrei fare clic. In questo momento urla ripensandoci e ha davvero bisogno di essere correttamente lavorato nel layout della pagina o completamente gettato.

Il tuo turno!

Per riassumere, Top Test Prep è partito bene, ma il progettista dovrebbe prendere in considerazione la creazione di un'intestazione più forte, l'abbandono della cornice della finta pagina e la risoluzione dei problemi di layout menzionati sopra.

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.

Interessato ad avere criticato il tuo sito? Puoi saperne di più qui.