Up for a swim???

Up for a swim???
Relax!!

Thursday, January 26, 2012

Week 4

Is this always a good thing?
I don't think there is a right or wrong answer to this question.  On one hand the Internet provides an avenue for anyone to publish or post information.  Starting a home or small business using the Internet can be more cost effective.  Just think of all the businesses that are mail order and benefit from having a website.  On the other hand, if anyone can create a website how do you know it's creditable?  Anyone can create a site and fill it full of useless false information that is misleading to the viewers.  I thinks most people believe what they read and if the site is not creditable than people end up misinformed.  I would have to say that "always" is a strong word and I believe that it's not always a good thing.

Advantages and disadvantages
Like with anything you attempt yourself, there is a sense of accomplishment that one feels when the project is complete and only you can add that personal touch that makes it your own.  Expressing what you want your site to look like to someone else can be difficult, especially if you want something that's not popular or proper.  Then there's the subject of cost.  There are free web authoring sites available that would make creating you web site virtually free, unless you have to pay a hosting fee.

Drawbacks would include limited resources or knowledge available to you and the amount of time necessary to complete the website.  Lastly, creativity is not a side that everyone possesses, therefore, some people would benefit from having a professional create a site that is both inviting and usable.

Additional comments on the reading....
Chapter 3 was somewhat of a review of our class.  They explained what web pages are and the different software programs available to create and author your own website.   They explained how some of the different programs react or display different information.  Not every web authoring program reacts the same way and this information could be useful if I choose to use one of the programs that they use as an example.  Adding or modifying code by hand was also discussed briefly, I glad we did this in class.

Chapter 4 explained the various tools necessary for posting a website, including what a browser and server do, even how to find a server or host site.  They go on to explain what a domain name is and where you need to go in order to reserve one.  Just like with most projects planning and outling are keys to success.  Knowing what you what to accomplish ahead of time coupled with organizing, and naming your files are keys to creating a useful, usable, and informative website.

The Diigo readings focused on "How web pages work", "How to design your own web site", and the importance of "Universal design for websites".  The "How web pages work" article was very involved to the point of nausea.  TMI   The article on "How to design your own web site" was interesting and authored by a webmaster.  She talked about a a web site that specializes in "do it yourself" web site building.  The name of the site is SBI and she gave it a thumbs up rating for several reasons.  The site can be tailored to your ability whether your a novice or an experienced site designer.  The tools are available, easy to use, and they provide support and motivation to help you along the way.  Best of all there is a money back guarantee!!!  Who can beat that???  " Universal design for web sites" really focused on "accessibility" and the need for such.  Initially, when I thought of accessibility, I thought of people with disabilities, but it's much more than that.  Sure you need to consider people with disabilities, but you also need to consider language barriers, technology limitations, and software differences.  This article discussed the things web designers need to consider in order to remove the limitations and make a site that is "accessible" to anyone who is interested in viewing it.  They also stressed the need to plan for this in advance versus having to go back in later on and make the necessary changes.


Usability -vs Accessibility
Usability refers to how easy a site is to use or navigate through.  Does the site do what the user intended it to do without frustrating the user?
Accessibility refers to the web sites ability  to be used by anyone regardless of language, culture, location, and physical or mental ability.  It also refers to a sites ability to be accessed by various electronic devices and technologies.
Usability and accessibility are related and part of the ergonomics of a web site, you might say they compliment one another.  The world wide web has no limits, therefore, you need your site to have both usability and accessibility in order to accommodate everyone who wishes to access it.

Sunday, January 22, 2012

Week 3

Oh boy, it's a Quiz! pg. 154
When you look at example "A" you see a web page that doesn't fit on the screen, length wise.  The links are centered on the page and too large.  This requires the user to scroll down in order to view all of the links.  Example "A" also has a disclaimer stating that their products are not available at this time, however, the user should go ahead and browse anyway.  Definite turnoff.   Example "B" fits nicely on the entire page.  All of the links use text and graphics and are arranged on the left side of the page, allowing the viewer to select a link from the entire list without having to scroll down.  Using graphics and text make the site more catchy and appealing to the eyes.  Example "B" also provides a text only version of the links at the bottom of the page for viewers that turn off their graphics when surfing the web.  This type of design is more appealing to the user due to it's simplicity for navigating the site and it's appealing interface design.

