Você está na página 1de 46

AUDIO AND VIDEO ON THE WEB

Multimedia files such as audio or video come in two general formats: “downloaded” format and
“streaming” format. In the case of the former, the file must be completely received before it can be
played, while in the case of streaming files, the material can be played before the material is fully
received. Another difference is that downloaded files can usually be saved to hard drive for later
use while some streaming formats do not allow the material to be permanently saved so that one
can replay them at will. (This “single play only” feature appeals to many music distributors who
fear that their material could be spread over the Internet without any restriction such as happened
when Napster first set up shop).

Sound, image and video files can be uncompressed or compressed, but compression is almost
always used when multimedia materials are transmitted via the Web. This is necessary in order to
reduce transmission time. Compression can be as much as 90% or more, depending on the
technology used. Furthermore, compression can be lossless or lossy, depending on whether or not
the original data can be mathematically reconstructed exactly by a reverse operation.

Aspect Ratio refers to the ratio of a video image’s width to its length. Video seen on regular
television has an aspect ratio of 4:3 while widescreen video seen in “letterbox format” movies and
DVD video employs an aspect ratio of 16:9. The “DV” format
used in digital video cameras uses an aspect ratio of 3:2 (with a frame size of 720 × 480).

AVI; Audio Video Interleave. AVI is a video format developed by Microsoft and is one of the more
common formats for PC video data. The format is interleaved such that video and audio data are
stored consecutively (i.e., a segment of video data is immediately followed by a segment of audio
data).

Colour depth (also known as bit depth or pixel depth) is a term that applies to both video and static
images and refers to the maximum possible number of colours. A 24-bit colour depth scheme
allows for 16.7 million distinct colours in an image. Achieving higher bit depth in video requires
larger file sizes, but generally provides superior image quality.

Codec is short for “compressor/decompressor”. A codec is any technology for compressing and
decompressing digital data, although the term usually applies to audio and video signals. The
rationale for the use of a codec is that the digital representation of
audio and video signals requires large amounts of data, often too much to send efficiently over an
ordinary 56 Kbps modem connection. Digital media presented over the web is therefore often
compressed to a much smaller size by selectively removing unimportant data from the file. The
codec is thus the method (algorithm) used to compress and later decompress the media. Codecs
can be implemented in software, hardware, or a combination of both. Some popular codecs for
computer video include MPEG,
Indeo and Cinepak.

Data Compression. Storing data in a format that requires less space than usual. Data compression
is particularly useful in multimedia and in telecommunications because it enables devices to
transmit the same amount of data using fewer bits. There are a variety of data compression
techniques, of which the MP3 format is a particularly popular one for audio data.
Data rate refers to the transmission rate of data. Most modems top out at around 56 kilobits per
second (Kbps), or 7 kilobytes per second (KBps) while connections using a Local Area Network
(LAN) can be much higher. Data rate capability is an all-important factor upon which many other
variables depend. These variables include colour depth, codec technique, frame rate, sampling rate,
sampling resolution, and video size. Uncompressed NTSC video (the usual format used in North
America) takes up about 27 megabytes per second, while compressed DV video takes up only
about 3 megabytes per second.

Frame rate refers to the number of frames per second (fps) in a video. A smaller frame rate
decreases the data rate, but makes the video appear jerky. Full motion video runs 25 to 30 fps. An
acceptable rate for web video is 10 to 15 fps, especially if the action is relatively slow, which is the
case in most medical procedure videos.

JPEG. Short for Joint Photographic Experts Group,. JPEG is a “lossy” compression technique for
colour images. Although it can reduce file sizes to as little as 5% of their precompression size,
some detail is lost in the compression.

Keyframe refers to a “reference frame” in a video. A video codec works by taking periodic
snapshots of a video, and redraws that snapshot as the video progresses. Only changes in
sequential frames are redrawn, giving the appearance of motion. Using less frequent keyframes
reduces the data rate, but also reduces the quality of the video.

Multimedia. The use of computers to present text, graphics, video, animation, and sound in an
integrated way.

MP3 (MPEG-1 Layer-3 audio) - a popular audio format with near CD quality sound at a
compression ratio about 10:1. MPEG. Short for Moving Picture Experts Group, a working group
of ISO. The term refers to the family of digital video compression
standards. MPEG achieves a high compression rate by storing only the changes from one frame to
another, instead of each entire frame. There are three major MPEG standards: MPEG-1, MPEG-2
and MPEG-4.
– The most common implementations of the MPEG-1standard provide a video resolution
of 352-by-240 at 30 frames per sec (fps). This produces video quality slightly below the
quality of conventional VCR videos.
– MPEG-2 offers resolutions of 720 x 480 and 1280 x 720 at 60 fps, with full CD-quality
audio. This is sufficient for all the major TV standards, including NTSC. MPEG-2 is
used by DVDs.
– MPEG-4 is a graphics and video compression algorithm standard that is based on
MPEG-1, MPEG-2 and Apple QuickTime technology. Wavelet-based MPEG-4 files are
smaller than JPEG or QuickTime files, and are designed to
– transmit video and images over a narrower bandwidth.

Sampling rate refers to the number of samples per second, and is a determinant of audio quality. It
is the audio equivalent of frame rate. Sampling rates for audio signals typically range from 8000
Hz to 48000 Hz or more. CD-quality audio is 44100 Hz at 16 bits resolution.

Sampling resolution refers to the precision with which a sound is recorded, usually either 8 or 16-
bit. CD-quality audio is 16-bit.
SMIL. Synchronized Multimedia Integration Language. (SMIL, pronounced “smile”). This
technology enables simple authoring of interactive audiovisual presentations. SMIL is typically
used for “rich media”/multimedia presentations which integrate streaming audio and video with
images, text or any other media type. SMIL is an easy-to-learn HTML-like language, and many
SMIL presentations are written using a simple text-editor.

Streaming is a method of delivery method of audio and video media whereby the material will play
as soon as enough information arrives at the client; the full file need not be downloaded. By
contrast, non-streaming audio and video require the whole file to
be downloaded before playback. For audio data, the de facto Web standard is RealAudio from
RealNetworks (www.real.com).

WAV. An early nonstreaming format for sound developed jointly by Microsoft and IBM. Support
for WAV files was built into Windows 95 making it the de facto standard for sound on PCs. WAV
sound files end with a .wav extension and can be played
by nearly all Windows applications that support sound.

What are Captions?

Captions are text versions of the spoken word. Captions allow the content of web audio and video
to be accessible to those who do not have access to audio. Though captioning is primarily intended
for those who cannot hear the audio, it has also been found to help those that can hear audio
content and those who may not be fluent in the language in which the audio is presented.

Common web accessibility guidelines indicate that captions should be:


Synchronized - the text content should appear at approximately the same time that audio would be
available
Equivalent - content provided in captions should be equivalent to that of the spoken word
Accessible - caption content should be readily accessible and available to those who need it

On the web, synchronized, equivalent captions should be provided any time audio content is
present. This obviously pertains to the use of audio and video played through multimedia players
such as Quicktime, RealPlayer, or Windows Media Player, but can also pertain to such
technologies as Flash, Shockwave, or Java when audio content is a part of the multimedia
presentation.

Closed vs. Open Captions


Captions as typically seen on television

Example of Audio Descriptions


In producing an instructional video for the web, the need for audio descriptions can often be
avoided. If the video were displaying a list of five important items, the narrator might say, "As you
can see, there are five important points." In this case, audio descriptions would be necessary to
provide the visual content to those with visual disabilities who cannot 'see' what the important
points are. However, if the narrator says, "There are five important points. They are..." and then
reads or describes each of the points, then the visual content is being conveyed through audio and
there is no additional need for audio descriptions

File types

The most widely used file types (formats) for audio and video on the web are:

MPEG3, audio only


.mp3
cross-platform
PC only, audio only
.wav
played by MS Windows integral sound system
QuickTime
.mov audio or video
cross-platform
RealPlayer
.rp, .rm audio or video
cross-platform
Windows Media Player, claims to be cross-platform
.wmp but in some cases, PC only

Streaming Audio and Video

Real Audio and Real Media streaming files may be added to your pages by methods known as
linking and embedding. Users have told us that embedding only works for sound files, and that
linking should be used for video clips. An embedded file places or embeds a Player on your PWP
that a visitor uses to hear your file by pressing buttons or controls on that player. Linking allows a
lPlayer to be launched when a visitor clicks on text on your PWP that is linked or associated with
the Audio or Media file you uploaded to your online directory. Example: "Listen to my Audio File"
or "See to my Video".

The instructions on this page concern Real Audio/Video files, but there's links to information on
other file types in the Additional Information section. Please be sure to read the troubleshooting
section before publishing your page.

Embedding a RealAudio file

In all examples, substitute your e-mail id for emailid and replace myfile.rm with the name and path
to your file. Your e-mail id is the part to the left of the @ in your e-mail address.

Upload the ra file to your online directory.


Place the following code on your page:
<embed src="http://home.att.net/~emailid/myfile.rm" height=100 width=200
autostart=false>

Upload or publish the html page in question.

This should place a working Real Player console on your page that is the height and width as
specified above. The user simply clicks on the triangle to start the file. If you wish it to start
automatically make the substitution autostart=true.

Linking To A Real Audio/Real Media File

In all examples, substitute your e-mail id for emailid and replace myfile.rm with the name and path
to your file. Your e-mail id is the part to the left of the @ in your e-mail address.

1. Upload the ra or rm file to your online directory


2. Open notepad or any text editor. Type in:
http://home.att.net/~emailid/myfile.rm
and save it as myfile.ram.
3. Upload the myfile.ram file to your online directory.
4. Place the following html code on your page. Make sure that you substitute the correct
information for emailid and myfile.ram, and make changes in the text to reflect what you
want to be seen on the page.
<a href="http://home.att.net/~emailid/myfile.ram">Hear my Whatever sound clip</a>
5. Upload or publish the html page in question.

Now when someone clicks on your text, it will point to this file. This will launch the RealPlayer,
and will play the myfile.rm file.

In order to stream Real Media via Http from the AT&T Worldnet Web servers, it must be encoded
as normal Realmedia format, with a chosen modem speed. You cannot use Smart Stream as this
requires a specialized streaming media server. Be aware also that the newer G2 encoder can
encode to either G2 or Real Player 5 standards. Users with G2 can view either format but Real
Player 5 users cannot view G2 content.

To embed the clip in your Web page:

1. In your Web page, add the <EMBED> tag with the RealVideo URL, window size, and
ImageWindow control. The following example assumes RealServer G2 will stream the
presentation:
2.
3. <EMBED WIDTH=176 HEIGHT=132
SRC="http://realserver.company.com:8080/ramgen/content/myclip.rm?embed"
CONTROLS=ImageWindow CONSOLE=one>

If you intend to play the clip back from a Web server, use an HTTP URL and link to a Ram
file with the extension .rpm (see below) as in the following example:
<EMBED WIDTH=176 HEIGHT=132
SRC="http://www.company.com/media/myclip.rpm"
CONTROLS=ImageWindow CONSOLE=one>

4. You can then add RealPlayer controls through additional <EMBED> tags that all use the same
URL for the SRC parameter. The following example embeds the full RealPlayer control
panel in the Web page, linking it to the image window through the same console. It
assumes RealServer will stream the presentation:

5. <EMBED WIDTH=375 HEIGHT=100


