Archive for the ‘Uncategorized’Category

HIST 697: Designing History

After reading my classmates’ blogs, I noticed that many of them posted about their own designs as well as critiquing each other’s, so I thought I’d briefly blog about mine as well. Like Megan, I chose to go in and make some changes to my site after receiving Sheri’s very helpful comments. This is the site as edited after reading Sheri’s comments. This is the original version of the site, though the CSS here does include the skip nav that I had originally omitted.

Like many of my classmates, this website will serve, at the very least, as a rough template for my final project. As you may gather from the body content of the site, I plan to pair civil defense films with historical commentary on the films themselves. I plan to upload the films I’ve found for free on the Internet Archive to my own YouTube channel (yet to be created) which I will then embed in the site. Users can then play the videos and will have a chance to read my deconstruction of what they’ve seen. I will pair the commentary itself with screen shots from the films and other supplementary materials so that the text will also be image rich. My challenge will to be to keep my narrative both accessible and informative. For the moment I plan to let the YouTube channel stand as a place for users to add their own comments, taking advantage of that existing infrastructure for interactivity. Perhaps I will also create some sort of page or form soliciting film submissions as well.

I also hope to create a page listing other resources visitors can use to learn more about the history of civil defense. There is where I plan to list and acknowledge the many monographs I’ve used over the course of my own research. It may even serve as a nice annotated bibliography. I’m also considering contacting other enthusiast civil defense sites on the web to create a mutual support network. Enthusiasts seem to have done a lot of important work in civil defense history, especially when it comes to collecting primary source material.

As I think about my final project I’m concerned not only about the text I plan to write for the site, but also how to display the videos in a visually pleasing way in terms of the site’s design itself. I think I’ve done all right when it comes to creating a certain period atmosphere for the site, but now I have to see how functional that design can be. Other nitpicks : I’m still not happy with the font. It’s so interesting Sheri picked up on it, because I tried for several days and just sort of gave up. She hit on what was wrong with the Trebuchet: it was too round. So I’ve switched to the straighter Verdana for now. Also, that Geiger counter guy at the bottom needs some sort of caption or text floating next to him. He’s there to fill what was too much white space. I got him from a civil defense pamphlet. I am going to continue pondering how to fix that blip at the bottom of the page. It’s actually been giving me trouble for several days as well.

15

04 2012

HIST 697: Design Assignment

This week I will be critiquing my classmate David’s design assignment, Santa Anna Goes to Washington. I’m excited that I get to work with David’s assignment, as he’s quite adept with both code and design and I’m always learning (and “borrowing”) from him.

So first, positive:

  • I’ll state simply that you’ve nailed CARP. I really love the way you’ve used the different borders and colors to create interesting boxes on your page that almost mimic a flag. The color scheme is quite nice – the blue really adds a lively pop, especially when contrasted with the yellows in your logo.
  • I think you’ve done well going for the period look. Part of this achievement is the aforementioned color scheme, and the addition of the historical map and figure in your logo. But the font choices, both in your logo and the serif in your body copy, are excellent. The choice of font color contrasted with the background really looks like ink on aged paper, but because of the strong blue and red, and the crisp logo image, your site avoids looking cliche and instead looks like quite lively.
  • I’m just going to say that I really am still quite impressed that you’ve managed to draw together such a complex color scheme and detailed logo image in such a way that still looks simple and usable over all.
  • Small point, but I actually really like the way you’ve used your footer to include the about you information. It’s well styled, and it’s a good use of the space. I may have to mimic you when I’m working on fixing my own design.