Will you be more critical of websites.....
Yes, I will be more critical of websites in the future.  It's like anything else, once someone points out a mistake or problem you become hypersensitive of it and try to avoid it in the future.  I realize now that I have allot more to consider prior to creating my website project.  Things you take for granted need to be considered.  How the site is laid out, color combinations, placement of the links, and making sure I include links that are text only allowing viewers who turn off graphics the same opportunity to navigate my site.  There is allot more to consider than I originally thought!!!

Additional comments on the readings
Chapter 7 gets to the point about how important it is to plan your website ahead of time.  Interface and Navigation play an important role in ease of use and how well the information you're looking to convey is displayed.  Repetition, such as keeping the links in the same location from page to page, allows the user to become instantly familiar with navigating through the website.  Using a familiar background color or design is another way to help the user become comfortable with using the site.   Lastly, as a web site designer, don't be afraid to view other web pages for ideas of what works and what doesn't.

Chapter 8 discusses good and bad designs.  When considering links, a good web designer will make sure their links are viable and working properly on a regular basis, otherwise, they will loose credibility and most importantly users.  I now understand how background color can effect how easy it is to view and read text on the screen.  Another thing to consider is that you're not filling the page with to much information making it hard to navigate through for the viewer.  I didn't really realize that scrolling sideways within a frame is a major turnoff to users and should be avoided until reading this chapter, make sense now that it was pointed out to me.  And finely, repetition and consistency are very important when a viewer navigates through a site.

The information in Diigo focused on criteria used to evaluate websites.  It's funny to think that someone who doesn't have credibility could post information on a website, but it's true.  Printing your opinions or information you deem interesting and informative costs money whereas posting it on line can be relatively inexpensive.  You really do need to understand where the information is coming from, who is the author, and whether or not it's bias in any way.  Knowing if the information is up to date or yesterdays news is something to consider as well.  Does the site provide that information?   With access to the world wide web, people can print just about anything whether its true or not, verifying the validity of the information can be difficult if you don't know what you're looking for.  One of the articles, published by Robin Williams, reveled criteria for both good and bad web design features which will be helpful for completing our website project.  I think the author of this article is the same author or co-author of our "The Non Designers Web Book".

What's your style: Organizing information for the web
It makes sense that you need to consider a non linear writing style for the web in order to keep it usable.  I'm a skimmer where possible, rarely do I read something completely unless it's a homework assignment (ha ha).  I agree that the designer has full control to make their site as easy to use and read as possible.  How boring and dull would the web be if it were just pages and pages of text from books?  I found it interesting that the author of this article compared writing for the web to writing for the newspaper, and this style of writing is referred to as the "inverted triangle" method.  Designers need to pull their viewers in a particular direction and provide the important information above the scroll area in order to keep their attention.  I can certainly see that you want to make your site informative and easy to follow and making sure that you organize your information in a particular way can help you achieve that.  All of this information will be useful towards completing my website project and I look forward to creating a "usable" and informative website.  This stuff is way more involved than I ever thought....

Lowe's website
I chose to evaluate the Lowe's website http://www.lowes.com/  The web page loaded very quickly even though there are graphics on the page, mainly pictures.  I like the layout of the home page and one of the most important links I look for is the "store locator" link, which is front and center on this site.  I like how they have an area that shows your hierarchy within the site. This make it easy to go back a screen or two without having to hit the back button on the browser.  Links to all of the departments are nicely located at the top of the page next to the search window.  Each page is set up the same and when you navigate to another page the top of every page looks like the home page, making it easy for the viewer to move from page to page regardless of what department they are searching in.  They use both pictures and words to identify the links making it very easy to distinguish between the various links.  I like this site because it's easy to use and the two key links I use the most are located at the top of the page, no need to scroll, especially when you're in a hurry!

