How do you like your site?
Web? Mobile? How about Responsive?
As my cutting-edge technically-oriented readers already know (but I love you the same even if you don’t yet ;0), Responsive Web Design wasn’t exactly born yesterday. The term was coined in an article written by Ethan Marcotte and published in May 2010 on A List Apart.
While Marcotte, the de-facto Founding Father of the Responsive Web Design approach (and its biggest evangelist), has already written a book about it, RWD still doesn’t have an article of its own in Wikipedia where the only reference I found about it was this very short definition: “a methodology for designing web sites that can adapt to a range of screen sizes and device types.”
So, it’s no suprise that RWD examples in higher education don’t abound – yet – even though this approach of designing once for all devices (desktops, large screens, tablets and mobile phones) might be the most efficient way to maintain and futureproof higher ed websites.
A few weeks ago I asked the + 2,500 readers of my weekly email newsletter if any were working or had launched a higher ed website based on a the Responsive Web Design approach.
And, I can say that the higher ed community wasn’t very responsive (sorry couldn’t help myself) as I only got back a handful of emails…
I’m currently working on my next article for University Business about this topic and have already interviewed most of these trailblazers. So, watch for these interviews as I plan to post them on this blog in the coming weeks.
But, I believe so strongly that RWD is one of the best approaches for higher education websites that I’ve asked Stewart Foss, the founder of eduStyle who is also teaching at the college level, to author and teach a brand new online course on Responsive Web Design for Higher Ed. The inaugural session of this 4-week course (with only 10 spots available) will kick off on January 30, 2012.
Anyway, I hope this will help institutions who need it get up to speed with this approach as the students of this course will not only become fluent in RWD but will convert a traditional web page of their choice into a responsive one in just 4 weeks.
In the meantime, since a picture is worth a thousand words, here’s a showcase of the higher ed RWD websites I was able to find (if you want any to be added to this list, please post a comment below with the web address and I’ll add them to the post).
Disclaimer: the screenshots have been done at different screen sizes. However, it’s important to note that many mobile web browsers will try to resize/scale down a website so it fits neatly within the device screen. In the RWD approach, this feature is usually desactivated to offer an optimized user experience designed with a purpose. That’s the reason why these screenshots might be slightly different from what you’d get if you visit these websites with an iPhone or an iPad.
Economic Development – University of Missouri
95 Scenes of Gillman Hall (John Hopkins University)
Texas A&M University – Writing Center
The EbbTide, SCC Student News Magazine
4-week online course: Responsive Web Design for Higher Ed
(asynchronous with weekly lessons and assignments)
ONLY 10 seats per session
Thanks for the RWD best practices. Now, how about a follow-up post telling us why these are the winners?
Not sure I understand your comment.
Do you mean why I selected these websites? I thought I explained that part in this post. Please tell me if this wasn’t clear.
Or do you mean why I think RWD is the right approach for higher ed? While I didn’t go in too many details, I explained that I believe designing once for all (existing and future) devices is the right approach when you have limited resources (staff and budget). Don’t you agree?
All of our new sites use responsive design. One recent example is http://economicdevelopment.missouri.edu/.
We are working on a responsive framework for all of our sites here at Johns Hopkins University, but one of the pilot sites I built a year ago can be found here: http://krieger.jhu.edu/gilman
And another we just launched today: http://strategicplan.missouri.edu/
http://writingcenter.tamu.edu/ launched in August. Alas, it’s still a little rough, as I’ve been frantically finishing back-end projects that have to be done by the end of the semester.
[…] screen sizes, spurring the discipline of responsive Web design. A few colleges are starting to make use of responsive design practices, writes Karine Joly at College Web Editor. Among the better examples: Johns Hopkins University, the […]
http://www.shoreline.edu/ebbtide is SCC’s student newspaper’s site. Just launched today so not completely finished but fully responsive!
[…] the Responsive Web Design approach I mentioned earlier might be the cross-device silver bullet for all the digital versions […]
Thanks for this list! We’ve been talking about using RWD as we look to make our site mobile-friendly. I must say I am a little surprised about how many of these examples still use a rather large image in the mobile version. I would think you’d be more interested in making the content front & center so users don’t have to wait for an image to download.
This site was created with a focus on content for our users. We wanted to make it easy for them to find IT support using any device.
We are looking for user feedback for our new responsive design at http://www.it.eku.edu. In August, we did a complete redesign including all new content. Our goal was clear and correct IT support. The goal with going responsive last week: giving our users (students, faculty and staff) the ability to find support on any device. please send feedback to tammy.cornett@eku.edu
We’re in the middle of planning our switch to responsive design for The Banff Centre as part of a major rework.
we are working through a few responsive projects now. our big debate is do we really need to serve up all the content on mobile. tablet and desktop yes, but it seems that mobile experiences could use far less content….
one good example i’v come across
http://www.lancs.ac.uk/
Kieran,
Maybe everything needs less but better content. Not just your site, but any site….Do a content evaluation and analysis, do you really think our target users: students, are reading all that content-do you think they care about the mission, vision, deans message,etc….?? Just my opinion, we have made a concerted effort to have clear and concise content that works well on any device in our redesign at it.eku.edu. Tammy
[…] my research, I decided to collect screenshots of school/university sites. Karine Joly writes about how difficult it is to update a school website because of funding and staff limitations and […]