Quantcast
Channel: The Desk Set » technology
Viewing all articles
Browse latest Browse all 2

Freshen up your web presence

0
0

As an Emerging Technologies Librarian, I spend a lot of time refining and building out my library’s web presence. Some of that is exploring social media and other online venues, but quite a lot of my work takes place right on our homepage. We librarians come from an information science background, so we spend energy and time on making sure our websites are well-organized, usable, and get patrons to their resources quickly—and that should be a top priority. But I really believe that to be leaders in the information ecosystem, our websites must look and feel like we are.

As the designer Charles Eames said, “The details are not details. They make the product.” A great user experience means allocating time to the small stuff. And knowing which small stuff to attend to means observing UX trends and shifts. Here are a few things I’ve incorporated into my library’s website (and my own projects, too).

Responsive design

responsive designResponsive websites arrange their content dynamically based on the viewing device using smart CSS. Instead of having to maintain a separate mobile website, your website detects the user’s screen width and displays the page accordingly. A beautiful example of this is the library catalog page at the University of Technology Sydney. Make your browser window skinny and wide—see how things change subtly?

The seminal article about responsive design was written in 2010 by Ethan Marcotte. Since then, just about every major website has adopted this UX philosophy.

Bootstrap

bootstrap examplePart of being digital is Frankenstein-ing together different code libraries and web elements into a cohesive and beautiful whole. Bootstrap is a bundle of HTML, CSS, and JavaScript code written by a couple of Twitter employees and used across the web. Its main use is to “bootstrap” websites—that is, quickly getting your site off the ground and looking beautiful. Using these readymade components means you don’t spend lots of time hand-coding. A good example of a Bootstrapped website is Columbia Libraries’ 3D printing page. It’s responsive, looks fresh, and probably took a very short period of time to put together.

You can also use bits of Bootstrap here and there. My library website’s form elements, like search boxes, use Bootstrap CSS and JavaScript for styling, so we get that nice blue glow when you’re typing in a search query.

Flat design iconography

flat design icon

If you updated to iOS7 this week, you’ll notice that the heavy-gradient, photorealistic look of iOS is gone, replaced visually by a flat, poppy look. This flat design look is a recent UX trend and looks pretty fly, if you ask me. I coopted some flat design icons offered for free by Pixeden to spice up our services page and give some visual oomph.

Locally, METRO held a recent Iconathon with the Noun Project to develop free-to-use, GLAM-friendly icons. They’re clever, extremely useful, and free to use.

Any other useful resources, web-savvy readers?


Thanks for hosting me as your September Guest Blogger! If you feel like you’ll miss me, I also write an Emerging Tech in Libraries blog, post occasionally on my personal blog, and am constantly on Twitter.


Viewing all articles
Browse latest Browse all 2

Latest Images

Trending Articles





Latest Images