Some Changes

| 1 Comment

This is my first post on this blog, so bear with me.

I've been working on a few changes with Soni regarding how our website may function in the future. One of the main areas I focused my attention on is the way media is displayed on our site.

Our site has quite a few profile videos as well as some pictures scattered around. However, there really isn't a consistent way that media is displayed on our website, especially pictures.

The Sydney program has a good example of one of the ways pictures are presented to users: http://umabroad.umn.edu/PROGRAMS/ASIA/sydney/about.shtml

When one scrolls their mouse over a picture on this page, a pop-up of the image is immediately displayed on the right side of the page. In essence, this works, but has some fundamental flaws.

  1. It isn't persistent. If you move your mouse away from the thumbnail image, the larger image disappears.
  2. You can't copy the larger image, or save it, to your computer. The only image you can do this with is the small thumbnail...which isn't very useful as a standalone image.
  3. The process used to perform this action on these images isn't useful as a whole. It only works on images, as far as I can tell.

I found a bit of javascript that works very well with images, video, text, and more. I used the Cuernavaca webpage as a model (I didn't pick Cuernavaca for any reason other than I just needed some content). You can see how this text works with images here: http://dev-lac.umn.edu/it/cuernavacatest/index.html

Picture 4.png

It also works with text, essentially removing it from being placed directly on a webpage, but keeping it very accessible: http://dev-lac.umn.edu/it/cuernavacatest/about.html (click on Learning Abroad Center)

1 Comment

I think this looks pretty good. My two cents are that the border, text, and arrows look a little "cartoony." Hope that makes sense, I don't know what the technical design term for that is.

Mission: The Web SWG defines and cultivates a strategic vision for the Learning Abroad Center website; maintains consistency of all content; steers development; and maintains the website as an extensive, accessible, and robust marketing tool.