What else did I learn?

Now I know what the tech elite meant by the World Wide Web phenomenon, because it was then that any computer could read HTML files.  Oh the things I learned!!   

I enjoyed the section on the book about layers and Cascading Style Sheets or CSS.  Interesting how you can create different layers, drag them or just one in to a different position on the page. Also, they can be transparent or overlap other layers, so many choices!  Another good section was the organizing files by name.  Something that seems simple but it can be difficult if there is no organization to the file keeping.  I like the idea of keeping all the files that belong on one page together and starting with the same letter or short, descriptive word.  Organization is important so I am able to find things. 

Another interesting factoid I now know why it happens is when a web page is open sometimes the graphics are missing.  This happens because the browser cannot find it due to: the actual graphic file was not sent to the server, or was put in a different folder or the name was changed.  So, once I put an image on a web page, it is better not to change the name of the image nor change its location.  I’ll try to remember that one. 

What are some of the advantages to creating your own website rather than hiring a professional? What are the some of the drawbacks?

The first advantage to creating my own website is how much money I will save.  The cost of having a professional web designer create my website would be in the thousands of dollars.  There are cheaper web designers but their work is dubious, I would not be willing to take such financial risk.  Next will be the creative web site builders.  Some of them not only help to create websites but they have people available to help and “hold my hand” throughout the process, there is a fee but nothing like paying a real designer.  Finally I would know exactly what I would want, need and how my vision for my website should be like.  I would be the sole person responsible for it, if I would do something wrong I have only have myself to blame, not someone I paid I pretty penny for the website.  

One important drawback is time.   To create a good website is time consuming and it could take a long time to achieve that goal.  Another drawback is the tricks that only a professional would know the eye for design and the mind for the project.   

What is the difference between Usability and Accessibility with regards to web design and why are they both important?

Usability is the quality that refers to the speed with which users learn to use something, the efficiency they attain while making use of it, how easy it is for them to remember how to use it, how error-prone it is and the level of satisfaction that they attain from using it.  In another words, usability is a measure of how easy it is to use a site.  While Accessibility is a feature through which people with disabilities can perceive, understand, navigate, and interact with the web.  Web accessibility includes all types of disabilities that impact access to the web and includes: visual, auditory, physical, cognitive and neurological disabilities. 

Both Usability and Accessibility are important because they are ways in which all individuals interact with the web, and a site is not usable unless it is accessible to the masses.

Computers and software have enabled individuals to become one-person operations with an internet connection and laptop. The same is true with website design; anyone with a computer can create a website. Is this always a good thing?

Not always.  There are many people who have the patience and time to learn how to make a good website and follow the “rules” to achieve a successful project.  It is time consuming and there are so much information and different ways to accomplish different tasks but I think that if someone is up for the challenge, paying attention to detail and have tons of patience it is possible (I think).  But unfortunately there are other types of people who do not care about any type of rules and breaks all of them at the same time.  It is important to follow some type of organization once someone wants to create a website.  I still do not know if they choose to break them because of the inability to see a good website or because they just don’t care.  So it is not always a good thing to have anyone making a website, but if they didn’t how would we have the examples of bad websites? 

Will you be more critical of websites in the future with regards to the information they contain? How will this information apply to your website projects you will be creating?

Absolutely!  I guess anyone can create a website, gather some images and through two sentences together without giving much thought.  But I feel more confident that I am able to spot a bad website against a good one, now that I know what to look for and try to be able not to fall into the traps of the bad design and content. 

I will have to make sure to have a blue print as to what I want to write for my web page and organizing the chunks of information will be a great help in making certain that my web site is coherent and user friendly.  That should be my first task; just to have a plan should be a good beginning.  Also, being simple is the way to go.  Keeping the design and context simple and direct to the point should help the viewers have a better time browsing through my website.  Plus, having a way to go back to the main page or other pages is another aspect that most website lacks of, and I must have on mine. Nevertheless, I hope to achieve simplicity and functionality all together for my website project. 

What else did I learn?

