Sunday, October 18, 2009

Compare/Contrast of Frontpage vs Webnodes 2.0

In summary, one of the most important concepts I learned from this class is that there is a lot of planning and work that goes into creating a website. Before this class I would surf the web and take for granted the websites I visited. Now, I respect the work that goes into making a website what it is in the end. I also find myself critiquing the CRAP principles of the different websites that I visit. Until you try something hands on you never really have the full appreciation for the work and thought that goes into it. I also feel that I learned more by trying my hand at the different applications of creating the website in two different places. Depending on what type of website an individual is trying to create would depend on which application is best suited for it. I found that since my website was a family website dedicated to my family members of our vacation memories that the application I liked best was the webnodes 2.0. If I was creating a professional website or one for a personal business I would probably use Frontpage or a similar application as it would give more freedom for personal creativity. For my particular project and purposes the 2.0 application was my favorite. This was because of the ease of getting it up and running. I will definitely use webnodes again. Bottom line is you could be a complete novice, which I basically am, and be able to feel as if you accomplished and created a professional looking website all on your own. Of course after completing this course I know that all the behind the scenes coding that is set up for you is very detailed and complex.

Although FrontPage allowed for more hands on detailed creativity I felt that the 2.0 application in webnodes was the one for me. In the end I felt as if that website was more organized because of the ease of the tools. It was easier for me to upload images in 2.0 webnodes. When I compare the finished product of both applications I felt that the webnodes website looked more like I had envisioned the end result to be from my storyboarding. There were some details that I decided to eliminate from my original storyboard. I learned that just because something looks good on paper doesnt always look good when you put it to the web. For instance, I started out putting lots of mexican colors on the text labels in my pictures. After posting in FrontPage I realized it looked too busy. I went back to Photoshop and changed the text to black on my pictures and kept the background colors in the mexican theme. One other item I changed from my storyboard was to add some content. I decided to add the history of Cancun on my index page to make the site more interesting. I also added some personal information about our vacation experience to make the website more interesting and inviting. Before doing this it looked a little bare. Adding the additional content made the site come to life so to speak. I preferred the templates in webnodes 2.0 a little better than in FrontPage probably just because I found a template in webnodes that better suited what I pictured the end results of the site to look like.

My webnodes website is located at cancunfamilyvacation.webnode.com. It could also be that I liked the webnodes application a little better because this was the second application I used. I felt as if I had more practice and learned what I didnt like the first time around so I could make some changes to adjust. It was also a lot of fun realizing that my webnodes project was live and out on the internet for all to see. I realize that I could publish the FrontPage application too but I thought my webnodes project turned out more visually pleasing. I liked the fact that the webnodes had pages created for me like a blog, a guestbook, and a comments page. It also had offered a photogallery area which I may choose to add more pictures to. The best part about webnodes is that it is free and was for the most part self explanatory. The other lesson I learned from this class is that the upfront planning is actually more time consuming than the set up of the actual site. It is critical to have the storyboard planned well in order to have a great finished product. I also felt that because the website was created about something I felt really scentimental and passionate about that for me it came to life and fit together beyond my expectations.
In conclusion I must add that although I liked webnodes better for my particular project, I can see how if I became more adept to building websites that I would reach out for more options and challenges. I believe that for a more experienced individual FrontPage could offer you a more challenging and detailed platform in which to build upon. At any rate I am very pleased with what I learned in the past seven weeks and will definitely use the basic principles and recall what I learned as I continue to expand upon my computer literacy.

Sunday, October 11, 2009

Planning my website