SRC="http://realserver.company.com:8080/ramgen/content/myclip.rm?embed"
CONTROLS=All CONSOLE=one>

Use an <EMBED> tag like the following when playing the clip back from a Web server:

<EMBED WIDTH=375 HEIGHT=100


SRC="http://www.company.com/media/myclip.rpm"
CONTROLS=All CONSOLE=one>

6. Transfer the clip to the appropriate RealServer G2 or Web server directory. When streaming
from G2, you are ready to test the clip because the Web page already contains the link to
the RealVideo clip.

Creating and Maintaining Website

Generally conceptualization plays vital role in creating best desired results for web designing,
putting into concept a web site is a time and energy consuming activity. There are so many things
one need to consider when creating a web site. So once you have created a web site, an important
thing to do is maintain it. It is where your continued success will mostly rely on.

In coming lines we will share the vital tips that can turn your web site creation and maintenance
process and simple one. Described below are the tips that can turn your website creation and
maintenance dream into a sweet reality:

• Make sure to designate sub folder for images.


• Keep a template that you can use when adding brand new pages to your site.
• Take note of pages that would need a lot of updates or materials in the coming dates.
You need to website design it in a manner that it can be expanded vertically.
• when updating your web site, make sure to have a back up. You would not want to lose
all those labor of hard work, would you?
• Keep with you a list of all the updates made on the site. Do not forget to include the
page, the date and the updates made.
• If your page has pictures, make sure that they have uniform size. This will help with the
appearance of your site.
• Check on your fonts, colors and texts. Of course, you would want to maintain a
professional site. Make sure that these are in sync with the theme of your web site.
Remember, you want to have an original and reliable web site. So do not think twice on taking
extra effort in creating and maintaining your web site. Always believe in the universal concept of
keep it short and simple for successful working of the site.

What is a web style guide?

A web style guide is a key deliverable at the end of a website design/redesign process. It is a
document (usually a subsite in itself) that describes what needs to be done to maintain and grow
the website according to a common set of principles derived during the design or redesign process.

A style guide will be referred to whenever a new content, new structure or new systems are
introduced. Thus, the guide is essential for content authors, web designers, information architects
and web developers to frame their thought processes when adding or changing content on the
website.

Needless to say that a web style guide is more appropriate when dealing with large corporate
websites or intranets where branding matters and where there are multiple stakeholders or teams
looking after different portions of the website.

Why do we need a web style guide?

A web style guide helps in communicating the framework under which changes are to be made to
the website.

You may have spent a lot of time and effort in coming up with a usable and useful website, but if
subsequent changes are not aligned with the initial thinking, then the website can quickly return to
its former state. The web style guide gives you a framework to avoid such situations.

As another example, let’s assume that you are in the process of setting up different intranet systems
such as a content management system, document management or record management systems,
having a style guide in this case can help frame the development process of these systems to
provide a unified web experience to your staff.

But does that mean that the guidelines are cast in stone? No. The trick here is to create the
guidelines based on principles rather than on rules. Having a rigid system will not work, but
knowing the principles and their boundaries will ensure that your website is in tune with the many
structural and visual changes that can benefit users.

A web style guide is closely related to branding. And the two brand-related situations where it can
be used are shown below:
Branded-house: Here the parent company brand permeates business units (e.g. Philips, LG,
Yamaha). The guidelines in this case can be more controlled.

House-of-brands: Here the parent company’s business units are brand in themselves (Clorox –
Hidden Valley Ranch, etc.). The guidelines can be more flexible in this case, allowing for each
brand to shine on its own and at the same time keeping the parent relationship just about apparent.

As can be seen, at one extreme you’ll want a tight integration with the parent brand, and at the
other, you’ll want only a passing mention. And if you're somewhere in between, you’ll want a
balance. Whatever the case may be, a style guide can help contribute to the brand framework.

What goes into a web style guide?

The items that go into a web style guide really depend on the perceived use(s) of the guide. Given
below is the table of contents of a recent web style guide that was included as part of a set of
governance deliverables for an information architecture project. In this case, the guide was to be
used by subsidiary departments and divisions of the parent organization to setup their own
websites. Also, since a content management system (CMS) was to be used to manage these
websites, the guidelines were written from a template perspective.

Web style guide TOC:

• Why is this style guide important?


• When should we use this guide?
• What are ‘templates’ and why should we care?
• Information architecture guidelines
• Using the [company] logo
• Masthead (or header)
• Footer
• Color palette
• Typography
• Images & media
• Accessibility
• Authoring guidelines (or how to write web content)
• Legal considerations (or web policies)
• Technology considerations
• Templates/CSS downloads
• Contact & support information

When applicable, I use the following instructional model to communicate each item:

• The guidelines
• Examples (or how flexible can we be?)
• Non-examples
• XHTML code (if any)
• CSS rules (if any)
• Downloads (if any)
Some items are explained below (the others are quite self-explanatory).

What are ‘templates’ and why should we care?

These days, websites, even the small ones, are managed using some sort of a content management
system (CMS). And ‘templates’ are at the heart of a CMS. Providing a good overview of how
templates are assembled and a link to existing templates can be a boon to those who want to
quickly set up their pages.

Typical sections may include:

• What are templates?


• Deconstructing the [company] templates
• Using the [company] templates
• Download templates (link to Templates/CSS downloads)
• What components cannot be changed?
• What components can be customized?
• How can I create new templates?
• Resources on the web

Information architecture guidelines

This is usually a summary of a more detailed IA report where content organization, labeling and
navigation structures are outlined. Sections may include:

• Chunking & organizing content (with examples)


• Using appropriate labels (usually a link to a vocabulary list)
• Using the navigation scheme
• Testing your choices out (link to a description of simple methods to test out if their change
is effective)
In my opinion, "IA thinking" is one of those things that can help build sense of a shared purpose. If
people responsible for the website subscribe to its philosophy, it can only but help the greater cause
– providing a better user experience.

Authoring guidelines

This is a critical portion of the web style guide, so much so that many choose to treat it
independently in the form of a “web content style guide”. Gerry McGovern’s book of the same
name is a useful reference here. But again, knowing the nature of web work, there is a need to
provide some simple guidelines to get things moving. In such a case, providing a gist of what
needs to be done, along with a more detailed document might be the appropriate strategy. This is
where the authoring guidelines come in.

Typical sections may include:

• Trim that text!


• Chunk it up
• Use microcontent to provide context and structure
• Use hypertext to provide breadth and depth
• Use the inverted pyramid style
• A bit about XHTML

Templates/CSS downloads

This item is a must. More often than not, this is where much of the action takes place.
Furthermore, this item is always expanding, at least it should be. For example, if there is a deep
need for a Flickr like gallery page, the code (both XHTML and CSS) could be added to this item.

Typical sections may include:

Main templates

• XHTML source
• CSS file
• Screenshot

Flickr-like gallery page


• XHTML source (CSS embedded)
• Annotated screenshot

Also see, for example, the University of Florida’s templates download page:

Contact & support information

Needless to say that without this item, there isn’t going to be that shared responsibility to maintain
the website. This not only a feedback channel, but also a commitment channel. It gives a clear
message that maintaining the website is serious business and the company intends to do it well.

Typical sections may include:

• Contact information. Direct contact to the people looking after the style guide.
• Suggestion box. Stuff that developers would want included in the style guide. A wiki might
help with this issue.
• Frequently asked questions (FAQs). These are based on the queries that the support staff
gets.

How to maintain a web style guide?

It’s one thing to create a web style guide, but it’s totally a different matter to keep it updated. And
keeping it updated is a matter of policy and representation. By representation I mean the ease of
use of the guidelines, which boils down to providing "how-to" knowledge rather than just
describing the guidelines. If there ‘s no policy or if executing the policy is difficult then the utility
of the web style guide will erode over time.

Also, it's best to keep the style guide online, and manage it like you would manage any of your
other websites.

One of the best style guides I’ve come across is the University of Monash style guide. The style
guide is a subsite and detailed information is provided for all items. From the looks of it, a lot of
effort is going into maintaining this guide (its at version 2 at the moment).

DOWNLOADING AND INSTALLING SOFTWARE FOR WINDOWS

Introduction

Most software available for downloading from the Web is usually contained in one or more files
into which all the files necessary to install the software have been packed. The downloadable files
will normally have the extension .zip or .exe.

To install the software on your PC, the files within these "containers" need to be unpacked. To
ensure that the individual files are easily identifiable always download software into a new
directory.
Zip files

Before installing, all of the files with the extension .zip will need unpacking using an unpacking
utility such as Power Zip. Power Zip is used in the following example for those who do not already
have an unpacking utility on their PCs.

Exe files

A file with the extension .exe is a program and its behaviour cannot be predicted before running,
i.e. double- clicking on the file. It may start a self-installing Wizard, or start up an unpacking utility
such as Power Zip. In the worst case, it could damage your PC.

Warning!

Installing new software is a high-risk activity. Malicious or badly written installation programs can
damage your PC.

To avoid this happening:

• Only install programs that have been recommended by IT Services or technical support
staff in your Unit.
• NEVER double-click on an *.exe file that has been sent to you via unsolicited email.

There are many sites on the Web from which you can download software, however you must
ensure that the site is reputable and that you are fully aware of the type of license that applies to
the software that you wish to install on your PC.

Downloading a file from the web

Always download files from the web into their own directory within a temporary directory on your
hard drive. This will ensure that the files are easily identifiable.

As the first application you need to download may well be an unpacking utility, this example uses
PowerZip. However, the following instructions apply to any file that can be saved from your
browser.

Having decided on which piece of software you require:

• Open Windows Explorer


• Create a folder within the temp folder on your hard drive, called, for example, download
• Find the correct page for downloading the piece of software - in this case a site called
Tucows which is at http://www.tucows.com/:

N.B. Ensure that the software is for your operating system - e.g Win XP or Win 2000 - and that
you can comply with the licensing conditions. NEVER download software from unknown sources.

• Print out and read any instructions provided


• Click on the appropriate link and save the file to the folder, c:\temp\download
• When the file has been successfully saved, close your browser.

Installing software

Having successfully saved the file, you are now ready to install the software onto your PC.

1. Dealing with *.exe files

Some downloadable files are self-extracting - i.e. do not require a utility such as PowerZip to
unpack them. These files usually have the extension .exe. In addition, an increasing number of this
type of file automatically starts the installation process using a Wizard. However, in most cases
you will not know which type of file you have until you double-click on it.

For all *.exe files, the first part of the process is the same:

• Close all open applications


• Open Windows Explorer
• Move to the Download sub-folder within the Temp folder
• Double-click on the file that you have just downloaded from the Internet

2. Self-installing *.exe files

In the example we are using the file is called PowerZip70_Tucows.exe. It is a well behaved self-
installing executable and so a set-up wizard starts up. [If double-clicking does not automatically
start the set-up process, please go to the next section, 3.Dealing with *.exe files that do not self-
install].

Continuing with our PowerZip example:

• The Setup Wizard automatically starts up


• Click on Next
• Read any licensing rules carefully - e.g. you must register PowerZip within 30 days
• Follow the remaining steps in the Wizard - ensuring that the program is installed in its
own folder under Program Files - the last step will often be to restart your PC.

Once the installation process has been successfully completed:

• Test the program


• If everything works successfully delete the downloaded file from your folder;
c:\temp\download

3. Dealing with *.exe files that do not self-install

