“You gain strength, courage, and confidence by every experience in which you really stop to look fear in the face.”—Eleanor Roosevelt







Friday, February 10, 2012

Week #6 DIG 315

Course Reflections
Throughout this course I have learned several new skill  sets that will benefit me long-term on a personal level and within my education and career.  With regards to the web and design, I will never look at a website or advertisement in the same way that I had before this class.  I have learned how to read, write, and publish on the web.....which is something I never really gave much further thought into before.  In a sense, I guess I am more of a critic now!  The section on photoshop also opened a whole new world for me; I guess I will no longer have to ask my 18 year old sister to edit all my pictures for me anymore =). The textbooks that we received in this class will be tools that I think I will constantly refer back to for future insight, especially the tips and tricks for photoshop! Mainly, this course got me out of my comfort zone and allowed me to explore and  get some hands on experience with something I might have otherwise never learned about.  Going through the stages of designing a website from start to finish was really valuable for me, I feel that it will allow me to create websites in the future for business and personal reasons....before this class I hadn't the slightest idea of how to do any of this! 

Website Compare/Contrast
Ugh!!  This was a long and tedious process for me.  I had chosen to design a website for the new restaurant that my company was opening at the end of February; I think that it ended up creating more work than I had anticipated in terms of design preparations and the actual input of the data.  The sites were comparable in that they each contained the same content; the exact same drink and food menu, and pictures.  Those were the only similarities....how the content was presented was where you can see an abundant amount of contrast!  When working in the Expressions program, I had more freedom with my design.  I chose not to use a template and designed every aspect of the design on my own from start to finish.  It allowed me to be creative in how I organized the information, color schemes, and the fonts, alignments, etc. of my text.   It was a whole different story when I used the freeWebs.  I was forced to use a template which completely limited my design.  The only freedom I really had here was the size and font of my text.  I was not able to change the alignment positions of my text, nor was I able to add pictures or text boxes in other places on the webpage that didn't coincide with the pre-existing template.  I also had to create sub-pages in addition to the four main pages of my site in order to include all of the information I wanted to present.  I faced several other dilemmas when working with freeWebs; changing or deleting content was much more difficult, inserting photos was harder, and I was also unable to add more than one active link with this template.  When we first started working on our websites, I thought for sure that doing it from scratch in Expressions would pose to be more challenging than using freeWebs.....it ended up being the complete opposite! The website I created in Expressions is more visually stimulating and I had more control in how it was designed.  The website I created in freeWebs created limitations for me that I wasn't expecting and I found it to be more time consuming and frustrating.  If I had chosen to use this program first, I may have gone into working with Expressions with a negative attitude already!  I must admit, that I personally feel that the freeWebs version of my website is rather plain, but overall the navigation of the page for users probably accommodates readers better than my Expressions site.  I'm more partial to the Expressions site because I feel it reflects my personality and creativity more. 

Storyboards
Expressions Site
The version of my site I created in Expressions closely matches the initial concept of my storyboards.  I was able to place the content in the way I had written it down on paper (alignment, size, color, organization, and placement).  The only place where it did differ is how I organized the information on the content page, I decided to change a few things around because the initial placement did not flow the way I had expected it to. 
FreeWebs Site
This version of my site was very different than the initial concept of my story boards.  Of course the content was all the same in both sites, but the manner that I was able to present it led to the differences.  The use of the template forced me to keep everything left aligned, which didn't match my storyboard.  I was able to change the font, size, and underline my keywords, but couldn't do much else.  Also, there was the issue of only being able to include one link for readers.  I was not able to include an active link for the business's Facebook page or a link for direction that would open in a new window. 

Friday, February 3, 2012

Week #5 DIG 315

Storyboards....
Using storyboards during the initial design process has multiple benefits and advantages.  Their purpose is to create a layout/draft of your entire site on paper for the purpose of easily editing and organizing your content.  It will help to establish and improve the navigation of your site in terms of how the content is presented (flow and usefulness) and allow for revisions to be made in order to prevent mistakes that could end up being costly in the end.  Creating a story board gives you something to look at directly and then visually absorb to consider....if I was a visitor of this site, what will I be seeing?  In the process of creating my own storyboard, I have been able to see how my information will be displayed on my site.  Some of my initial ideas have been erased and reorganized already!  Once the thoughts in my head were put onto paper, I realized that some of my initial ideas looked good to me, but when considering how the reader would perceive and view them, I definitely needed to make changes. I think that it is way easier to erase and fix information on a piece of paper than to have to do it later.  Of course, you always have the ability to change and edit at a later time, but having a good foundation to start designing will help smooth the process and allow for you to be more efficient in the end. 