First I must say that just typing the words "my website" in the title gives me a feeling of accomplishment. This is because I never ever would have pictured myself being able to even think about creating a website. I realize I havent done so yet but it gives me the courage to perservere and actually picture the finished product even if it doesnt turn out exactly the way I expect in the end. This past April (April 2009) my husband and I took my daughters Katelyn and Kelsey to Cancun Mexico. This was their first "real" vacation with white sand, blue water and beautiful palm trees. It was important for me as a mom to be able to share in that experience with them. The looks on their faces throughout the week was something that I will cherish until the day I die. It makes me very sentimental to think about that week because it was the best vacation I ever had. I have been to several places but nothing compares to sharing in their fun as I watched them laugh and experience the beauty of life. They were treated to many special experiences that week from cultural food, to shopping with the locals, to going on an excursion, and massages on the beach overlooking the ocean. My daughters are still talking about their vacation and I know they will remember it for all their life as special. When I returned from our vacation I created a picture filled scrapbook for each of them with captions to capture the special moments and funny experiences. Katie took hers to college and I was thrilled when she unpacked it and placed it lovingly on her dorm room desk. Kelsey refers to it often and looks through the pictures and laughs and reminisces. Therefore I decided that my website would be dedicated to our Cancun Mexico family vacation. I plan on titling it "HOLA Cancun." The girls had their own adjoining room and so they felt grown up because of this. However, every morning I would burst into their room repeating the word HOLA (hello in spanish) about a dozen times to wake them up. They would get so annoyed with me and pull the covers over their head. I would continue with the HOLA's until they were fully awake. Now they laugh about it and I hear them telling each other things like remember when mom would come in and dance around and say Hola Hola to wake us up. Now when my daughter calls me from college or when I call her she picks up the phone and says "Hola!" Before our vacation they didnt even know what the word Hola meant.
The images for my website are taken from my personal picture library of all the candid shots I took on our vacation. I will be using the photoshop extended software that I downloaded as a thirty day trial period in order to resize and enhance the photos. I do not have an html editor at home as of now so I plan on using frontpage. For the 2.0 application I will download from the list of choices we received in class during our week four class. Today I will continue to work on my storyboarding. I have it all layed out in my mind how I want everything to look but I'm sure that may change as I begin to put it to paper today. I plan on editing and resizing a scenic photo for the home page where the title will be located. Next I will create my buttons in photoshop and lay out my pages. Since this website is mainly intended for the enjoyment of my daughters and family I plan on making the pages that link from the homepage more humorous to match the fun times we had while living our vacation. Initially it will look like a travel website would for Cancun having a button for things like lodging,things to do and travel tips. However when you link to those pages it will be only the lodging of where we stayed with the link to that hotel. Things to do will take to to the page that has pictures and explanations of only the things that we did on our personal vacation. There will be a link to Wet and Wild where the girls swam with the dolphins and experienced the water park for the day. I may also add a link to isla mujeres the island of women where we took an excursion for the day. The girls also loved the entertaiment and eating at Margaritaville so I am hoping to link that website on the things to do page as well. The travel tips page will be information and tips related to the trip such as making certain to ask the bus driver to take us to cancun center and not center cancun! The tips will relate to other funny and memorable experiences like the picture I took of Katie with balloons on her head with a caption related to saying that this must be what swine flu looks like. There is a whole story related to this from vacation that they laugh about. I will then attach a real link to actual travel tips for Mexico.
I want the color scheme to match the primary colors you see in typical mexican decor which is red, yellow, green and blue. This will be the repetitive color theme throughout. I would like to try use chili pepper icons as a bullet to accent my information. I am really excited and cant wait to show the girls the finished product. Judging from how much they loved the scrap book this is going to be very special for them. Katie is majoring in psychology in college right now. The other day the professor asked them to do an activity where they close their eyes and think of their most relaxing thought ever. Katie told me she thought back to Mexico to the massages they had on the beach. I plan on having that picture in the things to do page. I hope the finished website will light up their faces the same way it did when they were given their scrapbooks. I think it will serve as another way to remember a great time in their life.

Sunday, September 27, 2009

Reach For the Stars Katie

This is my favorite picture of all time. My daughter Katie is a cheerleader and a flyer for her school. A friend of hers captured this picture while she was doing her stunts. As a mom I always remind her to reach for the stars. I think this is the perfect picture of Katie to depict that. Go Katie!!

Saturday, September 26, 2009

Blog #4 To Hire or Create your own/usability/accessibility

