Tag Archives: Web Development

Welcome aboard The 400

postcard of Chicago & North Western's 400 Streamliners

It’s time to give this website a new look.

This design is based on the paint scheme of the diesel engines and cars of the Chicago & North Western Railway’s 400 passenger service. I’ve always loved that paint scheme, and decided to incorporate it here on my site.

On the coding side, I developed the design based on the WordPress theme, Twenty Thirteen. It is fully responsive and will display well on ANY device.

For more information on the Chicago & North Western Railway, and it’s 400 service, I recommend:

Now… who can help me travel back in time so I can ride these wonderful trains?

Internet Librarian: day one

Rather than blog about every session I attended at Internet Librarian, I’m just going to just focus on the ones I thought were the most interesting.

Designing the Digital Experience
presented by David Lee King.

David told us that basically this is a 30 minute, presentation version of his book by the same name (which I had heard about before and was why I wanted to attend this session).

There are three paths to the experience:

Structure – Create an experience by making the website easier to use. A well designed experience should stay out of the users’ way. You should focus on developing parts of your site that users visit often. Don’t spend too much time on things users only do once a year. Look at your website with a critical eye, think about what would make people stumble. Figure out goals from there, don’t forget the “don’t make them think” philosophy.

View more →

Internet Librarian: preconference

Internet Librarian always sounded like a real interesting conference, and I’m fortunate to be able to attend this year’s edition. The conference for me began with one of the preconference workshops, Web Manager’s Academy; Redesign 2.0. The session featured four librarians presenting several informative talks throughout the day. The two presentations I found the most useful were ?User Experiences? which covered engaging website users and enhancing their experience, and ?Usability Research? which included things like preference testing, affinity mapping, and task-based testing.

View more →

The Edgewood History Collection

screen shot, Edgewood History Collection home page

One of the long term projects I’ve been involved with at work was quietly unveiled this week, the Edgewood History Collection.

The project is a collaboration between myself and several other members of the library staff. My responsibility involved designing and developing the collection’s Home and About pages, as well as the page templates for the digital collection management software (the pages that actually display the items in the collection). The software we’re using is a hosted version of ContentDM.

Some of the things in the Edgewood History Collection I found interesting include:

View more →

Now with photo zoom

For a while now, I’ve been looking for a decent method to display larger photos on this site (some pictures look so much better at larger sizes). I finally settled on Highslide JS, a very nice javascript thumbnail viewer. Just click on the photograph to zoom out to a larger version. It also lets you drag the larger image around, and open up multiple images at once. Pretty slick, huh?

Snowshoes

View more →

XRAY your writing

A couple of useful links for web developers…

XRAY is a brilliant little bookmarklet. Just click it, and then click on any element in the web page you’re viewing. XRAY will show you information on class, ID, inheritance hierarchy, position, size, margins, padding, etc.

XRAY works with Firefox, Safari, Camino, and Mozilla. Found via Zeldman.

Better Writing Through Design from A List Apart makes a case for focusing on the written word, and gives tips on writing better copy for your website.

Great web design reflects the way we interact, and the primary vehicle for that interaction remains text. We share, we chat, we comment, we tag, and we do it all via the written word.

Web developer toolbar tips

Like many other workers of the web, I’ve been using Firefox’s web developer toolbar for a long time.

Smiley Cat Web Design posts 10 Things You May Not Know About the Web Developer Toolbar. What a great list. Among the features I didn’t know:

  • Edit HTML: I use edit CSS all the time, but I had no idea you could edit the HTML. Sweet!
  • View Color Information: Get a complete list of colors (and their HTML codes) used on the site.
  • Display Element Information: View class, id, attributes, ancestors, position, etc. of any element.
  • And a bonus from the comments (more good tips there), CTRL-SHIFT-Y shows you the styles associated with an element.

Introducing… Color Bar

This website has had basically the same design since I bought the domain name (way back in 2000). It is definitely time for a fresh look. I’ve named the new design “Color Bar” and I plan on changing the photograph in the heading occasionally (and perhaps some of the site colors too).

With the new design, the list of my current musical recommendations has been moved from its own page to the home page. Any web geeks out there may be interested to know that the entire site is now managed through WordPress (not just the blog entries). Those static html pages are so twentieth century…

So the previous design isn’t lost to the ages, I have archived a sample of it on a separate page. If you get nostalgic for the old Shield Swoop Design, feel free to go there and reminisce.

Update: May 2015
This design has been retired. You can see an archive of the Color Bar design here.

A new catalog for Edgewood

This week, my latest web creation was launched: a new design of Edgewood College Library’s catalog.

Edgewood Catalog screenshot

Visually, I designed the new catalog to have an appearance that compliments the look of the library’s web site (with a similar header and footer on each page). Marketing types would probably use the word “branding” here somewhere. Some new features have also been unveiled along with the catalog’s new look.

View more →

Edgewood Library website

Today the new website for the Oscar Rennebohm Library at Edgewood College was officially unveiled. It’s been a big project for me, one that had its beginning back when I was hired as the Web Services Librarian this past November.

Edgewood Library screenshot

A great deal of the design of the site was inspired by architectural elements of the library building. I created the header logo to mimic the window and roof lines of the building facade and the graphic at the footer on each page was inspired by the shape of the building. The official Edgewood colors were used (red and black) along with some shades of gray.

View more →