Contact Form

The form for my site is finished.

I have tried using the "mailto" action to get the info to send to an email address. Unfortunatly it doesn't work, I spoke to Stefan about this and he's ok with this as we haven't covered server side stuff in web design yet.  

Finished Footer

I have completed my footer for my site. 

The colour matches the dark grey of the nav bar. 

The logo inserted in the footer also acts as a link to the home page.

Subtle Background

This is the background image I am using for my website.

I downloaded it from subtlepatterns.com. The plan is to have the images repeat throughout the background of the website. I chose the cube image as I felt it suited the topic of video games.

First Page Finished

I have finished the home page to my site. 

The flash animations are working in google chrome, safari and internet explorer but when run in Mozilla FireFox the page doesn't refresh the animations fast enough, resulting in clipping.

Colour Scheme

For my site, seeing as it is about equality and two sides i'm going for two contrasting colours. Red and blue will be used throughout the site, red representing women and blue representing men. 

Here's an example taken from the banner:

First Mockup

This is the first PSD mockup of my site.

Week 7

More wireframing.

Another continued look at the basis of laying out a website, once again using a grid system. A particularly good site (www.960.gs) gives a free file for CS6 that creates a 12 column page very useful for pre construction of a site. 

At the end of the class we returned to actual code. This week we looked at div's and floats, one of the most important basics for a website. These tags place the content of the site in chosen places on the webpage. For example you can centre the content of your site in the middle of the page which gives a nice amount of white space on the sides. 

Also another good font: Clarendon.

Week 6

This class was mainly focused on the design side of creating a website.

The main topic was wireframing, the idea of the layout of the website, done mostly using a grid system. In principal most websites are laid out in a grid. Whatever content goes into these grids isn't important. In some cases the content doesn't even fit the margins of the boxes in the grid. 

A wonder website (www.webwithoutwords.com) takes some of the worlds most visited websites and places a wireframe over the content, leaving you to guess what website it is. It provides some good inspiration as you get an idea of how the most popular websites on the internet are laid out.

Another good site for inspiration, www.designfloat.com.

Week 5

This was the first big step in making a good site.

Today the class started css, one of the biggest things done in class yet. 

From the beginning I have thought that the sites I have created have looked very dull. Now with css the sites can start to look and function good as well as have some personality.

Simple things such as changing the font have an immediate impact on how the sites look.

Two good fonts I found,

AF Generation Z

P22 London Underground (neither are available in blogger)

taken from the show "Sherlock".

Both look really good in my opinion.

Css also saves alot of time while coding,instead of toiling through numerous pages changing individual things we can simply add one line of code.

Week 4

Things continued on the design and style side of things.

This class highlighted the planning side of a website, particularly our first websites. 

Planning is being stressed as one of the most important aspects of creating a website. A good layout as well as a nice style pallet make for good sites.

Different points such as the purpose of the site, the people the site is aimed at and the what those people plan to do while on the site are all very important.

Week 3

Today websites created began to take a real shape and structure.

I was taught how to link pages together, an obviously useful skill. 

<a href="url">link text</a>

Progress also continued in the design/style side of the subject as today the class analysed a number of websites. Noting the good points such as the font or colour scheme and bad points such as confusing navigation and ill suited styles.

One of the most vital things taught was the structure of the files for creating a website.
The files should be placed in one easy access folder. Everything is in the folder, the html code, the css code and any images or other code types.

Week 2

This was the first real experience with creating a website.

This class went over html and how it works. I learn't a different number of tags/selectors and how they work. 

The structure of the html was also an important part as it explains the layout of a website and why that is important.

A useful site shown today was w3schools.com, a tutorials site with different instructions and pre typed code. We were warned to only take the site for what it is, while the site is useful it is somewhat basic in style.

While the sites I created looked boring it helped me understand the importance of html as the bare bones structure of any website, no matter how complex the site is it always contains html.

Examples:

<html>
<body>
<title>
<head>
<p>
<b>
<i>
<ul>
<ol>
<li>

Week 1

Week 1 was a basic introductory class. 

We were introduced to the subject of web design and the different tasks the class would be able to accomplish by the end of the course. 

The class was also shown the different programming languages we would be using. 

Lastly we went through a list of different websites with databases and tutorials on the different languages and programmes used throughout the course. 

Examples:

http://www.premiumpixels.com

http://www.thesession.org/discussions/

http://www.designkitchen.com

http://500.chromeexperiments.com

The last link is one of the most technically impressive sites I've seen but has a somewhat confusing layout.