Anyone can create a website. This is a great freedom to have but it can also have its disadvantages. This means that you must be careful when viewing other people’s websites and be sure that they are credible especially if you are using them for research. I learned this week that you can either create a website yourself or hire someone else to create it for you. If you create the website yourself, you can choose to be a purist and create it by using html code or you can opt for a web authorizing software which will write the code for you. One of the amazing qualities of web pages is that any computer anywhere in the world can read html. One of the benefits of knowing html is that you can tweak the code and further enhance the web page that is created using software.
Through careful reading and analysis of the course materials one can determine that there are many advantages and disadvantages to creating your own website vs. hiring someone to do it for you.
One of the advantages of creating your own website rather than hiring someone is cost. If you hire someone to create a professional website for you it can cost up to a thousand dollars or more depending on the content. However, a drawback of creating your own website as opposed to hiring someone is that creating your own website takes lots of time. Hiring someone will obviously save you time but you are paying for that convenience. One thing to keep in mind is that if you choose to hire someone and try to get a bargain price for having someone else create it you may end up with a lesser quality website.
It is important to identify the purpose of your website before you decide if you want to create it yourself vs. hiring someone. If the website is for entertainment for family and friends there are many choices out there for you to choose from. You can choose to create the website on your own. You can choose free website builders which may work well for developing these types of websites. However, if you are building a website for an expensive business of yours you may want to opt to have a professional build it for you since business will depend on it.
One of the interesting pieces of information I read this week was that if someone who is creating their own website is passionate about their subject the site, although created by an amateur, will often times be incredible due to the passion behind it. I would say this would be one of the advantages to creating our own site in that there would be great satisfaction in the accomplishment of your finished product.
Whether you are creating your own website or having a professional build it for you it is important that it have accessibility. Accessibility can be defined as a website that anyone and everyone can use and take pleasure in with no exceptions. For instance the government websites are fully accessible in that they create them so that people with disabilities can use them. They also offer other languages for full accessibility. This also means your website can be viewed by people that are visually or hearing impaired.
Usability means how easy it is for a website is to use. Obviously it is important to keep this in mind when designing your website. You don’t want people becoming frustrated or discouraged as they are navigating through your website. I learned that there are actually testing industries out there that will test usability. If you are making your own website it would be important to test the usability and keep in mind the ease with which you can navigate through the website. Both accessibility and usability are important so that you can reach as many people as possible with the benefits of your website. The more people you can attract through accessibility and usability to use your website the more successful it will be.

Blog Week#3 Website Evaluation

