The Value of Good Web Design

1
The Value of Good Web Design

• Kassi Carter

2
What is good design?

• Good Web design is, in effect, the lack of
  elements that make up bad design. Bad design is
  easily recognizable by every user of the World
  Wide Web. When a page is difficult to navigate,
  childish looking, and/or the information is
  scattered in strange places, it is surely a
  poorly designed site. The key to good Web design
  is certainly usability. The design must be
  user-centered above all else to ensure that the
  target audience can easily navigate through the
  pages in order to find specific information about
  what he/she is looking for. Every possible
  scenario of the target audience, such as
  disabilities, slow internet connections, limited
  access to computers, lack of education, monitor
  size, and different languages and dialects, must
  be taken into consideration. It is impossible to
  meet the needs of every person in the world, but
  good Web design can be achieved through thorough
  planning, hard work, and the knowledge of the
  elements that make up good design.
• A well designed Web site speaks positively for
  the business, organization, family, or anything
  else it represents and, therefore, gains respect
  from the target audience of the site. The value
  of this is that the site is accessible to as many
  people as possible and, as a result, businesses
  can prosper, more products can be sold,
  organizations can gain support, and a designer
  will leave a pleasant, lasting impression on
  their audience.

3
Six things Ive learned this semester that help
demonstrate my understanding of what good design
and its value are

• (1) Storyboarding. The value of storyboarding
  for a Web site is that it creates a solid
  foundation for building the site. It acts as a
  blue print to the design and content of the page.
  It helps to keep things organized in a
  hierarchical fashion and also helps to remember
  all of the content that must be included on the
  page. A thorough storyboard is ultimately a time
  and money saver.
• (2) Layout. The value of the layout of a Web
  site is that it can make the audience comfortable
  and intrigued with the site. This is important
  because it tends to make a user browse the site
  longer than would be expected if he/she was
  confused and frustrated. The layout does not have
  to be too fancy it should just be practical,
  logical, and functional. When a site is laid out
  in this way, it is easier for the user to
  navigate through it and locate specific
  information.
• (3) Content. The value of the content of a Web
  site is that it can inform your audience in a
  concise, yet useful way. A user will be more
  inclined to browse the content of a page if it
  does not look too intimidating or overwhelming.
  Web content, in contrast to printed content, can
  contain different elements such as hyperlinks and
  interactive graphics which can make it easier to
  get a specific point across to your audience.

• Storyboarding
• (2) Layout
• (3) Content
• (4) Voice
• (5) Graphics
• (6) Color

4

• (4) Voice. The value of the voice of a Web site
  is that it reflects the personality of the
  designer or the business it is representing. If a
  business is trying to gain customers, it should
  have a professional, educated, friendly, and
  reliable voice. If an organization is trying to
  persuade an audience to think or do something in
  particular, the voice of their site would most
  likely be informative, strong, and persuasive.
  Every element of a site from the words to the
  graphics aid in creating the voice of the page.
• (5) Graphics. The value of graphics on a Web
  site is that they tend to peak the interest of
  the audience. Simple, organized graphics are
  appealing on a Web page and are a great way to
  illustrate and supplement what is being said in
  the text. Also, for sites that tend to be dull
  and contain an abundance of text, graphics can
  help the page not look so intimidating. Graphics
  on a Web site are comparable to a book with
  pictures. Everyone enjoys seeing illustrations to
  go along with text in order to enhance their
  reading experience and bring words to life.
• (6) Color. The value of the color scheme of the
  Web site is that it determines the audiences
  first impression of the site. The colors can
  suggest a classy or professional site or they can
  suggest a childish, amateur site. Soft,
  earth-toned colors tend to suggest
  professionalism while bold, flashy, or bright
  colors tend to suggest the opposite. A users
  first impression of the site is very crucial. It
  determines whether they will stay and browse the
  site or if they will disregard it and move on.

• Storyboarding
• (2) Layout
• (3) Content
• (4) Voice
• (5) Graphics
• (6) Color

5
Storyboarding

