Thursday, May 23, 2013

Week #6 Blog Post from Homework

The final blog...

This was fun! Not web expressions though. After working in Wix, why would anyone want to put themselves through that? Of course, that comment is mostly because I am a novice at this, and Wix was not only easier, but actually fun! The Web Expressions templates themselves were boring, although I realize that I could have located other templates, I doubt I would have had the skill to work with them in a way to produce the stunning results anyone can make in an online web site builder. I did manage to get a video embedded so that made the Web Expression have some movement. With Wix, I was able to have a moving slide show on the front page, nice transitions, embed the video, add a poll and have many more features such as a form for contact.  A page in the template actually had a google map to my location, but for this exercise I deleted it. I like how the navigation bar shows all the sub pages when the mouse hovers over it. There was spell check in Web Expressions, but not in Wix. This was certainly not good! But, copy and paste directly from Word was possible, so as long as the text wasn't changed, checking for spelling could be done in Word. Web Expressions has spell check, but text has to run through notepad. I did attempt to past without formatting at the end.

Problems with Web Expression freezing on my computer cause a loss of work quite a few times. On one occasion with Wix my browser shut down, but had less problems overall with the site builder online. Both of these issues are related to my computer, but nonetheless, it was aggravating. Another issue with Web Expressions was that my side border picture did not repeat. On long pages, a side border photo did not show, which did not look nice. Wix on the other hand took care of all of that, with a nice background that was consistent throughout.  Working with images was quicker and efficient in Wix. In fact, I did not use Photoshop at all. Compare that with Web Expressions, and ALL images needed to be reworked first and then imported.

Wix templates are all pre-formatted to maintain consistency in color and style and the templates were very professional. There was some consistency in the Web Expressions template, but it was very easy to mess that up and create a site that would break the rules. I worked longer and harder on Web Expressions, but when I was working in Wix I found it to be more appealing and less aggravating. Another area of difference was in creating separate pages for the recipes, which I wanted to do in my original storyboard. This was very simple in Wix but not so easy in Web Expression. In the end, I just moved on and left all the recipes on one page in my Web Expression site. Also, in terms of difference from the storyboard, I did not include animations or video portions. Having the storyboard and information ready was a definite plus. It allows you the time to work on the design, rather than content.

When I compared both sites, the Web Expressions site is just okay, but I feel that the Wix site made my site look so much more professional. I am actually surprised that the Expressions site looks okay since I thought it was going to look very basic or even dated.  The basic templates are just that, basic. However, I was impressed with the Wix site and would consider using this in the future to build a website. In fact, a friend just sent me a link to a website he created. I think I might steer him to something like this or offer to create one for him. Although I have worked in graphic design, it has been years since I designed or wrote anything HTML, in fact my skills were terribly outdated. Even though it was a ton of work, I am pleased to have increased my knowledge in web design! Actually, I think I'll leave my veggie bite site up and keep working on it! Thank you for a great class! --Sandy


My Wix site: http://sjos0513.wix.com/veggiebites


Monday, May 20, 2013

Week #5 Blog Post from Homework

Getting to the end and finally putting together a site. This week is all about good writing, setting up a good website starting with storyboarding, and a few more tidbits about design.

Writing for the web is not the same as print. I liked the idea of an inverted pyramid, conclusions first, then expand.  Remember, people do not want to spend a ton of time reading lengthy wording. Again, appearance, navigation, relevant content are key. When writing, lists are better (7-10), try not to use "passive" voice, something I struggle with in all my writing. More helpful hints include, one idea per paragraph, links in paragraphs, headings and subheadings, and then...proofread and spellcheck.

Storyboards are for planning, organizing, and navigation of the website. A flowchart can be used to layout the entire site. A good design will be simple, stand out, be fresh, exciting, yet user friendly. One good way to find ideas and see good site design is by looking at other websites that are appealing. Good information from websites can also be found at bad websites. Bad websites show designers what not to do! When putting the storyboard together, a designer can see how the site will flow, and what it will take to navigate. It will not do any good to have pages buried through separate links that are impossible to get to.  Remember to keep it simple and consistent. Always have a way to get back to the homepage, and navigation bars should be the same on each page. In the book reading, important aspects this week is file organization. This is especially important as the site goes live so that all links are valid. Image files in the same folder can save a lot of time when routing or fixing links. Additionally, a few advanced tricks in Photoshop for the images such as slicing and rollovers or image swaps where a fly out/different graphic appears when the mouse hovers over a certain part of the graphic.