This weeks lesson had me thinking back to week one when we analyzed advertisements and applied the CRAP principles. Web design is similar in that there are certain rules and techniques to keep in mind in order to create an enjoyable and impressive website which your users will appreciate. In my opinion the most important piece of information I took away from this week is to keep it simple. Sometimes a classic design that is not overly busy or flashy can create a better impression upon the user than one that is too busy. After reading the websites assigned, article and chapter reading one can determine that using specific criteria when creating and searching websites is crucial.
One such criterion is to make sure your website has a purpose. Whether it is for educational, entertaining, or personal purposes it is key to make sure your web site has a purpose. Often times you can tell the validity of a website by the URL or web address. I often look for sites that end in .edu or .gov when doing research because I know they are valid sites. In my reading I came across a site given as an example called the onion. This is an example of a hoax site. Sometimes you can read the name of a site and think it means one thing but after navigating you can quickly tell the site is not for you. In this case I thought perhaps it was a cooking site. Instead it was a somewhat trashy site with some shocking articles. This is a good lesson when building your own website to be sure you are clear in your purpose and name your site accordingly.
Another criterion is authority, which means being able to readily determine who authored the site and being able to easily contact that person. If the person has good credentials and references chances are the site is going to be dependable and worthy of your time.
I also learned the importance of objectivity. It’s key to think about the author’s agenda for keeping the site and whether or not there are any bias you need to be aware of which may slant the view of what you are reading. Still another criterion to use when creating or selecting a website is that of appropriateness. Your website should be created to cater to those viewing it. For instance if the website is for children it should be written on the grade level you are creating it for. The website should be as accurate as possible and the information relevant to your purpose.
Did you ever go to a website where the information is not current or the links are broken? It is very frustrating and creates a very bad impression no matter how pretty the graphics might look. This to me is the most important of the criteria. It’s so important to keep your information current and you links working. If the information is not current and your links do not work then your website is pretty much useless.
When creating your website take responsibility. If referencing other information that is not your own you must then give credit where credit it due. I also learned the importance of clarity and accessibility. There should be no misspelled words and the pages should be organized and clean and crisp. The resolution should be set as such to accommodate those with laptops or smaller monitors without a lot of scrolling. Usually 800 x 600 is a good size.
All of this information ties into the interface experience of the person navigating around your site and the experience they come away with after visiting your site. I learned the importance of starting with a plan or outline. I thought it was a good idea to start with a pad of sticky notes to lay out how you want your website to look.
Taking all of this information into consideration I decided it was time to check out a few websites and critique them according to what I learned. Just like when critiquing advertisements and flyers in week one I found that this exercise made me consider that I may never view websites quite the same way again. Since I am going on vacation soon I thought it would be fun to critique the website of the resort I am staying at and an overall travel tourism site for the Dominican Republic. The first site I analyzed and navigated through was www.majestic-restorts.com. I was really impressed with this website. The reason is that as I applied the criteria of what I learned, I found this site had it all covered. First, when you come to the site the pictures fade out to the next picture. I thought this gave the viewer a calming effect which is what you want from a vacation site. Secondly, the layouts of the pages are repetitive with the same type of elegance. Because of the name of the resort, majestic elegance, I thought they did a nice job of staying with this theme. They chose a burgundy color which gave it a regal look. They keep their M logo at the top with the grey scroll design to the right throughout navigation which solidifies the theme of the luxurious experience. The site has a main purpose which is to advertise or sell their resort and make it tempting for travelers to stay there. It is easy to navigate through and see the resort services, the rooms, the restaurants, bars, spa, etc. There is clear authority in the website in that you can easily click to see who to contact with address, email and phone number information. The criterion that the website does have less of is objectivity. That is mainly because of the type of site it is. Of course an owner of a resort is going to be bias and try to show the property as best they can with the most stellar reviews. I did, however think that this was done in good taste and respectfully. Because this would be expected of any travel website I thought it was acceptable and didn’t take away from the qualities of the website since it was done tastefully and was not overbearing. The website was current and even had a navigation point entitled latest news from the resort. It also had a navigation point for the weather which of course had to be kept up to date or else it would have been useless. The site was appropriately written for the proper audience to be able to understand and appreciate. Lastly the site had clarity in that there were no misspellings, there were references throughout such as the meetings page where the person to contact was referenced. I was very impressed with this site. It made me feel comfortable that I had made the right travel choice. It left me with a feeling that there would be nothing left to chance when I got there and that I would be treated majestically. I will report back when I return to tell if the website lived up to the actual experience as I would have expected it.
The next website that I reviewed was www.godominicanrepublic.com This site was a tourism site and the first thing I looked for was its authority and accountability to be sure that what they were telling me was accurate. I easily found this and was confident when I saw that the information was coming from the ministry of tourism with contact numbers, names and addresses. This gave credibility to what I was about to view. The site had a purpose and that was to promote tourism to the Dominican. Across the top there were choices allowed you to read about Dominican, research things to do, learn about the regions, plan your trip etc. I personally prefer left side navigation and so I found it a bit cumbersome to be directed to those places but then had to back out to come back to the home page to see other choices boxed out such as beaches, golf, ecotourism, and cigars. I found this to be a little choppy. Once you opted for a choice from the home page at the top it opened up left navigation but I still felt that the flow of this was awkward. On my computer there was a bar of empty white space to the left of the screen which I thought was poor planning of whoever designed it. I would have expected to see some island colors on this site but for the most part it was bland as far as color. However, the pictures were a nice touch. I liked the fact that you could go to the top and change the language to view the site. The information was accurate, spelled correctly, and up to date. The accessibility of the links was adequate and the pages loaded quickly. For the most part the website was good with just a few opportunities for improvement.
I will be sure to take these criteria into consideration when creating my own website because navigating around and analyzing other sites allowed me to experience the importance of these techniques.

Sunday, September 20, 2009

Blog week#2

