Sono uno sviluppatore web moderatamente capace. Posso mettere le cose dove voglio che vada e mettere alcune cose di JQuery lì se ne ho bisogno. Tuttavia, se sto realizzando il mio sito Web (cosa che sto iniziando a fare) non ho idea di come progettarlo. Se qualcuno dovesse sedersi accanto a me un punto sullo schermo e dire "metti questa immagine lì, scrivi lì" posso farlo abbastanza facilmente. Ma progettare il mio sito con la mia scelta di colori e testo sembrerà come se fosse stato inventato da un bambino.

Qualcuno conosce siti Web / libri che posso guardare o qualcuno ha qualche suggerimento sulle basi del web design per bambini?

Hai alcune cose da fare.

Suggerimenti:

Impara a usare Photoshop. (In particolare, gli stili di livello sono eccellenti. Basta notare che possono essere effetti difficili da reimplementare in CSS2). Fa molto per fare buoni modelli.

Guarda i siti progettati professionalmente. Quali siti sei stato così bello per te?

Trova siti che ti disturbano e considera cosa potrebbe renderlo migliore. Guarda anche gli annunci sui prodotti. Imballaggi alimentari. Annunci sui giornali. Lo chiami.

Inoltre, una volta che inizi a capire, pratica, pratica, pratica. La grafica richiede tempo per svilupparsi come un'abilità, soprattutto da un programmatore che ha la programmazione da considerare. (Gradienti vs "piastrellabilità")

Utensili:

(Photoshop è un preferito personale. Paint.NET è una buona alternativa a Windows, ma non è altrettanto potente.)

Sistema a griglia 960 di Nathan Smith . Ha modelli per molti dei programmi di grafica tradizionali. Controlla.

Riferimenti:

Guarda alcuni di questi siti: (Ho visto di più, proverò ad aggiungere mentre li incontro)

• Una lista a parte
• John McCain
• BarackObama.com
• Hayon2010.com (Okay, l'ho fatto io, ma penso che sia carino. Modifica: apprezzerei anche i commenti su di esso. ;-D)

Il lato pratico

Esistono sicuramente alcuni aspetti pratici della progettazione che sono importanti da imparare. Non tutto è soggettivo.

   • Tutorial di web design: http://webdesign.tutsplus.com/

   • Tutorial Photoshop: http://psd.tutsplus.com/

   • Tonnellate di tutorial: Lynda

Ispirazione

   • Sito Web: stile senza eguali

   • Sito Web: Abduzeedo

   • Libro: linee guida per il successo online

   • Sito Web: Smashing Magazine

Competenze di progettazione

Design generale

   • Libro: Graphic Design: le nuove basi

   • Libro: Graphic Design, referenziato

   • PDF: The Big Four: Contrasto, Ripetizione, Allineamento, Prossimità

Tipografia

   • Libro: pensare con il tipo

   • Libro: gli elementi dello stile tipografico

   • Articolo: http://en.wikipedia.org/wiki/Typography

   • Articolo: http://www.informationarchitects.jp/en/the-web-is-all-about-typography-period/

disposizione

   • Libro: cartella di lavoro layout

Colore

   • Libro: cartella di lavoro per la progettazione del colore

   • Libro: cartella di lavoro Color Harmony

Filosofia del design

"L'errore più stupido è vedere il design come qualcosa che fai alla fine del processo per" sistemare "il disordine, invece di capire che è un problema del" primo giorno "e parte di tutto". -Tom Peters

"Un buon design rende l'utente felice, il produttore in nero e l'estete incolume." -Raymond Loewy

"Il design veramente elegante incorpora funzionalità di prim'ordine in una forma semplice e ordinata." -David Lewis

"Un buon design è un buon affare." -Thomas J. Watson Jr.

Altre citazioni

Questo potrebbe essere leggermente fuori tema, ma ricordo che Jeff Atwood mi ha fortemente raccomandato il libro Don't Make Me Think . Descrive come progettare il tuo sito Web per la migliore esperienza utente.

Ogilvy sulla pubblicità: questo libro tratta alcune basi del design grafico e un sacco di buon senso nel realizzare qualsiasi tipo di volantino, pubblicità, ecc. Anche se è stato scritto molto prima dell'era del www.

Più in generale, sfoglia libri e riviste su grafica, belle arti, decorazione d'interni, cinema - ci sono molti principi di progettazione comuni per rendere qualcosa di visivamente attraente e rendere interessanti informazioni o altri contenuti. Un po 'come l'elettromagnetismo è comune all'elettronica, alla scienza planetaria, alla chimica, al nucleare e ad altri campi della fisica e dell'ingegneria.

Un altro buon libro in questo spazio sarebbe The Design of Everday Things. Copre molte idee pratiche come favorire progetti che si prestano a un facile utilizzo sfruttando il modo in cui le persone affrontano naturalmente una cosa nuova. Il libro non parla specificamente dell'interfaccia utente o del web design, ma lo copre un po ', credo.

Un primo esempio nel libro sono le porte. Parla di come le porte con una manopola o maniglia su un lato e le cerniere a vista siano intuitive, perché conosci la porta che si aprirà spingendo o tirando su quel lato. Le porte fantasia con cerniere nascoste, barre di spinta su tutta la porta o manopole centrate sono difficili e richiedono un momento di sperimentazione perché il loro funzionamento non è intuitivo.

Uno strumento che trovo prezioso nel design è Color Scheme Designer . In genere scelgo un colore su cui vorrei basare il disegno e quindi utilizzo lo schema "Analogico" per ottenere un bel set di colori corrispondenti. Per me, ottenere i colori giusti è la parte peggiore, quindi dopo tutto il resto è solo ottenere un bel layout e applicare la gamma di colori limitata.