Areas for improvement:

  • Ah, that ornament. It is a great ornament. But I’m still not quite sure it works. It is okay on the main page, but when you start clicking into the meat of your site, which I’m sure isn’t finished yet, it looks very awkward just hanging out at the top all by itself. Maybe try making it smaller? Its size may be one reason it’s so jarring. Also, in this case we only see it once – there’s no repetition. If you choose to leave it in, you might find it becomes less clunky and awkward if it’s quite obviously part of a “scheme.” It would have shown up more than once in a document, yes? And also, it’s not the right color. Turn that black into one of the browns in your font, the darker one from your headers. Then it will look like everything was printed in the same ink on the same page. Right now it stands out as an image, especially because there is still some white around the edges I think – it’s not entirely transparent. I am rooting for the ornament, I really am, but you may have to let it go. Or maybe it’s that particular ornament? Anyway, I am eager to see what you can do. Trying to make it look more natural will probably help some of the issues.
  • Let me stop and talk about the content of your main page. I was praising you for the simplicity, and that is one reason the page really, really works, but at the same time, almost all of my attention is drawn to that logo and the content of the page itself comes as an afterthought. This is both in terms of the design and the actual body copy. What is there to pull my eye down? The ornament is the only visually interesting element. I assume each of your sections will be replete with images – perhaps pull one image from each section and make a small thumbnail graphic, then put it next to each link in the list, like a bulleted list but with icons? If they are very simple they could serve to draw attention down to the nav in your body and also, by virtue of your content, instantly inform the user just a little bit about each section’s content. Also, spice up the actual text a bit. I know things sometimes work better short and sweet on the web, but I’m not sure you’ve provided enough impetus here to get people clicking based on that teeny tiny paragraph at the beginning. You know why your project is cool and exciting, and so do we (your classmates), but have you communicated that coolness and excitement to other audiences? Who is your audience?
  • In terms of that horizontal nav bar, it looks great, but I might consider listing “Background” before “Meet the Travelers.” I think I can guess at your original design choice – you want to highlight the travelers, get your user to engage with their personalities, and use those things to pull the user into the story itself. But every time I looked at it the order just bothered me. Maybe find another word for “Background,” one that’s more exciting? That is a tall order. But I would seriously ponder the order of links here, or the descriptive words you choose, as this is part of your narrative arc.
  • I’m going to make some comments about the inside pages of your site, and I’m aware you may not have finished styling them yet, but on I go nevertheless. In terms of the navigation inside the website, once you get into the archive, it looks quite awkward. For example, when you’re clicking through the travelers and all their names are just hanging out up there at the top. Is there a way to move those around? Perhaps make them a left nav so they don’t get confused with your navigation at the top, or simply lost? I know you’re working with Omeka, so your choices may be limited. But when I first clicked through your site I was terribly confused by the sudden changes in navigation. It may simply be a case of a styled front page vs. an as-yet unstyled archive, and if so, I apologize.
  • Also, I see in your one completed biography of Santa Anna his picture is at the bottom of the page. Again, I’m not sure the limitations you’re up against when working with Omeka, but I would try to put all of your images above the fold, especially when they’re of people. Also, make sure all your images are facing into the text.

Okay, this is what I see at first glance. I think you’ve got a very impressive start. I really is a lovely site to look at, and I can see what you’re building toward. I am eager to see and interact with the finished product. It’s been very fun watching this idea develop over these past two semesters.

15

04 2012

HIST 697: Digital Museums

As I worked my way through The Lost Museum website and began taking down notes on my first impressions, I realized some of my judgments may be rather unfair considering the site was built in the early Aughts and therefore adhered to different standards and technological capabilities than the websites we work with today as users and builders. For example, the immediate music and sound that played the instant I wanted to view a (slow-loading, tiny) video is by now a well-accepted faux pas. I also felt irritated that I had to register to play the mystery game, and once there found absolutely nothing intuitive about how the game actually worked, even after having read about it. The interface felt heavily static and reminded me of educational games that I never found appealing. Because I chose to evaluate the hyperlinks linearly, I didn’t reach the lengthy, text-heavy How to Use This Site  page until after I’d been through the entire site, and when presented with that amazing chunk of small-fonted information, I didn’t bother reading it.

At first I liked the simple design of the site’s opening page, but working through the site it became clear to me that more navigation explanation, if not direction, would have benefited the user greatly. It did not have to be extensive. Also, the inconsistency in the sites design as a whole was jarring – the stark contrast between the spartan black design of the interactive museum pages and the white-backed, text-heavy archival pages and essays. I will say, I found the archival pages to be of the most interest, and to be the most useful. It’s too bad they aren’t the featured content on the site, or at least more clearly identified right off the bat.

