Designing for Web: Presenting Information

What encompasses Web design and what does it mean to us? Well, it would be challenging to narrow down a short list of specific keywords that describes the importance of Web design. I feel Web design is vital in presenting information to the end user in a fashion that is not only easy to read but more importantly accessible on different devices other than the browsers we use on our desktop computers.

The Web design landscape has changed dramatically over the years. You have the business perspective, in which design is still an important vehicle to build brand awareness or recognition. In regards to the personal user, we all tend to remember the places we like to buy our products from and we note the places that we don’t. Whether the design is for business or pleasure, it still all boils down to accessible information displayed or not displayed in an organized manner. A better way to put it, does this design meet the needs of the user? I read this interesting article on smashing magazine. The article talks about how many of the Flash only Websites are disappearing because of the growing use of javascript, and the upcoming HTML 5.0. I want accessibility to what’s important to me, and could care less about company legal battles over codecs or plugins. I know I’m not the only person that feels this way.

When I read this article on avoiding getting stuck in a design rut, it reminded me getting into safe zones at times whether it’s with a certain way of writing code, or maybe a style of texture or font. We all get inspiration from many different things and sometimes this allows us to lose focus on the end goal of satisfying the user needs. Design doesn’t have to be solely about visual appeal, for usability is just as important.

If you haven’t jumped on the Google Chrome bandwagon…Uhh, what on earth are you thinking? Read more.

Programming Logic – Week 10

Here is my final image gallery project. We couldnt use anything we wanted, as far as Flash and other technologies.

Programming Logic – Week 8

We got into form validation this week. I used some easier built-in methods to accomplish, compared to all of my previous efforts…woohoo. 🙂

Here was my form with validation.

Programming Logic – Week 7

This week we got into continued working with arrays, and performed some basic calculations based on user input. We also looked at the document object again, but we used some methods to control the browser window.

Here are some of the exercises.

Programming Logic – Week 6

This week’s assignments required us to store data into arrays, and write some conditionals to properly pull that data back out based on user input.

The two examples can be found here.

Programming Logic – Week 5

Well, I decided to move my scripting work to this blog for organizational sake. Its week 5, and this week’s homework was more challenging than the previous weeks for the simple fact that we needed to use most of what we have learned up until this point and put it all together.

It’s been a little while since I did nothing but code JavaScript, and it’s nice to be refreshing some of my previous experience I’ve gained over the years.

Here is some of this week’s work.

Designer’s Identity Website Analysis

Bicycling Magazine
http://www.bicycling.com/
1. The colors are a complimentary blue and orange, and the flow of the Website creates some interest to see what’s below the fold.
2. The navigation isn’t the best, as one gets lost in the sublevels at times. The Website has 6 main levels. I counted 61 subcategories that appear in a second navigation on the left side. The subcategories only appeared after you clicked on one of the main navigation links at the top.
3. I gave the Website a 3 in quality of content. The Website has great content, but the navigation doesn’t allow you to get to it fast without having to click a few times in some cases.
Rating scale – (1 excellent – 5 poor)
4. Target audience for this Website would be broad for the most part, but targeting men and women cyclists aged 20s to 40s. Corporate attraction would probably be mostly for outdoor/camping, bicycle companies, travel agencies.
5. I think this Website would be useful due to the large amount of text and content found.

VeloNews
http://www.velonews.com
1. You probably couldn’t find a simpler color scheme on a Website, but since it’s a news source the content is probably more important to its users.  The main top branding is in red, and is attached to a black navigation.
2. There are a couple of levels to the pages. There are 15 main links in the main navigation. Any of the subcategories are usually placed in a bread crumb trail under the main navigation so you know where you are if you click on one of the articles or stories from the main page.
3. I’m giving this Website a 2 for content quality. There is A LOT of content, but it’s pretty boring graphically. It’s a very functional Website, that doesn’t make you click very many times to get what you want from it, and the bread crumb navigation they bring in on the interior pages is helpful in letting you know where you are at.
Rating scale – (1 excellent – 5 poor)
4. Target audience for this Website would be cyclists ranging in age, skill level, and gender. It would appeal to anyone who likes to follow racing news, fitness, and new products on the market. Advertising would likely draw bicycle manufactures, and cycling retailers.
5. I like how the content is broken up into meaningful modules. Spite having so many things to display, it’s organized efficiently.

LookCycle
http://www.lookcycle.com/infos/
1. This Website has a wonderful design which showcases their products being used by professional athletes all over the world. It uses complimentary colors, and good use of gradient effects. Visually, the colors used are balanced and draw the eye to the important pieces of content.
2. The structure of the Website only contains one main level, but when clicking on articles or videos, pop-up windows are spawned for viewing. There are 4 level 1 links. They have really made 3 divisions for their Web users. The info, products, and forum portions are linked to one another, and have similar design.
3. I would give this example a rating of 1, due to the cleanliness of the design, navigation, and organization of content.
Rating scale – (1 excellent – 5 poor)
4. The target audience for this Website would most likely be for competitive cyclists male or female in the market for purchasing a new bike. No direct 3rd party advertising.
5. This Website would be useful example of visual appeal. Good content organization.

MapMyRide
http://www.mapmyride.com/
1. The design of this Website is fresh, with use of red, yellow, orange, and black. The contrasting colors make it easy to find information you want. Navigation is basic and to the point.
2. There are 12 level 1 pages and 24 subcategories you can click on in the secondary navigation on the left. There are more subcategories on the Website, which consists of countries.
3. I give this Website a rating of 2. Website was built with user feedback, and was done with a good looking design. It also uses current technologies such as Google Maps mashups. The only thing I didn’t like is the description or goal of the Website is in an “alt” tag in the header instead of having it on an about us page.
4. Target audience would probably be middle aged individuals into tracking their fitness levels, highly rated bike routes, and communicating with other people with similar goals. Any fitness geared companies that would cater to cyclists would be interested in advertising on this Website.
5. I think this is a good example of 3 column format, with nice modules and separation of content.

Men’s Health magazine
http://www.menshealth.com/
1. This Website is build for housing a lot of content, so there are minimal graphics. It has an efficient flow, with a main navigation at the top. It contains a rotating Flash banner module showcasing top stories below top navigation area.
2. The Website has 12 main categories, with 7 miscellaneous subcategory links that possibly take you to a sub-site to view.
3. I give this Website a rating of 1. The categories make sense, and the modular way of displaying the content makes it easy to peruse through the subject matter.
4. The target audience for Website would be primarily men that care about their health and fitness. Maybe mid to late 20s through 30s age bracket. Any company that would help chisel an identity for a man would be interested in advertising, such and new car manufactures, high-end wrist watches, apparel for men, and health professionals…etc.
5. The module organization is nice and would be a good example to get ideas from.

Samantic Markup: What is it?

What would the Web be like if everything was organized in a way humans and machines could understand the same information? In an article I read, common use of XML and XHTML used with detailed information about the content seems to be one effective way to get that balance. By cutting down on all the useless tables or page weight, pages are better understood by machines and other people developing.

I personally get erritated when there is no organization to the code I’m trying to troubleshoot that was written by someone else. It is important to create comments that are clear, tags that have meaning, naming conventions that make sense when your developing.