Kimberly’s Weblog

Just another WordPress.com weblog

Design beautiful websites with Fireworks October 25, 2007

Filed under: CAT 274: Electronic Design for the Web, Week 7 Assignments — kimberlyerin @ 12:38 am

http://www.adobe.com/designcenter/fireworks/articles/frwcs3_webdesign.html

This chapter has great tips for getting started on your design. I’ve found myself referencing it frequently.  Start out by researching the company and trying to get as much information as possible. Great tip that a meeting doesn’t have to take place in an office. Start out by sketching your layout design on paper.  Design a site that is both beautiful & functional. Navigation should be clearly visible on page.  Each page should look like it all belongs to one site.

The page should consist of the content & content block(container), a logo, navigation, footer, and whitespace.  He goes into the grid theory, which I later found out you don’t have to stick true to.  Grids work for print, but when you design for the web, making sure it is uniform and looks good will work. He goes into balance, symmetrical and asymmetrical, unity, ,proximity, repetition, emphasis, placement, continuance, isolation, contrast, and proportion.  All of these elements make a good design.

Having a morgue file is a great idea. That way you can reference it whenever you need an idea.  He also has some great ideas to mix up the navigation and placement of everything on the page.

 

The Best Faces for the Screen October 22, 2007

Filed under: CAT 274: Electronic Design for the Web, Week 7 Assignments — kimberlyerin @ 10:29 pm

http://www.will-harris.com/typoscrn.htm

While he states using a 14-16 point type face won’t look unusually large, I have to disagree.  I think that size should be used for headers and subheaders.  I would stick to 12 pt. for body text, 14 at the most; or else it will look like your designing for the elderly. I understand the reasoning behind always using a sans-serif for at all times on the web, but it feels so wrong, coming from a print background. 

I had no idea about hinting before this; it is a process where by individual pixels of the screen are controlled when fonts are certain sizes.  He also states to us a typeface with a large x-height.  When the font has a larger x-height it gives you more pixels, more information, and more definition. It’s a good idea to have an x-height that’s one pixel larger than half the body size.  He also states extra tracking is a good idea (between characters).

Tips:  The bigger the better.  The simpler the better.  Don’t touch! (letters)  It’s great he gives a list of the fonts which work best on screen.

 

FOGE Homepage October 15, 2007

Filed under: CAT 274: Electronic Design for the Web, Week 7 Assignments — kimberlyerin @ 7:18 pm

The following is my redesign for the FOGE homepage. The navigation all contains rollovers. Left navigation will rollover to a red, and the top navigation lights up like the “About Us” button is pictured.  The video play button is also a rollover. You can click on the thumbnail or link below to view my file.

home_page5.png

or

http://bcts-potomac.aacc.edu/128b/19/foge/homepage.zip