(19th September 2007) Northwind Traders example website

The website was to be created using Microsoft Visual Web Developer 2005. On launch of program, I clicked on 'New Website', and then chose 'ASP.net Web Site' as a blank template to use.

To set the layout for the website, I chose to create a table by clicking on the layout toolbar at the top of the program and then clicked on 'Insert Table'. I chose a table with 2 columns and 2 rows. A space for a logo, a title, a navigation bar and a main space for data.

To add the logo into the table on the lop-left cell, I clicked on 'Add Item' on the toolbar then 'Add Existing Item'. In the file explorer, I chose a .jpg logo that I had created earlier. I dragged and dropped this into the table cell. I then right-clicked on the cell and changed the properties of the cell so that the logo could fit.

Then, I added a title, highlighted it and right-clicked to show editable properties. I changed the colour of the text to match the colour scheme of the logo. I then added some text to represent the other pages of the website on the bottom-left cell to form a navigation bar, which I would later add hyperlinks to. I also added some text to the main bottom-right cell - the main cell for displaying information about each page.

I then previewed the design on a browser to see if everything was looking as it should. VWD uses a WYSIWYG design view so nothing looked any different.

After seeing the previewed design, I decided I would change the background colour of the cells on the left, to improve the aesthetics and also to distinguish between the two sides of the website (eg. so the navigation bar appears to be separate from the main bottom-right cell.

Then, I created 3 new blank pages for each category of data, like in the database switchboard. The solution explorer shows all of these pages (.htm).

I have more pictures and information about how I finished it but unfortunately blogger.com isn't great and if you make any mistakes like deleting pictures whilst your trying to move other pictures around, it's saves the draft as it is before you can undo it and you can't get the stuff back.