Forking Pathways
Web design Planning Tools:

I looked at creating pathways through different structures and understood how the browser operates when developing a website.

I began by looking at a basic Flow Chart. A Flow Chart/ Site Map is a simple structure that is used in many websites.
It shows a simple structure to follow when putting together a website.

The start is the homepage.
The input is the links to the pages.
The process is the choice the user has.

The Flow Chart can sometimes have an ‘open-ended structure’ to show more than one ending.
A wireframe is a visual representation of content layout in a website design, which helps with organising and simplifying all the content and the various elements within a website.
Check out this website:

http://www.webdesignerdepot.com/2009/07/using-wireframes-to-streamline-your-development-process/
An interface is the design layout and grid structure of websites and software applications, where the focus is on the users experience and interaction.

An example of an interface can be seen in:
http://www.creativereview.co.uk
Another useful website design by Olia Lialina can be seen below, click on the picture to checkout this interactive website.
In this site you can find a number of frames, which comprise of pictures and sentences. The user can choose their own path by clicking on whatever frame they want. The different paths allow the user to see the website through a variety of perspectives.

HTML

When creating a website it is fundamental to understand how the browser operates. The HTML programs the language for the layout of your website. As an example I looked at the HTML of Olia Lialina’s website.

This is a screenshot of the HTML:
The HTML shows the codes- header, JavaScript and the cascading colour sheets of this website. As you can see the HTML is quite simple, but on reflection, the website is complex. The HTML is very important as it allows you to understand how the browser operates and is a handy tool to use when creating a website.
For further referencing and inspiration go to:
www.codeacademy.com

HOMEPAGE