Writing for the web vs. print
The main thing to keep in mind here is that people don't read information on the web in the same way that they read printed material.  Writing for print is typically done in a logical sequence.....we know what the reader is going to read and in what order.  When information on the web is read, content is often skimmed through fast and quickly, with a reader pulling out what information they feel is most valuable to them.  When writing for the web, it is all about how to catch a reader's attention.....
Here are some tips:
  • Keep it simple and short....don't include too much that you lose the reader's attention
  • Use key words/phrases....highlighting or bolding key words will grab the attention of your reader and organize information so it is easy to find and read
  • Put your most important information first....this will increase the likelihood that it will be recognized and acknowledged
  • Break-up large chunks of information into smaller sections or utilize having various pages within your site to separate topics and increase reader interaction on your site
  • Use bullets or numbering to pull attention to main ideas and to simplify the way information is presented and read

I chose Webs.com to use for designing the Web 2.0 version of my site for a few different reasons.  One of the main reasons was because Mrs. Mislevy mentioned that this is the site that she often uses, despite that it puts an advertisement on your site.  I also chose it because I liked the templates that they offered, as well as that it seemed to be easy to navigate through.  I don't need all the animation or extra perks that the other sites offered....not that I want my site to be simple and dull, but I wanted to ensure that for me as a designer, I kept it simple and not too confusing throughout the design process. 

Additional comments on reading....
Chapter 13 was resourceful for me in learning more functions of using a table.  My website will contain a somewhat lengthy menu, and I think using a table to organize the information is gonna work the best! A lot of the other tips and tricks mentioned in this chapter are kind of advanced for me.  I won't particularly be using any of them when designing my sight, but I do plan on exploring them when I get some free time..especially the rollovers and image swaps.
Chapter 14
Site management software???  Really??? I have evolved from thinking that designing a website should be left for professionals to realizing that there are so many tools out there to assist you in the design process, that a ten year could probably make a great site! All the fix tips and ways to test a site can kind of take away any of the uncertainties or confusion that one might have.  It's an awesome tool that reassures the functionality of a site and ensures it will work properly.
Chapter 15
This is one of the steps in designing a site that I was unsure about....the uploading process.  Before this class, I had no idea that the ISP you have provides you with the space needed to post a website.  I learned additional information on the process and necessary steps needed in order to go live with a website, as well as the abilities to change or update information within the site after the fact. 
Diigo
There was an abundance of readings from Diigo this week...woof!  The first few articles focused on writing on the web which focused largely on looking at how it is read.  I took a lot of information away from these articles.  Some of it was review and some of it was things that I found to be obvious.  I focused more on the tips that were offered for how to write on the web, especially in regards to content and how it is displayed. 
The articles on storyboarding helped me to create an outline for my own website as far as what type of content to include and how I should utilize subheadings when organizing the content......definitely sparked the brainstorming process!  The links for the Web 2.0 sites allowed me to browse through several choices and helped me to make my end decision of using Web.com for designing the live version of my site. 

Friday, January 27, 2012

Week #4 DIG 315

Is it always a good thing??
I'm kinda on the fence with this one.......
Reasons it is good...It can be beneficial for business and personal reasons.
From a business standpoint, there is possible financial gain by getting your business known and out there for everyone and anyone to see.  It creates numerous opportunities for you and the consumer:
  • Consumers can easily look-up and access your company
  • Consumers also have the ability to purchase goods via your website to increase sales
  • It can be used as a free form of advertising and a way to promote your products
  • It is a good way for consumers to learn about your product and provide an outlet for them to contact your business
Examples of personal reasons:
  • Allows for information or your expertise to be shared with a vast amount of people
  • Provides an abundance of resources
  • Allows for one to be creative and demonstrate self-expression
  • Artist, musicians, etc. can share the beauty of their work at no cost to them or the reader
  • It can be used to promote causes, do fundraising, and to promote knowledge about a specific topic
Reasons it may be bad:
  • A lot of garbage may be put out there
  • What are people reporting or promoting?  Illegal, harmful, or false information??
