Suggerimenti per il layout del design della pagina Web
Ci sono molte cose da considerare durante la progettazione e la realizzazione di un sito Web. Anche i progettisti di pagine Web più esperti commettono errori nonostante i loro anni di progettazione, quindi non consideriamo il tipo di errori che i principianti possono fare.
Il seguente breve elenco di dieci passaggi del layout di progettazione di pagine Web copre tutte le informazioni essenziali che è necessario conoscere prima di iniziare un nuovo progetto di sito Web o iniziare a lavorare con un'agenzia digitale e copre anche ciò su cui dovrebbero concentrarsi durante il processo di layout di progettazione di pagine Web .
Coprono aspetti essenziali del layout della progettazione di pagine Web come la progettazione di una landing page, nonché problemi di flusso di lavoro generali per un sito Web che funzioni meglio. Seguendo questi passaggi del layout di progettazione di pagine Web, sarai in una posizione migliore per creare layout di progettazione di pagine Web di livello professionale.
I passaggi per creare un layout perfetto per la progettazione di pagine Web
-
Penna su carta
Non avviare semplicemente Photoshop o il software di progettazione di pagine Web che hai quando inizi un progetto. Questo è un errore comune che persino i progettisti esperti fanno prima di pensare ai problemi che devono risolvere. Giusto; il layout della pagina web riguarda la risoluzione dei problemi e non solo il bell'aspetto e l'estetica. Questi problemi possono essere risolti solo con una gerarchia e un layout chiari e validi. Concentrati sul contenuto, sul layout e sulla funzionalità prima di guardare i codici colore e le ombre.
Quando devi creare l'aspetto di un progetto, la prima cosa che devi fare è creare un framework di fascia alta in grado di risolvere tutti i problemi di layout del design della pagina web. Il framework è l'interfaccia utente che circonda il contenuto e consente di eseguire azioni sul sito Web e navigarlo. Il framework include anche barre inferiori e laterali e altri componenti, nonché elementi di navigazione. Inutile dire che non puoi perdere questi pezzi essenziali. Inizia il tuo progetto di web design con questa prospettiva e avrai una chiara comprensione del layout e di come progettare ogni pagina.
-
Aggiungi una griglia a Photoshop e seleziona la tua tipografia
Ora puoi accendere Photoshop. Ma prima di iniziare a progettare qualcosa, è necessario una griglia adeguata, per cominciare. Non importa quanto tu sia bravo con il software di layout di progettazione di pagine Web, non usare una griglia finirà in un layout di progettazione di pagine Web scadente, in un modo o nell'altro. Una griglia aiuta a strutturare il layout della pagina in diverse sezioni e ti guida lungo i diversi requisiti di dimensione dello schermo. Ancora più importante, aiuta a creare un layout di progettazione di pagine Web reattivo e realizzare un design coerente in termini di spaziatura e altri elementi.
Una volta impostata una griglia di progettazione di una pagina Web, è tempo di entrare nel carattere tipografico e nei colori. Questo può richiedere del tempo, ma è anche una fase entusiasmante di un progetto di progettazione di pagine Web. Come regola generale, è meglio non utilizzare più di due caratteri tipografici nel layout di un sito Web. Tuttavia, ciò può variare in base a diversi progetti di progettazione di pagine Web; potresti restare fedele a uno o scatenarti con diversi caratteri tipografici. Indipendentemente da ciò, scegli un carattere facile da leggere, anche se c'è molto testo da leggere. Sii più creativo con l'invito ad azioni e titoli e scegli caratteri grandi. Inoltre, mantenere la coerenza in tutto il sito Web in termini di tipografia.
-
Colori e layout
I design di pagine Web possono impazzire quando scelgono i colori per un sito Web, ma è meglio usare un set limitato di toni e colori perché troppo di tutto può essere negativo. Potresti guardare i colori proprio nella fase di scelta dei caratteri tipografici. Scopri quali colori utilizzare nell'interfaccia utente, nel testo e negli sfondi. Utilizzare toni e colori impostati limitati per l'interfaccia utente generale. Applica i colori in modo coerente nell'interfaccia utente in base alla funzionalità dell'elemento. Guarda il layout di siti Web popolari come Vimeo, Quora e Facebook. Oltre all'interfaccia utente, non dovrebbero esserci restrizioni di colore per i dettagli grafici o le illustrazioni, a condizione che non interferiscano con gli altri componenti o funzionalità del sito Web.
Per quanto riguarda il layout della pagina web, la regola migliore da seguire è "più semplice è, meglio è". Ogni sezione deve essere essenziale per il sito, con una ragione e un beneficio per il risultato finale del visitatore. Il layout deve essere in grado di evidenziare i contenuti e gli elementi più importanti. Riduci al minimo il numero di chiamate su una pagina in modo che tutti i siti Web lavorino nel fornire valore al visitatore. Un buon modo per garantire il layout più semplice è quello di iniziare con il più semplice possibile e aggiungere elementi ove necessario.
-
Pensa diversamente
A questo punto, avresti qualche idea su elementi che sono considerati essenziali per i siti Web ma non hanno paura di ripensare le convenzioni attuali. Pensa agli elementi considerati importanti in questo momento. Ad esempio, hai bisogno di un pulsante di ricerca? Potrebbe aiutare in alcuni casi, ma nella maggior parte dei casi è ridondante. Convenzioni di layout di pagine Web e schemi di layout di pagine Web sono presenti perché funzionano in alcuni casi. Tuttavia, potrebbero non funzionare in tutti i casi e potrebbero essere obsoleti. Ripensare gli schemi stabiliti su un componente e pensare a come migliorarli.
Non limitare neanche il ripensamento agli standard o alle convenzioni del settore. Devi anche ripensare le tue abitudini e i modelli di layout del design della pagina web. L'innovazione non viene sempre sfidando le convenzioni esterne; può anche venire sfidando te stesso con ogni progetto. Non limitarti a uno o pochi modi di lavorare. Esempi di varie sfide possono includere un nuovo sistema a griglia, nuovi componenti o semplicemente evitare determinati colori e caratteri tipografici.
Corsi consigliati
- Formazione professionale gratuita su Python
- Corso di test del software libero
- Formazione sulla certificazione in Java gratuito
- Corsi PERL
-
Concentrati sui dettagli
Ogni progettista di pagine web degno di nota sottolinea questo punto, e per buoni motivi. Come dice il proverbio, "Dio è nei dettagli". I dettagli più piccoli in un sito Web o in una pagina Web potrebbero fare una grande differenza sull'usabilità per l'utente.
Qualcosa di semplice come una piccola interazione, un tocco estetico o un'animazione potrebbe migliorare l'intero sito Web. Ma questi dettagli sono essenziali e arriveranno naturalmente man mano che acquisisci più esperienza. Concentrati sull'eccellenza in ogni componente e tutto si riunirà per formare un prodotto completo eccellente. Ogni componente deve essere progettato come potrebbe essere il miglior componente autonomo a sé stante. Molti designer lasciano parte dei loro siti Web per la fine e hanno poca considerazione per loro.
-
Mantieni le cose nitide e in ordine
Mantieni nitide tutte le immagini e i contenuti del tuo sito Web impostando il giusto contrasto tra i colori e i tratti di sfondo / sfondo. Oltre all'estetica, devi anche evitare alcune altre cose comuni per un sito web pulito e nitido. Alcune delle cose da evitare quando si rende più nitido l'output includono bordi sfocati, banding gradiente, opzioni di rendering dei caratteri e tratti che si fondono male con lo sfondo.
Questi sono solo alcuni dei semplici esempi di progettazione di pagine Web da cercare. Continua a guardare il layout della tua pagina web nella sua interezza e vedi se tutto funziona bene insieme. Quindi analizzare ciascun componente separatamente e con maggiore attenzione.
Durante la progettazione con Photoshop, mantieni puliti i tuoi file PSD, indipendentemente dalla dimensione del progetto e dal numero di designer che lavorano al progetto. I file più puliti semplificano l'esportazione di varie sezioni e velocizzano il processo di layout della progettazione di pagine Web, oltre a lavorare con altri designer che utilizzano file condivisi.
-
Preparati al peggio e mantieni la concentrazione
I progettisti di pagine Web hanno lo scopo di risolvere i problemi attraverso diversi vincoli. In termini di design di pagine Web, i vincoli possono essere tecnici, relativi al contenuto o concettuali. Quando inizi e lavori su un progetto, non pensare solo allo scenario più ideale, ma anche allo scenario peggiore. Ad esempio, l'utente potrebbe tentare di accedere al sito Web da uno schermo da quattro pollici con un sistema operativo che ha più di due aggiornamenti. Tieni presente come funzionerà il layout del tuo sito Web con schermi di dimensioni, dispositivi e sistemi operativi diversi.
Quando ti avvicini a un sito Web, devi progettare una pagina Web in modo che lo scenario migliore sia anche nel caso peggiore. Come progettista di pagine Web, devi anche ossessionarti per il progetto. Ogni buon designer si immerge in ogni progetto. Rendi il tuo sito web parte della tua vita e finirai per vederlo con maggiore chiarezza. È quindi possibile identificare difetti e problemi e infine modificarlo. Man mano che il tuo progetto matura, anche tu come progettista di pagine web. Alla fine, imparerai molto di più con il progetto di quanto faresti se restassi disconnesso da esso. Inoltre, l'output finale sarà molto migliore. Se versi il tuo sudore e sangue in ogni progetto, mostrerà sicuramente a tutti.
-
Stabilisci una buona relazione con il tuo cliente e sviluppatore
Se stai pianificando di essere un designer di pagine web professionale, dovrai vedere e gestire molti clienti e sviluppatori web. Cominciamo con i clienti perché i clienti vengono sempre per primi.
Quando proponi un design o un concetto di pagina web interattiva, devi tenere aperte le comunicazioni con il tuo cliente in modo che entrambi si trovino sulla stessa pagina. Non rimanere con un concetto per molto tempo; condividilo con il cliente appena puoi. Una volta approvato un concetto iniziale, avrai una migliore idea di ciò che il tuo cliente desidera e ti allineerai al progetto. Se il concetto non è approvato, è possibile raccogliere tutti i feedback desiderati dal client per ottenere un concetto più appropriato alla tabella. In ogni caso, non aspettare fino a quando non creerai un concetto dettagliato.
Una volta che il tuo concept è pronto e stai lavorando al progetto, devi sviluppare un buon rapporto con il tuo team di sviluppatori. Gli sviluppatori non sono solo programmatori; sono anche creativi e appassionati del proprio lavoro tanto quanto i progettisti di pagine web. Tuttavia, spesso non sono inclusi nel progetto dall'inizio e accedono al progetto solo dopo aver deciso il concetto e non sono più necessari i loro input creativi. Sfortunatamente, questo processo è sbagliato. A volte le migliori idee di layout per la progettazione di pagine Web provengono dalle fonti meno probabili. Non scartare la creatività del team di sviluppatori. Portali nel processo di concettualizzazione all'inizio e rendili parte del progetto dall'inizio. Condividi i tuoi concetti di layout della pagina web con i tuoi sviluppatori e coinvolgili per idee migliori e, in definitiva, una migliore codifica ed esecuzione dalla loro fine.
-
Una presentazione è importante e alcune idee potrebbero non esserlo
Mentre è sicuramente importante creare un ottimo sito Web e produrre un grande progetto, è anche importante presentarlo bene a un cliente. Anche il miglior layout di progettazione di pagine Web al mondo può essere ignorato o odiato del tutto se non viene presentato bene. Ricorda che i concetti e le idee di layout della pagina Web utilizzati per un progetto possono essere chiari e per tutto il tuo team, ma potrebbero non essere così chiari per il tuo cliente o qualcuno che è diventato parte del progetto in una fase successiva.
Allo stesso modo, dovresti anche ricordare di non essere troppo attaccato a tutte le tue idee di progettazione di pagine Web e concetti di layout di progettazione di pagine Web. Esprimi una forte argomentazione per ciascuno di essi, ma ricorda di ritirarti se il tuo team o cliente non è d'accordo con loro. Ricorda che le preferenze possono essere soggettive; ciò che funziona bene per te potrebbe non funzionare affatto per il cliente o lo sviluppatore. Come progettista di pagine Web, devi avere una ferma opinione delle tue idee, ma dovresti anche essere abbastanza flessibile da cambiare rapidamente concetti e idee se non sono concordati da altri.
-
Tieni traccia e monitora i progressi in ogni fase e mostra alla community
Chiunque lavori in un'agenzia conoscerebbe la difficoltà di lavorare alla progettazione di pagine Web di un nuovo progetto mentre il loro precedente è in fase di sviluppo o appena finito. Contrariamente a ciò che la gente può pensare, il lavoro di un designer non termina semplicemente inviando i file PSD e il foglio di stile. Se sei completamente investito in un progetto, devi anche controllare gli sviluppatori per vedere se le idee di progettazione e interazione della tua pagina web vengono eseguite come le hai pianificate e aiutarle secondo necessità per garantire che ogni dettaglio funzioni correttamente .
È inoltre possibile condividere i componenti del lavoro in corso e i fogli di stile con la comunità dei designer. A volte le parti migliori di un progetto vengono lasciate fuori o perse nella cartella dell'archivio. Una volta che il progetto è completo e approvato dal cliente per essere promosso, è possibile creare un case study con i lavori in corso e i disegni e i componenti delle pagine Web esclusi. Questo può essere un grande vantaggio per la comunità e puoi imparare molto dal feedback.
Articoli Correlati:-
Questa è stata una guida ai suggerimenti per il layout della pagina Web che sono facili da ricordare. Qui in questo post, abbiamo studiato i passaggi per creare un layout perfetto per la progettazione di pagine Web. Ecco alcuni articoli che ti aiuteranno a ottenere maggiori dettagli sul layout di progettazione di pagine Web, quindi basta passare attraverso il collegamento.
- Le 10 migliori tendenze del web design che devi conoscere per il 2016
- 10 nuove funzionalità di un efficace portafoglio Web Designer
- Elenco dei 10 migliori software gratuiti per la progettazione di pagine Web (Guida)