Progettazione di siti Web con successo richiede pratica e pazienza, ma con la giusta motivazione, chiunque può imparare a essere bravo a farlo. C'è un processo distintivo per progettare un sito Web, un numero di regole inderogabili da seguire, e allora avrai bisogno di conoscere linguaggi di programmazione web. La cosa più incoraggiante, tuttavia, è che ci sono un sacco di strumenti a vostra disposizione in questi giorni, e la maggior parte di quei migliori sono gratis.

Il piano del sito

Prima di toccare un computer, assicurarsi di conoscere le risposte ad alcune delle grandi domande: qual è il punto di questo sito Web? Chi è il pubblico? Quindi, scrivere un piano di sito: annotare tutto ciò che volete che il vostro sito per contenere, quindi organizzare tutte quelle cose in una struttura: ad esempio, potrebbe essere una sezione "news", che potrebbe avere una sottosezione di "entertainment news".

La regola è di non avere mai più di sette scelte in un momento: mirare per sette o meno sezioni principali, ognuna di tali sezioni dare sette o meno sottosezioni e così via. Anche decidere quanti layout sito avrà bisogno. Maggior parte dei siti hanno un modello principale che usano per gli articoli, ma un modello diverso per la homepage.

Preparazione dell'area di lavoro

Per avere uno spazio sicuro per progettare e testare il tuo sito, è necessario impostare un server privato di casa prima di acquistare un nome di dominio e un piano di hosting commerciale. È possibile farlo gratuitamente con la suite di software XAMPP (Vedi risorse qui sotto). Avrete anche bisogno di un editor di testo migliore rispetto a blocco note o TextEdit: programmi gratuiti come Aptana e Notepad + + color-code il codice per renderlo più facile da gestire.

Infine, è necessario conoscere linguaggi di programmazione web. Non devi necessariamente comprendere appieno PHP e SQL, ma si dovrebbe almeno essere confortevole con HTML e CSS. Controllare il tutorial alla W3 Schools (Vedi risorse qui sotto).

Strutturare il tuo sito

Un content management system è un programma che si installa sul server del tuo sito che fornisce un'interfaccia utente pulita per la creazione di nuove sezioni, scrivere nuovi articoli e organizzare il layout. È un must-have per la maggior parte dei siti Web perché non una quantità enorme del legwork e materiale tecnico per voi. Ci sono molti CMS gratuito e hanno tutti i siti Web di approccio in modi leggermente diversi: WordPress è ottimizzato per il blogging, ad esempio, mentre Joomla! funziona bene per siti di grandi società. Per i principianti, provare CMS Made Simple.

Ogni CMS ha un insieme di modelli di struttura pre-esistente (o "layout" o "temi") a vostra disposizione. Avete tre scelte: rivedere i propri piani di layout per montare un modello preesistente, scegli un modello da utilizzare come "base" e quindi modificarlo per adattare il proprio stile o creare un modello personalizzato. Quando si sta appena iniziando, opzione due è probabilmente la soluzione migliore come vi darà un'idea di come sono organizzati i modelli.

Suggerimenti per la progettazione

Il Consiglio più importante è quello di mantenere le cose semplici: assicurarsi che il sistema di navigazione del tuo sito Web è chiaro, il testo è leggibile, la grafica non è antipatico e ogni pagina è collegata da qualche altra parte. Chiarezza è più importante di ogni altra cosa.

Testo di styling è un passo importante ma spesso trascurata per web designer di inizio. Nel file CSS, se si aumenta l'attributo di "line-height" e rendere il grigio scuro del testo anziché nero, scoprirete che le parole sono diventati improvvisamente più piacevole da leggere. Un altro suggerimento affidabile è di rendere il tipo di carattere della font articoli un sans-serif (come Arial o Verdana) e i titoli dei tuoi articoli un font serif (font con piccole linee sulle estremità delle loro lettere, ad esempio Times New Roman o Georgia).

Per grafica, sfondi e bordi, utilizzare un sacco di sfumature dello stesso colore. Invece di un solido background blu, ad esempio, creare una sfumatura tra una tonalità blu scura e una tonalità leggermente più scura di blu (utilizzando un editor di immagini come Photoshop o Gimp); Questo può dare siti una particolare lucentezza professionale. Allo stesso modo, se tu avessi una scatola blu sul tuo sito con un codice di colore di sfondo di #222299, ad esempio, non rendere il bordo nero. Fare qualcosa solo leggermente più scuri, come #111188.

Infine, prendere spunti dal tuo pubblico. Un sito per una grande azienda è probabile non sta per avere un sacco di colori rosa e gialli al neon, ma potrebbe un sito di arte moderna. E mentre un blog di programmazione potrebbe uscire con un carattere davvero piccolo, un sito di intrattenimento per ragazzi avrà bisogno di qualcosa che è leggibile anche quando vi appoggiate indietro nella vostra sedia. Usate il buon senso e sarete sulla buona strada.