The Home Depot's website
Since I evaluated the Lowe's website, I thought it would be a good idea to evaluate a competitors site.  The Home Depot http://www.homedepot.com/ website loaded very quickly even though they have plenty of graphics.  There navigation bar is located at the left side of the page and is easy to use.  As you navigate through the site each page is similar to the home page making it fairly easy to use.  This site also has and area that shows the users hierarchy or progress within the site.  Again this makes it easy to go back a screen or two without having to hit the back button on the browser.  The search link is located front and center which is nice and easy to find and use.  The "store locator" link is at the top of the home page, and every other page, however, it's not as easy to recognize as the Lowe's site.  Overall, I think the site is easy to use and navigate through.

Friday, January 13, 2012

Week 2

Readability vs Legibility
Reading pages of text on the screen can be very straining to ones eyes.  Web designers use various ways to keep their readers focused on the material they are displaying.  For example, certain text styles and sizes can make reading text on the screen easier or harder depending on your combination.  One of the most popular text styles is serif text, which is very easy to read in print or from a monitor.  Sans serif text is also used due to its ability to become even more readable when you display it on a monitor.  This is due in part to the design of the text itself and the way its displayed through the pixels in the monitor. 
Contrast is another thing to keep in mind.  The easier it is to distinguish the letters from the background the easier it is to read and understand. This is particularly important if you want your readers to take the time to read what you have posted or displayed.  Text that goes on forever and fills the screen is a huge turnoff to readers.  Its better to keep your text manageable, long enough to convey a message but short enough that you don't bore the reader.
Legibility refers to how easy it is to distinguish characters or even words from one another.  If your readers can't distinguish one word from another whats the sense of displaying anything at all?  Here again different fonts or contrasts can help immensely.  Displaying everything in capitals will hinder your readers ability to distinguish between words. Why, because every letter is the same size and within the same block or area which makes it difficult to tell them apart.
Unfortunately web designers are not able to control how everything is displayed on each individual computer.  Most designers do the best they can to create pages of information that are both readable and legible, however, when its all said and done the individuals computer and their default settings play an integral role in how it will be displayed.  This information is invaluable and will be helpful moving forward as we design our own websites.  Knowing upfront what fonts work well with a computer monitor will enable me to create a site that is both "readable and legible" and hopefully informative and enjoyable.

Niagara Falls project
  • Now that you have the perfect picture of Niagara falls, the first thing you need to do is download the picture to your computer.
  • Open up Photoshop and open the picture of Niagara falls.  Once that opens create a duplicate with a different name buy using the "save as" function in the "file" menu.  This will prevent you from modifying the original so you can open it back up in the future if you need too.
  • Now you need to select the part of the picture that you want to display on your website.  Use the "quick selection tool" to pick the parts of the picture you want to keep for your website.  This tool uses contrast to distinguish boundaries.  You may need to zoom in using the magnifying glass in order to see the finite detail.  If you happen to pick an area that you don't want, just go up to the tool bar and select the "-" selection and remove that area.  You will have another chance to remove unwanted background later on with the "eraser tool"
  • Once you have the area selected you need to hit "control c" in order to copy the area
  • Next you want to open a new blank file
  • You will be prompted to choose the name, size, resolution, and background contents for your picture
  • Choose a name
  • You can choose the default size unless you want a boarder/box around the picture that is bigger than the picture.
  • Choose the default resolution.
  • If you want the white box surrounding your picture than choose white in the background contents, if you want your website background to show through then choose transparent.
  • Now that your in you need to hit "control v'" in order to paste your picture into this new file.
  • Now that you pasted the picture into the new file you may see fragments or images around the edges of your picture that you don't want, select the "eraser tool", zoom in on the picture and carefully erase the parts you don't want.
  • Once you've finished cleaning up the picture, your now ready to save it so you can pull it up on your website.
  • In the file menu pick "Save for Web"
  • At this point you will have an opportunity to choose what file type you want to save your picture in.  Since this is a high resolution picture you will probably want to use either a Jpeg or PNG file due to the clarity.
  • Now you need to determine what size you want to save the picture as.  Since you took an 8 meg picture it's probably a fairly large file.  If you want you web page to load quicker reduce the percent of the new file compared to the original file and this will reduce the file size making it load faster.
  • Create a name for the file and use "for web" in the title, to easily distinguish it from the others.
  • Now your ready to include this picture on your web site!!!
