Planning a Website MAD2053

SITEMAPS A sitemap is a visual representation of a website’s structure.  Boxes generally represent pages and lines represent links.

SITEMAPS – why important? pages and blocks of information your website should contain are identified pages and functions are aligned to your user’s priorities all content has been categorized appropriately your website is easy to navigate redundant or duplicate content is removed all project stakeholders understand how a website and the information it contains will be structured

WIREFRAMING Web design FOUNDATION Define the information hierarchy of your design Makes it easier for you to plan the layout according to how you want your user to process the information

WIREFRAMES vs MOCKUPS vs PROTOTYPES Wireframes are basic illustrations of the structure and components of a web page. Mockups generally focus on the visual design elements of the site. Prototypes simulate how the website will work. Prototypes will have the user interface and is usually constructed using HTML/CSS (and even JavaScript for showcasing how the front-end interface works).

Further reading http://webdesign.tutsplus.com/articles/a- beginners-guide-to-wireframing-- webdesign-7399

http://responsify.it/

http://www.wirify.com/