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 è il portfolio del fotografo Matthew Coughlin.
Se desideri inviare il tuo sito web in una futura Critica del design, ci vogliono solo pochi minuti. Facciamo pagare $ 49 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.
A proposito di Matthew Coughlin
Matthew Coughlin è un fotografo di ritratti creativo di Pensacola, in Florida. Il suo lavoro rende pesante e molto bello l'uso dell'illuminazione da studio in ambienti naturali. Il risultato è uno stile molto particolare che ha in genere una gamma dinamica impressionante e un aspetto e una sensazione molto drammatici. Mi piace particolarmente la sua capacità di catturare davvero la personalità del suo soggetto. Ogni foto racconta una storia ben definita in un modo molto coinvolgente.
Ecco uno screenshot della homepage:
Guarda Ma, No Flash
Recentemente abbiamo tenuto un piccolo omaggio per una critica che ha richiesto ai partecipanti semplicemente di mandarci un tweet con l'URL del loro sito. Dopo aver guardato attraverso i partecipanti, sono stato immediatamente attratto dal sito di Matthew sia come fotografo che come sviluppatore web.
La prima cosa che ho pensato fosse davvero rinfrescante è stata la mancanza di Flash. Non voglio trasformare questo in una sessione di flash-bashing, ma credo fermamente che esista un'eccessiva dipendenza da Flash nel settore della fotografia. Quasi tutti i siti di fotografo che puoi trovare sono costruiti quasi completamente su Flash.
Per essere onesti, ci sono pro e contro a questa tendenza. Sul lato positivo, i siti di fotografi tendono ad essere incredibilmente dinamici e interattivi, il che può essere un modo molto coinvolgente per visualizzare le foto. Questo è un elemento che sicuramente manca dal sito di Matthew in quanto è una pagina abbastanza statica. C'è un po 'di interattività, che vedremo in seguito, ma per la maggior parte è solo una galleria di immagini CSS standard.
Sul lato negativo, Flash ha un sacco di bagagli. È intensivo per il processore, può essere sicuramente indicato come la causa di un buon numero di crash del browser, ma, soprattutto, non è molto mobile-friendly. iOS ovviamente blocca completamente Flash, ma anche quelle piattaforme mobili che lo supportano sono piuttosto appesantite da enormi siti di fotografo Flash al 100%.
Tutto ciò per dire, mi piace vedere il fotografo occasionale che decide di aggrapparsi a quello che è sicuramente lo standard del settore e utilizzare un approccio al sito più ampiamente compatibile.
Layout reattivo
Un'altra cosa che ho subito apprezzato di questo sito è che il layout è abbastanza reattivo. Quindi vediamo che questo sito non è solo mobile-friendly nel senso che non utilizza Flash, ma si adatta anche a schermi di dimensioni più piccole. Certo, il design è abbastanza semplice che questa non è stata un'impresa enorme, ma non è assolutamente una brutta cosa!
Il layout responsive / felxible è realizzato in modo molto semplice, con una sola query media e molti valori basati sulla percentuale. Niente si ridimensiona davvero come il layout cambia, la pagina si limita a riflettere. Penso che un po 'di considerazione per le immagini fluide potrebbe rendere la vista mobile più bella.
Non tutti rispondono
Una cosa che mi confonde un po 'è che il design reattivo si ferma essenzialmente alla home page. Il layout del blog, essendo una griglia molto simile a quella della home page, è perfettamente adatto per la stessa tecnica e tuttavia non è sicuramente così solido.
È interessante notare che la pagina del blog sembra effettivamente meglio sul mio iPhone che sul mio desktop, suggerendo forse che il designer stava adottando una strategia mobile-first. Tuttavia, come puoi vedere nell'immagine sopra, il layout è piuttosto scomodo su un desktop in quanto vi è una grande quantità di spazio vuoto sul lato destro.
Interazione
Tornando alla home page, diamo un'occhiata a cosa succede quando si fa clic su un'immagine. Qui vedi che ottieni questo simpatico e grande cursore jQuery che mostra le immagini in un ambiente più mirato.
Mi piace molto e penso che il sito ne abbia davvero bisogno, tuttavia ho alcuni suggerimenti per migliorarlo. Per cominciare, i controlli avanti / indietro sono un po 'fuori mano, e forse è un modo sbagliato per dirlo perché mi piacciono dove sono, ma penso che sarebbe molto più utilizzabile se, oltre a ciò che è già in posto, facendo clic sulla grande immagine avanzata la presentazione. Questa funzionalità è intuitiva, mi aspetto di ottenere una nuova immagine quando faccio clic sull'area dell'immagine principale, ma non lo faccio.
Inoltre, penso che potrebbe essere bello giocare un po '? pulsante che scorre automaticamente le immagini. Semplicemente non è possibile aggirare il fatto che le persone siano abituate a vedere le presentazioni sui siti fotografici, è un ottimo modo per catturare un gruppo di immagini e richiede zero operazioni da parte dell'utente. Penso che lanciare questa funzionalità qui mentre si trova nel regno di JavaScript / jQuery aumenterà l'impressione dell'esperienza complessiva.
Conclusione
Per riassumere, mi piace molto il design basico e centrato sulla foto del sito. Mi piace il fatto che il sito non sia basato su Flash, come lo sono tanti portfolio fotografici e apprezzo il lavoro extra che è stato fatto per rendere la homepage piuttosto reattiva.
Come ho detto, ripenserò sicuramente il layout della pagina del blog e aggiungerò alcune funzionalità al cursore sulla home page. Come suggerimento finale, potrebbe essere bello avere un'immagine in primo piano o una presentazione sulla home page. La griglia è perfettamente attraente ma può essere percepita come un po 'noiosa e uniforme. Rompendo un po 'il disegno con un'immagine più grande del resto, si aggiungono variazioni e si riduce la ridondanza nel layout.
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 anche di essere rispettoso nei confronti del designer del sito e di offrire una consulenza chiara e costruttiva priva di insulti ostili.