Overall, I generally think it's a good thing, it has tremendous benefits for the person designing the site and the audience viewing it.  All of the reasons it could be bad can be avoided--you get what you search for!! There are numerous ways to find out if a site is reputable and useful for a reader.  For the main reason that the internet is a tool where users determine their type of use, having the ability for anyone to design a website is a good, valuable tool. 

Advantages and Disadvantages:
Some of the most obvious advantages involve cost.....If you were to design a website on your own, it will more than likely be less costly than paying someone to do it.  It will also allow for first hand portrayal of your info; your expression, not someone else's.  Explaining to someone what you want or expect something to look like may not result in you getting exactly what you want. 
The biggest disadvantage is based on your level of knowledge and skill; this can possibly limit your creative abilities....you obviously know what you want things to do and how you want them to work and look, but do you really know how to produce that finished product?  Here's my thoughts on some of the possible dilemmas...
  • Is what you're putting out there representing your information correctly and in a way that will accommodate your reader's needs?
  • Could there be adverse effects based on your good intentions?
  • The design process could be time consuming and frustrating, depending on the resources you  have available.
  • It could also end up being just as costly designing your own website as it would have been if you were to hire someone to do it....would you have to purchase design tools, etc. ? (ex. software, cost of your time). 
Additional comments on readings...
I viewed the readings from Chapters 3&4 of the textbook and this week's articles as a review and reaffirmation of the interactive work we have been doing in class the past few weeks: learning what different web pages look like and how to create your own (changing text, adding images, different terminology that is important to know and remember, and how, when, and where to save). Chapter 4 did offer some new insight into the actual posting of a website and discussed strategies for the planning and execution process.

Usability and Accessibility
Usability and accessibility both revolve around accommodating the reader.  Usability can be described as making your website easy for your visitors to find the information they need when they need it; simple, readable, and fast to navigate.  It includes clearly presenting information, placing information in a manner that is obvious and easy to find, and accessing the information should be equally easy and obvious.
Accessibility makes the content of a website available to everyone.......who will be viewing the site and what are their potential needs?  It should be about removing barriers and limitations to make it usable for people of all abilites and disabilities.  Some of the common suggestions made to increase accessibilty include the use of authoring toools and evaluation tools when creating web content.  Usability and accessibilty are both important aspects of web design that coincide with one another....they both take little effort to execute, but often times are ignored in the design process.  When working with web design, the focus should be largely about the reader's experience.  Ultimately making sure that you include both of these elements will increase the likelihood that a reader will return to your site or choose to use your site above others.

Tuesday, January 24, 2012

Week #3 DIG315 Website Eval's

I chose to evaluate Hollister Co.'s website: http://www.hollisterco.com/
  • The navigation had some pro's and con's.....the entry page to the website did not fit the suggested 800x600 of the text book. In order to view the entire page, you had to scroll down to see all of the options.  There was consistency and repetition in the navigation tools as far as design, placement, and usefulness; it was clear and simple.  The website also utilized frames as a way to organize their selection tools; some of them remained stationary while you viewed the page, others moved while you scrolled up and down. 
  • I think the web page has great visual appeal and the overall design and use of graphics helps state their purpose and provides good direction for the reader.
  • The page did consist of an abundance of graphics and information...though it was well placed, it did cause the page to take a little while to load.
  • As a shopper, interactivity on this site was easy, and not stressful or frustrating when trying to locate exactly what you are looking to purchase. 
  • I also believe that the display of this page is good example because it includes all of the C.R.A.P. principals and executes them well. 
  • Overall, it is a good site that accommodates their target shoppers!

The second site I viewed was Albright's Moodle site http://moodle.albright.edu/
  • Again, the entry page did not fit the recommended 800x600, but it did include the pyramid technique by containing the most important information first and then level of importance trickled down the page.
  • Navigation is good, selection tools are framed out to help a reader navigate through the page.  Tools are clearly defined and organized throughout the page. (ie. log-in box and most frequently used tools placed first, directly at the top of the page)
  • Sorry Albright, but I don't find the Moodle site to have much visual appeal at all!  It's simple and functions well, but nothing about it grabs my attention.
  • Loading time for the website itself is rather fast, but when using the log-in function to navigate you to other areas of the site, it's often slow.  All other links are quick to load, well placed, clearly defined, and extremely useful for users.
  • The website serves as a tool for students, in this instance, I think that perhaps the simplicity of it makes it easier for one to navigate.  The interactivity is one of the site's strong points!

Friday, January 20, 2012

Week 3 DIG315 Readings

