Wednesday, December 10, 2008

Website

Final Website


Ok. Here it is.

so now what?

So, I think that overall, after not having ANY EXPERIENCE in web design what-so-ever, that I did a good job. Lincoln taught me well enough that I was able to come up with what I have now and I think that having people in my class around in the computer lab really helped me with ideas and information that I may have missed in class. I took full advantage of class time this term. I accomplished a lot and was able to work with others at the same time. I wish that I had more time to go deeper into the programs (lynda expired) and that I could work longer on this specific project. So I know I complained a lot and I know that everything was extremely confusing and I know that I was not a happy camper, but even after all of that I was able to learn the coding of web design and I was able to understand it. Yes, understand it. I really liked working with DreamWeaver because as I was typing the codes, it finished a lot of my tags that maybe I didn't catch and it was really easy to follow overall. I think that after finishing this project, I am kind of interested in creating my own website.....something different then critiques, but something that I really enjoy and could have a lot of fun creating.

critiquing my critiques...

So it is clear that I did not follow my initial composition idea that I had posted earlier on my blog and I changed it to a more simple layout. I wanted the navigation of my site to be extremely clear and understanding. I think that the usability of this site is very easy and I think that making it visually appealing really helps viewers. Simple. Click and go. The given information is an easy read and I think if someone where not interested in critiques it would still be somewhat interesting because of the design layout.

DETAILS

There were many things that I wanted to show visually while designing this website. At first I thought that it would stay extremely simple because it was extremely difficult to work with the css. After Lincoln walked me through the basics :
body {
background:url(Pattern2.jpg);
background-repeat:repeat;
}

.container {
vertical-align:middle;
border-color:#0099FF;
border-width:thick;
}

h1 {
font:Geneva, Arial, Helvetica, sans-serif;
font-weight:300;
font-size:36px;
color:#000000;
background-color:#CC0066;
}
h2 {
font:Geneva, Arial, Helvetica, sans-serif;
font-weight:100;
color:#FFFF00;
}
h3 {font:Geneva, Arial, Helvetica, sans-serif;
font-weight:300;
font-size:24px;
color:#000000;
background-color:#CC0066;
}
a:link, a:visited {
color:#FFFF00;}
a:hover{color:#33FF00;}
p {color:#FFFFFF;}
I was able to chose colors that I wanted and styles that I wanted. I went to pgpatterns.com to create my background design so it was not boring. I think that by having a dark background it helps make the images stand out and that is why I chose the yellow, pink and green type colors. I added a texture to the background in order to give it a little more detailed and not so simple and boring.

I wanted my title to stand out....so I chose Cracked as my typeface and kept the same color scheme. The reason why I chose cracked is because I am critiquing websites and sometimes tearing them apart.....thus website critique is falling apart....Just go with it.

The next thing I thought of doing was changing my links so that the were lined up on a horizontal line. Lincoln helped me with that a lot and he showed me exactly what to do.

I also added a link at the bottom of Rachael Ray, Red Bull and The Movie sites that directly connected them to their sites.

Don't worry there is more.

Example of Red Bull's HTML

This is an example of what my HTML of Red Bull's Copilot website looks like. I have a title, my name and then all the information that we needed for the critique. As you scroll down, the images are great examples to the information that is stated.
























HTMLs.............ruined my life.

Ok, so after having a little family problems up in Portland I missed one day in class and it instantly threw me behind like 5 days. I started my HTMLs on my laptop on dreamweaver and was able to create something very simple by decent. My index page consists of a title, Website Critiques, and obviously the author, ME. I then have the three different websites that I am critiqing with an image from each of there index pages. Their titles are the links that take the viewer to the specific page with all the information I had on their specific critique. Plan and simple. Moving on.













Websites + Amber = Death

I am clueless. I have no idea what-so-ever how to make a website from scratch. Its kind of like baking.....you forget to add the sugar and your cookies taste like shit, I forget to close a tag and opps there goes my website, see ya later. So I did a little guess and check and eventually created my HTMLs and they turned out Ok, i guess. Thank God for Lincoln though. After listening to almost every single tutorial possible, I still had no clue what to do about css or how to tie everything together. He helped me work through my website step by step (which will be described in further posts) and slowly but surely my website is coming along and is starting to look decent.

Monday, December 1, 2008

Site Map


This is my site map. It helps me to stay organized while trying to learn this crazy project.

examples





These were some examples from my critique #2 and critique #3.

Composition Idea


This was a sketch I created that was kind of what I wanted my layout of my website to look like.