Week 7 Assignments

My FOGE homepage redesign is presented here.  It should be locatated at

Http://bcts-potomac.aacc.edu/128b/10/fogecompzip.zip.  I would like the buttons to change when rolled over, but couldn’t get it to work.  Does anyone remember how to do this?  The Help isn’t very helpful.

The Article: Best Faces For the Screen, by Daniel Will-Harris, was a great article for us to read at this time.  There are so many fonts from which to choose that it becomes baffling.  This article helps by giving good examples for specific fonts that are good for the screen (such as Memphas/Rockwell or Bitstream Geoslab703, Verdana & Georgia, Lucida fax, Serifa, PNM Caccilia, Melior, Times New Roman, Arial, Avenir, Blueprint, Gill Sans, ITC Officina Sans, ITC Legacy Sans, Lucida Sans, Myriad Multiple Master, and Lucida Handwriting) as well as pointing out things to watch for while choosing a font for viewing on-screen:  size, serif or sans serif, large x-height, tracking, and hinting.  He also has links to download specific fonts mentioned in the article.

The Article: Design beautiful websites with Fireworks, by Jason Beaird, wouldn’t load correctly so I couldn’t read it.  The 11.91 MB pdf file is 44 pages long and kept erroring out (network error).

So far, I have read the first three pages.  He suggests your first step in designing a web site for a client is to meet with him/her in person (after having learned what you can about the company from the internet or from competitors).  Ask questions about the company and take notes.  Ask about what the company does, what the role of the person you’re interviewing is, the logo, web site goal, what information will be provided online, target audience – share any common demographics, such as age, sex, or physical location, competitors and their web sites.

Week 6 Assignment continued

Storyboard for Redesigned FOGE Home Page.  This link contains the storyboard for the redesigned FOGE home page.  Recommendations for the FOGE website should be located at http://bcts-potomac.aacc.edu/128b/10/week6/fogereview.zip

Assignment for week 6

Chapters 3 & 4 were easy to follow.  The following was produced:

Couldn’t find the article ”Five Principles to Design By.” 

I read the article, 8 Web Design Tactics to Help You When You’re Stuck, by Matthew Inman (Oatmeal) .   My favorite was number 8.  I think he’s right.  You do want to get others’ feedback, but be careful they’re the right “others.”

Assignment 5 – picture from Chapter 2

Week 5 assignments

My design link should be at:

bcts-potomac.aacc.edu/128b/10/week5/designzip.zip

About this assignment,

It was a good assignment for becoming familiar with various parts of the Fireworks program.  The one thing I found difficult was matching the fonts.  Is there a good way to find  a match?  There are so many of them, it’s mind boggling.

Regarding the article by Jakob Nielsen, Top Ten Mistakes in Web Design:

Mistake #1:  Bad Search – I’m assuming he’s talking about the search engines vs our website design.  Should we be putting keywords with common misspellings?  Also, the search engines do tend to return a “Did you mean ____?  when you misspell a word.

Mistake #2:  PDF Files.  I totally agree with him here.  I hate PDF files.

Mistake #3:  Changing Color of Visited Links.  I’ve found that even when websites do change the color of visited sites, they don’t all change.  For instance, when there are many links and you click on each one, several will turn purple, but one stays blue.  This is confusing and I’m not sure why it happens.

Mistake #4:  Non-scannable text.  Sometimes it’s necessary, but generally I agree.

Mistake #5:  Fixed Font Size.  I wasn’t aware you could change the size of the font.  It’s a nice idea, especially for the very small font.

Mistake #6:  Low Search Engine Visibility.  Do the search engines nowadays search through the web pages to find results?  In the old days (a couple years ago), my husband had to send his keywords to each search engine.

Mistake #7:  Advertisement appearance.  I agree with this.  I tend to avoid anything resembling an ad.

Mistake #8:  Consistency.  I agree with him here.  Consistency is key in writing for print as well as online.

Mistake #9:  Opening New Browser Windows.  I agree with not wanting mega-windows opening on the user; however, I like the idea of opening a new window when going outside the site (agree with professor here).

Mistake #10:  User’s questions.  I agree.  A lot of times I will go to a website looking for prices and they’re not listed.

Regarding the Webpages That Suck website by Vincent Flanders, specifically  “The 10 Worst Web Sites to Navigate in 2006″ :

I thought the ads that came up at the top were part of the site.  Also, once you click on a link you can’t get back to his site.

Diner’s Club:   archive.org  The doors are interesting – they should be consistent – either be new links or all the same as the top buttons.  It’s not intuitive that the doors are buttons.  New site still takes too long to open. 

Shulman Fleming:  Tjere’s nothing wrong with using a baby.  The baby signifies growth.  I kept staring at the screen expecting something to come forward.  Finally I realized the side bar would open when rolled over – agree, not a good design.

Matthew Mahon:  Takes too long to open.  Can’t get back to original site.

Campbell Mithum:  Search is important

Medium:  Not good.

Sjb:  Navigation should be very user friendly and intuitive, not fancy.

When designing a website, is there a way to make sure that if someone clicks an outside link, they can get back to yours.  This is important for your business and frustrating when you have to keep entering the business address again and again.  Also when the user opens a site, that site should open on top, not be buried down deep in the open windows.  These are comments relating to the  “The 10 Worst Web Sites to Navigate in 2006″  website.