Before taking this course I really didn’t give much thought beyond the fundamental action of taking a digital picture and sending it off to my friend or family. We all know how fun it is to take digital pictures. Many of us pick up a digital camera and suddenly we think we are an expert in digital photography. I realized that there is much more that goes into posting or sending a picture online to a friend than first meets the eye. I have learned through this weeks reading of the book and the web material that you should be courteous and conscious of certain techniques when emailing pictures to friends and family by first considering some important adjustments and qualities.
One such consideration should be that of size. You should try to make the picture not too big but not too small. It is important to find that balance. You should consider reducing the size of the file and not necessarily the size of the image. A good size seems to be approximately 200-300 pixels. Reducing the size of the file allows the picture to load faster when your friend is trying to view it. One way to reduce the file size is to save it as JPEG file.
Another consideration you should make before sending your picture is the image quality. You may choose to use the JPEG compression and keep the size of the picture which uses less disk space but you will have a lesser quality image. You don’t want your picture to be sent pixilated by making the print too big. JPEG is a good way to send photographs because they can contain 16.7 million colors or 24 bits. You could also choose to send the picture in GIF format where all computers can view them. GIF files are compressed and the image does not lose the quality. However there is a trade off in using GIF in that they can have a maximum of 256 colors and so you are limited in that respect. The one benefit that GIF offers is that you can choose a color that is transparent so that the background color of the page will show through part of an image. GIF works well with simple illustrations, graphics, cartoons and logos.
It is essential to consider monitor resolution and how your picture will be viewed by the recipient in addition to the file format you are using to send. The resolution of a picture depends on the bit depth of the image and the monitor’s settings. If you change the number of pixels and the number of colors you change the resolution. For instance if the pixels are smaller everything on the screen looks smaller but the images can appear to have better resolution.
It is also important to take into consideration whether or not the person you are sending it to will just be viewing it online or if they will be printing it. Therefore it is key to consider and choose the amount of compression and size of the image to meet what the viewer will need. It should be kept in mind that the viewer may not have a big monitor or high speed internet. If the image resolution is higher than the monitor resolution then the print size is so large that the viewer must scroll.
This week I also learned some interesting facts about color and that it is important to consider these fundamentals when sending pictures and graphics. If the person is printing then it is important to consider that color is reflective and uses CMYK color. This stands for cyan, magenta, yellow and black. Color that is viewed on the monitor is not reflective but rather is coming from the source and into our eyes. It comes through the screen and uses what is called RGB color which stands for red, green and blue. This gives an overall different perception of the color on the monitor vs color in print. Therefore it is an important concept to keep this in mind when sending pictures for viewing on the computer vs those that will be printed or both.
Another interesting term related to web graphics that I learned this week is anti aliasing. This is the smoothness of the edge of a graphic. If you are really creative and sending text along with your photograph to your friend you can decide if you want to use this technique. Extra colors are necessary to create the blend and the file sizes of anti alias GIFS are larger. Because of this you would need to decide if it is important for you to use this feature in graphics. I think anti aliasing has its place but overall I am not extremely fond of it for most graphics. I think it is cleaner and sharper to send text that is not anti aliased.
Some last bits of information, no pun intended that I learned about is about an image map. If you are sending a photograph and want to put a link or a hotspot on the photo you can link back to another page. This is fancy designing over and above just sending a friend a photo but it can be lots of fun. Imagine putting a link near a person’s picture and having it link when you click on it to that person’s personal web page if they have one or to their face book page. This can be a fun alternative to just a plain picture. Another way to send photographs is to include thumbnail versions of the image. These are just smaller views of the image where you then jump to another page of the larger image if you want to take the time to do so. This helps the recipient with perhaps a slower computer to pick and choose what they want to take the time to open instead of being bogged down by large images.
Overall this week the one part of our photoshop class that I was most amazed by was that you could take an image, cut it out, and clean it up in a precise way to include it with or overtop of another image. I knew that this could be done but I just didn’t realize the time and precision with which a person could take the time to perfect. Graphic design really is a fine art and one to be respected. There is a lot of work, planning, and decision making that goes into professional pictures, web design, and graphics not to be taken lightly. I am curious about the weeks to come and what else I will learn about this field that I was otherwise unfamiliar with.

Monday, September 14, 2009

Week #1 Blog-What I've Learned