It would be interesting to read a report on the site’s usage today, and I also found it interesting to experience the site after reading the article about its design. I almost feel that in attempting to give the reader too much freedom, the builders became completely disconnected from giving users adequate signposts, if not guidance. Also, the part of the site built on exploration of a three dimensional space still lacked a compelling narrative, and to me didn’t link to the archival content and historical essays other than being compiled in the same place. Further, it seems the site is attempting to appeal to a mixed audience, which is fine, but in the way the content is presented the site also seems to completely divorce separate audiences from each other. I’m not sure that’s effective in this case, especially without the aforementioned signposts.

Despite my criticisms, I think it’s a great synthetic effort, and a great attempt to take advantage of 3D virtual worlds to imbue them with intellectual content. Perhaps they needed to hire more game designers to help them with the process. This disconnect may be evidence of where we need to see more interdisciplinary work being done to build synthetic tools and online environments that combine different types of media and information into one satisfying whole.

It’s especially interesting for me to interact with this website as I work on my own design project and final project. My site centers around educational civil defense films, and I haven’t even begun to tackle how to embed the videos in my site in a way that will encourage viewing, let alone how to integrate the videos with a historical narrative. Further, how do I meet the challenges of getting my users to both watch the videos and interact with the narrative content? How do I even lay out my navigation menu? Which links take precedence? How many videos do I chose? How do I personally deconstruct the videos I watch? How do I translate my analysis into something readable for a lay and academic web audience?

Brown and his fellow builders asked the same types of questions as they built The Lost Museum and wrote the first successful edition of Who Built America?, but they captured a very brief moment in time when educational CD-ROMs seemed so appealing, perhaps simply because they were so new. They tried to build on the fleeting success of that format by transplanting it to the web, when what they needed to do was translate it. We struggle every day to catch up the changing uses and meanings of the internet. So my users will be familiar with YouTube, I expect, will they be willing to watch a video embedded in my site? In 10 years will historians such as myself be using similar techniques to allow our users to watch our motion picture sources (when not protected my copyright) or will that technique soon seem clunky and out of fashion? Or am I simply having my own unique user-end experience, one that has taught me what I’m going to try and avoid doing, anyway?

07

04 2012

HIST 697: Remixing the Internet

Watching Hans Rosling’s TED Talk, Debunking Third-World Myths, the first thing I thought was, “Wow, all that data and the way it’s displayed is wonderful. I’m so glad there are other people out there who want to do things like that, because I sure don’t.” Then his lecture ended with a bit on how actually, no one wants to compile, display, and analyze data the way he does. Actually, what he didn’t make clear, at least to me, was whether or not this impediment is caused by those who keep the data in regards to monetary concerns – they simply don’t want to fund it? They don’t want to  release it without making a profit?

And so what was the point, really, of his talk? That we need not only people willing to do this kind of statistical analysis (which I think he proved is completely possible) but that we also need  freedom of access to the information and between those working on the data? I found myself far more interested in the very large among of time he spent using the statistical analysis/data to deconstruct his students’ (and perhaps our own) notions about the way the world looks in terms of its economic flatness. It reminded me of the First World Problems Meme:

Making jokes about having “first world problems” I think began as a way for those of us in the “first world” to acknowledge how truly, truly trivial some of the things that vex us can be. It’s ostensibly meant to be mocking of ourselves. But this meme, and these kind of jokes, have quite rightly come under fire for being, well, racist may be the right word, and if not certainly ignorant, in assuming that just because someone lives in the “third world” they wouldn’t have problems with things like takeout menus or cellphones not working properly or wifi being slow because we flatten the “Third World” and forget or aren’t even aware that these technologies and the ridiculous vexations that come along with them are also globally available. Another, more explicitly race-coded term for these jokes is “white people problems.” Naming the meme is this way makes its problematic title that more clear.

Seeing the data Rosling displayed really drove home to me how valid the criticisms of this meme are – when Rosling displayed as world flattened by the internet he was raising an interesting point that I wish he’d spent a bit more time on. Designing for a web audience means that we are designing for a world wide audience, and this means we must redefine our understanding of audience. This audience may speak a different language but have the same literacy skills and face the same kinds of challenges we do, and also have the same interests and curiosities we do. We cannot, must not, look at the internet as a first world problem.

