Transcript clayton - Wake Forest Student, Faculty and Staff Web Pages

Computer Enhanced Learning:
Electronic Communication
Rick Matthews
Dept. of Physics, Wake Forest University
[email protected]
http://www.wfu.edu/~matthews
97/9/16
Clayton College
1
Electronic Communications
• Outline
–
–
–
–
–
–
–
97/9/16
A New Pedagogy?
Communication
E-mail
Listservs
Usenet
The Web
Pedagogy, again
Clayton College and State University
2
A New Pedagogy?
• Is the computer really going to revolutionize education?
In what way?
• Where is the technology going? Where will it be 5
years from now? Ten years from now?
• What are our broad educational goals, and how does
computer technology serve these goals?
• What do we want to change, and what should we be
careful to preserve?
97/9/16
Clayton College and State University
3
A New Pedagogy?
Let’s hope the traditional lecture is NOT a good way to
teach!
Do we want to be the Tea Room or the Tastee Freeze?
Classroom time is too valuable to waste on onedirectional transmission of information.
97/9/16
Clayton College and State University
4
Short term
• More initial impact on what happens
outside the classroom than what
happens in the classroom!
97/9/16
Clayton College and State University
5
Communications
•
•
•
•
E-mail
Listservs
Usenet
Web pages
97/9/16
Clayton College and State University
6
Communications
•
•
•
•
E-mail
Listservs
Network News
Web pages
97/9/16
• E-mail:
– Familiar, omnipresent.
– Students are more willing to send e-mail
than to call.
– If it works well for the students, it can be
very time consuming.
Clayton College and State University
7
Communications
•
•
•
•
E-mail
Listservs
Network News
Web pages
97/9/16
• Listservs: an electronic mailing list
– You can subscribe members, or invite users
to subscribe themselves.
– No new application for users to learn;
messages appear with regular mail.
– Excellent forum for discussions outside of
class. Example: English literature.
– More efficient, and perhaps better, than email for answering student questions.
– Disadvantages: All discussions are mixed
with your regular e-mail. (Solution:
Filters.) Discussions are not threaded.
Clayton College and State University
8
Communications
•
•
•
•
E-mail
Listservs
Network News
Web pages
97/9/16
• Network News, or Usenet, is a set of
thousands of online discussion groups
– You can create local groups accessible to
just your faculty and students.
– Discussions are separate from e-mail.
– Discussions are threaded by topic.
– Limited privacy
– Articles are read with a different
application (maybe). Messages do not
appear in your mailbox.
Clayton College and State University
9
Communications
•
•
•
•
E-mail
• Web Pages
– Web use is ubiquitous -- students already
Listservs
know how to use it.
Network News
– Publication is cheap and easy. Gutenberg II.
Web pages
97/9/16
– Rich presentations, multiple fonts, images,
equations, sound, video.
– Hypertext offers a different paradigm for
presentation.
– Students can be “published” internationally.
– Communication is one-way (usually!).
Clayton College and State University
10
Communications
•
•
•
•
E-mail
• WFU Physics uses of Web pages
– See http://www.wfu.edu/physics.
Listservs
– Class syllabus, indexed on student
Network News
government pages.
Web pages
97/9/16
– Homework assignments, solutions.
– Links to relevant sites.
– Last minute information, weather reports,
satellite images for Astronomy labs.
– Official information for graduate and
undergraduates. Online applications.
– Classroom demonstrations.
Clayton College and State University
11
Communications
•
•
•
•
E-mail
• More uses
– Online threaded discussion, much like Usenet.
Listservs
– Student pages
Network News
• Not just ego-booster (though that helps).
Web pages
97/9/16
• Students can publish papers, other
students can critique.
– Student Web searches
• Much is trash.
• Much printer matter is trash, too!
• Students need to learn how to judge the
value of what they see.
Clayton College and State University
12
Communications
•
•
•
•
E-mail
• Content!
Listservs
• Ease of use!
– Find out the fastest, most efficient way of
Network News
getting your information on the Web.
Web pages
97/9/16
• Frontpage
• Word97 (get the latest plugin: w97au.exe)
or Word95 with IA
• Netscape Composer
• Scanned text
Clayton College and State University
13
Style
• HTML
– Standard markup, “styles”: essential for good pages
• Normal
• H1, H2, etc.
• PRE, handy for existing documents with tables
– HTML is not WYSIWYG.
• Viewer may not even have graphical browser.
• If the same brand of browser, settings may be different.
Mark content, not layout.
97/9/16
Clayton College and State University
14
Web Authoring
• HTML Style Elements
–
–
–
–
97/9/16
Numbered list, <OL>
Bulleted list, <UL>
Horizontal rule, <HR>
Note: bold and italics are supported, but HTML purists
do not use them. Instead consider “Strong” or
“Emphasis”.
Clayton College and State University
15
Graphics
• Goal: high quality, small size.
• Size is important, very important.
• Rule of thumb:
Time = 1 second per Kbyte + 3 seconds per file
– Lots of 1 K buttons add tremendously to download
time; it’s not just file size.
– This will get better with http1.1.
• Don’t forget the value of caching! Reuse images.
• Pick the right format: GIF or JPG.
97/9/16
Clayton College and State University
16
Graphics: file type
• GIF, JPG, TIF, BMP, WMF, PNG, PCX: why all these
file types?
• How do we represent color?
– One number each for R, G, B.
– TrueColor: 256 levels each for R, G, B
• 3 x 8 bits = 24 bits per pixel = 3 bytes per pixel
• 800 x 600 image x 3 bytes/pixel = 1.44 Megabytes!
• TIF, BMP
– Full TrueColor representation, no compression
97/9/16
Clayton College and State University
17
Graphics: compression
• GIF
– Invented to reduce file size.
– Reduces number of colors in image to a maximum of
256 (and a minimum of two), using a palette of 24 bit
colors.
– Repeated colors are replaced by a single entry and a
repeat number: [17][17][17][17] becomes 4x[17].
– Works great on line drawings, computer art.
• Full representation of image without loss.
• Small file sizes.
– Not so great on photographic images.
97/9/16
Clayton College and State University
18
Graphics: compression
• JPG
– Invented to compress photographic images
– Works best where GIF works poorly: continuous tone
images.
– Compresses by discarding spatial frequencies the eye
does not notice.
– Quality (and file size) is adjustable.
– Supports TrueColor.
– Terrible for line drawings, computer art.
97/9/16
Clayton College and State University
19
JPG vs. GIF
Original:
2000x1600 truecolor
97/9/16
Clayton College and State University
20
JPG vs. GIF
1 Meg
97/9/16
2.4 Meg
Clayton College and State University
21
JPG vs. GIF
1 Meg
97/9/16
2.4 Meg
Clayton College and State University
22
JPG with extreme compression vs. GIF
134 K
97/9/16
2.4 Meg
Clayton College and State University
23
JPG vs. GIF: Computer generated image
5k GIF
16k JPG
97/9/16
Clayton College and State University
24
Graphics: choosing file types
• Computer art and line drawings:
– Always use GIF
• Photographic images
– Save the original as BMP, TIF, or PNG
– Put JPG on the Web
• The future:
– PNG will replace GIF ( I hope!), but will not replace
JPG.
97/9/16
Clayton College and State University
25
Web pages: special concerns for
math and science
• HTML does not support mathematical expressions and equations.
• Methods:
– Scanned handwritten text
• Easy, viewable by most, not very pretty.
– IBM TechExplorer
(http://www.ics.raleigh.ibm.com/ics/techexp.htm)
• As easy as Tex.
• Requires a plug-in only available on the most popular
platform, but accessible to anyone with Tex.
– Include equations as images
• Viewable by most browsers
• Easy with Microsoft Word97
97/9/16
Clayton College and State University
26
Including equations with Word
• Initial setup of the equation editor on the toolbar:
–
–
–
–
Click on “Tools” and then “Customize”.
Select the “Commands” tab.
Select “Insert” from the left window.
Drag equation editor icon (“”) from the right window
to the toolbar. Click on equation editor icon, create
equation using equation toolbar.
• Equations will be included as a GIF files.
• Warning: equations cannot be edited later unless also
saved as *.doc.
97/9/16
Clayton College and State University
27
HTML <HEAD> information
• Header information
– Important!
• Titles are what appear in bookmark list.
• Subject, keywords, description are used by search
engines to index your page.
97/9/16
Clayton College and State University
28
Meta tags in HTML source
• <HTML>
<HEAD>
<TITLE>Your title goes here</TITLE>
<META NAME="subject" CONTENT=”Your subject here">
<META NAME="keywords" CONTENT= "Keyword1 keyword2" >
</HEAD>
<BODY TEXT="#000000" BGCOLOR="#ffffff">
<P>This is the body.</P>
</BODY>
</HTML>
• Modern Web authoring tools offer an easier way!
97/9/16
Clayton College and State University
29
Adding title and meta tags in
Word97
•Click on File, Properties
to bring up the window
shown at right.
•Click on “More”.
97/9/16
Clayton College and State University
30
Adding title and meta tags in Word97
On the Summary tab, you will
find slots for title, subject,
description, etc.
97/9/16
Clayton College and State University
31
Adding title and meta tags in Word97
• Select Custom tab.
• Enter the word
“Description” in the
“Name” slot.
• Enter a description of
your document in the
“Value” slot.
97/9/16
Clayton College and State University
32
Adding Meta Tags in Netscape
• Netscape
Communicator
offers a similar
entry window.
• Select “Format”,
“Page Colors and
Properties” to call
up this window.
97/9/16
Clayton College and State University
33
Editing HTML directly
• HTML looks much like the old pre-WYSIWIG word
processors.
• Can use the “Edit source” option of Word, or edit
directly with Notepad, emacs, vi, etc.
97/9/16
Clayton College and State University
34
Final thoughts on Web design
• Content, Content, Content.
• Keep graphics file size down, unless graphics are the
focus. Consider thumbnails linked to bigger pictures.
–
–
–
–
Use GIFS for computerTime
generated pictures and line art.
Use JPGs for photographs. Adjustable compression.
Reuse graphics where possible, and refer consistently.
Use “Height” and “Width” tags.
• My rule of thumb:
Time in seconds = (3x #files) + (Total size in K)
Keep time under 45 seconds.
• Site should be navigable without graphics.
97/9/16
Clayton College and State University
35
Pedagogy again
• Bob Swofford: “We are in the ‘bolt-on’ technology
phase.”
• Where do you see us going?
• What are the pitfalls?
97/9/16
Clayton College and State University
36