Blank Website

Project seven was a three page website mock-up. It was to primarily focus on layout, typography, and color. The three pages were a home page with an about box and an image, a products page which I had a few boxes for products with a place for an image, description, and price, and then a contact us page which just had an area to send a message. I think the project was really helpful with starting to us div containers to layout a website and move stuff around a lot easier. I think I did a good job making the website look clean and have good fonts and a color system. I do wish I had more time to go back and add more to the home page so there is maybe more info and images instead of just two boxes.

Fake News

Our 6th project we were tasked with recreating a webpage from The Onion. I had a really fun time trying to recreate the page and finding the fonts, looking through the actual websites code. I had difficulty having the container on the right having a top margin and ended up just putting in a lot of line breaks to make it work, solving the problem but obviously not in the way it should have been.

The Wonderful Shades of Coffee

For our fifth project we were tasked with creating the SMPTE color bars with divs using the float code to move them to the correct spot and then change the colors to follow a certain theme. We also had to place three images into three of the divs. The hardest part by far was getting all of the divs/boxes aligned correctly and into the right spot, but once I was able to get a couple in the right spot it started to get a lot easier figuring out how to put them all together. My theme was coffee because coffee has a rather large color spectrum and it is monochromatic so all of the different shades would look nice together with some images of coffee itself mixed into it.

Good Old Fashioned Running

For our fourth project we were to include video iframes into our websites from Vimeo. The theme I picked for my website was running, stemming from my high school days of running track. Putting the videos into the code was very easy and I did a simple layout that alternated from left to right. The hardest thing for me this project was getting the text to align on the right while also staying in the constrained proportions I wanted so it only was in a container half the size of the website.


The Language of Love

For our third project we were tasked with making a multi-page website that used a table and iframes, that also had something to do with locations. I couldn’t really think of any good ideas for a location based website so I just went with the largest French speaking cities in the world going off of my French heritage. It is a pretty simple centered layout website with the table giving info on where the cities are and their populations. On each of the other pages there is information on the cities and an iframe showing where they are on the map. I enjoyed doing this project because it was the first one where we had the freedom to be creative, although I couldn’t think of a creative idea for this assignment. That was probably the most difficult thing for me was just trying to figure out what my website was going to be about.

The Five Senses (Enhanced)

Our second project we were tasked with adding images and enhancing our html five senses websites. I enjoyed this project a lot more than the first because I was able to be more creative with the code to make the websites more appealing. I added a main five senses image on the home screen and then turned the four links to the sub pages into images of the corresponding sense. So instead of just the word hearing being a link sending you to that page an image of an ear will send you to the hearing page instead. I also created a home button that is on each of the sub pages that has all five senses on it with the word “Home” overlaid on the image. I think I did a good job making the websites more visually pleasing while also making what I did challenging instead of simply adding images next to the text on the websites.