The second TED Talk, Lawrence Lessig’s How Creativity is Being Strangled, also spoke, much more directly than Rosling, to the ways in which the old system of information and cultural creation and dissemination (read culture) refuses to cede ground to the re-emergence of read-write culture. I though a lot about his notion that presenting the established paradigm with competition is the best way to disable or shift it, and I think he’s right. I wonder just how powerful these new technologies are. The simple expectation of new users that the right to remix (and it is seen as a right) be available to them (us) suggests to me that those in control are fighting a losing battle.

Even before watching Lessig’s video, I wanted to share this website with you all. In it, Kevin Weir has gone into the Library of Congress’s digital archive of historical images and animated many of them. Some of them are ghostly reimaginings of what the photo might look like brought to life:

But wait, who’s that in the background? Surely it’s not H.P. Lovecraft’s Cthulhu! Still, consciously intended or not, this image communicates a sense of looming dread over the evils of warfare, whether or not you know who Cthulhu is. The image of a dark monster peering out through drifting smoke, peering down at the bombed out ruins of a town is quite evocative. Indeed, many of the animations are much less subtle and border on the absurd; many are almost Monty Pythonesque.

Perhaps we scholars wouldn’t use images like these with such artistic license, but it made me think about our ongoing debates in class about what it means to alter an image, when it’s appropriate. Sometimes, even, and perhaps especially in their caricature, these animations capture the way we in the present might imagine the historical mood of the image:

These images also represent the way that, through remix culture, we might be able to bring historical images to life. Image you’re staring at a photograph of Abraham Lincoln and he blinks at you. How does that alter not only the users experience, but our own narrative?

Edit: So far this week I have commented on Sheri’s blog, as well as Richard’s.

01

04 2012

HIST 697: Presenting Information Visually

I really enjoyed this week’s assigned text, Edward Tufte’s Visual Explanations. First, it’s different from all the other monographs we endlessly read as graduate students. The book is an interesting exploration of visual literacy, a skill that is often let fall by the wayside, even at the highest levels of education. Tufte’s approach is interesting not just because he wants to teach his readers how to read visual information, but because he is also interested in teaching his readers how to present information visually. Beyond the educational text of the book, it is pleasingly interactive and beautiful to look at, two important components of presenting information that content creators often ignore. I’m reminded of the times I found myself unable to read certain books simply because I found the font choice to be so jarring and poor. Visual disruption can interfere with our willingness or ability to interact with information in astounding and sublime ways.

I found myself particularly taken by the musical streams-of-story presented on pages 90-91. It reminded me a great deal of this wonderful poster by Ward Shelly visually documenting the history of science fiction:

I bought a copy and it’s currently hanging on my wall. The fact that you can only really take in all this information when it’s blown up to a gigantic size says something about the way the information is being presented. The larger size is still problematic – the image expands outside your field of view instead of being too dense to process, or disjointed because it won’t fit in a browser window when blown up. Still, larger is better.  Because the image is organized chronologically from left to right, it is easier to follow the flow of information when you still can see the entire image, even peripherally. Being trapped by the box of a browser window is jarring and unsatisfying.

When I first bought it I sat in front of it and stared at it for what seemed like forever. Initially I found myself captivated simply by the shape and colorization of the image – how did the artist choose such a design, what thought went into the color selection? Does it look like an octopus on purpose? They are both alien and incredibly intelligent creatures, a seemingly fitting choice for a visual representation of science fiction.

