Project 4

Project 4


To create a webpage with 5 or more vimeo videos related to a theme as a video gallery demonstrating what we learned from chapters 1-10.

I decided to base my theme on landscape time lapses that I found on vimeo because I’m really interested in nature and how nature can be expressed as art and when I thought of videos time lapses are a really scenic way to see the things that happen in nature so I thought it fit perfectly.

I made a couple different boxes and embedded the vimeo iframes within them and put those in a container within the body. I chose simple colors and tried to focus on the design elements in CSS. I added all of the content in the videos description and included all the links back to the sources, etc. I proofread those as well and fixed them in html and crated some lists to keep it all organized on the page.

I played around with colors. I color coded the boxes and the links.I added a horizontal bar across the top and linked my boxes with each video as link buttons, when you hover over they turn black. I thought this would enhance the users experience. Though I would’ve liked to add a back to the top button but I wasn’t sure where that would go in my document. I had trouble with the text design… I’m having trouble getting text to change fonts and colors but I did successfully indent each paragraph and center the videos and their captions on each block. I made the menu bar items italic.

I added a link at the bottom to a simple works cited page for both project 4 and 5.

I added a link at the top of project 4 to project 5 because I was doing them at the same time and they were due at the same time so I just thought it would make sense in navigating through.

I could not figure out how to separate the list items in my menu bar from the list items in my paragraph texts… but you can see in the html code I put a lot into just editing those text paragraph descriptions of each video it just got messed up on the page from my CSS making of the listed items menu bar.

Link to project 4:




Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s