Transcript HTML Lesson 7 - California State University, Dominguez Hills

HTML Lesson 6
TBE 540
Prerequisites
• The learner must be able to…
– Create a web page using a text editor and/or
a web page editor, demonstrating the use of
text, graphics, lists, links (external and
anchor), lines, colors, backgrounds, and
tables.
– Search the web for information.
Objectives
• After completing the activities related to
this lesson, the learner will be able to…
– List three or more attributes of a “good” web
page.
– List five or more considerations that affect
web page design.
– Describe accessibility adaptations.
– Locate appropriate rubrics for educational
web page evaluation.
Look at Web Page Rubrics
• Before going further in this lesson, take
the time to view at least three web page
rubrics.
• You will find the links on the TBE 540
HTML page (middle right) at
http://www.csudh.edu/fisher/540html.htm
Web Page Audience
• One of the main considerations of web
design is audience appropriateness.
• You would not expect a book for a young
child to look like a novel that an adult
would read.
• The audience of a web page should help
determine its overall appearance.
Audience - Reading Level
• One example of an audience adaptation is
reading level.
• If you want to see the “readability” of some
of your text, copy it, go to
http://www.csudh.edu/fisher/readability.htm
and paste it into the box provided.
• Follow the directions on the page to see
several versions of the grade level of the
text.
Audience - Amount of Information
• If your audience is younger, you may want
to put only a small amount of information on
each page.
• You may also want to provide graphics that
assist in navigating the page.
• Some individuals do not like to scroll very
far.
• Consider breaking long text into several
sections or providing anchors within the
text.
Audience - Foreign Language
• If your intended audience will be nonEnglish readers, you may need to display
special characters or different alphabets.
• For example, you can display ñ with this
code: ñ
• For a complete list of special
characters, see
http://www.webmonkey.com/reference/Spec
ial_Characters
Audience - Load Time
• You may be aiming your web page at
children or parents who do not have access
to the latest equipment.
• If they have older computers or slower
modems, they do not want to wait for large
graphics or PDF documents to load.
• They may not have helper applications such
as Acrobat Reader or Shockwave.
Audience - Load Time
• Consider the load time of your page in its
design - avoid unnecessary “bells &
whistles”.
• If you must use large graphics, make them
“interlaced” so that they load a little at a time.
• You may also want to make a text-only
version of your page (if the graphics are not
necessary to the information).
Audience - Different Browsers
• You have no control over the browser that
your audience will be using.
• Web pages will look different in Explorer, in
Netscape, in Safari, in AOL’s browser, and
in others that are less common.
• Various versions of each browser also differ
in display capabilities.
• If you include web page code or activities
that are browser-specific, the users may not
see what you intended.
Audience - Alternate Fonts
• You may have a special font that you always use
in word processing.
• You should generally not specify special fonts in a
web page, because they may not be available on
the user’s computer.
• Your page may not have the appearance you
intended if you specify an uncommon font (Times
and Arial are usually OK).
• You can place graphic versions of text in a page,
but it will not be accessible to the blind.
Audience - Accessiblity
• You may be required by law to make your web
pages accessible to disabled users (school and
other public web sites).
• There are some easy adaptations, such as
including ALT tags on each image so that screen
readers (for the blind) can read necessary
information.
• You should also provide text links as an alternate
to image maps.
• For more info, see the links (bottom right) at
http://www.csudh.edu/fisher/tbe540/540html.htm
Web Page Purpose
• The intended purpose of your web page
will also affect its design.
• If you are trying to sell a product or recruit
new customers, you will need a site that
gets the user’s attention.
• If you intend to teach or provide
information with your site, you will need
more emphasis on information and less on
attention-getting.
Web Page Purpose
• It is generally not a good idea to make the
purpose of your page “see what I can do!”.
• Be sure you have a clear idea of the
purpose/objectives of your page. The page
design should help the users meet the
objective(s).
• For example, if the purpose of the page is to
“teach”, you may want to include some
interactive elements.
• If the purpose is to provide information, be sure
the information is well-organized.
Web Site Cohesiveness
• Even though you may want to use a
variety of color, etc., your web site should
look like it is all part of one package.
• You can use a color scheme or a “theme”
(found in some web editors).
• You should keep the navigation consistent.
For example, many pages have a list of
links on the left side of all pages.
Web Site Cohesiveness
• The user should know where he/she is
within the site at all times and be able to
return to the “home” page easily.
• Some pages use frames (see HTML
Lesson 5) so that the outer part of the
display does not change.
• Others (more common) use tables with
navigation links in the same location on all
pages.
Web Site Cohesiveness
• Most web site designers do not use
frames (Blackboard is an exception), since
they are harder to bookmark, print, and
download.
• The next time you use Blackboard, notice
how the frames are used. They are used
both for convenience and for appearance.
General Considerations
• Proof read your text. Fix typos.
• Put your name and/or contact information
on each page.
• Include the date the page was last
updated.
• Check external links frequently to ensure
that they are still working.
General Considerations
• Your school/district may require a
disclaimer for your pages or your site.
• At CSUDH, non-official pages must
include this statement:
– Disclaimer for unofficial pages: The statements found on pages in this
web site are for informational and instructional purposes only. While
every effort is made to ensure that this information is up to date and
accurate, official information can be found in the University
publications. Links to commercial sites are for information purposes
only; no promotion of particular commercial sites is intended.
• See the CSUDH Web Style Guide at
http://www.csudh.edu/wam/resources/styleguide/
General Considerations
• If your site will be posted on the web, be
sure to honor copyright regulations. At the
very least, give credit for copied artwork,
and adhere to “fair use” principles.
• See the copyright links (middle right) at
http://www.csudh.edu/fisher/tbe540/540ht
ml.htm
• Keep your web page file names fairly
short, with no spaces. This will make it
easier for users.
Rubrics
• Remember that you will be using a rubric
to evaluate your own web site.
• Take time to print a copy of reference as
you develop the site.