This poster arranges information both temporally and categorically, but as I read through the flow chart I also found myself questioning why certain authors/genres had been placed in certain areas, why certain authors and genres are featured over others, among many other questions. I agree with some of the choices and disagree with others. Tufte might say that all of this information has been removed from its context. As an academic I long for footnotes and the more familiar text that explains the artist’s decisions. Somewhere I read Shelly cite Thomas Disch’s book The Dream’s Our Stuff is Made Of: How Science Fiction Conquered the World. That book is so horrible, biased, and outrageously sexist that I couldn’t finish it, and Shelly’s chart appears to be about one hundred times more intelligent, thoughtful, well-researched, an unbiased than Disch’s pithy attempt. So where is the disconnect? As a fan of science fiction and as a historian, I want breadcrumbs to lead me to the information that helped create this wonderful poster. I want the context. But how would we connect this image to its context? It seems plunking the chart down in the middle of a carefully researched monograph might create the difficulties with correspondence that Tufte reiterates through various examples. How can we explain and justify an image like this?

Tufte’s is a great book to read as we approach the creation of our own informational websites. I want to work with videos, a medium I’ve never tried to present online before, so I’m facing the challenge of how to link that visual content to whatever information I choose to present to my reader. I would love for Tufte to write an updated edition of this book with a chapter on the internet, though I will say that it’s quite remarkable how well his argument holds up over time. Even the spare bits on computers don’t really feel dated. That fact may say just as much about the way humans create and process visual information as it does about Tufte’s insights.

Speaking of visuals, we spend a lot of time talking about the importance of color. Getting color right, both in my webdesign and simply in my life is something that I find to be incredibly important. Society and history load color with meaning, so that we react to color intellectually and emotionally, more often that not without even noticing the way we’re being influenced. The right color scheme on your webpage can not only effect the readability of the site, but create mood and provide subtle context for your content. I’ve found the Color Scheme Designer to be one of the most useful tools there is in selecting colors for my sites. At the very least I can be assured that my color scheme doesn’t clash with itself, which is one step toward producing a successful site. The flexibility of this tool also means that I can go right to selecting the colors I envision, or I can play around and discover new and delightful combinations if I’m having trouble coming up with a design scheme on my own.

So far I have commented on Geoff’s blog.

25

03 2012

Hist 697: On Restoring Images

Here’s my image assignment!

As I’ve mentioned before, I have some experience in fixing up photographs with Photoshop:

This is a picture of my friends’ daughter, Baby C, that I took while visiting them over winter break in California. The kid is a born model. Seriously, it’s ridiculous. Anyway, I was taking pictures in terrible light in my typical amateurish fashion, and without Photoshop I wouldn’t have been willing to show the results to anybody, let alone her parents. But now I think she can start building a portfolio. Eat your heart out, Tyra Banks.

The Photoshop work above does not represent any sort of serious departure from the original RAW image. As you can see from above, my adjustments came down to correcting the lighting and making the colors pop. That little girl did the rest of it on her own. In a way then, our assignment this week was a great departure from erasing the dust on my sensor from the picture and making the best of a terrible flash.

This is the first assignment that at times left me feeling quite defeated. I still can’t get the coloring right on my main lady’s face – she looks like someone attacked her with foundation then left her to die, such is the terror in her eyes and skin tone. I tried so many ways to make it look natural and failed quite miserably.

Also, interestingly, I ended up finding a color version of my photograph in a book after I’d started coloring. I detail my response to that discovery and how it influenced my work in my image assignment, but even knowing what the colored photo looked like and striving to emulate it, my picture still ended up looking radically different. If I had been able to make the tones look a bit more naturalistic, I could probably start a whole kurfluffle as to which photograph is correct. Luckily for the history community, I am not that skilled. My coloring of the photo vs. the coloring in the photograph I found presents two radically different meanings, something I’m still thinking about.

I did enjoy the assignment, though as I noted in my narrative, Photoshop is a lot more fun when you are free to meander through  your image manipulation without structure. This was the first time I had guidelines and requirements from outside being imposed upon my work. Actually, interestingly enough, my brother’s girlfriend asked me to take some head shots of her this weekend. It marked the first time I’d ever shot and edited head shots for professional use, and I actually used a lot of the techniques I learned in this class to edit her photos, most helpfully burn and dodge. Being on familiar ground, working with photographs I’ve taken, I felt more comfortable and, in fact, I also felt frustrated because I had too few guidelines to work with for the head shots. I’m still not sure I produced an adequate finished product.