I have already experienced the difficult task of navigating and search for information on various websites.  Now I do understand why there is such a disconnection between the beautiful aesthetic design and the functionality of many websites; the developers and writes are often not the same and there could also be a content provider. Sometimes when I am looking at a website it is obvious to me that they did not speak to each other.  Also, “chunk” is a clever way of naming the framework to organize information.  One thing that is still not clear to me (I need a visual) is the flatter the structure or hierarchy and deeper too.  Understanding the flatter option is somewhat easy, how viewers can jump to content directly from the home or top-level pages.  Deeper could be bad (depending upon the how web designer wants to give the information to the users) because the viewers have to browse to get to the needed content.   

How cool and awesome is this inspiration site?  This site is so great because it allows people like me (with 0 experience in web design) to visualize the beginning states of the web page work.  Also, it has a wide-ranging library of symbols.   Very nice.  But if I don’t want to use the Internet for my web page outline, I can use sticky notes (it will feel like planning a wedding dinner sitting chart.  Where should I place the annoying uncle that no one wants to see with?) I think it will work just as well. 

Another look into the world of web design is that there is a section on the book about index or site map.  So many web sites out there completely missed this section while they were making their own sites.  And I really like the advice from the book author if I would be doing an external link, to have it open up in a separate window so my site stays on.  Love this! Good advice.

Evaluate 2 websites. List the URL's. What criteria did you use for your evaluation? Be specific. Address issues such as naviagtion, visual appeal, purpose, loading time, usefulness of content (or entertainment), interactivity, use of multimedia. What other criteria did you use to evaluate the website?

There are various criteria in which I took in mind while evaluating the two websites such as: one-size surfing, good usage of proximity, text, graphics, links, backgrounds, general design and also all from the given prompt.  However, there were two main criteria that seem to take first and second place before all the rest: purpose and clarity.  To me purpose is one of the most important factors of the design.  What is the website about?   What do I want to say and show?    Only then I am able to evaluate each decision the web designer has taken to achieve his/her goal.   In addition, clarity becomes another important piece of the puzzle.  Is the information given in the website clear and coherent?  There is no worse frustration to a viewer to go into a well-design website and see that all of the content and navigation are unclear and does not make any sense. 

My first website evaluation is from a site called, http://www.jennafavadesign.com/.  The owner of the site is a graphic designer and creator.   Her purpose is to sell products and generate clientele (business).  The information given in this site seems to be legitimate and not a hoax, her contact information is easy to find and the visual appeal is of a professional website that gives the viewer confidence in its content.   There is the usage of one-size surfing criteria.  All of her information is there at first glance fitting the page and, there is no scrolling down, sideways or hidden navigation.  The color scheme is simple but effective; black background with a white frame and pink on some of the fonts.  The labels are left aligned in a good size font, not too large, very easy to read and clear to assume where they will lead.  The content is coherent and easy to follow.  There is consistency and repetition in her design from page to page.  It is understandable why the designer wanted to keep the font for the content a little smaller to keep all on the same page, but I think it would look better if it was a tad bigger.  Once you click on a tabbed link to go to that specific page, the color of the label changes to pink so the viewer knows at all times where they are.  There are content and thumbnails images of her works but unfortunately once you click on the thumbnails to view them in a larger scale they do not come up.  The site also has external links, which once clicked are opened on another page, keeping the website open.  Loading is relatively fast and very easy to move from page to page.   This website is interactive (user friendly) and uses some multimedia, like pictures and some of her graphic designs.  This web designer kept things simple but was able to achieve a high level of sophistication.  The site is not bogged down with meaningless information and tons of pictures.  Everything was organized and very clear where to find the needed information.  The Jenna Fava Design website was beautifully done. 