Additional reading comments:
The reading is becoming a little more intense and detailed.  Chapter 9 really focused on color and resolution, which will be helpful with our website projects.  I had some knowlede of resolution but didn't really know how it all tied together.  I must admit that I really never thought about how web designers need to consider resolution and color and how the end uses settings will visually effect the way their pages are displayed. 
Chapter 10 explains the various graphic file formats and the pros and cons associated with such.  I had heard of these formats, but never really understood the differences or why you would use one over the other.  The book was very clear in distinguishing between "pixel based' and "math based" graphics formats.  I think I understand the benefits of "anti-aliasing" and how it helps the viewer to see lettering more clearly or should I say smoothly.  Ive used thumbnails before for displaying pictures and lists, as a matter of fact, I have my windows exployer set to display thumbnails.
Chapter 12 tackles typography and it's importance in web design.  There really is alot to consider when designing graphics and text pages for the web.  How will your page look on different computers, is this text easy to read and legible?  Should I attach a style sheet to my HTML document and if I do will the end uses browser desipher it correctly?  There was alot of information contained with chapter 12 and I'm sure I'll use a good deal of it in the near future, with the help of the book of course.
The Dingo reading focused on scanners and resolution and there importance.  I can honestly say that I know, or have at least read, more about scanners than I ever thought I would.  The information about digital image resolution was interesting and can be useful in the future.  I like the chart that was provided that explains PPI, printed size, and file size which I can use in the future to determine the appropriate file size for a given picture.