There’s a key lesson: research and ask for help. I spent so long trying to get the vignetting to work and so far I’ve failed miserably to recreate our exercise in class. Now I am going to ask for help! I take solace in knowing that I can create transparent backgrounds without crying most of the time. Now I will stand and and wait for my trial by fire. Well, not wait exactly. I’m sure I’ll change the vignette and my lady’s face about 4 million times between now and then.

That reminds me! One of the greatest skills you’ll ever learn in Photoshop is when to stop and let an image be finished. It’s a lot like writing in that way, actually.

Edit: So far this week I have commented on David’s post.

18

03 2012

HIST 697: Photography, History, and Historical Photographs

Points if you can see the person.

I truly loved the Errol Morris article that we read for class today. I remember last semester in CLIO I discussing how schools don’t really teach visual literacy – I know I didn’t begin learning how to read visual sources until I entered college, and then only in certain courses. These articles are deep visual literacy – Morris and his interviewees not only read the images as presented but investigate the history of the creation of the images and the changing meaning/uses/understanding of the images over time. This approach is deeply historical and should go far to prove that images are valid historical sources. And, just like any print source, they are biased, their creation is complicated and perhaps unknowable, and their legacies are unique, changing, and completely their own. Even their creators lose control over them.

Reading the article I initially had to laugh because my first reaction was, “Have these people ever known a photographer?” Anyone who’s ever known or been a photographer knows what a strange business making images is (and what quirky and dedicated people it attracts to do it well). The camera is an extension of the eye, and therefore it comes with all its same limitations and biases. I do a lot of nature photography, which initially to me seemed a pretty objective subject. But I also remember the day that I realized in order to take a good picture you don’t look through the camera and photograph what you see, you have to see the shot first, then look through the camera and try to recreate it that way. This in and of itself is a manipulation. What about that stretch of coastline do I want to capture? How to you manipulate the framing of the image, the focus, to convey that meaning? Should I include the little purple flower in the shot, or does leaving it in the frame add a bit too much life? Including it or not means moving the lens an inch, but its a different photograph either way. But I’m not manipulating the scenery. What if I include it in the shot but crop it out in post? What if? What if? Which picture is the “real” one?

In my own photography I found I liked desolation – huge sweeping landscapes dominated by overwhelming natural features, devoid of people. Most of my photography looks this way, but I was photographing at national parks, often crowded ones, though you’d never know it from the images I shot. The Pacific Ocean made me feel small, so I wanted my photographs of it to do the same – when people appear it’s one lone person photographed from a far distance to emphasize the isolation.

North Shore at The Great Beach, Point Reyes National Seashore, Point Reyes, CA. This image has been altered.

And that brings me to the issue of test shots. Dr. Petrik said it last class – don’t keep 500 pictures of seals when you only have 8 good ones. It’s so easy, especially now, to take a million pictures and pull out the 3 the hit capture that you wanted. The idea of a man moving around a skull a bit and playing with light and exposure doesn’t bother me. Because that’s what photographers so. I’m an amateur, but my friends who are professionals, dear god it can be tedious to be around them even when they’re not shooting in a studio. They’re not working for the FSA, but they’re mind’s eyes is equally active trying to document the world around them. A photograph is a memory of “physical reality,” but it’s also a memory of a mood.

At the end of the day “getting to the bottom of it” can become just as muddy as with any other source. Photographs are not objective representations of the truth, just as print is not. But this difficulty does not disqualify visual sources. Instead, it makes them deeper, richer, because as we explore their meaning, their construction, the change in that meaning over time, the way we remember them, we learn even more about history. Every step of the way teaches us something. We just have to learn to do the leg work.

<strong>I commented on Margaret’s blog this week.</strong>

05

03 2012

HIST 697: Color & More