• The value of storyboarding is that it creates a
  solid foundation for building the site. The
  example that I have chosen to show here is a
  slide from a storyboard that I helped build for
  redesigning a Web site for a video production
  business. This is only one slide out of several.
  We made a slide like this for every page
  detailing exactly what information we wanted to
  include and where we wanted to include it.
  Because we had done such a thorough job on the
  storyboard, it was very easy for us to implement
  the design on the Web and then simply add the
  necessary content in the appropriate places.
  Notice that we even included placeholders for
  specific graphics and text. Before we even
  started constructing the site, we knew precisely
  what pages were going to be included and how each
  of them should be laid out.
• storyboard example

Storyboarding
6
Layout

• The value of layout is that it can make the
  audience comfortable and intrigued with the site.
  The example that I have chosen to show here is
  the first page of my personal Web site. The
  layout that I used for this site is one that
  makes sense for every user. The most important
  information is strategically placed at the top of
  the page and, therefore, is what the user notices
  first. I want my audience to notice my name and
  what other pages I have included in my site.
  Also, since people read from left to right, the
  links to my other pages are organized from most
  important on the left to those of lesser
  importance on the right. These links are set up
  in buttons which are user-friendly and easy to
  find. Note that consistency in page layout is
  very important. The black banner at the top of my
  site is unchanging throughout every page and
  everything is centered. This helps the pages flow
  together and comforts the user. At the very
  bottom of every page, I have included the least
  important information the date and time of the
  last update and my contact information. Thus we
  see a clear hierarchy of information.
• layout example

Layout
7
Content

• The value of content is that it can inform your
  audience in a concise, yet useful way. The
  example that I have chosen to show here is a page
  that I helped construct for the redesign of a
  site for a video production business. I chose
  this particular page because it contains content
  that is relevant to the site and useful to the
  target audience of the business. Although there
  is a lot of text on the page, it is laid out in
  such a way with bullets and spacing so that it
  does not look intimidating. The information is
  provided in small chunks which makes it easy to
  read. The text supports the point that the site
  tries to get across to use Earth Realm
  Productions for your video needs. Also, it
  includes links to the contact page, the services
  page, and ERPs email address which, in effect,
  provides extra information without displaying a
  lot of text.
• content example

Content
8
Voice

• The value of voice is that it reflects the
  personality of the designer or the business it is
  representing. The example that I have chosen to
  show here is a page from my personal Web site
  that contains my favorite links. I chose this
  particular page because when my audience looks at
  it, they can tell immediately what my interests
  are and, in turn, can determine what my
  personality must be like. From this page alone,
  my audience can tell that
• I attend or support Texas Tech
• I own or am interested in Corgis
• I enjoy music from Texas Country artists
• I enjoy playing games on the internet
• I like the movie Gone With the Wind, and
• I have some interest in dentistry.
• voice example

Voice
9
Graphics

• The value of graphics is that they tend to peak
  the interest of the audience. The example that I
  have chosen to show here is the first page of my
  photo gallery on my personal Web site. Notice
  that each graphic is consistent in size and laid
  out in an organized fashion. The double Ts at
  the top are big enough to notice, but not so big
  that they take away from the content of the page.
  The three pictures below are big enough to fill
  out the page and draw the interest of the
  audience, but they are not so big that they take
  up the entire page and make it look cluttered. If
  I had only put the links to the pages in my photo
  gallery without the graphics, my audience would
  be less likely to browse through the entire
  gallery. Supplying small pictures helps persuade
  the user to continue to browse the site.
• graphics example

Graphics
10
Color

• The value of color is that it determines the
  audiences first impression of the site. The
  example that I have chosen to show here is the
  first page of the Web site that I helped to
  redesign for a video production business. We
  decided to use a color scheme of a light green, a
  deep blue, and black text. The blue indicates
  more important information while the green is
  solely used for the background. The contrast
  between the blue and the green is appealing and
  it looks professional. If we had decided to use
  bright, flashy colors or more than three colors,
  it would have diminished the integrity of the
  site and made it look childish. The first
  impression of the audience when looking at this
  site is that it looks organized and elegant. This
  leads them to think that maybe the business is
  professional and that they may want to hire this
  company for their video needs. If the site looked
  childish, the audience may tend to think that the
  business is somewhat childish lacking in
  organization or lacking in professionalism.
• color example

Color
11
(No Transcript)
12
(No Transcript)
13
(No Transcript)
14
(No Transcript)
15
(No Transcript)
16
(No Transcript)