Adding the poll.....
Adding the poll to my blog was very easy and everyone's questions were interesting.  A few of the questions test the political spectrum and a few test morality.  I liked Dana's and Ava's polls since they were questions that could create debate amongst the voters. 

    Sunday, January 8, 2012

    Week 1's post

    For those of us fortunate enough to have our sense of sight we take the world of graphics for granted, at least I do.  Everything we do, buy, or learn has something graphic associated with it.  Just think of the advertisements, flyers, billboards, and web links we are exposed to daily.  Manuals for new electronics, cars, appliances use graphic designers to depict examples of how to install, fix, or operate.  Magazine articles you read in the doctors offices grab your attention, or your kids attention, into buying a new and improved product.  Web pages with sound and animation entice you into buying one of their products.  These days, the web plays an important role in selling products and services, not to mention the ton of information that is available at your fingertips.  The days of encyclopedia salesman have fallen by the wayside.  The electronics age is here and growing by leaps and bounds.  Each year more and more people are using the Internet to purchase products and services.  The Internet is a huge source of information based on billions of pages of graphics, text, video, and sound.  Some of these pages are informational and some are sales tools, but most importantly, they are at your disposal, provided you have access to the web via computer or smart phone.  Although technology is advancing at an astonishing rate, print media will be around for many years to come.  I don't think the world is ready to stop using paper to convey a message, however, I do think that the world is better informed than 10 years ago due to our advances in technology which web design is a major contributor.

    Designing for the Web -vs- Print
    Designing for the web poses different challenges over print.  Yes, you still have to consider the layout like you would in print, but you also need to take in to consideration the different levels of technology your audience will be viewing your material from.  Not every viewer will be using the same size monitor and or computer that supports 16 million colors and complex graphics.  How fast a page will load is very important to the end user. Graphics, especially pictures with lots of detail, chew up computer memory and slow the loading process down. As technology advances and our computers and Internet connections get faster people have less patience for slow page loading, myself included. I've noticed that since I switched over to broadband, I expect my pages to load instantly and when they don't I get frustrated and refrain from using that site if at all possible You need to consider what browser will be used since all browsers are not created equally.  The simple fact is that different browsers display the same page differently. When I'm looking for something on the web I quickly loose interest in a site that is difficult to navigate through. If I have a hard time moving from page to page I give up and try another web site. In general, web pages need to be user friendly, even obvious if possible, to keep a readers interest.  All is not bleak in the web business.  Costs are typically lower than print.  Changes are easy to make and the web is available all hours of the day.

    Print designers are faced with pitfalls of their own.  Typically they have a limited amount of space to entice their audience long enough to make a point.  Another drawback is cost.  It can be very expensive to create a brochure in hopes of selling your product. Brochures for cars or vacations for example can entice potential customers to explore further and possibly book a vacation or buy a new car.  Changes are another burden.  Once the final copy is sent to the printers for copy its very costly and timely to make a change.  On the bright side, the prospective customer has something tangible in their hands that they can see and feel and no technology is needed to read the print.  Both forms of media have a place, and in some cases a specific need, in our society today. Ultimately there are pros and cons to both forms of media and I believe that both forms will be around for a long time to come.

    Chapter 5 Quiz:
    1.  Print - Company's have a responsibility to inform their share holders of the progress/financial stability of the corporation.  Printing an annual report and mailing a copy to all of their shareholders is one of the only ways to ensure that all share holders have an opportunity to review their progress over the past year.  Even in this day an age, one cannot assume that all shareholders are familiar with computers or have access to the Internet.

    2.  Web - The cost associated with printing up brochures to send to all the add agencies located in a big city could cripple you financially.  By providing the agencies with your web address, you can effectively provide the same or more information for less.  A web address will allow you to include more information and not increase your out of pocket expenses.

    3.  Web - I would require my customers to register the software over the Internet and provide an email address for future updates/announcements.  This will allow the company to send out a blast email to all of the registered users informing them of the updates.

    4.  Web - By providing a secured site specific to each individual customer you can make changes regularly and this "real time" information will be available to the customer at their convenience day or night.

    5.  Web - The cost associated with printing multiple booklets would be to high.  By using the web, you could provide your students/associates with the web address and they would be able to access the information at their leisure.  There is a cost associated with establishing the web site, however, you could charge visitors a nominal fee to access certain areas which would in turn off set the web site and maintenance cost.

    6.  Web - The cost associated with printing high quality pictures is very high.  For an individual it would be more cost effective if they used the web to showcase their talents.

    The Non-Designers Web Book, comments:
    I would consider chapter 1 to be a review for me. I've been using the web for many years and have become familiar with the information reviewed in this chapter. Chapter 2 did have some useful information, especially about drilling down in various search engines. I must admit that I use Google for just about everything and I was not aware of some of the features or specialities that various search engines have. It looks like I will have to play around with directory searching more and use key phrases a little less often, chances are I'll find what I'm looking for faster. Chapters 5 and 6 were the most informative to me. I never really thought about the advantages or disadvantages between printing something and a web site. Chapter 5 explains in detail the advantages of using the web as well as the need to continue to use print for certain cases. It's definitely a great tool for business and personal use, especially when you consider the cost associated with printing everything and then the cost to distribute it. Chapter 6 reinforced the 4 principles we reviewed in class last week. C.R.A.P, the acronym used to describe Contrast, Repetition, Alignment, and Proximity, was discussed in great detail, further supporting our discussions in class. I like how the book used actual web site pages for examples. These examples, along with the step by step changes, helped me understand and visualize how applying these 4 principles to the design can drastically change the appearance of the page and help the viewer find information easier. I can see myself using these principles to help me design various forms of print or web based media in the future, which will in turn make the information I'm trying to convey easier to read and more informative.

    Adding the Gadgit......
    Adding the blog list from class was simple provided you know how to copy and paste.  Once you add the blog address you add a name for the link and save it.  I liked Ava's blog with her picture and reference to liquid refreshments.  The contrast she chose made reading her post very easy.