What's Your Style Article....
I found it interesting to learn what the actual term usability meant for a website.  I had general knowledge, but this article provided me with a lot of new insight.  I was always initially impressed with the visual appearance or lack there of... never gave much thought to usability in the terms mentioned in this article. 
Here's what I took away from reading it, which I will all utilize when designing my website
-The web as being nonlinear presentation of info; it's use is largely determined by the user.  Some of that is obvious, but found navigating the web described as scanning, peeking, and poking, a rather interesting way to describe how it is used.
- Focus should be on pulling a user's attention in a particular direction
- The concept of the inverted pyramid; most important info first, general to specific.
- When designing, we need to predict how users will interact....this helps to organize, present, and display your info.

Chapter 7: Designing the Interface and Navigation
- Interface and navigation design are inseparable elements
- I learned a lot by the steps the book mentioned; I believe this will help greatly in designing a good website.  The breakdown helped me to develop a new approach and way of thinking about the process, particularly the preparation process before the actual designing on the web starts.  I liked and believe I will be utilizing the sticky note method!
- In the navigation part of the design, I now know that the focus should be on organization, not graphics!

Quiz pg 154
-The structure and organization in example B immediately struck me as having a better interface and navigation design.
Image B
-It fits the 800x600 pixel resolution and size; one size surfing that displays the entry page well
-The navigation is framed to the left side and is easily recognized
-Hyperlinks are obvious and clear
-Great display and use of graphics in the navigation process
-Graphics use repetition and frequency
-Graphics express intention (cheese=products and mouth=grins)
Image A
-Buttons are large and take up an excessive amount of space that could be utilized in other ways
-Not all of the navigation is displayed on the entry page; should have used 800x600
-Gave a bad first impression for me as a reader......
-Background color doesn't add to the overall design of the page, I think it even dulls it up!
-Where and what are the so-called sections? What is ratz stuff? What is rat ball?
-The poor organization of the website gave it a vague feeling, and as a reader, I found it to be somewhat confusing!

Chapter 8: Good and Bad Design
-Bad design is easier and more fun to recognize--before this class, I kind of already knew that, but now I have an appreciation for why! I also have obtained knowledge as to how it could've been done better. 

Criticism of Websites
I think all of my above comments throughout this week's blog pretty much sum up how I will critically analyze websites from here on out.  When I first heard that we were going to be asked to create a website for this class, I was scared to death!  All of the knowledge I have acquired in the past few weeks, especially last week's class, have boosted my confidence a bit.  I'm comfortable in saying that I think I now have the ability to create something with a lot of character that will be equally matched by a proficient interface and navigation design.  From here on out, I will be more critical when viewing a website, especially when looking at what information it contains and how it is organized, not just on how pretty I think it looks!

Sunday, January 15, 2012

Week 2 DIG 315 Niagra Falls project

First and foremost, the image needs to be uploaded onto your computer and opened using photoshop.  Once the image is displayed in that program, make a duplicate copy of it by using the save as option.  This will ensure that even after you make all the desired editing options, you will still have an original copy to refer back to if you choose to do so in the future.  Now, you can start editing.  If the main purpose of your editing is to remove the unwanted tourists from your image, there are several steps you need to take.  To select the part of the picture you want to use on your website, you can utilize the quick selection tool.  Using this function, click on the image and drag it to include the part of the image you wish to include in your website.  Once you have made your selection, you will then need to select the copy function.  Note: if in the process of cropping your image, you have captured some unwanted material, you  have the option of zooming in on the image and using the eraser tool to get a more precise outline at a later time.  Once you  have selected to copy the image, go to file, open a new blank page, and select the paste function to carry the new version of your cropped image into a new file.  Here you can make any other changes to the image that you choose, including utilizing the eraser tool, adding text, etc. If the image is now precisely the way you want it, there are several things we need to do to ensure that it is web ready.  You will need to click on file and then scroll down and click save for web.  Once that window opens, there are several selections you need to consider.  Consider the resolution and quality of your picture that you want to achieve.  If it is a higher resolution, you may want to select saving the image as a Jpeg or PNG file to guarantee the best level of quality is maintained.  Now, you need to consider the size of the file.....the image taken is an 8 mega pixel; you need to explore your options for resizing the amount of space the file will consume.  Your space availability will determine your file size choice.  Lastly, you need to save the image, choose a file name, and include for the web behind the title so it is easily recognized as a file you intend to use for web publishing.  Now the image is ready for the web!