Double-clicking on this type of file will not automatically start a set-up process. Instead, the files
contained within the *.exe file will be unpacked into the temporary folder that you have created.
With Windows Explorer still open at the temporary folder that you have created:

• Press the |[F5]| to refresh the screen - this will ensure that any files that have been
unpacked are now visible in Windows Explorer

The remainder of the process is described in the section, 5. Installing the program

4. Dealing with all *.zip Files

All files with the extension .zip will need to be unpacked using an unpacking utility such as
PowerZip. After unpacking they will then need to be installed as described in the section, 5.
Installing the program.

Unpacking the files:

• Close all open applications including the Office


Short-cut bar
• Open Windows Explorer
• Move to the Download folder within the Temp
folder
• Right-click on the file that you have just downloaded from the Internet - this will open a
short-cut menu
• Click on the option: Extract to folder C:\TEMP\download\"filename"\

5. Installing the Program

As these types of compressed files do not self-install, you will now need to install the software. In
most cases this will involve double-clicking on one of the extracted files, usually called setup.exe
but occasionally it might be called install.exe.

• If there is no such file, the extracted files must be copied to the appropriate place within
your file structure, i.e. to their own sub-folder within Program Files on the hard drive.

Installing the Program from an Extracted File:

• Ensure that all applications are closed


• Open the sub-folder containing the unpacked files
• Print off and read any Readme files that have been unpacked as these often give further
instructions regarding installation
• Double-click on the file, setup.exe - This should start up the installation Wizard
• Follow the steps in the Wizard - ensuring that the program is installed in its own sub-
folder on the hard drive - the last step will often be to restart your PC.

Warning!

Badly behaved setup programs will install without a wizard, i.e. they will not prompt the user
during the process. In these cases, you must check to see where it has installed itself.
Once the installation process has been successfully completed:

• Test the program


• If everything works successfully delete the downloaded file from your sub-directory;
c:\temp\download

Downloading and installing software patches

To check for GFI MailSecurity software updates:

1. Click the Patch Checking node in the Console Root, and click the Check for patches button in
the right pane window, to connect to the GFI Update Server and check for available updates.

2. If software patches exist for your version of GFI MailSecurity, these are listed in the right
window. Otherwise you will be informed that no software patches are available. From the list of
available software updates (in the right window), click the Download link included in the last
column of each patch. This will start the download process. Repeat the same procedure for all the
listed updates.

3. After all downloads are complete, you can start installing the software updates. Since the
software patches vary in file format (i.e. could be DLL files, EXE files, etc.), you must read the
relative patch information for the installation instructions. To access the installation instructions
and other information relevant to a patch, click the Information link provided in the list of
available updates (in the right window of GFI MailSecurity).

NOTE 1: It is important that you follow the exact patch instructions provided in the information
link. An incorrect patch installation might cause a product malfunction or degrade its performance.

NOTE 2: If available, GFI MailSecurity also includes links to Knowledge Base articles related to
the listed patches. This is denoted by the KB Article caption in the KB link column of the patch.
To access the Knowledge Base information, click the KB Article caption/link.

NOTE 3: GFI MailSecurity sends an email notification to the administrator whenever new
software patches are discovered.