Some of the most beneficial reading was not to do in web design. Be careful with advertising if used. This should be related to the website if possible. Splash screens are bad! I personally do not like these at all. Be careful with text, color, and no horizontal scrolling because your content is too wide. Always check your website in other browsers, and also for accessibility and usability. Turn off graphics to be sure that you have properly attached text to all images. It is a great idea to see what your site looks like without graphics. Also, try to view in mobile devices or chose a site builder that offers mobile capability. More and more people are surfing the web on tiny screens and if your site does not look good or operate in this environment then you will not have visitors. (Usability and Accessibility answered more fully in blog post #4)

For my final web design, and after reviewing some of the online site builders, I am choosing Wix. With Wix, I was able to easily locate a design that fit my content. The company is also free and the template I am using has a slide show feature.

Tuesday, May 14, 2013

Week #4 Blog Post Homework

The fact that computers have allowed many people to have a voice online is a double-edged sword. The Internet is a vast database of knowledge, from personal to business, governments, and more, but you have to carefully sift through it all and be sure that what you are reading is actually true. We must always ask, is the information presented from a reliable source? Its easy to surf the web and fall into thinking that everything you read is accurate. However, there is no dispute that we now a vast amount of information available in an instant! We have become smarter and more knowledgeable because of it, and education has dramatically benefited from this technology. It is hard to imagine the days when doing reports meant checking out encyclopedia's from the school library. The flip side though is that anyone can create a site, and unfortunately that also means that people are able to create and do things that could potentially harm others. Users have to be diligent in how they use this technology.

Advantages to creating your own website are many IF you have the ability and skill to do it the way you need it. After all, no one knows you, your hobby or your business like you do. Hiring a web designer is expensive, so if you want someone else to do it, you will need a sizable budget. Depending on how much you pay and the company doing the design, it is possible that they will have a variety of people that work on various aspects of your site with their own skill set. The most dramatic results will come from a paid website designer, provided you have selected someone with excellent skill and education. However, if you want to tackle this project yourself, you will need time to get the job done. While a professional can have a site complete in a rather short amount of time, novice users could pick web site builder programs that use templates or those with which you can simply type in what you need. These programs still require some knowledge or it will be very frustrating. However, they will enable a beginner to have rather decent website, but with little control. An often overlooked aspect of web design is site optimization. There are people that specialize in this field.This is important especially if you want to have an online business. What good does a good site design do if your site does not come up in searches. Online adverting, targeted advertising, and store/cart systems are other areas that require a good skill set. Another area that requires good knowledge is security, especially if you are a business owner who collects personal and financial information from your clients. Again, very important considerations if you are running a business when choosing who will design your site. However, if you want just a hobby or other personal site, there are easy to use, site creation programs, hosting etc. that walk non-web designers through the entire process. The question you have to ask yourself is, will my website achieve the goal it was intended, will the data be safe, secure, and backed up regularly, and will the site have any unwanted advertising from the program or hosting server, especially in lieu of free services.

Finally, you have be sure that your site is usable and accessible. These terms are often confused. Accessibility refers to the ability of everyone to use the computer and Internet in terms of disabilities and usability refers to ease of use. The Americans with Disability Act has set forth laws that require certain websites to be accessible to those who have mobility, sensory or learning disabilities. Because of the vast nature of how we use computers and the Internet, having an accessible website has become both a legal and ethical issue in web design. It is important to have a universal design that is usable to a wide range of audiences.  Protocols are set by World Wide Web Consortium (W3C). One very critical design element is the use of alt text or long text names for non-text items on a page. This allows those who are unable to see to have the ability to understand what images you have portrayed, as these can be read out loud. In a nutshell, the website needs to be obtainable and functional to people with disabilities. Usability refers to how easy one can navigate the website. If a website is difficult to use, people will leave. Usability covers areas such as intuitive design, efficiency, ease of learning, memorability, error frequency and severity, and satisfaction by the user (usability.gov).  When designing for the web, the site needs to offer the user an opportunity to learn and use the site to meet the desired goal, and be satisfied with the process. Its important to check the design by viewing in different browsers, turning off sound, turning off graphics, use different monitors, screen resolutions and such to see how usable and accessible your site actually is.

12 Popular Logos with hidden messages in the desgin....

12 Logos ...These are interesting. I knew only of the FedEx logo. While subliminal can be debated, these designs are very clever.

Wednesday, May 8, 2013

Dreaming of....Beach Therapy!


The beach is where I go to restore my soul, and energize my spirit!


Morning sunrise at Virginia Beach with broken clouds
Virginia Beach, VA (May 13, 2013)
"At the beach, life is different. Time doesn't move hour to hour but mood to moment. We live by the currents, plan by the tides and follow the sun." 
-Unknown

Monday, May 6, 2013

Week #3 Blog Post from Homework

Quiz: Immediately after viewing the two examples I could see that "B" was designed much better than "A". While there was contrast in colors in "A", fonts are not easily readable, and the entire first page was not visible, the buttons are dramatic and huge, need to scroll down to see all options, but no scroll bar? The navigation buttons should not be the main focus of the page.  In "B" the entire first page is easily seen, good contrast, navigation of the site is clear on the left hand side, fonts are readable, still has contrast, pleasing colors, all of the button (links) have both pictures and words so it is clear what to expect when you click on them.

Evaluation of Websites:

  • #1 LUXE Salon and Spa
    • Visually appealing and understandable site, opens on home page with a multimedia show of the salon and spa. Pictures are clear and inviting.
    • Site has color theme: grey, black and orange - most font/font colors are easily readable, nice contrast. Use of light gray might be an issue in some monitors though.
    • Object of the site is to provide information for potential new clients
        • Phone # to make appointments stands out very clearly as well as address.
    • Navigation bar at top clear in words, also located at bottom of page
    • All pages including initial page load -- good load time! Important information is contained in first view. After scrolling down though, it was a bit junky. Some of this could have been placed onto separate links, such as salon specials.
    • Link at bottom to Google maps is good for directions, also link Facebook and Twitter at top of page.
    • The navigation bar repeats on every page. To show where you are a fine orange line appears on the navi-bar. Each linked page within the site has wording to indicate where you are as well. Home link is very clear. Could not find a site map, but I don't feel as if I need one here.
    • I think the team page is fun with a revolving graphic of the people that worked there, however they missed an opportunity by not providing information about the employee when you click person.
    • Offers/coupons/following or rating them online should redone.
    • They are missing an "appointment page" which many salons on the web now have. The phone is clear, but they should have a link to make appointments by phone or Internet. Also should have a search site box.
    • When graphics were turned off, they did a pretty good job, just a few missing "alt" tags and descriptions.

  • PPL Electric Utilities
    • Home page almost fits to screen. Nice pleasing multimedia show that can be clicked for more information. Clear box for site search.
    • Navigation is on the right on this website
    • Although there is a top navigational bar (words) on all other pages, this does not appear on the home page. No navigational bar in words at bottom either. Personally think they should have one since many people are accustomed to this feature and should be appealing to a larger audience, especially for an utility company. However, after leaving the home page, getting back to home is clear and easy.
    • Page load time is excellent
    • They have a nice color scheme, shades of blue and off white. Fonts are clear, easy to read, nicely sized, and appropriate contrast.
    • Could not locate a site map/index and this size of website should probably have one.
    • Customers that utilize this site will want to report trouble, need customer service, or view account. All of these activities are clearly visible on the home page.
    • There is no button or link to convert this page to different languages. This is a surprise!
    • This website was redesigned a few years ago and thought this version was much better than the previous.
This class is helping me to refine a critical eye that I developed when in print design. I might even be becoming a bit of a web snob, actually! Although I knew things looked bad, I did not always know why. When I create my website, I know it is important to reach a wide audience and be visually appealing. Websites that are not done properly, do not invite the reader in to look around, which is of course, the ultimate goal! Remembering the Alt tags, quick load times, clean and crisp fonts/wording, good navigation, and first page "fit to screen" is a great reminder of things I like to see when I looking at websites. The truth is, as critical as I am about these websites, I can only hope that I accomplish a website that incorporates the elements that they did.