For the past two weeks, I’ve been putting in a great deal of time trying to create my final website. I did not realize how difficult this was going to be! The assignments throughout the semester certainly helped prepare me to build a site, but it becomes a whole new story when you actually sit down to make the final thing. If this class has taught me anything, and it’s taught me a lot, it’s that websites are an intensive piece of work. Never again will I take for granted the work that goes into websites. Beyond just the nuts and bolts of the code, one issue I’ve encountered has been the content. Writing on the web is totally different than writing a research paper. How much information is too much? What is a general observer interested in? These are just two of the many questions I have been asking myself the last few weeks. While I find the topic of a murder in 1856 fascinating, I have had to restrain the amount of text I spend on context information. It’s a constant battle to determine how much of the cultural history surrounding the trial needs to be included on my site. I feel that I’ve done a good job of getting the essentials on my site, but it’s been tough to leave certain bits of information out.
The hardest part of this website has been figuring out how to make an image gallery. I had grand visions of making little thumbnail images of a newspaper and then when the user scrolled over the image it would expand and the visitor could easily read the specific part of the article about my topic. Alas, I spent many hours and got nowhere. So as I put my preliminary site up for critique, that is the major aspect that is missing. I still plan on achieving this goal, but it will have to be presented as part of the finished product. I’m hopeful that I can get some pointers from my classmates to see where I’ve gone wrong. For something that is so easy to imagine in my head, I’ve had no luck figuring out how to get my vision on the web and that’s been extremely frustrating.
Here is my comment on Elizabeth’s post from this week, Design Post.
With no reading for this week, I’ve spent my time working on my design assignment. If you’ve read my previous posts, then you know design is not my forte and I’ve had some struggles with it. This assignment really gets at the importance of making your site as a whole reflect the topic and content. Again, if you’ve read my previous posts, then you know my topic is on the murder trial of Philemon T. Herbert. So that was in 1856. With that year in mind, I had to figure out how to make my site feel old-timey.
Because much of my content focuses on the newspapers’ reaction to the murder and subsequent trial. Therefore, I wanted to make a design that has the feel of an old newspaper. I think I did a pretty good job of it too. The first aspect I worked on was the background of the body of the site and the background of the container. In my other pages, I’ve used an off-white color for the container and a dark red for the body. I wanted to mix it up this time. I got some inspiration from several of my classmates websites. I really like the textured background look for the body. I was able to find a site that has that type of texture png files and uploaded it to my site. The next thing I did was search for an old parchment paper that I could use for my container. I did a general google search and found numerous options. I really like the contrast that these two images set up on my site. I then found several fonts that look like old news print. I used one of these for my main content and the other for the navigation.
I’ve certainly made it sound like this was an easy assignment. Let me assure you, it was not. I had some issues figuring out how to import the fonts I downloaded to my site. It took me a long time to realize I needed to create a @font-face property. That was a great a-ha moment for me. With that figured out, the other main issue I see with the site is the parchment background. I think it looks good, except I can see a faint line between the container and the main content section. The reason for this is I used the parchment first for the container and then again for the main content. That made it so it wasn’t just one piece of parchment throughout. I would appreciate any suggestions about how to remedy that. I’m not sure how I can install a background that will cover both the container and main content. I’ll keep working on it, but for now here is the finished product.
Here’s a link to my comment on Eric’s blog post “Interactivity.”
Interactivity is a tricky thing to accomplish on the web. That’s what I learned from this week’s reading at least. It seems like it would be very simple to make sure your site is interactive, but as usual there’s much more involved on the back end than I realized before. By nature, websites are interactive. People click around on them, read text, watch videos, or look at images. For me, I figured it wouldn’t be hard to make my site interactive. Apparently, I wasn’t thinking hard enough, or perhaps creatively enough. I’ve been working on the basics of interactivity, but as the reading and website visit from this week showed, there’s much more people can, and should, be doing on a website than just reading and clicking.
This week we looked at the website The Lost Museum. I was happy to do this because when I took the first Clio course back in the fall 2013 semester, I actually reviewed this site. It wasn’t until after I made my selection on which site to review that I discovered I chose the site that the professor, Dr. Michael O’Malley, had helped create. Lucky me. When you visit this site the first thing that stands out is how dated it is. It was created over ten years ago at this point, and it shows. The site overall is a bit cheesy. I think that’s the biggest risk that historians encounter if they want to make a site like this. The Lost Museum tries to mimic the appearance and interactivity of computer games. That’s a tough task because those games are constantly updating and are more focused on graphics and game play as opposed to making sure the user learns something. When I presented my review to class, Dr. O’Malley affirmed these thoughts. He said they had a tough time determining just how to make a website both fun and educational. I don’t envy that task, as I am struggling just to make my website educational.
I really enjoyed reading the article by Joshua Brown that accompanied this web visit. That article gave me a chance to really see what the creators’ intentions were for this site. I like the idea. Learning should be fun and they tried to merge video games with learning. While the idea is excellent, it’s clear that the results were lacking. As Brown notes, “the narrative outcomes were preordained, confirming only the predominance of designers over users–as demonstrated by ‘test’ audiences of teachers and students who gleefully clicked on different 3-D exhibits but professed utter bewilderment about the significance of what they found.” I remember some history classes in high school where the teachers had us use some type of learning game like this. And I’m pretty sure I fell into the pattern Brown describes of not really learning much. Nonetheless, I certainly applaud the effort to make an immersive history site. And I really like feature they added that allows the user to search the archive for specific terms and data. But the fact that this site is so “corny,” (this might be too harsh a word) takes away from the information it presents. For the generation who grew up with video games and computers, this type of site might actually prevent learning, rather than encouraging it.
Here’s a link to my comment on Jefferson’s blog post this week, “Accessing Accessibility.”
This week’s readings focused on the accessibility of the web for a wide audience. This goes beyond just thinking about your viewers in terms of their age, gender, or interest level in your topic. As these readings note, many viewers may have various disabilities that can disrupt their ability to access your website. It’s taken me most of the semester to actually think about who my audience is and how to appeal to specific types of viewers, and I now realize I hadn’t even taken into account those viewers who might have physical or mental limitations that might make my site less easily accessible. I enjoyed the readings because they were a wake-up call for me to really think about each individual who might visit my sight. I certainly don’t want anyone to miss out on the exciting news coverage that followed the case of Philemon T. Herbert way back in 1856. Therefore, moving forward I will put even more thought into my audience.
Constantly adding more thought into my site has been a common theme throughout the semester. I use the internet all the time, and am constantly interacting with different types of websites, but until I started this course I didn’t have any idea how much work went into creating my own site. I’m not just referring to the work of actually writing the code either. I’m talking about the amount of mental work required to think about aspects of the site that includes the structure, color, font, navigation, audience, accessibility…….I’ll stop there, but rest assured I could go on for quite a while. Each week I’ve addressed a new aspect, and this week it was time for accessibility. Chief among my concerns with accessibility is the effect of my site’s design, specifically the colors. I’ve been having trouble picking a suitable color scheme for a few weeks, but figured that was really only an aesthetic issue. However, I now realize that bad color design can be not only displeasing to look at, but can also affect the way someone with vision impairment could view my site.
If color is not contrasted properly, it can become difficult for some viewers to actually see distinctions between text. A good example can be seen in Mark Pilgrim’s book Dive into Accessibility when he discusses using color safely. Pilgrim makes some great points about how if you don’t provide enough of a distinction between the color of a hyperlink and that of the rest of the text, viewers may miss the link altogether. Given the amount of time that goes into creating a site, everything on it should be there for a good reason and it would be a shame for someone to be unaware of a link because of the poor color choice made by the creator. Pilgrim’s book offers some great examples of how to make sure your site is clear by using various design techniques.
Another place to check out some basic accessibility tips is on Webaim.org, specifically this page. I found the first tip about adding alternative text to your logos to be really helpful and simple to do. The other major point I took away from these tips was the need for structure on your site. A few weeks ago I watched a tutorial on Lynda.com about proper HTML5 structure. In that video the instructor stressed the importance of making sure your code was structured in a way that could be easily read by other viewers. The tips on Webaim went a step beyond that by discussing how a coherent code structure can facilitate page navigation and comprehension.