Making the final decisions

I really enjoyed working on my project this week, actually because I finally feel like I have a decent command of CSS and Dreamweaver. My goal by the end of this week was to have to basic framework for all of my pages complete. Success! I even managed to add a custom google search function and tweak (ever so slightly) the Javascript. I don’t know how to not have a new google based page show up, but it otherwise seems to be working.

I have most of my fun tricks already in place, but I am still trying to find some sort of gallery with caption display option for showing off more of the artifacts related to the individual graduate without creating a long page. My thought is to make something like 2 separate containers (1 with images, 1 captions) within a larger container. I found this HTML slideshow but it has some javascript so we’ll see.

I commented on Amy’s Blog.

Design Project

This last week was filled with adding what content I already had prepared and trying to work out the last of the big quirks. My biggest hurdle was figuring out how to make an accordion menu – this site was one of a few that really helped. The greatest solved mystery came at the hands of Dr. Petrik, who showed me how to use the properties section to “target” other pages in my own site! This has been a life saver! She also helped me better organize my site based on folders. Unfortunately I had some issues with Filezilla leading up to class so I had to post the following links to my site a bit haphazardly.



While reading Joshua Brown’s article “History & the Web” I realized firstly that in the short time since it was written so many technological developments occurred, and secondly that the base message still rings true today – How do you utilize the non-linear democratic capacity of the web and still get visitors to come out with a deeper knowledge of the subject? In Clio I, we learned about a lot of different digital tools that lent themselves to interactivity and then tried applying compatible versions to our own project. In the process, we learned (good or bad) which tools were the best use of the space and best way to present our project.
Revisiting this idea forced me to reevaluate my project from last semester. For example, I still want to use CartoDB to map all of the graduate’s hometowns, but wish the maps could integrate into the site as another search tool. I also dabbled with 3D modeling last semester, but want to take it to the next level to allow user manipulation (all I could figure out to make was a 360 degree video of a ring). What I’d like to end up with is something like the 3D models of skulls from the Smithsonian’s X-3D exhibit. Just this week at work we discovered Bruegel: A Fall with the Rebel Angels, a VR manipulative video interpreting the famed piece at the Royal Museums of Fine Arts of Belgium. I would love to know how they accomplished this! Using Zoomify or Thinglink (which I also used last semester) gets the same idea across but at not nearly the same level. As of now I plan to use Zoomify to show other items in the museum’s collection that pertain to the graduate by using the slideshow/slidestack and caption options.

The video about creating polls and surveys is intriguing but I’m not sure how it could be used for my project. I did wonder about a form for people inquiring about donating items to the Museum, but as a federal institution we can’t solicit donations so I’m not sure where that falls in the spectrum. Probably just comes down to the wording.
While still in my infancy with databases (only Clio I knowledge of Omeka) I realize the inherent interactivity and openness of making available some of your collection online with metadata. That being said, Omeka’s manipulation limitations have me searching for other options. If I don’t end up going with these options then is there a way to host Omeka within our own designed site? Or would we simply link out to the separate Omeka project? I know I just need the time to play with it and figure it out.

I posted on Tam and Amy’s blogs.

Imagery Project

With every assignment we tackle I feel like afterwards I can almost claim a certain level of aptitude in everything we’ve covered. Creating the webpage wasn’t too difficult, but I did have to relearn bits of CSS/HTML that my Photoshop intensive pushed out of my brain. That being said I do really like the results of my image assignment page. I feel like the various tricks and tools of the trade are helping me discover what I eventually want my final design to look like.

The one big issue I still haven’t been able to hurdle is getting all of my fancy fonts to show on each browser. I will definitely be bringing this up in class!

I posted to Danielle’s blog.


Next to simply learning the ins and outs of Photoshop my biggest hurdle for the Images assignment was finding material that checked all the assignment’s boxes and applied to my overall project. Lack of scanners are a true problem in today’s society. I chose to focus on Admiral David Foote Sellers, USN, 30th Superintendent of the US Naval Academy, Navy Cross recipient, and representative of the class of 1894 in the Class Ring case. I couldn’t find a good example of a damaged photo for Admiral Sellers, so I used a very damaged photograph of the USS Maine post-explosion – which can be used with the 1895 graduate representative, Darwin Merritt, killed aboard the Maine.

For the recoloring portion, I chose I black and white image of Sellers while Superintendent from the yearbook. First I tried lessening the paper texture through the 4-pronged scanning/combining layers process. Then, I thought I should start easy and chose the background with the polygonal tool and filled it in a grey-blue. Aside from trying to be as deliberate as possible with the lasso, I think the opacity level is extremely helpful to create a soft/not too harsh color balance. My progress has reached a stand still, however, as I try to accurately colorize Seller’s ribbon rack. I’ve had to dig out the Museum’s books on military medals and I can’t seem to find a full list of his decorations.

Here is my progress so far:



Up until now I have only been using the polygonal tool and fill but I think I need to shift to using the brush to get the more detailed parts like his eyes and hair.

I commented on Tam and Amy’s blog.

Photoshop is a bit rough

I left Monday’s class feeling pretty good about the mysteries of Photoshop, but I realize now I was a little too optimistic. Does anyone else feel like it be nice if they could work a whole lot the night after a class so it all sinks in? This week I decided to tackle the engravings tutorial. I got my image from the Alumni Association’s 1945 published history, “A Century of Naval Academy Life.” The original image was this terrible mustard/brown color. The black color helped with the definition but seemed a bit harsh.


