wireframe e prototipi con wordpress

La fase di progettazione di un sito web spesso e volentieri viene sottovalutata, specialmente dai non addetti ai lavori. Questo è un errore gravissimo perchè è in questa fase che si decide il se il sito web avrà le carte in regola per avere successo e raggiungere gli obiettivi o se si rivelerà un flop.

Quali sono i passaggi per progettare un sito internet

Realizzare un sito web efficace vuol dire fare in modo che risponda a tutta una serie di requisiti indispensabili al suo corretto funzionamento e soprattutto al suo corretto utilizzo da parte degli utenti. Per questo motivo è molto importante avere ben chiaro prima di procedere a fare qualsiasi cosa:

  • Obiettivo del sito: per quale motivo stiamo creando questo sito? Cosa vogliamo comunicare? Che risultato speriamo di ottenere?
  • A chi si rivolge: quanti anni ha il nostro target? Che interessi ha? Ha familiarità con il web e la navigazione oppure no?
  • Struttura contenuti e funzionalità: come sarà strutturata l’alberatura del sito? Che tipo di contenuti avrà ciascuna pagina? Dobbiamo prevedere delle funzionalità particolari?

La struttura del sito

Una volta che avremmo risposto a queste tre fondamentali domande possiamo sederci al tavolo ed iniziare la progettazione vera e propria. La prima cosa da fare è quella di disegnare l’alberautura del sito, in modo tale da avere chiaro anche visivamente come sarà strutturato il sito e da poter progettare il menù di navigazione nella maniera più funzionale possibile. Per progettare le alberature dei siti noi usiamo un software a apgamento che si chiama Visio ma volendo è possibile utilizzare anche Powerpoint o Illustrator, o, nel caso di siti poco articolati vi possono bastare carta e penna.

Pagine e contenuti

wireframe

Adesso sappiamo perfettamente di quante e quali pagine è composto il nostro sito, e soprattutto quali sono i contenuti di ciascuna pagina (l’abbiamo definito all’inizio). Possiamo quindi iniziare a pensare come disporre i contenuti all’interno delle pagine in modo tale che siano facilmente fruibili dall’utente. In questo caso ci torna parecchio utile uno strumento chiamato wireframe, ossia una rappresentazione grafica molto embrionale della disposizione dei contenuti all’interno della pagina. Questa rappresentazione ci aiuta a capire subito qual’è la maniera migliore per disporre i contenuti in maniera ordinata, chiara e pulita. Ci sono varie teorie e scuole di pensiero su come disporre i contenuti in maniera user friendly, tra cui secondo noi le più importanti sono la teoria dello “z layout” e quella dello “F layout”. Anche in questo caso per disegnare i wireframe ci avvaliamo di un software che si chiama AXURE che permette inoltre di creare una demo funzionante del sito in modo tale da poterne testare l’usabilità ancora prima di averlo sviluppato, e di correggere quindi eventuali problematiche riscontrate durante i test.

Design e sviluppo

A questo punto abbiamo definito tutto quello che serve ai nostri web designer e sviluppatori per poter iniziare a lavorare sulla grafica del sito e a seguire sullo sviluppo vero e proprio. Insieme alla documentazione (alberatura – wireframe) che abbiamo prodotto prima forniremo tutte le indicazioni sull’azienda/prodotto, sul target, sullo scenario, sui competitors in modo tale che possano disegnare e sviluppare un sito veramente in linea con gli obiettivi dell’azienda e le aspettative del target, oltre che efficace e facilmente usabile.

RESTA AGGIORNATO!

newsletter e blog magenta digital

Continua a seguire il nostro blog per scoprire di più sul SEO, sul Social Media Marketing, su WordPress e tanto altro! Iscriviti alla Newsletter e scarica i nostri utilissimi tools pensati appositamente per te!

[Voti: 1    Media Voto: 5/5]