I’ll admit to struggling a bit with this week’s videos. I’ve been using Photoshop for many, many years, and if there is one thing I know for certain it’s that there is pretty much nothing about that program that is intuitive. Everything I do using that program is self-taught and probably not at all the way one is “supposed” to do it. I learned more about the Save to Web box in 6 minutes and 46 seconds than in the 2 years I’ve been futzing with CS5 on my own. So many things I didn’t know how to do! I feel so uneducated! So far these videos (and I’ll admit I’m only about halfway through) are a mix of overview and surprising new information tucked away in functions I’ve already used with what I wrongly thought was thoroughness. I find these videos to be a lot less hands on, at least at the point I’ve reached, and as I usually use Photoshop to edit photography meant to be displayed at full optimization, all the time spent on making images lighter and smaller seems baffling. But I’m glad to finally be getting some guided learning about this very sophisticated program that goes beyond editing in RAW and manipulating light and color. And to my classmates that have never encountered Photoshop before: it can be just as frustrating of a time suck as coding, but once you get trapped it’s actually very fun. And there are ways to simplify the process too once you’ve bumbled through the first round of editing to find something that works.

As for The Non-Designer’s Photoshop Book, I’m similarly thrilled and baffled. Shadows and Highlights, where have you been all my life? Only a few months ago I was bemoaning the fact that my skills with the self-healing brush failed at removing phone lines from a photograph and low and behold, I only had to read 28 pages to find the solution to that vexing problem. But again, a word of caution. The solutions presented are really great, but just because you follow the steps to the letter doesn’t mean things will turn out the way you want them too the first time. Sometime execution is easier said than done, and sometimes you just have to futz with it for a while. Tools don’t always work right, settings need to be changed, and each image is its own beast. They have individual personalities and will require individual attention. One reason our videos this week are so tedious is because our teacher is demonstrating the amount of tinkering necessary to get what you want. In fact, she’s probably cut down on the amount of tinkering and sheer frustration that can sometimes go into making images look and behave as you want them to. That said, layers are your friend! And yes, Photoshop can be just as fun as it can be challenging. Try to keep that in mind too. Look at it as a toy box that just happens to be full of sophisticated equipment.

As for our color sites, the short articles were very helpful, and I’m glad to have the list of tools designed to help us select colors. I am always wary of colors because I know how hard selecting the right ones can be. I’d like to share a link to a color choosing tool that I really, really like: The Color Scheme Designer. This page offers an amazing variety of functions that helps you design whole color schemes. It’s also just fun to play with. I highly suggest you give it a look.

Oh! I’ve also made some changes to my type page. Still not perfectly happy with it, but I think there is some improvement, and I have addressed some, if not all, criticisms, hopefully with a certain degree of success.

Edit: This week I have comment on Geoff and Richard’s blogs.

26

02 2012

HIST 697: @font-face

Edit: My type page design is now mostly polished and done, complete with my executed plan to included Courier New in the design. It’s very spartan – I am realizing that I am perhaps too much of a minimalist – but I think it’s a good first start, especially considering how frustrating the design process was at times. Those footnotes! I still can’t figure out how to italicize the titles, but I have to step away for a while or I’m going to pull out my hair. /Edit

Here is my type project as it stands so far. It is not finished in so far as meeting the requirements (no endnotes yet, for example), but I didn’t feel I could discuss it in my blog without posting a link, and it’s finished enough to discuss my font choices.

I am not happy with it. Well, I’m not completely happy with it. I found my biggest challenge for this project was selecting a set of different fonts that went well together and also matched my historic time period.

The text of the page comes from an old paper I wrote as an undergrad on civil defense, which I examined through the lens of a short story by Philip K. Dick (the king of science fiction) entitled “Foster, You’re Dead.” Because this is a web format, I tried to grab a few key paragraphs from the much longer essay and break them up using sub-headings so that the flow of the text would be logical and easy to read on the web, without being TOO texty. You know, so as to keep the attention of those roving eyes. I’ve chosen this specific topic because it fascinates me, and I’m considering trying to do something concerning the civil defense program for my final project. The image I’ve chosen to include is actually taken from the National Archives’ website (if you click it, you will be taken to the image’s specific page in their catalog), and at this stage I’m pondering how I might make use of their digital and physical archives to help my own project.

Anyway, more specifically about the type. I decided to host all my own fonts, partially because I thought for this exercise it would be easiest and cleanest in my code if I began by working only with @font-face. I think this decision must have made my life about 100% easier in terms of building, because I had zero trouble getting my fonts to work (at least as far as I can see).