ushida findlay architects.  When I opened this website in a small window, it appeared blank.  Not so good.

Gaiai Group. same as above

Crumpler Bags.  Very cute, but I can’t read the words that pop down from the pictures on top.  Text that pops up with pictures on bottom are more readable.  Should use consistency and be readable. Also takes too long to open. 

Optimal World.  What does the countdown mean?  not intuitive.

Chapter 2 is in last week’s assignment.

Assignments for week 4

My assignment for week 4 is located at bcts-potomac.aacc.edu/128b/10/week4/mapexample.html, I hope.

Chapter 2 of the Fireworks book went over copying, rotating, masking, adding filters, importing graphics, and trimming the canvas.  The only question I had, I answered myself.  In case others had the same problem, I will mention it here.  I had trouble deselecting the circle (page 56), but then realized I had to have the pointer tool selected first.

Assignment 3 Continued

Assignment 3 Continued

The first chapter of Fireworks was presented very well.   It presented many different methods for cropping, deleting backgrounds, erasing, and smoothing.   The author walked us through the methods and provided examples for hands on experience.  Two images are presented showing the lessons learned.

In the article, Designing for the Web, By Joshua David McClurg-Genevese, Published on January 9, 2006,

the author defined the areas of concern when designing for the web; namely, resolution, differing browsers, web-safe color, graphic compression, and text.  He defines pixel dimensions and spatial resolution and how they affect each other.  He discusses browser trends.  He discusses how you have to take into account the browser space in addition to the size of the monitor.  He mentions fixed-width vs. percentage-based designs.  He mentions the 216 standardized colors.  He discusses the three acceptable image compression formats:  GIF, JPG, and PNG.  He also discusses text fonts, computer limitations on fonts and that the browser’s default font will be used if the specified font is not available on the computer.  Accessibility is another important consideration.  Usability and audience are also discussed as important considerations to design.  I don’t have any questions about this article.

The Web-Safe Color Dilemma, by Lynda Weinman, Lynda publishes the 216 (256-40 colors that vary on Macs and PCs) color palette developed by programmers as a way to design for 8-bit color systems.  Although most computer systems in use today are not limited in this way, a lot of the small electronic devices, such as cell phones and PDAs are.  I don’t have any questions about this article.

Both articles were interesting and well-written.

  I watched the following five Adobe videos:

• Dreamweaver CS3 – Defining a Site
• Dreamweaver CS3 – Creating New Pages
• Dreamweaver CS3 – Creating Links
• Using Shared Elements of Dreamweaver and Fireworks
• Dreamweaver CS3 – Adding Images

These videos were great to watch on my own.  They were quick and only discussed one topic, making them easy to watch and retain the info.  The first video stressed the importance of defining the site first.  The second stressed the ease of creating a new page by right-clicking on the site file.  It also shows other longer methods for creating a new page.  The third video discusses the different methods for creating links – link to email, link to image, link to page within the site or outside.  There are many different ways to accomplish each type of link.  It is best to point to it or browse for the file vs typing in which could end in error.  The fourth video demonstrates the GUI in Fireworks and Dreamweaver.  .  The fifth video demonstrates the methods available to add images to your web pages.  It stresses adding the alternate text along with your images.   The fourth video is presented by Joseph Lowery.  The other four of the videos were presented by Garrick Chow.   Both of these presenters spoke very clearly and demonstrated the procedures with ease.  I prefered watching these videos at home vs in the classroom.  Thanks to Jenn for providing us with the links to view them at home.

Assignments for Week 3

My website for the class assignment is located at bcts-potomac.aacc.edu/128b/10/index.html

The other pages are linked to this page.

 This was a good assignment to become familiar with linking and the different ways to accomplish it.  There was no mention in the assignment about naming titles.  I found that all my pages were marked untitled, so I added names to the titles of each page.  The Target _blank made a new page appear with the link – very useful.

Assignments for Week 2

My website can be viewed at bcts-potomac.aacc.edu/128b/10/Laura.html

Page 2 can be found at bcts-potomac.aacc.edu/128b/10/page2.html

or by clicking on Page 2 on the first website page.

Adobe Seminar Discussion

This was a decent overview of Dreamweaver.   However, since I am totally new to this program, a lot of it went over my head.  I’m going to note the link of the seminar so that I may revisit it when I’m more familiar with the software: 

:  Click here to view “Introduction to Dreamweaver” (1 hour approx)

Is there a way to rewind the seminar?  Many times as I was trying to grasp a concept, I missed the next one.  I would have liked to rewind and listen again.  For example,

How did they delete the background from the chosen CSS?

The Library concept sounds good.

From the spry tab – Accordion panel – this is a new concept for me.  I don’t believe I’ve seen it used in websites before.  Sounds good.

He talked about validation widgets.  How do we put in validation widgets?

There’s so much info discussed here – I hope we don’t have to know all this just yet.

I understood about the fact that Fireworks is good for optimizing pictures, but I

didn’t understand the rest (of why Fireworks vs. Photoshop).

Just noting another website mentioned in the seminar to check out (for later reference):

http://www.adobe.com/designcenter/video_workshop/

AJAX widgets – I don’t know what they’re talking about

I didn’t hear the answer to the question about vista ready.   Is Dreamweaver vista ready?

For further questions email Abbas Rizvi at:  rizvi@adobe.com