This is what I get for not reading ahead in the syllabus when attempting to design my horrendously minimalist and ugly Web page for this class. But at the same time, it is good to have these two chapters to supplement what we learned on those assignments, and use it for the final project.
Tuesday's lecture highlighted the four principles of contrast, alignment, repetition and proximity. Conveniently enough, these form the anagram CARP, which is of course a kind of fish as well as the mascot for the Hiroshima-based team in the Japan Baseball League. I did get a kick out of how chapter six repeatedly made the point that they were not looking to harp on mediocre Web sites, but actually took bad ideas from some and created their own sites. Also, the chapter touched on the four CARP principles we previously discussed, but also on something hat many forget, but which has been hammered home in class: the importance of avoiding grammar and spelling mistakes on your Web site.
When chapter eight discussed how to recognize bad design, it seems like the white text on black background idea is an axiom for anyone who has read such a site on the Web. It is more difficult to read, and I usually highlight the text with the mouse to create a dark text/light background view.
It seems like a lot of the poor design principles should be commonly known among those who use the Web with regularity, which is just about everyone these days. For instance, avoiding making the reader side-scroll. I find that annoying as a reader, so that makes sense to me, like many of these ideas. Now the key is to find a way to put these ideas in motion.
Thursday, April 5, 2007
Wednesday, April 4, 2007
I'm not the best designer, but I'm pretty adept with HTML, so I did a lot of coding and design in junior high/high school for extra money. Even though I wasn't always sure what I came up with was the best or brightest idea, I used to look at some of the designs people sketched, and it amazed me what they thought would "work" on the web. (My favorite? Still the woman who wanted me to put an entire row of animated gifs across the bottom of the page to "sing" to visitors. The site was to promote a business solutions start-up company. I don't think it lasted.)
I thought it was important that the readings mentioned some of the simplest rules of design. The more people spend looking at a webpage, they begin to see it's not visually appealing and try to change it, but they don't realize what a difference small things the make. Just the distinction between <br> and <p> is so important. I belong to an online writing community where posters have to format their work themselves, and those that run all the paragraphs together must not understand that it simply doesn't entice anyone to read more. It's not as important in Dreamweaver, but definitely something of which to be aware. With news stories, no one wants to see a long block of type with no visible paragraph breaks.
CRAP, also, is a great way to break down the basic rules of design, but a lot of it is still trial and error. It takes a lot of honesty with yourself to look at something and say, "You're really not doing your best here; this is't something someone will want to look at." It's really necessary to do though because taking risks can land you with the most amazing end product. I know when I was learning to code, I spent a ton of time copying elements from my favorite sites until I found combinations that worked best with whatever content I was using. It's all about trying it out and being flexible.
I thought it was important that the readings mentioned some of the simplest rules of design. The more people spend looking at a webpage, they begin to see it's not visually appealing and try to change it, but they don't realize what a difference small things the make. Just the distinction between <br> and <p> is so important. I belong to an online writing community where posters have to format their work themselves, and those that run all the paragraphs together must not understand that it simply doesn't entice anyone to read more. It's not as important in Dreamweaver, but definitely something of which to be aware. With news stories, no one wants to see a long block of type with no visible paragraph breaks.
CRAP, also, is a great way to break down the basic rules of design, but a lot of it is still trial and error. It takes a lot of honesty with yourself to look at something and say, "You're really not doing your best here; this is't something someone will want to look at." It's really necessary to do though because taking risks can land you with the most amazing end product. I know when I was learning to code, I spent a ton of time copying elements from my favorite sites until I found combinations that worked best with whatever content I was using. It's all about trying it out and being flexible.
CRAP
After reading about web design, I understand why looking at the web page I made for this class makes me cringe. Funny how that works for every assignment in this class. You would think I would learn to read ahead, but it never happens. The “CRAP” rules make perfect sense, and are things that I would think about if I were designing something for print. I guess I was thinking about the web as something more abstract, with nearly limitless possibilities. Sure, you can do a lot of things with a website, but if you try to do too much, everything you are trying to communicate will get lost in the labyrinth of orphan pages, poor navigation, bad alignment, etc. Simplicity will always get the point across. This may take a lot of time and nuance (catch word of the class) with Dreamweaver, but it is much better to have a pleasing, if amateur, website over one that you hope will be taken off the web and soon so you can save yourself from the nauseating experience of having people view the disasters you’ve created.
Web design
After reading chapters six and eight of “The Non-Designer’s Web Book,” I learned about several taboo web elements that I would have likely otherwise never thought about. Tips that suggest not leaving link buttons default blue, ensuring that viewers do not have to scroll sideways, and not including any blinking elements seem perfectly logical for a professional website. These chapters suggest that sometimes a seemingly simple site may actually be less confusing and more elegant than one that is gaudy and cluttered. It is not always necessary to prove that you know how to use flash animation if the page is user-friendly and easy to navigate in the first place.
For our final group project, I plan to work on the website whenever I get a chance because I genuinely want to learn more about web-design. I know next to nothing about designing web pages, and believe that this will be an excellent opportunity to employ what I have learned. I hope that we follow the CRAP guidelines—Contrast (maybe a light background with black font), Repetition (repetitive elements that add a sense of consistency to each individual page), Alignment (everything left justified whenever possible), and Proximity (grouping related elements together). These chapters also recommended spell-checking every page, so I will likely type all of my text into Word before copying it to Dreamweaver.
For our final group project, I plan to work on the website whenever I get a chance because I genuinely want to learn more about web-design. I know next to nothing about designing web pages, and believe that this will be an excellent opportunity to employ what I have learned. I hope that we follow the CRAP guidelines—Contrast (maybe a light background with black font), Repetition (repetitive elements that add a sense of consistency to each individual page), Alignment (everything left justified whenever possible), and Proximity (grouping related elements together). These chapters also recommended spell-checking every page, so I will likely type all of my text into Word before copying it to Dreamweaver.
The Beauty of Simplicity
Sometimes it's easy to get so caught up in flash animations, rollover graphics, java applets, etc. that we forget about what is most important—content. Webpage design can be visually pleasing, but its main purpose is to allow consumers to quickly and efficiently access our product, whether its a print story, slideshows, or video.
The best websites in terms of design aren't those with the snazziest graphics—they are simply the most clean, convenient, and consistent. Any design element that is confusing, distracting, or unnecessary just detracts from the quality of the content. In newswriting, you often hear, "Keep it simple, stupid," and that applies in the design world as well.
Though the information provided in the readings might be a little dated, most of the basic ideas still hold true. It's cool to look at websites now and see how C.R.A.P is being used (or not used).
The best websites in terms of design aren't those with the snazziest graphics—they are simply the most clean, convenient, and consistent. Any design element that is confusing, distracting, or unnecessary just detracts from the quality of the content. In newswriting, you often hear, "Keep it simple, stupid," and that applies in the design world as well.
Though the information provided in the readings might be a little dated, most of the basic ideas still hold true. It's cool to look at websites now and see how C.R.A.P is being used (or not used).
Monday, April 2, 2007
Why?
This is the question I think is not asked enough in web design. The two articles from "The Non-Designer's Web Book" reinforced my belief that designers don't spend the proper time questioning their design decisions. I think if more time was spent during the design or during site revision analyzing the decisions that were made, there might be fewer 'unfriendly' sites out there, forcing us to read white text on a black background or scrolling horizontally.
The four basic principles listed in Chapter 6 - alignment, proximity, repetition and contrast) were a nice starting point to clean functional design. They proved, in my mind, that most design mistakes are made not by placing limits on design but not having enough limits. Creativity does not come about through addition, but through subtraction. That all-important question - why - will lead any level designer to a clearer site through a better understanding of their goals and purposes for each element in their site.
The four basic principles listed in Chapter 6 - alignment, proximity, repetition and contrast) were a nice starting point to clean functional design. They proved, in my mind, that most design mistakes are made not by placing limits on design but not having enough limits. Creativity does not come about through addition, but through subtraction. That all-important question - why - will lead any level designer to a clearer site through a better understanding of their goals and purposes for each element in their site.
The Good, the Bad and the Ugly... Design
I found the chapter on recognizing good and bad design in "The Non-Designer's Web Book" helpful, but also dated and thus lacking. I got a chuckle or two out of some of the "awesomely bad" examples of 8th-grade-history-teacher-quality websites the book showcased. The reality that many amateur web designers include random animated gifs and clip art as soon as someone shows them the
tag, producing gaudy or kitsch sites that hurt your eyes and are illegible, is as undeniably as it is funny.
Still, some of the advice the authors give is simply out of date. For example, they suggest all good designs should fit within 640 x 460. Monitors now very rarely run such a tiny resolution. Making any site smaller than 800 x 600 wastes space and forces the user to either click more links to find your content or scroll more, neither of which eye movement tracking studies show users are readily willing to do. Some other signs that the guide is dated are the acceptance of frames. Frames have largely gone out of vogue in the design techniques of "Web 2.0" designers (don't ask me what web 2.0 is, other than contemporary design). They also seem to accept the dominance of tables in design. The best modern design no longer touches tables, and even mediocre design is beginning to use less of them. CSS deserves some recognition (even if my template for the final project uses tables for the layout - www.missouri.edu/~mjv2dc/finalproject). I also disagree that links need to always be underlined. Using a different color for text links has become an alternate convention.
A lot of the general tips still ring true, though. Gaudy designs or designs that show off while making the content less accessible will always be bad designs. Text lines should always be reasonably short (the rule I hear used is 12-24 words per line).
Dated or not, I do enjoy me some good and bad design.
Still, some of the advice the authors give is simply out of date. For example, they suggest all good designs should fit within 640 x 460. Monitors now very rarely run such a tiny resolution. Making any site smaller than 800 x 600 wastes space and forces the user to either click more links to find your content or scroll more, neither of which eye movement tracking studies show users are readily willing to do. Some other signs that the guide is dated are the acceptance of frames. Frames have largely gone out of vogue in the design techniques of "Web 2.0" designers (don't ask me what web 2.0 is, other than contemporary design). They also seem to accept the dominance of tables in design. The best modern design no longer touches tables, and even mediocre design is beginning to use less of them. CSS deserves some recognition (even if my template for the final project uses tables for the layout - www.missouri.edu/~mjv2dc/finalproject). I also disagree that links need to always be underlined. Using a different color for text links has become an alternate convention.
A lot of the general tips still ring true, though. Gaudy designs or designs that show off while making the content less accessible will always be bad designs. Text lines should always be reasonably short (the rule I hear used is 12-24 words per line).
Dated or not, I do enjoy me some good and bad design.
Subscribe to:
Posts (Atom)