The second go-around I followed Paula’s steps under Elements and I think it looks more natural, keeping the paper texture and a nice blue.


I’m assuming we’ll go over it in class soon, but I’d like to know how to take the background away and have a floating image that can take on the webpage background.

After taking stock of images already scanned from last semester’s work on the project I realized a couple things. First, most of my images are from books or at least have the paper texture. After watching the paper texture section of’s tutorial I may need to scan 4 different directions of a number of images in order to create a softened texture. Second, everything is scanned as a JPG, which will be fine for the modern images, but for the older images, it would have been nice to get to the TIFF level and then save them for the web.

I made four scans of a couple paper textured images and went to work. I think I can see a difference, but for the extra time involved, I’m not so sure it’s worth it. I rotated, cropped, and combined multiple layers to reduce paper texture. Here is the before and after:



Perhaps I did it wrong because I do not see a discernible difference. I plan to play with it more this week. My biggest issue now is finding good photographs/images to use that both help my final project and fall under the image project guidelines. I’m hoping I can find some at work this week!

I commented on Amy’s Blog


Choice is an absolute. Much like the difference between archives and collections there is an element of choice involved to focus the subject matter towards the questions you want to answer. Photographers employed to document the plight of the Dust Bowl and Depression in rural America had to do just that. As an extension of what they saw, a camera’s lens and the photographs it produces are at the core how a photographer views the world. Most would assume the image is an objective truth, but as we read in The Case of the Inappropriate Alarm Clock, it isn’t always black and white. Not only do photographers have some level of bias omnipresent but photo manipulation, original intent, captions, and viewer beliefs play a huge role in how an image is perceived.
Photographic manipulation at any stage mars its documentary and historical status. I’m not saying that staged photos are not historical – if taken during the event, then there is value, but without proper explanation it may be misconstrued as straight fact. The movement of items or coaching of subjects in supposedly documentary photographs give a false perception of truth. Like the short quiz shows if the intent is propaganda, photojournalism, or art – the viewer takes that into account and that colors their interpretation.
Once something comes out as doctored it is hard to change. The FSA manipulation disputes actually reminded me of the initial reports of the images of the Marine flag raisings on Iwo Jima. AP photographer Joe Rosenthal took the now famous image (in photo and statue form) of the second flag raising and sent it off. Everyone just assumed it was the first cheered flag raising (the one that actually meant something) and it took a long time for people to recognize it as such.

I posted on Kater’s blog.

What a difference a class makes…

After working on the in-class/homework purple page (and with Mark and Pearl’s help) I can hesitantly say I don’t feel completely hopeless coding anymore. It took way less time than usual to tweak the purple page, actually allowing time to re-attack my typography assignment and portfolio pages! The type page in-class critiques included: too many words per line, a responsive (bouncy) site, and padding issues. Finally seeing a “static” site with set width and use of px vs % or em was extremely helpful in defining what our site should be. I was following’s responsive site plan with max and min widths instead. My second revelation was the purple page’s use of a container/article. Previously, when looking at websites with the developer tool I hadn’t made the connection of the separate central div, which also allowed for a more distinct background surrounding the container. Thirdly, realizing you can just place an image or quote in the middle of the source code and use really opens up the non-linear possibilities.

I’ve always fancied myself a bit of a designer around the house, but color combos alluded me. These tools are great for inspiration, presenting the color spectrum ever-so-different. The most intriguing tool types were extracting colors from images (, accessibility checkers, and any of the plug in a color and get scheme options tools. I put my site up against Graybit and it checked out, but when I tried it in Check My Colours it came up with an error message. Did anyone else have any luck with it? It would be neat to see how it grades different sites. Extracting colors from a set image is a great idea, but dealing with black and white images doesn’t help the cause. I really want to use that type of tool once we work with photoshop and hand color a photograph.

During spring break, I am definitely going to continue attacking and reconfiguring my portfolio and type pages. I’m looking forward to tweaking the color scheme too.

I commented on Alicia’s blog.

Typography web

I came in with a familiarity of the art print side of typography as a fan of Etsy (the one stop online shop extraordinaire for all things crafty), but had no real concept of its web based usage. It’s straightforward with print, whereas in coding we have to account for browser reading capabilities. I spent a long time perusing and the Adobe Edge web fonts before deciding on four styles.

For menu and military citation font I wanted a mid-century typewriter feel so I chose:
The header font is fairly similar to Special Elite but isn’t quite as straight and is more transparent:
Body Font:
For the Yearbook (Lucky Bag) Quote I was trying to mimic a guy’s handwriting, which was especially hard since nearly every guy I know has horribly illegible writing:
I love the fonts, but cannot figure out why they are not working in every browser. It is especially painful because I use Firefox and that is the only one I can’t get to accept the specialized type. After browsing FireFox’s support site, I found Font2Web which is supposed to convert TTF or OTF files to more readable WOFF or SVG. Unfortunately after uploading a new file through the website I still haven’t had success in getting Mozilla to read them. Anybody else having this issue?

This assignment is also supposed to use citations. Initially I was having issues with the in-page links or bookmarks, but thanks to W3schools I realized I was using the “class” attribute instead of “id.”

Since uploading my typography assignment through Filezilla only one of my fonts transferred for any browser. Nevertheless, this is my typography site: LT Reem Medal of Honor.

I commented on Tammy and Alicia’s blogs.