Week 9 - Open Source Code

During the past few weeks, I have spent a lot of time working with images. I always imagined this project to be rich and layered with a lot of visual texture.

Some websites look great with clean, bright palette and crisp text. But this project is about 17th-19th century British tea. I want the user to experience a period look and feel, accomplished, in part, with vintage images. 
 
So... weeks of finding, scanning, renaming, and saving image files into folders I set up for each page on the website. I don't know how, or if, I'll use all of this source material, but some really lovely background images, little bits and bobs that will do "things" on the page later on, and great images that support the content.

Speaking of the "content," I am struggling to figure out how to turn the information from a 20+ research paper into a website. I am not interested in having a bunch of text blocks laying around the site, requiring the user to read, read, read.

In an effort to detatch myself from my research paper, or, rather, from the format of my research paper (comfort in the familiar), I pulled out the "meat" and organized it into a bullet lists for each "page" of the website. From here... we'll see.

In the meantime, I had a lot of housekeeping to do in Dreamweaver as well. I had to create files and folders in Dreamweaver to match the layout of the webpage. Having all of this built ahead of time, before the actual content is loaded onto the website, helps me stay organized.

The home page has a background image in it now. I'm not super thrilled with the size of the Camellia sinensis plant overlaying the map (it's too big), so I'll have to play with it.

One thing I always planned on, was having an image carousel on the home page. I wanted it to rotate through several images that live on the interior pages, thinking the movement will give a little life to the home page.

I found what is actually called an "image slider." I don't know what the difference is between an image slider and carousel, but found one that didn't have as much of a modern look to it. This is where I discovered something called "open source code." Free code you can copy and paste into your project - so cool - but... not exactly the easiest thing for a novice to work with.

After downloading the CSS and HTML files for the image slider, I was stuck. What the heck do I DO with these now? I called in a SME, a subject matter expert from work that I was sure would point me in the right direction.

I learned to pay strict attention to my file structure and file names in Dreamweaver, rename some of the location names accordingly (that came with the open source code), pay less attention to the HTML code itself, and ignore the Java script for now.

After renaming the images I set aside for the image slider, I finally got them to show up. There's some work to do yet on the little buttons, but accomplishing this much was exhausting, so I'll stop for now.