Design Exercise 6 - Resizing

Today's seminar involved creating two separate layouts that were both 'fixed' and fluid'.
The fixed template meant that when the page was displayed in any browser on any resolution it will always be the same size and look the same.

The fluid layout meant that when the browser window size or the resolution was changed the content of the page also changes. When the window is widened the text/images also widen to fill the page. When the page is made smaller, the text/images moves to fit on the screen.

Below are examples of fixed and fluid pages along with the coding.

Fixed:


Fluid:

Website Banner

So for my first term website project I have been given the task of creating a 5 page website about a building/Environment of my choice. For this i have chosen to do Rochdale AFC's football stadium 'Spotland'. After creating my wire frame my next task was to create the banner for my website . This will be displayed at the top on all of the pages of the site.

Unharmony and Harmony Colours

The final task of the seminar was to create a basic piece of HTML coding to portray the feeling of Harmony and Unharmonay using two different colours.
The two colours i chose for unharmony were red and a lime green colour.


The two colours i chose for Harmony were two blues.


Here is the coding that made all this possible!

Logo Colour Changes

The nest task that involved colour was to pick a couple of logos/brands that we liked and then to change the colours on them to see what affect this had. I decided to use two Internet based company logos. I used Facebook and YouTube.


Changed to.....


My Other logo was Youtube.
The two logos i chose are two of the most recognisable brands on the Internet. The logos can be recognised globally along with the colours they use. The Facebook logo, is clean and fresh, the blue looks good next to the white and is not too overpowering. I changed this by altering the blue to a red colour and also the white to black. This makes the logo stand out a lot more, i feel the colours contrast well but doesn't really create a good logo. In my opinion it makes the logo too dark.
With the YouTube logo i only wanted to edit the main colour, this being red. I changed this to a lime green colour. It gives the logo a fresher, cleaner feel.

My Favicon

So after having this blog for just over a year, i finally got around to adding my own favicon to the website. Due to the small size of the favicon (32x32 pixels) i had to have something very simple.
I decided to simply create a logo just using my initials with two simple colours so that it would be easily visible.
I uploaded this and then inserted some code into the blogger HTML so that it would display correctly.

Colour Wheel

During today's seminar we were set a couple of tasks all based around colour. The first of these tasks was to find a Colour Wheel of some sort that we were going to use for the next tasks and also for our main website project. I chose the colour chart below. I think this specific chart is especially useful because all of the HEX codes are listed with the colours. I can use this when working on my website.

Website Wireframe

This is my first draft basic homepage wireframe for my Spotland Stadium Website. I wanted to keep the page quite simple and easy to use. I have chosen to have a navigation bar across the top so the user can easily navigate through the site. The content of each page is layed out similarly in columns.
I am going to have 6 pages to my website, these being:

• Home
• Gallery
• About
• News
• Contact

The benefit of keeping each page mostly the same is that the user knows where everything is on each page and how to navigate to each object/page. The Gallery page will consist of a different design in order to accommodate a scrolling gallery feature.

My Building:Structure:Environment Choice.

From my shortlist of three Environments i decided on using Rochdale AFC's football stadium 'Spotland'. It has become a very important place to me ever since i first attended a Rochdale game.

I was a season ticket holder at Spotland for 8 years and have been through many different emotions watching Rochdale play. Following Rochdale has taken me all around the country to different football grounds but non of these have quite the same feeling and enjoyment that Spotland has.
The ground has undergone extensive development within the last 15 years and has changed dramatically. The ground is now all seated apart from The Sandy Lane end which is situated behind one of the goals. I had my season ticket in the Pearl Street stand which is also behind the goal, in my opinion the best stand in the ground not only for facilities but also for atmosphere.

Stadium is situated on Willbutts Lane in the Spotland area of Rochdale. Spotland has been the home of Rochdale AFC since 1920 when there was only one stand. The stadium is now shared with the local Rugby club Rochdale Hornets.

I will base my website around the whole stadium rather than just one specific stand. I am going to have information about the stadium, stadium news, a gallery page and also a map of where the stadium is.