The Evolution Of The Header.

I've been thinking about what sort of style I'd have for my website, and I've spoke to my friends (who are the band) and they seemed pretty liberal about it. So taking that into account, I thought I would just try a few ideas out for the header and see what I came up with. 

I thought I would use this group photo to create a header, I had a play about on Microsoft Paint and this was my initial idea.

I then took the idea a step further by making it more professional looking, so I opened up photoshop and created a similar orange background with a gradient effect. 

I opened up the original group photo....

... and then I cut the rocky background out just leaving the boys.

After putting it all together, it doesn't look bad, But it needs more work and different ideas adding to make it perfect.

Designing...

After the lesson today, I should post a blog about the design aspect of this project. The design and layout of the web page is incredibly vital to the success of the web page, lets face it you wouldn't want to view a web page that was looked terrible and poorly put together. 

Here are a few key points I learned today,

• Proximity: This is keeping all the related items of your web page together, making it easier for the user, "The closeness of items to one another sets up their visual association with one another and helps produce an order to how the design is to be 'read'"
• Alignment: This means that the nothing should be placed on the page at random, everything should be placed that has a connection with other items.
• Repetition: If your going to do one idea for your design, repeat it through out!
• Contrast: If two items on the page are different, make them different, like REALLY different so that they contrast. A good example of this is using a black background with a white font within the middle. 

The use of grids is important (I found this out today). Grids can be as liberal or strict as you want, you can have wide, tight, tall small grids. All in all these little lines of joy keep your work clean, tidy and precise. They allow you to measure your work and check that it is all mathematically accurate

(ADD AND DOUBLE CHECK LATER ON)

After all of that, it becomes clear that those points are visible in most web pages you visit on the internet. Seeing as I am going to be creating a band page, I have done a bit of snooping,

As you can see from the King Blues website, it amplifies the points of contract and alignment.

The Bedouin Soundclash web page need I say more?

This has been a great learning curve and I am going to use these points in creating my web page. 

DRAFT

AWESOME!!!

Seeing as I think I might do my friends band as a website. I figured I'd ask a friend of mine who has some really good photographs of the band, if I could use her work. Basically she's given me full permission to do what I like with the images. 


This has allowed me to openly create headers, and content boxes using her images, here are a few of them until I can get to a computer that has Photoshop,

 Jace and Belton

Jace

Kieron

Lucas

I think with these and the rest of the pictures, I could do something.

*Images courtesy of Lucie Williams : http://www.facebook.com/lucierachel?ref=ts 

HTML and CSS 101

So, today was the second time I have ever used Dream Weaver,  and to be honest I think I'm getting the hang of it. The first lesson consisted of us creating a verity of boxes within a single box, and it looked something similar to this, 

DRAMATIC RECONSTRUCTION

Then today we we're allowed to practice and experiment with the colour and shapes of the boxes and add a background. This is a still captured from my practice website. As you can see it has content within the boxes and pictures added.

Here is another example of the CSS code which is starting to make sense to me, 

I think that I am going to create a band website for my work. I am slowly starting to feel comfortable working with the Dream Weaver  and I think could produce something that I would be satisfied with. I'll start to post more ideas and creations around this idea. 

PEACE OUT

Movies!

I know what your thinking. And yes, I have another idea, movies (if you haven't guessed from the tittle :) ) .

I am very interested in films and IMDB (Internet Movie Data Base)  is one of my favourite website out there.

IMDB is a website that allows its users to view reviews of films and tv shows, have a sneak peak at up and coming films, and gives a list of its 250 greatest films.

My idea would be to create something similar. To create a forum for debate and discussion for users. Vote tools to enable people to vote which films they prefer and whether they agree or disagree with a comment.

I could also add media from other websites like, flickr , youtube , facebook and myspace .

That's pretty much it...................

What to do ?

For the portfolio and actual assignment of making a website I have a few ideas. One of which is making a band website for my friends band, Midnight High .

I thought a band website would be a good one to do, as the websites are constantly updated with news, reviews and tour dates. They also have a buttons, links and even Youtube videos. on the websites in which it allows the fans to follow the band on either Twitter or Facebook. This would allow me to be liberal with the designing of the website.

Whilst looking online for band websites, I came across a similarity that most band websites have together, their headers, 

 

It seems that most bands have their headers as images of themselves in poses. They are all interactive headers as well which allows greater access to the fan using the site.

Another interesting thing that I have noticed is with the Kings of Leon band website, their background image for the introduction page, is the cover for their latest album, for example,

http://radioactive.kingsofleon.com/GB

After our first lesson on learning the basics of Dream Weaver , it seems possible to create a band website similar to the professional ones I have previously posted. 

 

Anyway, Its just and idea....

What is this blog for?

This blog is my portfolio, which is part one of my assignments for MEDS 2007: New Media : Design & Production. 

This blog is going to contain ideas about for my web page... So enjoy

Practice

This is a practice post.