My second website evaluation is from a site called, http://www.serene-naturist.com/.   The purpose for this site is very confusing and unclear.  The site claims to be a therapy center that sells Swedish massages to clients and also is dedicating the website to their “naturist clients” (not sure what that means) but the main purpose is to create business of some kind.  There is no visual appeal, only busy and hideous appeal.  After a long time searching for the contact information, I realized the website is from Manchester, UK.  There is no inkling giving to the viewers (this is a .com site) that this website is foreign.  On the main page on the right hand side the words, “Index Page” is shown.  It serves no purpose only to add more confusion to the main page.  Also, the website keeps track of the time, the “actual” time.  There is no need for that, if you have a computer you can see the time.  There are various types of typography and font sizes/colors throughout the website, making the task of reading their content much harder.  The content itself is confusing and disorganized.  There are some dubious links on the website, like the one for the “nudistexplorer” (I did not dare to click on it!) with a thumbnail size image of a naked person on a bike at the end of the main page.  This sends off the opposite message that this website claims to have, the professionalism of qualified massage therapists.  On the top of the main page, some of the index label does not have a working link.  The usage of multimedia was too much; flying butterflies, different size of pictures with no coherent message, the strange music for each page, and what is the sculpture without legs, arms and head has to do with Swedish massages?  The loading time is the only thing this site has going for them, it’s fast.  There is no good use of proximity and they used all of the alignments on the same page (every page) making the website disorganized and so hard to read.  There were too many usage of blinking and animations, the butterflies and the “disappearing” message, no one will have time to wait for that message (I did and I still don’t know what was saying!).   Overall, the general design of the serene naturist page was extremely bad.  There was no usage of: the one-size surfing criteria, no focal point to the webpage (too many of them), extremely clutter with unnecessary information, and lack of contrast, good contrast.  However, for me the worst crime of this webpage is the ambiguity of it all.  Is this website a reputable therapeutic business that suffers from bad taste of a web design or is it a website camouflaged as regular business to sell “illegal” services?  What do you think?

Quiz pg. 154

Of the two examples from the book, which one instantly strikes you with a visual impression as having a better interface and navigation?  Why is that? What is going on in both of these pages that gives you your instant impressions?  Put into words the problems with one and the solutions of the other, specifically in regard to the interface and navigation.  Add other comments, if you wish.

The first site has some visual appeal because of the colors chosen.  Contrast is good because of the black background, purple and yellow fonts.  It makes the page jump out at the viewers better than the second site.  The graphic design of the rat in the cheese ball is clever but it has to alt labels and once clicked there is no way of knowing where I would end up.  There is no use of the one-size surfing, the buttons are way too large and the interface and navigation are horrible.  Unfortunately is not clear or functional and I have to scroll down the see the rest of the navigation.  

The second site is much clearer with its interface and navigation.   The site is more organized and coherent.  The graphic buttons have alt labels and are easy to see them and now I have a better clue as to where I might go if I click in one of them.   The entire visual impression fits the one-size surfing (800 x 600) and I know that there is nothing else hiding. 

Blog Extra #2

The polling questions were somewhat fun to do.  Almost all of them were hot topics issues in today's world such as:

the death penalty, legalization of marijuana (one of my favorites from Ava's blog) and about the health care debate.  I was expecting more funny questions with absurd answers that we had to choose from, where is the fun people? :) One that stuck in my mind (from Scott) was the poll about what poet was my favorite.  Well, my favorite was not there, so unfortunately I had to pick, who?  That was fun!!

I did not have any trouble with the polling activities but I had problems with the color text from the gadget I created (the poll).  I still do not know how to change only the gadget text color without changing my blog text.

Additional Comments on Readings

It is fascinating to me how there is a math formula to find out how many different colors a pixel can display.  Math is everywhere!!  Also, I did not know that even if the graphics are 24-bit, it will appear to be in low resolution because your pixels can’t display that color depth- the monitor has to fake it. Another fascinating fact is how a browser-safe color is, by their RGB values and percentages of each color.  I absolutely enjoyed the straight to the point numbers of each color, so easy to chart them in order. But I am also happy that there is no need to think of that, unless like the book stated: “you are in a third world country or New Mexico,” is always good to know the browser-safe colors.

      I really enjoyed the idea of making an image map for my upcoming web page.  The creative possibilities are endless, and choosing “the one” for me will be an exciting challenge (server-side, client-side).  Can’t wait!  

  Very interesting that I have to pick codes to use quotation marks on the web page. 

What is the difference of readability vs legibility? Summarize what you learned from teh reading about typography on the web and how this will help you when designing your website project.

Readability refers to how easy it is to read a lot of text, extended text, pages and pages of text. 

Legibility refers to how easy it is to “recognize” shorts bursts of text, such as headlines, buttons, signs, and so on.

Typography is one factor that is important for a web page.  It can give a specific flair to the web page or could completely make it look ugly and hard to read.  One important factor that a designer should keep in mind is the page layout which should be neat and organized and giving the text contrast adds to the readability of the page. And according to the book the body text doesn’t have to be black to have enough contrast with the page background.  The final appearance of the text will be relative to the default font style and size settings in a viewer’s own browser. But fortunately some designers are able to override the browser’s default font settings. If a person viewing my web page does not have that same typeface installed on his/hers computer, my unique and beautiful font is replaced with his browser’s default font. Also the monitor resolution plays a factor in viewing the websites.  If the resolution of a monitor is high it will show more images on the screen but everything will look smaller including the typography.  If it is lower, will show less image but everything including typography will look bigger. Also the computer’s operating system also affects how pages look on viewers screens. 

Cascading style sheets (CCS) a technique that provides better typographic control and flexibility of design and usually overrides any local formatting preferences set by a web page visitor. 

Choosing the appropriate font choices will be a challenge and I hope fun procedure.  Choosing between the: proportional, variable-width font and for a monospaced, or fixed-with font.  Oh fun!

Definitely choose the physical style of typography because it will always be displayed consistently in all browsers. 

I think if I want to keep it simple I will be able to achieve maximum results with my web page. 

What do you do to make an image web ready for your site? List at least 5 changes that need to be made. Fully explain the changes and why you need to make them.

To make my image from Niagara Falls web ready I need to:

·       Make a duplicate file of my original image.

After opening my image in Photoshop I would make a duplicate copy of my original image using a different file name (ex: original Niagara Falls Image) before I would start editing my image; just in case I would need to go back to the original image. 

·       Crop image.

This is the way to get the not so wanted tourists out of the image.  Click on the quick selection tool (forth one from the top on the left hand side of the tools bar) and click each part of the image, one click at a time.  That way you can be very specific as to what part of your image you should keep or crop it out.  Once you are happy with what you have, click edit and then copy.  Then click on file and click on new to copy the new edited image. Click on blank page and paste (click on edit then paste) the new image.  This is the part where you can make more changes to your image if you still need to crop some unwanted lines or more of the picture.  By clicking on the magnifying glass and then the image, you can make as big as you want then using the eraser tool you can make the changes more precise to achieve a better result.   

·       Save for the Web.

Click on file then click on file and save for the web and devices.  This part of getting the image ready is just as important as to cropping the image, because here is where you will pick the size and image resolution.  Choose what type of file you want to save your image in.  That will depend upon what type of work you need to accomplish and the look you want to achieve. 

Although JPEG is the most common file format to save web images, GIF is used to achieve the transparency on the web page.  For example, if I need the picture to be on my web page layout and it needs to be transparent, I would save it to be in the web page as GIF file.  Because it will allow me to have just the picture shown, letting the background color of the page show through part of the image, whereas the JPEG cannot have any transparent areas. You can preview the picture before saving it and then make the choice of, low, medium, high, and max which is referred to quality not the amount of compression. 

Then the size of the picture needs to be changed (to a thumbnail), this is also important because the larger the size of the image (file) the longer it will take to download (people will leave annoyed if it takes more than ten seconds).  If it is as a JPEG is ok, the quality (once the size is changed) should not change that much. 

Then choose a name to save as (I would do, web ready Niagara Falls) and save.

The image is web ready.

Additional Comments on readings- what else did I learn?

I really enjoyed the readings from the book.  The material was very informative and easy to relate and it had a hint of humor, just great.  The pictures were simple and fun making that visual bridge easy to understand (even my daughter got it how the web works).  I already knew some of the information but most of all I was lacking terminology from the internet world.  Learning about, URLs, browsers, and modem speeds were an eye opening.  I caught myself thinking, oh that’s how or oh that’s what it is…. It is wonderful.  The expense and work it takes to have something print or have it on the web was another interesting new finding.  But the most interesting thing for me was the fact that web pages will look different in every browser, monitor, computer, and OS combination.  The web designers have no control of how their work will look thus they don’t have the luxury that a print designer has; the ability to know they work will not change.  That was so interesting to me, and very good information to know.

What did you learn about graphic design and how does graphic design play a role in our daily lives and activities in both the print and web?

 It is so interesting to me that graphic design plays such an important role in our daily lives from: paging through a magazine, reading a children’s book or just simply surfing the internet.  I have zero experience on any type of design (oh, I lied, I am an expert in designing stick figures!) but I was able to pick a bad ad or a good one, due to either of its bad color or incoherent message.  Learning the four basic principles of design (CRAP) was crucial in understanding graphic design and what it has to offer.  Alignment, Proximity, Repetition and Contrast are the principals I was putting into place every time I would see an ad or something on the web without knowing what they were.  A perfect example of how graphic design played a role in our daily lives was when a few years ago the magazine Newsweek revamped their entire look.  They utilized all of the “CRAP” to achieve their new and sophisticated look.   There was an outcry from some people, they did not like the change, but what Newsweek had accomplished was that they gave the magazine a web design look.  It was innovative to see the ways the magazine changed; their usage of alignment was tremendous in the new format.  It was so exciting to see the change.      

 Although designing for print and web are too distinct concepts there are a few things that are the same in achieving their goal of a good design: Knowing your target audience, a clear and effective layout, and the use of elements of design.  For print the advantage that the web does not have is the actual usage of the “physical” product, giving the design texture and shape to achieve a superior design.  That can be seeing all the time with children’s books, some of them have different type of paper and textures for the children to feel, different colors and shapes and sizes.  That is something the web cannot offer, the pleasure of touch and discovery for children.  

Quiz pg. 112

1. Print.  All of the stockholders will be able to have a report even if they don't have a computer.
2. Wed. With the web there are no limitations as to who would be able to see it and the choices for the work would be unlimited.
3. Web. An instant e-mail reminder with the link to see the changes is the best way to go.
4. Web. Changes can be made instantly on the web for the web.
5. Web. The ones that prefer to print the brochures can, with a file that can be formatted just for them to print.
6. Print.  This is a book like idea, even though on the web will be another great choice.

What is your understanding of designing for the web vs designing for print?

One important factor that I understood of web vs print is cost.  The cost for publishing anything in print is astronomical because of the potential usage of color (which is limited) and space available that is purchased by inches.  Meanwhile, the cost for the web is unexpectedly low, offering unlimited color choices at no extra cost and the abundant amount of space giving freedom to its creators to produce an effective web site.  In the print world if mistakes are made corrections will cost “an arm and a leg” to fix them and it will most likely be an undertaking to complete such task.  But for the web, is almost like pressing an “easy button,” changes can be made at any time and within minutes the corrections are done.   Distribution for web and print could not be so different.  While print is finding a company to help them target their audience and how to give their materials (spending more money and time), with the web the trick is making the web address known to as many people possible so they could visit the web site.    Keeping the information up-to-date in print is a challenge.  To redesign and reprint brand new information is another costly work, and after all, what to do with the old materials?  One of the greatest advantages of designing for the web is the ability to make quick changes and to keep the web up-to-date without any fuss.  Maintaining the web site interesting and up-to-date with information are ways to get and retain visitors to the site.  

Although the web has various wonderful advantages that help us with our daily lives, print is still just as important today because of its history and the comfort that it gives most of us.  In the sense of cost to own a book or paper, it is still affordable to have in print; there is no need to buy a computer and all its gadgets if the person does not want to or cannot afford it. It is my opinion that there is no question that web is the future, but I know I will always enjoy the old process of buying a book, enjoying each page as I come in contact with the paper and carrying my book everywhere I go.

Blog Extra #1 (Week #2)

What a work out!!  Thank goodness I have Austin sitting next to me.  He helped me starting on this task.  The process of copy and paste was a tad boring, but it was fun to see the many different blog names and seeing John's "Glamour Shots" picture (nice picture on his profile) many times was definitely fun. But after I had added at least two web addresses I was stuck and that was when Michele gave me some important information (after I had the web address of each person in the box, I had to use the space bar to add as a link).  Afterwords I realized I had added the two by accident!! I have no idea how I did it. Hopefully this will be the only time I get something done without really knowing how I did it.

I absolutely enjoyed Mandi Freese's "Frozen" Blog!! Love the choice of words.
Thank you Michele for staying until I was done, it was great to get a head start.