Thursday, February 22, 2007

Project #3: Site Redesign



The new section for "centenary" provides you with a consistent layout, focusing on visual differences that replace the need for bread crumbs to show you where you are within the site.



The new home page condenses all of the information on the main website by the use of tabs. The original site had very repetitive tabs, a lot of times switching sections as you would travel farther within each section. I focused on enclosing information into its own section, visually separating it from other outside information. I used red links within each section to be able to read on, without being too over whelmed to do so in the first place. Differences in the line thickness provide visual separation for navigation purposes as well.



The original website. What was wrong with it? It was very overwhelming, considering we can only take in so much at one time, this website was a definite overload of information. There are a lot of pictures randomly placed through out the site that are links to other pages within the sections. Only two of the links are actual links to other sites. Along the left side of the page there is a list called "Regattas online" which needs to be changed to a link so there's not so much stuff going on.

Tuesday, February 13, 2007

Reading #2

Read chapters 6-8 in "Don't Make Me Think":

Chapter 6: Street Signs and Breadcrumbs
Designing Navigation
Web Navigation 101:
Similar to the process of searching for something in a store; when you enter a website
  • you're usually trying to find something
  • you decide whether to ask first or browse first (the web equivalent of asking is searching)
  • if you choose to browse, you make your way through a hierarchy, using signs to guide you
  • eventually, if you can't find what you're looking for, you'll leave
About Browsing:
  • compared to a store, there is no sense of scale of the website
  • there is no sense of direction
  • there is no sense of location
The (overlooked) purposes of navigation:
Navigation isn't just a feature of a website; it is the website. The purposes of navigation are:
  • to help us find whatever it is we're looking for
  • to tell us where we are
  • to give us something to hold on to
  • to tell us what's there, revealing content
  • to tell us how to use the site
  • to give us confidence in the people who built it and create a good impression
Persistent navigation (or global navigation) describes the set of 5 navigation elements that (need to) appear on every page of a site:

1. Site ID- needs to be on every page

2. Sections- primary navigation that links us to the main sections of the site; subsections are the secondary
navigation

3. Utilities- links to important elements of the site that aren't really part of the content hierarchy

4. A way home

5. A way to search


Project #2: Writing for the Web

The goal of this project was to investigate the writing techniques that we read about in our Reading # 1 assignment. We had a selection of websites provided by the teacher to choose from and to follow through with the assignment by selecting the text that we will rewrite based upon our readings.

I chose the website for the department of Computer Science and Engineering, a department of The Institute of Technology. Why you ask? Because it made me laugh! I couldn't understand over half of the links, there was way too much blah, blah, blah, and it was obvious that someone from that department made the website, not a (good) designer. Silly software engineers, when will you ever learn? What's ironic, is that website for The Institute of Technology is really nice! There is alot to take in with the Headlines, but it's mapped out well and it serves well as a home page, not a site map like the CSE website.

The original website:





What are the problems? Over 50% of the links are repeated and spread out over the page. There are alot of department specific technical names, words, and abbreviations, for example: "CSE," is all over the page, what the hell is CSE? I had to think about it and make the connection that it's the abbreviation for the department name. The search bar is floating around somewhere that isn't readily available when you first glance at the site. No bueno. The technical names are out of control: what is a Colloquium? Oh wait, that's right! I'm not a software engineer and wouldn't readily know that it means academic conference or seminar. I had to look it up in the dictionary. Simply said, this website just has too much going on and not that much is self-evident.

The rewritten website:





By getting rid of all the repeated links, rewording bits of information into shorter bits of information, and grouping similar things, there is alot more clarity and navigation is easier. I no longer have to look up any words.