FTP
YOU transfer files all the time on the Internet, without even thinking about it! When you browse
the Web, files are transferred to your Web browser. When you send e-mail, files are transferred
across the Internet to the message's recipient. Web and e-mail programs, however, are specially
designed to handle a few particular file types, types that they know how to display or create. They
also use spt'cial communications languages, called protocols, designed specifically for efficient
transf('r of those files.

Sometimes, however, you just want to get or send "any old file." It might be a word processor
document, a spreadsheet, a photograph, or a program. To transfer the file across the Internet, you
have several choices:

• Transfer the file using one of the commonplace Internet seivices:e-mail or the
Web .
• Use software specially designed to transfer "any old file," software that speaks a
special protocol called File Transfer Protocol (FTP).
Using File Transfer Protocol (FTP)
FTP is designed for distributing files to a number of users. It is not designed for communicating
files between individuals. FTP uses a client-server system, in which files Me stored at a central
computer and transferred between that computer and other, widely distributed computers. The
central computer runs software called an FTP server, and the software at the other, widely
distributed computers runs software called an FTP client. Using File Transfer Protocol, the client
requests that a file transfer be initiated, and then the client and server exchange data.

Like FTP, Web clients request files from Web servers. Using HyperText Transfer Protocol
(HTTP), Web clients (browsers) request files from Web servers (Web sites). The big
qifferenceis that FTP service goes both ways: "up" to the server, as well as "down" to the client.

Just as you need Web client software (a browser, which speaks HTTP) so that you can receive files
from a Web server, you need FTPclientsoftware to exchange files with an FTP server. Note that
FTP communication is always between clients and servers, never between clients: just because two
people have FTP client software doesn't mean they can exchange files with each other. One person
might send a file to a server and the other person might then download that file, but a server must
still be in the middle.

FTP Clients
FTP client software can be a separate, stand-alone program, such as Ipswich Software's popular
WS_FTP for Windows computers, or Dartmouth College's shareware program, Fetch, for the
Macintosh. FTP client software can also be built into other software. In fact FTP client capability
is incorporated in popular Web browsers from Netscape, Microsoft, and others, and is included as
a utility program in various operating systems, such as UNIX and Windows 98 and 95.

The FTP client capability that is incorporated into Web browsers is usually fine for downloading
files from public (so-called anonymous) file servers. It even works for uploading files to FTP
servers, as long as the servers are set up in a certain, standard way.
Stand-alone FTP client software, whether a commercial program or an FTP utility provided as
part of the operating system, generally offers more flexibility. Such programs can help you deal
with the less conventional configurations of FTP servers, with the various types of files, and with
managing the files and directories at both ends of the transfer. FTP utilities generally rely on text
commands, whereas commercial FTP clients usually offer a graphical user interface with buttons
and windows. Commercial programs sometimes also offer useful non-FTP utilities such as Ping,
Finger, Who’s, and Lookup that help you connect to the server you want and troubleshoot the
connection.

FTP Servers
As with Web servers, the Internet contains thousands of FfP servers. Many organizations that run
Web servers also run FTP servers, which they use to handle the distribution of various files: free
programs, product documentation, or data files. Often, when visitors to a Web site click a link to
download something, the link actually redirects the visitor's browser to an FTP server. (You can
tell that such a redirection has happened if you notice that the address your browser is using for
the download begins with ftp:/ / instead of http://.) For most Internet users today, such subtle
redirections are their only exposure to FTP.
FTP servers are, however, independent of the Web, and supply other files besides those listed on
Web pages. In general, the other files on FTP servers support the needs of the more technical
users of the Internet, such as UNIX users and software developers.

Public ("Anonymous") and Private FTP Service


Some files on FTP servers may be accessible to the general public, while others are accessible
only by private users such as customers or members of the organization that runs the server. On
many FTP servers at educational and non-profit organizations, public access is a service due only
to the generosity of that organization.

To separate the general public from the more private, privileged users, every user of an FTP
server must log on to that server. If the server supports public access, the public logs on using the
login name anonymous, with either no password required, or the user's e-mail address required as
the password. For that reason, public servers are usually called anonymous FTP servers. Private
users log on using assigned names and passwords, which gives them various degrees of privileged
access to private folders (directories). When you use a Web browser to access an FTP server, it
automatically performs an anonymous login for you unless you direct it to do otherwise.

FTP servers put files in a variety of folders. When you connect to a server, you see whichever
folders your level of privilege permits you to see and use. Depending upon how you log on, you
may be permitted to do various things: simply see the files listed in a folder, download the files,
put new files into the folder, or change existing files. Commonly, you will find a folder named pub
(for public) that contains files for public downloading.

Transferring Files of Different Types


FTP doesn't need to know much about what type of file you are transferring. It does have two
modes of sending files, however: binary and text mode. Binary mode sends the file exactly as it
is, with no changes at all. You can send any file in binary mode.

Text mode was designed for plain ASCII tex,t. ASCII is the common standard for text, but one
feature is not standard: how the end of a line of text is represented. UNIX and Macintosh systems
differ from PC systems in how they end a line of text. If you use binary mode to transfer a text file
that originated on a UNIX system to your PC, the lines won't end properly. Text mode solves that
problem; your client program substitutes the correct line endings for your system. Text mode,
however, does not correctly transmit anything but a text file.

Finding Files on FTP Servers


You can find files on FTP servers by using Web search engines, because of the links to FTP files
now offered on Web pages. FTP servers have, however, been on the Internet much longer than Web
servers. So, before the Web, a separate system called Archie arose to help people locate material on
FTP servers, much the way Web search engines help people locate material on Web servers. Archie
allows you to search for files by file name only on FTP servers.
Archie is an entire client-server system dedicated to supporting FTP servers: there are Archie
servers and Archie clients. You can obtain Archie client software as a stand-alone program or
integrated with an FTP client program. Alternatively, you can use the Web to submit search
requests to any of the various Archie servers around the world. One starting place to find such
Archie "request forms" and "gateways” is Yahoo! at http://www.yahoo.com. Choose Computers
and Internet I Internet I FTP Sites I Searching I Archie.
Running Your Own FTP Server
Most Internet users do not have a sufficiently broad audience for their files to need to have
internet of their own. Instead, they generally distribute their files bye-mail. While it is possible to
obtain FTP server software for most computer systems, unless you are permanently connected to
the Internet, your users would have to know when YI III were connected. Also, there are security
issues with allowing other people access your computer. To maintain security, an FTP server
allows you to limit access to folders for certain users.

If you do need to be able to make files accessible to other people on demand, your internet Service
Provider (ISP) may allow you to maintain a folder on the ISP's FTP. An alternative is to place files
on your Web site, if you have one.

Transferring Files by E-mail


E-mail is a method of transferring files between individuals on the Internet, or sending to a
specific list of people. Most e-mail programs make attaching files to messages wry simple; the
sender or receiver of the file rarely has to know much about what is happening. There are,
however, different ways to attach files, and both the sender and receiver must use the same
method. Three methods are commonly used:
• Multimedia Internet Mail Extensions (MIME) Increasingly, MIME is the Internet
standard.
• Encoding a method with roots in UNIX.
• BinHex A method commonly used on Macintosh computers.
These methods are necessary because e-mail protocols were originally designed III handle
only plain text messages. When a file is "attached" to an e-mail message.it IS actually appended
to the text message with a header that tells the receiving e-mail pro~ram how to decode it. The
e-mail program trims off the remaining data and l'lInverts it to the appropriate file. If your e-
mail program doesn't have the ability to handle the encoding method, or is set up to use another
method, you may appear to have received a message with vast amounts of random text at the
end.
If you do receive such a file, examine the first few lines of text that follow the e-mail for the
words uuencode or binhex as a clue to the encoding method. Then check 10 see if your e-mail
program allows you to choose that method. Ask the sender to send the message. Another
alternative is to download from the Web one of the uudecode or binhex decoding utility programs
available. Save the e-mail message as • text file, open that text file in your decoding utility, and the
utility will reconstruct tile original file

Downloading Files from the Web


By far the most popular form of file transfer is to download files from the W~b, especially free or
trial software. (For the full details on downloading software from the Web, pleaS(' see Chapter 38.)
How does your Web browser handle this file transfer process? Sometimes the link you click to
begin downloading a file actually redirects your browser to an FTP server, as you read earlier in
the section in this chapter on FTP servers. The browser then turns over the job to its internal
FTPclient software (or to the operating system's FTP client utility). You can proceed to browse
other sites on the Web while the download happens, although your browsing may be slowed by the
ongoing download process.
If the link you click to download a file does not redirect your browser to an FTP server, the
Web server delivers the file. When a Web browser begins to receive a file from a Web server, it
examines the file's type. It either looks for information from the server as to the MIME type of the
file (for example, text/HTML for Web page files), or it looks at the file's extension (for example,
GIF). Browsers are principally focused on displaying files, not saving them, so if the browser
knows how to display a given type of file, it does so. If it does not know how to display the file, it
checks to see if it has any helper software that can display the file: a plug-in or a viewer program.
Failing that, it asks you if you want to save the file. If you choose to save the file, you can proceed
to browse other sites while the file downloads.
Browsers a,1:e increasingly clever about recognizing file types, however, so they attempt to
take action on a file rather than simply save it. Some browsers can recognize a file as being a plug-
in or other add-on component for the browser itself. They can then automatically install that
component, given your approvat or they recognize that they are receiving a file that is executable
(a program) on your computer, and ask you if you wish the program to be run once it downloads.
Some browsers can check with your computer about what program it associates with certain file
types, and run that program-even within the browser window itself. Increasingly a browser,
recognizinK that it lacks the necessary viewer or plug-in to display a file, offers to download the
required software.
If you have a Web server (or have the use of one), you can use it to distribute files.
For instance, you can use it as a drop-box for other people to pick up a file at their leisure.
Transfer the file to the site by using FTP. Then you can either link to the file from a Web page,
or simply give people the filename and URL for the file

INTERACTIVE WEBSITES

Interactive Websites provide standards-based cross curricular web resources designed to enhance
online learning opportunities. These sites interact with the user usually through either a text-based
or graphical user interface. Choose from the links above to explore a collection of interactive
resources.
To be sticky, a site needs both content, as well as some form of database or other programming. A
web site that can get visitors to stay longer and return often is known as a sticky web site. The
stickier you can make your site the better your chances of converting visitors into customers. You
can add some ASP or CGI or PHP scripts, as your web server supports. Let us see some of them
here.

Content Syndication
you can feed some daily news, which can be general or your industry specific. You can get the
syndication information from the content provider site. Most probably they will be simple
JavaScript that you can just place on your site where you need the content to be appearing. In this
way the visitor gets some fresh news/information always. Moreover syndication is just one time
job, and you do not have to spend any maintenance time on it.

Discussion Boards
Discussion boards allow users to discus among themselves and with you. People can post their
questions and can expect the answers from other visitors. In this way people usually comes back to
your web site. Most people have something to say, whether good or bad, and many love to say it!
If your company sells products buyers can support each other using discussion forums. You can
also create topics about that can help your business and can collect various opinions.
Opinion Polls and surveys
you can create polls or surveys for your visitors to answer. Keep them simple and anonymous to
achieve a higher response. Your goal is to get as many responses as possible. Let your questions be
relevant and help your business.

Articles and tutorials


Write some specific articles related to your business. This can give you a great impact on your
visitors. People love to read. If you educate them freely with your tutorials and articles, they will
really remember your site, and will come back. There is a higher possibility that they may turn
back as potential customer. Moreover articles and other type of content that is relevant to your
business with proper keywords can help you to promote your sites with search engines and other
Industry specific Indexes.

Your own eZine


Ask your visitors to join in your eZine. Tell them the benefits of subscribing your news letter. Do
not forget to mention your "no spamming" Email policies. Write at least one informative
newsletter per month and send them. You can advertise there with your new product information
also.

OPTIMIZING WEB GRAPHICS

The secret of shrinking graphic file size is reduction of bit depth, resolution, and dimension while
preserving image quality. This classic size-versus-quality tradeoff is the key to the art and science
of graphics compression

Bit Depth Reduction

For palette-based indexed formats, such as GIF and PNG, the lower the bit depth, the smaller the
file. Lossy, full color RGB formats like JFIF, do not benefit from bit depth reduction as file size is
primarily related to quality.

A full-screen 640x480 24-bit color image requires 900K of disk space, enough to discourage even
the most bandwidth-enabled surfer. Even though the majority of Web users support 16-bit or
higher color depths older Macs and Windows PCs can display only 256 of these colors
simultaneously. Users viewing your full-color masterpiece on these 8-bit machines will see your
subtle color gradations as dithering bandits. One way to avoid these problems is to deliberately
work in a 256-color palette. At 256 colors this same graphic becomes a 300K TIFF, a factor of 1/3
(8/24 = 1/3).

Color Palettes

The two ways to store color raster images are indexed and RGB. Indexed formats are indexed, or
mapped to a 256-color (or less) lookup table (CLUT) or color palette. RGB formats, also known as
true color, use 8 bits (0 to 255) for each Red, Green, and Blue value to form a 24-bit pixel
(8+8+8=24) palette which can hold one of 16.7 million colors (2^24=16,777,216 colors). Some
formats support even higher bit depths, useful for medical imaging or smooth transparencies.

A CLUT is a digital version of a paint store's color-mixing chart: it contains 256 entries, each with
its own formula for a specific color. Indexed images refer to each color by its position in the
palette. Finding the right color palette that provides the best image quality on 8-bit machines is an
art form in itself, and can dramatically affect the appearance and size of your graphics.

Compression

Compression algorithms are used to re-encode data into more compact representations of the same
information. In other words, fewer words are used to say the same thing. For GIFs and PNGs, the
more linear change there is, the less efficient the compression.

With judicious reduction of colors and constant color areas a GIF can compress this raw 300K
image from 150K (256 colors dithered) to 90K using HVS Color (64-128 colors), a factor of 6:1 to
10:1. GIFs retain edge and sharpness information if there is no dithering. A JPEG can reduce this
900K 24-bit image to 45K (high quality) or 30K (medium quality), a factor of 20:1 to 30:1. With
JPEGs the more you compress, the more edge definition and sharpness you lose. Humans are
especially sensitive to edge sharpness, possibly a holdover from ancient man spying snakes on the
side of trees, so GIFs generally appear sharper than JPEGs. Other compression methods can yield
even higher compression ratios, but are currently proprietary.

Dithering

To display a full-color image on a 256-color computer, it must simulate colors it can't actually
display. The computer does this by dithering: combining pixels from its 256-color palette into
patterns that approximate other colors. At a distance the human eye merges these dithered patterns
into another color, but up close the image appears speckled. Dithering makes it harder to losslessly
compress images, as the compression algorithm used in GIFs [LZ84] relies on horizontal areas of
the same color. In order to avoid dithering, create images that use the colors specified in the
browser's default color palette.

The main characteristic that separates the GIF plug-ins is the quality of color reduction
(quantization algorithm). To test this I reduced the full-color balloon (try it yourself, it's available
as a stuffit file (57K), binhexed (79K) or TIFF/Zipped for PC users) to both 64 and 128 colors
using an adaptive palette. The 64 color image is admittedly an extreme example used to exaggerate
the quantization quality. Only HVS ColorGIF and ImageVice (see Compression for details on HVS
ColorGIF 2.0 which replaces HVS PhotoGIF) create an acceptable image at 64 colors. But add in
some dithering, and the banding smooths out (diffusion dithering works best here). Imageready
excels at small yet high quality reductions, check out the lossy/dithered 8.6K GIF below.

Two new entries, Macromedia's Fireworks, and Adobe's Imageready created smaller files at the
same bit depth than the others, and better banding than all but HVS and ImageVice. In addition to
an adaptive palette, Imageready 2.0 has a perceptive palette, that works similarly to HVS's
technology (though not as well). As you'd expect using Imageready's perceptive palette produced
images with less noticeable banding than the adaptive palette. To test color remapping quality I
reduced the image to 128 colors of the Netscape 216-color palette at the default dithering settings.

Optimizing Graphics for the Web

The key to graphics optimization lies in the ideal median between image quality and file size. To
balance these two, you must consider several important characteristics of digital images that can be
altered with the help of image manipulation programs like Adobe Photoshop. This guide will help
you choose an appropriate format for your image and then explain how to compress that image
into a smaller file.

JPEG v. GIF

When preparing images for the web, it is essential to choose an appropriate format for your file.
Currently, the two principal formats used for web graphics are JPEG and GIF. Determining which
format to use depends on the characteristics of the image. Both JPEG and GIF compress file size,
but each is suited for different types of images. JPEG is designed for compressing either full-color
or gray-scale images of natural, real-world scenes. It works well on photographs, naturalistic
artwork, and similar material that contains highlights, shaded areas and shadows. In contrast, GIF
is best suited for images with only a few distinct colors, such as line drawings, text, and simple
cartoons.

Working with JPEGs

JPEG (Joint Photographic Experts Group) uses a lossy compression technique (meaning it discards
some data), which changes the original image by removing color information during the
conversion process. In theory, JPEG was designed so that changes made to the original during
compression would not be visible to the human eye. Most imaging applications let you control the
amount of lossy compression performed on an image.

Saving a JPEG

1. Using Adobe Photoshop, open the image file.


2. Click on File and Choose Save As.
3. Select JPEG as the file type, name the file (filename.jpg) and click Save.
4. Image quality can be selected in three ways: typing a number between 1 - 10 in the Quality
box, selecting Low, Medium, High or Maximum from the drop-down menu, or by moving
the slider bar. Select a quality level for the image and click OK.

Working with GIFs

The GIF (Graphics Interchange Format) format uses an LZW compression scheme (the same as
Stuffit and PKZip) which does not change the quality of the image. Instead, it uses an index color
palette which may degrade the color quality of your image, but effectively cuts the size of an RGB
image by two-thirds. The GIF format also allows you to assign one color in the index color palette
to be transparent.

Saving a GIF

1. Using Adobe Photoshop, open the image file.


2. The image might be in RGB mode. To save the file as a GIF, it must be in Indexed Color.
Select Image from the top menu bar, then choose Mode > Indexed Color. Say OK to
flatten the image.
3. Leave the palette as Exact, and click OK.
4. Click on File and choose Save As. Change the file type to Compuserve GIF, name the file
(filename.gif) and click OK.
5. Choose Normal rather than Interlaced, and Click OK.
Creating a Transparent GIF

1. Using Adobe Photoshop, open the file airplane.psd. In the Picchi Center, this
image is in the folder c:\workshops\optimize. If you're not in the Picchi Center
and need to download the file, go to the images directory, right-click on
airplane.psd and save it to your disk.

2. The file is currently in RGB mode. In order to convert the file to a GIF, you must
first change it to indexed color mode. Select Image from the top menu bar, then
choose Mode > Indexed Color. Say OK to flatten the image.

3. Choose Exact Palette, and click OK.

4. Next, select File from the top menu bar.

5. Choose Export > GIF89a Export

6. The cursor is now in the shape of a dropper. We will use the dropper to select the
colors of the image we want to turn transparent. Check the Transparency Preview
Color - it should be gray - this is the color that will be transparent in your image.
Using the dropper, click anywhere in the white background. The background turns
gray, indicating that the entire background is now transparent.

7. There still appears to be some lighter color pixels around the airplane. To get rid
of these, click on the lightest color gray next to the white box on the bottom
portion of the Export Options screen. This is an alternative way of choosing the
colors to be turned transparent. If you choose the wrong color, re-click on it while
holding the "CTRL" key down.

8. Click OK.

9. Save the file as airplane.gif. If you open the image in Adobe Photoshop, the
background will appear gray. However, if you put it on your webpage, the
background will be transparent. Open airplane.htm in your browser to see the
results.

Color Palettes

To display a full-color image on a 256-color computer, an application must simulate colors it can't
actually display. The computer does this by dithering: combining pixels from its 256-color palette
into patterns that approximate other colors. At a distance the human eye merges these dithered
patterns into another color, but up close the image appears speckled. Because different operating
systems and applications build color palettes according to their particular needs, color variance
arises when moving across platforms and programs. You should prepare for the fact that visitors to
your website will be using different systems with various color settings.
There is, in fact, no one universal 8-bit palette that will not dither on all platforms. However, there
is a 216-color palette that will not dither on most. The web-safe palette (or browser-safe palette)
consists of 216 colors that display the same on both Macintosh and PC operating systems. These
colors will also display the same on PC systems using a low color depth. By using the web-safe
palette you will ensure that the graphics you create look the same no matter what system or
browser the viewer is using. When displaying graphics created with non web-safe palettes, the
browser tries to approximate the color through dithering. This may work fine for some graphics,
but will often produce results far from what you intended.

Web-safe colors should be used for creating images with large blocks of solid color. Photographs
should not be remapped to web-safe color, as they will take on a blocky appearance.

Choosing a web-safe palette in


Adobe Photoshop

1. Open Adobe Photoshop

2. Click on the Swatches tab of the floating palette for Color, Swatches, Brushes

3. Click on the arrow in the upper right, on the same line as the Swatches tab.

4. Choose Replace Swatches. (Note: "Load Swatches" will just add the new palette
to the end of the current palette, without indicating which palette is which).

5. Open the Color Palettes folder: c:\program files\adobe\photoshop


5.0\goodies\color palettes

6. Choose the file Web Safe Colors.aco, and click Load.

A web-safe color palette is now loaded.

GIF Cruncher and JPEG Cruncher

Free on-line tools for compressing GIFs and JPEGS are available at www.gifcruncher.com and
www.jpegcruncher.com. These tools are very useful for automatically reducing file size and
comparing different levels of quality. Each tool will return several versions of your image, ranging
from high quality and large file size, to low quality and low file size. Choose the file which best
suits your needs, and save it to your disk.

Using GifCruncher

1. Go to www.gifcruncher.com
2. Scroll down to "Browse to select a GIF from your hard drive."
3. Click on browse, and select textile.gif from the folder c:\workshops\optimize. If
you're not in the Gelardin Center Center and would like to download the file, go
to the images directory, right-click on textile.gif and save it to your disk.
4. Click on crunch, and wait. Sometimes this takes a minute or two.
5. Several versions of the image will appear, starting with the original down to 2
colors. File sizes and download times are shown for each image, in addition to the
number of colors and amount of dithering. (Remember, dithering is used to
simulate non web-safe colors from web-safe ones).
6. Select the image you think looks the best, and right click on it. Save the file to
your disk.

PEER-TO-PEER

A peer-to-peer based network. A server based network. (Not peer-to-peer).

A peer-to-peer (or "P2P", or, rarely, "PtP") computer network exploits diverse connectivity
between participants in a network and the cumulative bandwidth of network participants rather
than conventional centralized resources where a relatively low number of servers provide the core
value to a service or application. Peer-to-peer networks are typically used for connecting nodes via
largely ad hoc connections. Such networks are useful for many purposes. Sharing content files (see
file sharing) containing audio, video, data or anything in digital format is very common, and
realtime data, such as telephony traffic, is also passed using P2P technology.

A pure peer-to-peer network does not have the notion of clients or servers, but only equal peer
nodes that simultaneously function as both "clients" and "servers" to the other nodes on the
network. This model of network arrangement differs from the client-server model where
communication is usually to and from a central server. A typical example for a non peer-to-peer
file transfer is an FTP server where the client and server programs are quite distinct, and the clients
initiate the download/uploads and the servers react to and satisfy these requests.

The earliest peer-to-peer network in widespread use was the Usenet news server system, in which
peers communicated with one another to propagate Usenet news articles over the entire Usenet
network. Particularly in the earlier days of Usenet, UUCP was used to extend even beyond the
Internet. However, the news server system also acted in a client-server form when individual users
accessed a local news server to read and post articles. The same consideration applies to SMTP
email in the sense that the core email relaying network of Mail transfer agents is a peer-to-peer
network while the periphery of Mail user agents and their direct connections is client server.

Some networks and channels such as Napster, OpenNAP and IRC server channels use a client-
server structure for some tasks (e.g. searching) and a peer-to-peer structure for others. Networks
such as Gnutella or Freenet use a peer-to-peer structure for all purposes, and are sometimes
referred to as true peer-to-peer networks, although Gnutella is greatly facilitated by directory
servers that inform peers of the network addresses of other peers.

Peer-to-peer architecture embodies one of the key technical concepts of the internet, described in
the first internet Request for Comments, RFC 1, "Host Software" dated 7 April 1969. More
recently, the concept has achieved recognition in the general public in the context of the absence of
central indexing servers in architectures used for exchanging multimedia files.

The concept of peer to peer is increasingly evolving to an expanded usage as the relational
dynamic active in distributed networks, i.e. not just computer to computer, but human to human.
Yochai Benkler has coined the term "commons-based peer production" to denote collaborative
projects such as free software. Associated with peer production are the concept of peer governance
(referring to the manner in which peer production projects are managed) and peer property
(referring to the new type of licenses which recognize individual authorship but not exclusive
property rights, such as the GNU General Public License and the Creative Commons License.

Classifications of peer-to-peer networks

Peer-to-peer networks can be classified by what they can be used for:

• file sharing
• telephony
• media streaming (radio, video)
• discussion forums

Other classification of peer-to-peer networks is according to their degree of centralization.

In 'pure' peer-to-peer networks:

• Peers act as equals, merging the roles of clients and server


• There is no central server managing the network
• There is no central router

Some examples of pure peer-to-peer application layer networks designed for file sharing are
Gnutella and Freenet.

There also exist countless hybrid peer-to-peer systems:

• Has a central server that keeps information on peers and responds to requests for that
information.
• Peers are responsible for hosting available resources (as the central server does not have
them), for letting the central server know what resources they want to share, and for
making its shareable resources available to peers that request it.
• Route terminals are used addresses, which are referenced by a set of indices to obtain an
absolute address.

e.g.

• Centralized P2P network such as Napster


• Decentralized P2P network such as KaZaA
• Structured P2P network such as CAN
• Unstructured P2P network such as Gnutella
• Hybrid P2P network (Centralized and Decentralized) such as JXTA, GreenTea and Shwup

Advantages of peer-to-peer networks

An important goal in peer-to-peer networks is that all clients provide resources, including
bandwidth, storage space, and computing power. Thus, as nodes arrive and demand on the system
increases, the total capacity of the system also increases. This is not true of a client-server
architecture with a fixed set of servers, in which adding more clients could mean slower data
transfer for all users.

The distributed nature of peer-to-peer networks also increases robustness in case of failures by
replicating data over multiple peers, and -- in pure P2P systems -- by enabling peers to find the
data without relying on a centralized index server. In the latter case, there is no single point of
failure in the system.

When the term peer-to-peer was used to describe the Napster network, it implied that the peer
protocol was important, but, in reality, the great achievement of Napster was the empowerment of
the peers (i.e., the fringes of the network) in association with a central index, which made it fast
and efficient to locate available content. The peer protocol was just a common way to achieve this.

While the original Napster network was a P2P network the newest version of Napster has no
connection to P2P networking at all. The modern day version of Napster is a subscription based
service which allows you to download music files legally.

Computer science perspective

Technically, a completely pure peer-to-peer application must implement only peering protocols
that do not recognize the concepts of "server" and "client". Such pure peer applications and
networks are rare. Most networks and applications described as peer-to-peer actually contain or
rely on some non-peer elements, such as DNS. Also, real world applications often use multiple
protocols and act as client, server, and peer simultaneously, or over time. Completely decentralized
networks of peers have been in use for many years: two examples are Usenet (1979) and FidoNet
(1984).

Many P2P systems use stronger peers (super-peers, super-nodes) as servers and client-peers are
connected in a star-like fashion to a single super-peer.

Sun added classes to the Java technology to speed the development of peer-to-peer applications
quickly in the late 1990s so that developers could build decentralized real time chat applets and
applications before Instant Messaging networks were popular. This effort is now being continued
with the JXTA project.

Peer-to-peer systems and applications have attracted a great deal of attention from computer
science research; some prominent research projects include the Chord project, the PAST storage
utility, the P-Grid, a self-organized and emerging overlay network and the CoopNet content
distribution system (see below for external links related to these projects).

Application of P2P Network outside Computer Science

• Bioinformatics: Peer-to-peer networks have also begun to attract attention from scientists in
other disciplines, especially those that deal with large datasets such as bioinformatics. P2P
networks can be used to run large programs designed to carry out tests to identify drug
candidates. The first such program was begun in 2001 the Centre for Computational Drug
Discovery at Oxford University in cooperation with the National Foundation for Cancer
Research. There are now several similar programs running under the auspices of the United
Devices Cancer Research Project. On a smaller scale, a self-administered program for
computational biologists to run and compare various bioinformatics software is available
from Chinook. Tranche is an open-source set of software tools for setting up and
administrating a decentralized network. It was developed to solve the bioinformatics data
sharing problem in a secure and scalable fashion.

• Academic Search engine: The sciencenet peer2peer search engine provides a free and open
search engine for scientific knowledge. sciencenet is based on yacy technology.
Universities / research institutes can download the free java software and contribute with
their own peer(s) to the global network. Liebel-Lab @ Karlsruhe institute of technology
KIT.

• Education and Academic: Due to the fast distribution and large storage space features,
many organizations are trying to apply P2P network for educational and academic
purposes. For instance, Pennsylvania State University, MIT and Simon Fraser University
are carrying on a project called LionShare designed for facilitating file sharing among
educational institutions globally.

• Military: The U.S. Department of Defense has already started research topic on P2P
network as part of its modern network war. In November, 2001, Colonel Robert Wardell
from the Pentagon told a group of peer-to-peer software engineers at a tech conference in
Washington, DC: "You have to empower the fringes if you are going to... be able to make
decisions faster than the bad guy".[1] Wardell indicated he was looking for peer-to-peer
experts to join his engineering effort. In May, 2003 Dr. Tether. Director of Defense
Advanced Research Project Agency testified that U.S. Military is using P2P network. Due
to security reasons, details are kept confidential.

• Business: P2P network has already been used in business areas, but it is still at the
beginning line. Currently, Kato et al’s studies indicate over 200 companies with
approximately $400 million USD are investing in P2P network. Besides File Sharing,
companies are also interested in Distributing Computing, Content Distribution, e-market
place, Distributed Search engines, Groupware and Office Automation via P2P network.
There are several reasons why companies prefer P2P sometimes such as: Real-time
collaboration, a server cannot manage with increasing volume of contents, a process
requires strong computing power, a process needs high-speed communications etc. At the
same time, P2P is not fully used as it still confronts a lot of security issues.

• TV: One of the first applications of P2P in this area is Joost, which is expected to deliver
(relay) near-TV resolution images.

• Telecommunication: Nowadays, people are not just satisfied with “can hear a person from
another side of the earth”, instead, the demands of clearer voice in real-time are increasing
globally. Just like the TV network, there are already cables built. It’s not very likely for
companies to change all the cables. Many of them turn to use internet, more specifically,
P2P network. For instance, Skype, one of the most widely used phone software is using
P2P technology. Furthermore, many research organizations are trying to apply P2P network
on cellular network.
Attacks on peer-to-peer networks

Many peer-to-peer networks are under constant attack by people with a variety of motives.

Examples include:

• poisoning attacks (e.g. providing files whose contents are different from the description)
• polluting attacks (e.g. inserting "bad" chunks/packets into an otherwise valid file on the
network)
• freeloaders (Sometimes known as 'Leechers') (users or software that make use of the
network without contributing resources to it)
• insertion of viruses to carried data (e.g. downloaded or carried files may be infected with
viruses or other malware)
• malware in the peer-to-peer network software itself (e.g. distributed software may contain
spyware)
• denial of service attacks (attacks that may make the network run very slowly or break
completely)
• filtering (network operators may attempt to prevent peer-to-peer network data from being
carried)
• identity attacks (e.g. tracking down the users of the network and harassing or legally
attacking them)
• spamming (e.g. sending unsolicited information across the network- not necessarily as a
denial of service attack)

Most attacks can be defeated or controlled by careful design of the peer-to-peer network and
through the use of encryption. P2P network defense is in fact closely related to the "Byzantine
Generals Problem". However, almost any network will fail when the majority of the peers are
trying to damage it, and many protocols may be rendered impotent by far fewer numbers.

Security

Anonymity

Some peer-to-peer protocols (such as Freenet) attempt to hide the identity of network users by
passing all traffic through intermediate nodes.

Encryption

Some peer-to-peer networks encrypt the traffic flows between peers.

This may help to:

• make it harder for an ISP to detect that peer-to-peer technology is being used (as some
artificially limit bandwidth)
• hide the contents of the file from eavesdroppers
• impede efforts towards law enforcement or censorship of certain kinds of material
• authenticate users and prevent 'man in the middle' attacks on protocols
• aid in maintaining anonymity
Applications of peer-to-peer networks

• File sharing (using application layer protocols as BitTorrent )


• VOIP ( using application layer protocols as SIP )
• Streaming media
• Instant messaging
• Software publication and distribution
• Media publication and distribution (radio, video)

WEB AUDIO FILES

Introduction
This is a guide to the use of audio files in your web pages. It explains the most common file types
and their uses, it explains how to code audio links in your pages, it lists major sources of audio
files and clips, and it gives you brief copyright guidance as to what you can and should do with
audio files.

Equipment Requirements for Audio


Although most computers come with a built-in speaker, it is of low quality, and audio files will
generally not play through it. To play music quality sound files, it requires a sound card and
speakers attached to the card. Many notebooks now come with a built-in sound card and small
speakers in the notebook, which can be supplemented with plug-in external speakers. Computers
sold as multimedia machines usually come with a sound card and speakers included in the price.
The earliest sound cards were labelled 8-bit. Then came higher quality 16-bit cards, which refers to
the capability to produce high quality, wide audio bandwidth sound. The terminology is confused
by new cards with 32 and 64 in their name, which refer to 32-voice and 64-voice synthesizers.
Probably the best known maker of sound cards is Creative Labs, maker of SoundBlaster cards.

Audio File Types


Sound files, by their nature are quite large. Types that must fully load before they can play can
cause long waits across dial-up speed lines. Most types of sound files are based on taking very
frequent samples of the complex sound waves and digitally recreating those sound waves during
playback. The faster the sampling, the higher the quality of sound, but the larger the file. Low
quality files are typically sampled 11,000 times per second. Medium quality is sampled 22,000
times per second, and high quality is 44,000 times per second. The low quality is akin to telephone
sound, and not very good for listening to music. The high quality is similar to FM radio. File sizes
may be reduced somewhat by compression techniques.

The earliest types on the Internet, first used with unix computers, use the .au and .snd extensions.
These are apt to be the largest files for a given length of audio. Later sound files use the extensions
.ai, .aif, .mp2 or .mp3, and .wav. Most modern browsers either have the capability to play these
built in to the software or can play them with plug-in software, readily available from Netscape or
Microsoft.

If your modem and connection are fast enough, it is possible under good conditions to feed a low
to medium quality signal to you fast enough to play in real time over a dial-up connection.
RealAudio was the first company to produce streaming audio files and broadcast of live events.
These files have the .ra extension, and require you to download the RealAudio or RealPlayer
software(the latter combines a streaming video capability, too) from the RealAudio site or buy it in
a store. There are other forms of streaming audio appearing now, too, such as the audio
components for QuickTime, Shockwave, and Streamworks.

MIDI, another type of sound file uses a resident library of instrumental sounds from your sound
card. This technique is called wave table synthesis. The files, instead of reproducing sound waves
based on sampling, feed information to the software and sound card on pitch, duration, instrument
or type of sound, and other technical characteristics of the sound. The card pulls the prerecorded
instrumental sounds from its wave table. These files can be much smaller than those based on
sampling, even with many instruments. If your sound card supports MIDI (Musical Instrument
Digital Interface) files (with the .mid extension), you can play MIDI files. Quality may vary
greatly, depending on the sound card and you can hear very different sounds from different
computers. At its best, it can be very, very good. At its worst, it is horrible. It is very popular,
though, and large libraries have been built up of MIDI files. See Sources below. MIDI, as an audio
standard for musicians, can be used with keyboards and synthesizers independent of computer
systems, too.

Check to see if your system is set up to play each of the types below by clicking on them:

• AI, AIF. No examples available. Check back soon. Try this test page.
• AU
• MIDI
• MP2, MP3. No examples readily available. Try MP3.com for some clips.
• RA. This connects with the RealPlayer site.
• SND. No examples readily available.
• WAV

Coding Sound in HTML


The simplest way to call a sound file is to simply put a link to the file. Depending on your browser
and configuration, it will either invoke your operating system's basic player software, player
support built into the browser, or a plug-in that provides the player capability. If you want to
control what plug-in is used to play the sound file, you need a more sophisticated call. As an
example of the simplest format, the line of HTML code below will call up the file mysong.mid
from the current directory with any browser. Note that you can play any sound file with this
command format, not just MIDI files:

<a href="mysong.mid"> Play My Song </a>

It is also possible to embed a file into the html code for a page so that it will play in the
background. Netscape introduced the EMBED tag and Microsoft the BGSOUND. With the newer
browsers, both commands can be used and each browser will ignore the other's command. The
examples shown here use MIDI files, but you can substitute other file types with the same results.
Here are the paired commands to call a MIDI file. In the first example, the Netscape EMBED call
forces the use of the Crescendo MIDI player plug-in. The second example allows any MIDI player
to take effect instead of the Crescendo. The companion MSIE BGSOUND call does not
specifically call Crescendo.
Example 1:
<EMBED TYPE="music/crescendo" SONG="mysong.mid" HEIGHT=16 WIDTH=16
AUTOSTART=true LOOP=false> <BGSOUND SRC="mysong.mid" LOOP=1>

Example 2:
<EMBED SRC="mysong.mid" AUTOSTART=true LOOP=false> <BGSOUND SRC="mysong.mid"
LOOP=1>

Notice that both EMBED and BGSOUND include a LOOP parameter. Set to "false" and "1"
respectively, the file does not repeat. Set to "true" and "-1" or "INFINITE", it repeats endlessly
until the page is abandoned or the music turned off. BGSOUND also permits a specific number of
repetitions.

The most widely used file types (formats) for audio and video on the web are:

MPEG3, audio only


.mp3
cross-platform
PC only, audio only
.wav
played by MS Windows integral sound system
QuickTime
.mov audio or video
cross-platform
RealPlayer
.rp, .rm audio or video
cross-platform
Windows Media Player, claims to be cross-platform
.wmp but in some cases, PC only

WEB PAGE EDITORS

Looking for a better editor (or perhaps even your first editor) to design your website? This page
lists free HTML editors, Web editors, WYSIWYG editors, web site builders, as well as specialized
editors optimized for Cascading Style Sheets (CSS) or even the numerous web scripting languages
such as PHP, Perl, Java, JavaScript, ASP, etc.

The editors are separated into two sections: the WYSIWYG Web Editors / Site Builders allow you
to design your website using a What You See Is What You Get interface - somewhat like a
wordprocessor where you can see what your page will look like (mostly) as you type; and Site
Builders that allow you to design your site from pre-packaged templates (and sometimes also
allowing you a WYSIWYG interface to change elements from that tempate).

The other section lists the Free HTML Editors / Free PHP/Perl/JavaScript (etc) Editors which are
basically ASCII text editors with additional features that make it easier for you to code pages for
the web. Very often, this includes syntax highlighting for the HTML/CSS elements (and perhaps
also for PHP, Perl, JavaScript, ASP, Java elements as well). If you write your pages using raw
HTML, or if you plan to learn to write HTML, these are the editors you will want to check. You
may also want to look at the Free Programming Editors and ASCII Text Editors page, which lists
more editors that can be used to edit / create HTML web pages. My decision of whether to put an
editor on that page or this page is sometimes arbitrary, so it's best to look at both pages to see if
you can find what you want there.

If you are looking for a commercial web editor, which includes both the ability to edit using a
WYSIWYG interface as well as edit "raw HTML" code, produce valid CSS and HTML code and
supports Web 2.0 technologies like AJAX, one well-known and well-loved web editor is Adobe
Dreamweaver Creative Suite 3 (see my Dreamweaver tutorial if you're getting this). Another up-
and-coming commercial web editor is Microsoft's successor to FrontPage known as Microsoft
Expression Web Professional.

Free HTML Editors / ASCII Text Web Editors


Notetab Light

This is the freeware sibling of the commercial Standard and Pro versions. It is a general
text editor that has lots of features, including a useful "Clipbook" facility that has numerous
HTML editing conveniences. Its commercial cousin Notepad Pro comes with syntax
highlighting. (Note: to get Notetab Light, click the Products link.)

HAPedit (HTML ASP PHP Editor)

HAPedit is useful for people who develop both dynamic and static web pages. It provides
syntax highlighting for HTML, ASP, PHP, JavaScript; provides a project manager; features
code completion, an SQL console, FTP manager, PHP code "compilation", integrated PHP
help, brace matching, search and replace with regular expressions, statistics on your page
(ie, rendered size, images, links, etc), and so on. This is a Windows program.

Notepad++

Notepad++ is a source code text editor with syntax highlighting (C, C++, Java, C#, HTML,
PHP, JavaScript, ASP, SQL, Objective-C, etc), multiple document handling using tabs,
auto-completion of keywords (customizable), regular expressions in the search and replace
function, macro recording and playback, brace and indent highlighting, collapsing and
expanding of sections of code (to zoom in and out of pieces of code such as to provide an
outline overview of your text/code), etc.

PSPad

PSPad is a full featured text editor that you can use to edit HTML, PHP, Perl, JavaScript, C,
etc. It even has built-in facilities allowing you to edit binary files. There is project support,
the ability to directly edit files via FTP on your server, a macro recorder, search and replace
in files, text comparison (differences between two files with the differences highlighted in
colour), syntax highlighting, spell checking, internal HTML preview using IE and Mozilla,
integrated HTML TIDY (for validating HTML code and fixing them), code explorer for
Pascal, HTML, PHP, XML (etc), matched bracket highlighting, etc.

TSW WebCoder and WebPad


TSW WebCoder is a web editor that supports an internal preview of your page, built-in FTP
client, integration with HTML Tidy (see the Free HTML Validators page), integrated
validation, code libraries, CSS inspector, syntax colouring, multiple documents, etc.
WebPad, the other editor available on that site, is a lighter-weight editor that features
syntax highlighting, an FTP client, multiple documents, integrated HTML Tidy integration,
etc. It is targeted at people who want something more than Notepad but without the frills of
WebCoder.

Webniac

Webniac is a text editor for web page development. It has syntax highlighting for HTML,
CSS, Java, JavaScript, VBScript, PHP, SQL, Perl and XML. It includes some JavaScripts
which you can use on your site, a CSS generator, facilities for constructing tables, etc.

Quanta Plus Web Development Tool

Quanta Plus is a Linux HTML editor for KDE. It contains an assortment of features such as
syntax highlighting, easy configuration of toolbars, site uploading facility, the ability to
update a site from CVS (with a plugin), document structure tree, etc.

Matrix Y2K Freeware HTML Editor

Matrix Y2K is a HTML editor with support for multiple languages, multiple documents,
syntax highlighting, search and replace, character maps, links validator, internal preview of
your page, external preview (launches browser), image file browser, table wizard, forms
support and the ability for you to create a library of scripts.

Bluefish

From the announcement by one of their development team: "Bluefish is a programmer's


HTML editor, designed to save the experienced webmaster some keystrokes. It features a
multiple file editor, multiple toolbars, custom menus, image and thumbnail dialogs, open
from the web, CSS dialogs, PHP, SSI and RXML support, HTML validation and lots of
wizards." I've seen a lot of good things said about this editor by other webmasters. Bluefish
runs on Linux, FreeBSD, Solaris, Tru64/Alpha, NetBSD, OpenBSD, HP-UX and Mac
OSX.

HTML-Kit

This HTML text editor is intended for use by web developers, and comes with support for
writing HTML, XML and scripts. Among its features are internal preview of your web
pages (requires IE 4.x and above to be installed), integration with HTML Tidy (a HTML
and CSS validation program), auto-completion of keywords, etc. HTML-Kit can be
extended using plugins, and runs on Windows 95, 98, NT and 2000.

EZPad
This HTML editor provides the usual facility to edit and create HTML files in a convenient
tabbed interface. It comes with an assortment of wizards that allow you to quickly create
specific HTML features like forms, tables, etc.

Arachnophilia

This editor comes with built-in FTP facility, making it possible for you to author your web
page and publish it without leaving the editor. It has a spell-checker, an internal browser
view mode that is able to show your HTML changes as you type, a global search and
replace facility across all open documents, built-in tutorial on HTML, JavaScript, frames;
etc. There are apparently two versions available - the older one runs on Windows systems,
the newer one is written in Java and is apparently cross-platform.

Web-O-Rama

An editor that supports a host of features useful for HTML editing yet has an uncluttered
interface. It is free for non-commercial use.

Free WYSIWYG Web Editors and Website Builders


KompoZer - Easy Web Authoring

KompoZer is a WYSIWYG web editor that allows you to build websites in an easy way. It
is essentially an updated version of Nvu with bug fixes. You can learn how to create a
website using KompoZer with thesitewizard.com's tutorial How to Design and Publish
Your Website with KompoZer.

Nvu - Complete Web Authoring System

Nvu is a WYSIWYG editor that is designed to make the creation of web sites as easy for
novices as it is using commercial web editors like DreamWeaver. It is based on the Mozilla
Composer web editor (see elsewhere on this page) and includes new features that will
eventually make its way back into Mozilla Composer. This open source editor is available
for Linux and Windows. You can find a tutorial on How to Design and Publish Your
Website with Nvu on thesitewizard.com. There is also a longer review of Nvu available.

SeaMonkey Composer (Mozilla Composer)

Seamonkey, the web browser suite from Mozilla, comes with a WYSIWYG web editor that
allows you to quickly code web pages using a wordprocessor-like interface. For more
information, please read the detailed review of the Mozilla Composer on
thesitewizard.com. You can also find a comprehensive tutorial on How to Design and
Publish Your Website with Mozilla Composer there.

Trellian WebPAGE :

Trellian WebPAGE is a free WYSIWYG web editor with a drag and drop interface, a
preview screen that allows you to see your page under three common screen widths (640,
800 and 1024), built-in FTP uploader, table creation wizard, form creation tool, etc. It also
has a syntax highlighting HTML editor for people who may want to switch to the HTML
mode for some fine tuning.
Amaya Web Browsing and Authoring

Amaya is an open source browser and WYSIWYG web authoring environment that
purports to allow its users to develop web pages without knowing anything about HTML or
CSS. You can create your pages, view them, and upload them to your website using this
software. It supports CSS (including CSS 2), HTML, XHTML, MathML 2.0 (which allows
you to browse and write web pages containing mathematical symbols), etc. There are
versions for Windows (a separate one for NT/2000/XP and 95/98/98SE/ME), Linux and
Sparc Solaris.

Netscape Composer

Netscape (yes, the browser) comes with an easy WYSIWYG web editor that allows you to
get started with your own web page quickly and easily. It supports the usual text and
graphics and is generally adequate for the beginning webmaster. To get it, simply download
the full Netscape package. Note that Netscape Composer is probably just a version of
Mozilla Composer (also listed on this page). For more information about Netscape
Composer see the detailed review of the Mozilla Composer on thesitewizard.com. You can
also find a comprehensive tutorial on How to Design and Publish Your Website with
Mozilla Composer there.

How to evaluate the web editors

Choosing a Web editor can be an easy decision or a hard one. There are so many choices out there,
that you may end up going with what the rest of your team uses just for convenience or perhaps
choosing solely on price. But I feel that it's important to choose a Web page editor that meets both
your needs and your budget. And these are the criteria I use to decide what makes a good editor or
a great one.

Price and Operating System

Sure, these are obvious - if you can't afford an editor or it won't run on your operating system, then
you shouldn't buy it or download it. But there is so much more to a high-quality Web page editor
than just the price or whether it runs on Mac OSX or not.

What Type of Editor Is It?

There are essentially three types of Web page editor:

• Text editors that let you edit the HTML tags directly, but not in a visual way.
• WYSIWYG editors that let you edit the Web page in a visual way, but not the HTML
directly.
• Combo editors that let you do either WYSIWYG or text depending upon your mood or
style.
What type of editor you choose is largely one of personal choice. In my evaluation, an editor that
offers both will get more points than one that is only WYSIWYG or only text. That way, if you
want to build your table visually but then code the attributes and styles by hand, you have that
option. See the links at the bottom of this article for more information on deciding between text
and WYSIWYG.

Whatever type of editor you have, in my book it needs to come with an HTML validator to get the
most points. HTML validators can save a lot of time and frustration in the long run, and if you
have one built into your Web editor you'll be more likely to use it. (Although, interestingly enough
I found the "validate as you go" option of Amaya to be a little disconcerting.)

Text editors should also come with color coding and tag completion. Some people don't like tag
completion, but I find that it's much easier to make a mistake like leaving off an end tag if the
editor doesn't do it for me. Perhaps this is just laziness on my part, but tag completion is critical to
my editing.

Managing Your Web Pages

Many of the more powerful Web editors come with site managers (sometimes called "projects").
Site managers allow you to keep all the files for one Web site together in one place, and the Web
editor then can manipulate them as a site rather than as individual files. One of the best ways that a
Web editor can manipulate the files is through FTP. Web editors with FTP built-in make it much
easier to get your files from your hard drive to the Web site.

Another way that Web editors help you manage files is through search and replace. This is an easy
way for most editors to receive points on my scale, but I have an extra score as well: extended
search and replace. This is where the Web editor can search a group of files (either open files or
files in a directory of a certain pattern or whatever) and do the same replace across all the files. If
you've ever had to update tens or hundreds of files with the same simple change (such as an
updated copyright date), you will understand how valuable this is. While there are other external
programs to do extended search and replace, Web editors that have it built-in get extra points on
my scale.

Images

No, I'm not talking about support for images - in fact, if a Web editor didn't allow you to put
images in your Web pages, I would take points away. Instead, I mean image manipulation and
connection to graphic software for extended manipulation. Some Web page editors provide limited
image editing right in the tool - things like cropping and resizing. And even if they don't, if they
can connect to outside image editors, this makes the Web editor more convenient to use.

CSS, JavaScript, and Special Characters

While you can write CSS styles in most editors these days, if it has embedded support like a style
library, CSS editor, and CSS validator, the Web editor will make writing CSS Web pages much
easier. JavaScript support is the same - however I don't know of any that offer JavaScript
validation, but many good ones have either libraries or other support for JavaScript.
Special characters are one of those things that many Web designers forget about. If you write in
English, it can be easy to assume that you'll never need to know the code for an accented character.
But what if you want to write "30¢"? Sure, you can spell out "cents", but having an editor that
writes ¢ for you without having to look it up somewhere else is really convenient.

Valid Templates

This is a personal peeve of mine. I think that Web page editors should strive to create the most
correct Web pages for you - even if you stay strictly in WYSIWYG. So I grant points for editors
that write valid XHTML by default or provide templates for HTML that include a DTD for a
modern HTML version. You shouldn't have to remember how to write a DTD.

Extra Conveniences

Other things I find useful in Web page editors are:

• The ability to connect to a database


• support for other languages like PHP, ASP, JSP, and ColdFusion (hopefully Ruby and/or
Python will show up soon)
• Spell checkers that ignore tags can be critical
• Pre-written scripts, code snippets, and templates can make a project go much faster -
especially if you can create your own
• Some editors provide other fun and silly options like a photo gallery maker

Customizability

The last thing I always look for in a Web page editor is how customizable it is. And I don't mean
that you can change how the toolbars look. Customizability means that you can add plugins or
extensions to add functionality. A simple Web editor can become very complex if it has extensions
or plugins to make it fit your needs exactly.

The Business Case for Editor Types

What Types of HTML Editors Are There?

The primary distinction between HTML editors is whether they are "WYSIWYG" (what you see is
what you get) or "Text" editors. WYSIWYG editors work a lot like a word processing program and
you edit your document generally how it will look when it is loaded to the Web site. Text editors
work more like programming engines and you edit your document directly in the HTML.

Once a Web team grows beyond two to three people, it's good to standardize on one piece of
software for developing Web pages. This insures that your entire team is working in the same
fashion and you'll have less compatibility issues later with uploading and file sharing.

But it can be very hard to decide what editor to choose for your Web team. This is especially true if
you have a mixed team of designers (who usually prefer WYSIWYG) and programmers (who
usually prefer text). Both camps will have very strong and often impassioned arguments as to why
their way is best, but are those arguments really a business case?

What is a Business Case?

A business case is a reasoned proposal for making a change at a company. Most businesses are run
based on the "bottom line" so in general, a business case defines how much money the company
will make through the change or how much they will save through the change. Personal opinions
are always valid, but don't hold a lot of sway in a business case, as they are often evaluated by the
finance department, high-level executives, and other MBA types.

So, when you're developing your proposal for a new HTML editor for your Web team, it's
important to go over the costs and do a risk versus reward assessment for choosing one type of
editor over another. In many situations, the company will want in the final proposal a clear plan for
exactly which editor to buy.

In this article, I'll leave that step up to you and your business. But I will go over some of the
suggestions for business cases for WYSIWYG editors and text editors and tell you which ones I
would have accepted as a Web development manager and MBA.

Benefits and Costs to WYSIWYG Editors

WYSIWYG editors allow staff with less training and IT skills to add content to their web pages.
This obviously saves money on training and allows existing staff, often the content owners, to
perform this task. (Leonie)

Leonie is quite correct here. In fact, this is one of the biggest benefits to WYSIWYG editors. It is
now quite possible for someone with no HTML experience to put up a good looking Web site
without ever even looking at the code.

The reduction in learning curve for many WYSIWYG editors makes them a very good choice for
small companies that don't want to have a dedicated Web team building and maintaining the Web
pages. You can save a lot of money in a small firm by using pre-made templates and maintaining
your Web site yourself. And a WYSIWYG editor makes that emminently possible. If you want to
have a more customized site, you can hire a designer to build the initial site and then use a
WYSIWYG editor to maintain it.

WYSIWYG is faster is a comment I hear all the time. But this isn't a business case for a
WYSIWYG editor, but rather for the designer/developer who knows how to use it quickly. I have
challenged WYSIWYG developers to races several times in the past and I can code similar pages
more quickly with a very simple text editor (vi). But that doesn't mean that everyone should switch
to vi, only that I'm a very fast developer with my preferred tools. I would not be able to build the
pages as quickly using Dreamweaver or another WYSIWYG tool

WYSIWYG writes bad code is another complaint about these tools. However, I don't feel that
argument stands up any longer. If you try the most modern versions of the best WYSIWYG editors
(Dreamweaver, GoLIve, and yes, even FrontPage) you'll find that most of the code that people
object to was put in there by designers who don't know how to use the tool. It's not the tool's fault
if you don't know how to streamline your pages or generate valid XHTML.

Benefits and Costs to Text Editors

Text editors are often cheaper than WYSIWYG editors. In fact, a lot of them are free. This is
because text editors don't require as much overhead to build. Also, because they rely on you
checking your pages in the browsers directly, they don't have to have any way to display how the
pages are going to look (although some do).

Text editors are included on every operating system - Notepad (Windows), TextEdit (Macintosh),
and vi (*nix). This means that you can edit Web pages on any Web server without needing any
expensive software.

Text editors require a lot more time to learn than WYSIWYG. You need to learn at least minimal
HTML to use a text editor, and if you're using an editor that isn't specifically designed for HTML,
you won't have features like tag completion and validation - so you have to know HTML and CSS
and JavaScript to build a complex Web page.

WEB SITE CONCEPT CREATION

Introduction: How to Create a Website

Before attempting to construct a website, it is important to have a good conceptual understanding


of what exactly a website is and how it is architected. By adhering to good architectural principals,
you will save yourself much website development effort and ongoing maintenance work.

Using simple graphics, this tutorial explains how web pages can be partitioned into reusable page
parts or page partitions in order to make the site aesthetically attractive, easier to navigate and less
onerous to maintain. It discusses web page components such as images, graphics, buttons and web
forms.

The diagram above illustrates the personal computer from which the website is built and the server
computer that will host the site. Connecting the two, is the World Wide Web or Internet: a series of
hundreds of thousands of computers (the circles), each connected to the global network (arrows)
and uniquely identified by an IP Address.
Web site concept creation is where the theory and ideas are built that drive a web site's themes and
functions. Effective concept creation integrates the expertise of all web site development team
members to assure quality across all aspects of site design. The process involves a series of
brainstorming and concept refinement sessions culminating into a cohesive set of ideas.

Concept Focal Points

• Information Architecture
• Theme/Masthead
• Creative elements
• Functional elements

Required Expertise
• Web Strategist
Facilitates concept creation sessions
• All Development Team Members
Concept creation resources

Activities
• Basic
Brief concept meeting
• Standard
Concept meetings, research
• In-Depth
Multiple Concept meetings, research

Web Site Strategic planning


Web Site Strategy

Web site strategic planning maps a path for maximizing the effectiveness of your web site.
Strategic planning directly impacts your web site's success as it forms the framework for how your
entire site is developed.

Web Strategic Planning Process


• Preliminary Planning
Create web site mission, objectives, and resource requirements to determine project scope.
• Needs Analysis
Develop requirements from a company, customer, and industry points of view.
• Concept Development
Specify site concepts to achieve requirements.

Required Expertise
• Web Strategist
Business exploration, facilitating, focus group design, survey design
• All Development Team Members
Concepts Creation

Activities, Time and Costs Estimates


• Basic: 1 Week, $1,000
Preliminary planning session, concept meeting, internal review, concept summary
• Standard: 1 Month, $10,000
Preliminary planning sessions, internal information gathering, secondary needs research,
concept meetings, concept research, internal review, surveys and/or focus group testing,
concept specification
• In-Depth: 4 Months, $50,000+
Preliminary planning sessions, internal information exploration, primary and secondary
needs research, concept meetings, concept research, internal reviews, in-depth surveys
and/or focus group testing, detailed concept specification

Web Site Development Team

The Web Site Development Team are the experts responsible for carrying out the various tasks
needed to create your site. The modern Internet is full of opportunities and pitfalls; proper team
selection is critical. The difference between a web site and a web site that gets results is the range
of expertise and synergy of the development team.

Web site development teams are built in many ways. You may only need to select a project
manager who will, in turn, build the rest of the team. Alternatively, you may have to research and
evaluate each resource yourself. There are three possibilities for effective team members:
• Qualified Internal Personnel
• Qualified External Consultants
• To-be-trained Internal Personnel

each with different pros and cons.


Core Team Members
• Project Manager
Responsible for coordinating personnel and tasks
• Web Strategist
Aligns business and web strategy
• Creative Lead
Manages graphics and multimedia design
• Copy Lead
Writes and edits site text
• Page Development Lead
Integrates site content into web pages
• Technical Lead
Manages programming and server/network development
• Marketing Strategist
Responsible for strategy, material development, and execution of site promtion

What is a Website?

A website is a series of related web pages that share a common domain name and are linked by a
series of hyperlinks. Websites can be built directly on a server or built on a personal computer and
"published" to a web server.

A "brochure" type website is one that displays static pages and does not require a web application
or web database.

A "data driven" website is one where the web pages are dynamically using created using data that
is stored in tables or files. The advantage of a data driven website is ease of maintenance.

TWO Alternative Approaches

There are two possible ways to create a website. They are:

1. Server based Website Creation Application (i.e. software provided by web host)
2. Client based Website Creation Application (i.e. software installed on PC)

Server based Web Creation Application

This option is simple, fast and inexpensive. There is no need to purchase or install software,
however, the resulting website is typically unsophisticated and non-interactive (i.e. "brochure
ware"). The website content is created and stored on the server computer.

1. Find a web hosting service that provides site creation software.


2. Use their web creator application on the server to design and generate your website.
3. Purchase a domain name and "point" it to your new website.

Client based Web Creation Application


This option is more complex and costly but the solution is more flexible, portable and functionally
rich than the first option.

1. Purchase and install web creation software on your computer


2. Create your website on your hard drive
3. Lease web hosting services for a web hosting company
4. Deploying your website to the web server
5. Access the server using your web browser, and configuring it if needed.

Construct a web site – simple and complex methods

When a website is created using a Website Creation application that is provided by a web hosting
company, the resulting website content is physically stored on the server computer. This implies
that if you decide to switch web hosting companies, it is not always easy to take your content with
you.

If you construct your website on your personal computer, you will need to publish it to a web
server before it can be made visible on the world wide web. Some HTML generators and website
construction applications have built-in functionality to copy the website content to a server
computer, however many do not.

FTP is a file transfer protocol that is used to transfer files from one computer to another. There are
many different FTP packages available. Most provide a user interface that lists the files on both
computers and allows the user to transfer individual files or entire websites between the personal
computer and the server computer.

How to copy a web site to a web browser

In addition to publishing to the website to the server, it is necessary to "point" the domain name
that you have purchased to that physical address. This is done by assigning primary and secondary
DNS names and DNS IP addresses to the domain name.

If, however, you construct your website using a website builder installed on your computer, the
web content is initially created and stored on your hard drive. You are able to navigate through the
website as if it were on the Internet, however it is only visible to you. Before it can be viewed by
the world, the website content must first be copied to the server computer.

Important role of a web browser

When creating websites, the web browser plays a very important role. The browser is the
application software that resides on a personal computer that interprets and displays the HTML
Code sent from the web server. Although Microsoft's Internet Explorer is the most widely used
web browser in North America, there are many other browsers available (e.g. Netscape Navigator,
Mozilla, Firefox, Opera and Safari).

Because each browser (and sometimes versions of browsers) renders web pages somewhat
differently, it is important to anticipate which ones will be used by your website visitors. You can
then create web pages that are optimized for those browsers. For example, if your target audience
is in China, you might want to optimize for Firefox. Normally, websites should be optimizes for a
recent version of Microsoft's Internet Explorer.

As you construct your website, it is important to test your web pages with different browsers. Once
your website is constructed and in production, the web server log will reveal which web browsers
are being used.

Example of Browser Data from a Web Server Log

MSIE 88.5 %
Msie 6.0 83 %
Msie 5.5 1.3 %
Msie 5.23 0.5 %
Msie 5.22 0.4 %
Msie 5.16 0.1 %
Msie 5.01 0.7 %
Msie 5.0 2.2 %
FIREFOX 1.3 %
Firefox 1.0.6 0.4 %
Firefox 1.0.4 0.6 %
Firefox 1.0.3 0%
Firefox 1.0 0.2 %
NETSCAPE 0.9 %
Netscape 7.2 0.8 %
Netscape 7.01 0%
Netscape 4.76 0%
Netscape 4.0 0%
Others 9%
Unknown 5.6 %
Mozilla 1.9 %
I-Mode phone (PDA/Phone browser) 1.1 %
Konqueror 0.1 %
LibWWW 0%
Safari 0%

In addition to the browser is used, it is important to optimize for the most widely used screen
resolutions (e.g. 800x600, 1024x768, and 1280x600).

Static web site

There are many types of websites that can be constructed. Most websites are simply brochure
ware that doesn’t require an underlying application system or database. Technically, these sites
consist of a static web pages, web parts, graphics, pictures, buttons etc. that can be sent by a web
server to a web browser when a page request is received. Such sites are easy to build and
inexpensive to operate, unless they change frequently.

Sometimes, more complex website are needed. For example, you might want to construct a
website that computes a monthly amortization schedules based on input fields provided on a web
form. This requirement can't be met by a web server alone. It requires program logic to take the
form fields provided by a visitor (e.g. principal amount, interest rate, payment frequency, payment
amount), calculate the amortization and display or print the schedule. In this example, however,
there is no need to authenticate users or store any data in a database. If there were, the complexity
would be even greater.

Dynamic Web site

A data driven website is a website that uses a database to store information that is captured during
an Internet session or a site that uses data from a database to dynamically assemble web pages
using live data from a database. Most, but not all data driven websites are "authenticated" sites.
An authenticated site requires that the visitors identify themselves using a login ID and password.
Examples of data driven sites include Amazon, Hotmail, and web banking websites. An example
of a simple data driven application is Newspaper-World.com.

It is much more complex to build a data driven website than a "brochure ware" website or a web-
application that doesn't require a database (e.g. an application to display amortization schedules).
Fortunately, there are web authoring tools now available that can help you generate simple data
driven sites using data from Access databases, spreadsheets, and XML data sources.

Você também pode gostar