After what I learned this week I decided I will never look at web pages, flyers, advertisements, magazines, newspapers or business cards the same way again. After learning about the four techniques of contrast, repetition, alignment, and proximity I find myself critiquing according to what I’ve learned in class and through the course reading. We are surrounded by print and web on a daily basis. It is amazing how the use of these four techniques can make all the difference between good design and design that has room for improvement whether it be on the web or a printed article. Our lives are very much influenced by what we see in print and on our computer. We use design for fundraisers, projects, research, church functions, and just about everything we do in our day to day lives. One probably doesn’t stop and consider the impact that the designer has on the viewer of this vital information. Through the lessons learned an otherwise amateur can be more aware when creating their own information whether it is print or web related. It also allows the otherwise naïve viewer to have a better appreciation for the effect that a well designed piece of print or web material has on the eye of the beholder. Through reading the course material and reflecting on the in class lesson one can determine that the four techniques are the foundation of a good design whether it be print or web related.
First, it is important to use contrast that is strong with a vivid difference. For instance black and white or bolded information vs plain both offer a drastic change noticeable to the onlooker. Contrast makes an advertisement more interesting and captures the attention of the viewer. I learned that contrast can be used both in print and on the web. However, the web has more options as far as the color spectrum choices than perhaps print does. In print there is usually limited space to use this and the other techniques learned but with the web your space is virtually unlimited. I also learned that many web designers concern themselves with how their web creation will look if it is printed. This can sometimes be mind-boggling and frustrating for the creator. I gleaned from the reading that although you need to be concerned with this you shouldn’t let it stifle or cripple your project by letting it bog you down.
Secondly, repetition creates some uniformity and familiarity to the person viewing the ad. It is an important technique when used in conjunction with the other three techniques as it adds interest. Repetition provides a subconscious cement to get the idea that you are trying to stress across to the viewer. It is important to think about your layout and discover what is most important in your message. This is what should be repeated in order to reinforce your message. It wouldn’t have the same effect to repeat something trivial. The repetition should be what you want your viewer to walk away thinking about long after they are done viewing your ad or web page. I learned that web has advantage over print in that you can update your website with updated information keeping it fresher than perhaps something put to print. So if you repeat information in your ad keep in mind that with web you can always change this information more easily as items need to be updated or refreshed keeping your key points fresh. Print has the disadvantage in that information that becomes stale needs to be reprinted and redistributed accordingly.
Next, a good designer recognizes the importance of alignment in their product. Alignment should be considered carefully. I have learned through the in class lesson and through further observation that center alignment is highly overused. It is the safe method of formatting but not always the best choice. I have learned that right alignment or left alignment can often look cleaner and more organized. Alignment is an important technique and can improve a layout if the proper choices are made. For instance, a block method to the right can look much crisper and cleaner than a centered alignment. It is important that the designer consider how many times a persons eye will stop when viewing an ad, flyer, or webpage. The proper alignment can aid in this process. Alignment is important in web and print but one thing that web has over print is that with web you can also add things like sound and animation. Print relies solely on alignment and perhaps a picture but there is no movement or sound included with it. The web takes this creativity to a whole new level of stimulation.
Lastly, it is important to keep in mind that similar pieces of information should be categorized and located in close proximity with each other. For instance, if you are creating a business card the hours, location, and phone number do well when kept together in close proximity to each other. Keeping like parts in close proximity with each other help keep the viewer’s eyes from jumping from place to place and becoming frustrated. Keeping like thoughts or pieces of information in close proximity cause your work to be more organized and create a cleaner product which is more effective.
In conclusion it is important to keep in mind that any change to include one or two of these techniques is an improvement. However, in order to optimize your project completely and strive for perfection the goal would be to keep all of the four techniques in mind and follow the rules of each one thoughtfully. Using all four techniques of contrast, repetition, alignment, and proximity makes for a more professional looking end product. Whether you choose print which can sometimes be more costly to design and publish or a web related project which may be more affordable to publish, these techniques are the foundation of your creation. While using these techniques, I learned through reading that web design is more technical and it is important to keep file size and graphics in mind more so than if you are using print. You wouldn’t want someone having to take an extreme amount of time opening your webpage. However, the four techniques still apply equally for both print and web. In web designing it is critically important to try to capture the reader’s attention so that they move beyond the first page. This is why it is so important visually to use the tips we learned regarding contrast, repetition, alignment, and proximity. In print it is a little different because most everyone knows how to use a brochure or pamphlet to leaf through it before putting it down. The web has a few more complexities to keep the interest of the person navigating through it. The web also offers an easier way for readers to respond and so by using the four techniques you are inviting the web user to break through and offer a quick response more so than a static print piece of information. I am excited about putting the techniques I learned about into practice to create my own webpage in the weeks to come.