I’ve mentioned before that I have a weakness for grunge fonts, and I was pleased to discover that I could actually sneak one into my header, HVD Peace. The design of my page is supposed to evoke the feel of a fallout shelter sign (hence the color scheme) – one that is worn, a relic. HVD Peace, despite its name, has a military and perhaps more appropriately utilitarian appearance to it. It mimics a worn, graffiti stencil, giving it the sense of being aged that I wanted. I actually built a second grunge font, Gesso, into my stack. I really like Gesso, and it was just a bit too modern for this project, but if for some reason HVD Peace doesn’t show up for some, Gesso still presents the aged look, but it casts a more sci-fi feel to the project, especially as a serif. I think that’s actually okay – my paper does discuss science fiction, after all.

So the logo font was the easy part. It’s the body I struggled with and that I’m still not happy with. I really like my sans-serif, Gentium, which I’ve used in various weights and styles for my headers, caption, footer text, and (unfinished) navigational menu. I had a lot of trouble finding a serif that I liked, probably because I just have my heart set on Futura. That font is so perfect for the time period, especially something attempting to mimic the appearance of instructional text. I think it would’ve looked great. But, it’s not an option – it’s not a webfont. So after much back and forth I went with Roboto. I’m still not sure how I feel about it. I may still change it.

One thing I do want to do between now and Monday is actually work with some Courier New. Those basic fonts can work for us too! I want to use it as a stylized text. I hope to add another header in between by “subtitle” and my first “subsection” explaining very briefly that the text is an excerpt. This little bit will be in a larger size. I also want to style my pull quote in Courier New, if not Gentium. My thinking with Courier New is that the font will give my page a sort of “typed,” look, as it the text were being pulled from an old military report. If it doesn’t work, maybe I’ll post screenshots just to show the difference, or to demonstrate visually what I was thinking.

All in all it was a fun exercise, but I found trying to make the page period appropriate to be most difficult. In my case, my content speaks to both a military theme and also a cultural, science fiction theme. Most graphic design I see around Civil Defense spins the biazzaro, Philip K. Dick, angle of it. I went the other way. But my choices were also dictated by my images. I don’t hold the copyright to any pictures of families sitting in their shelters in front of mountains of canned goods, smiling like they’re not prepared for the nuclear apocalypse. Copyright, I’m anticipating, is going to be my biggest problem. So goes the life of a 20th century cultural historian.

Edit: This week I commented on Megan and Jeri’s blogs.

19

02 2012

HIST 697: Typography on the Web

To those of my classmates who chose not to pay for the exercise files that accompany the lynda.com videos, I highly suggest you invest the extra $12. I found myself zonking out on a lot of the videos this week, as many were basically filmed PowerPoint presentations, but when we finally got into the code, being able to work along with the instructor helped me focus my attention. Additionally, and perhaps more importantly, working along in the exercise files makes learning and understanding the coding about 100 times easier, at least in my opinion. It certainly helped make Dreamweaver feel manageable after after that first set of videos. It’s the difference between learning and doing. We’re all poor, I know, but if you’re struggling with building I suggest you at least try out the exercise files.

I found this week’s videos helpful in explaining how to integrate web fonts into our own pages. It seemed that, in a way, this series was a little bit of a retread of what we watched last week, minus the strong emphasis on design principles. That is okay with me, though. The focus and reiteration of these lessons helped reinforce the technical aspects of selecting and using web fonts on our pages. Integrating good design technique is what I suspect will be the difficult part. The sheer amount of fonts in and of itself is overwhelming, and I’m glad for all the websites this instructor showed us to help us work to build font stacks and work with fonts in browser.

At this point I don’t really have anything profound to say about Stunning CSS. It’s more technical manual, more stunning than gripping, however, I did sit up and say “Ahh,” several times, particularly when reading about how to cheat bots when using header images as backgrounds. I am both anxious and excited to try that trip. I suspect this book will become more useful when we begin to apply the knowledge we attempted to absorb this week, a handbook whipped out every time a building problem rattles nuggets of memory. And if all else fails, we can use the index.

I have commented on David’s blog this week.

12

02 2012