 |
Interactivity on the Web
Ever since Marc Andreessen and Eric Bina added the <IMG> tag to
their Mosaic for X Windows browser in 1993, the Internet moved from text-based
to its current interactive experience. This probably more than anything
else contributed to the medium's current popularity.
For the longest time, we were restricted by bandwidth - the amount of
data that can be sent via a browser from one user to another. Even with
today's 56k modem (the current most popular bandwith modem), video and
sound can create a long download - and anything more than 30 seconds seems
like an eternity to many viewers.
Luckily, there are so many alternatives to slow bandwidth (and increasingly
more users taking advantage of them!) that pushing the envelope of current
web design can be achieved - and viewed - in a variety of ways. But it
is still advised that the you still be judicious in the addition of interactive
media to your site, and concentrate the majority within your inner pages.
Types of Media For the Web
Multimedia content in Web pages includes the use of plugins such as Flash
or Director, the inclusion of audio, video and 3D material in web pages,
and the use of streaming technology.
- Animated GIFs are cross-platform, fast-loading, does
not require a plug-in, and has great flexibility in the use of transparency.
A great background can appear through a well designed gif. Not truly
interactive, since it cannot in and of itself accept input, but you
can design a graphic that entices the viewer deeper within your site,
where you can then interact with the user.
- JAVA is a very powerful scripting language modeled
after C++. This code is versatile enough that an entire program can
be written that doesn't require a browser at all, and can run stand-alone.
An example of this is an applet (similar to animated GIFs).Java can
be run across multiple platforms and operating systems, but because
of the in-fighting of the "Java Wars" between Sun and Microsoft,
there have been complaints about the technology.Java is a client-side
script. It can use the browser's internal Java machine to access
built-in Java functions instead of embedding the function onto the page.
See Sun on the Java technology.
For tutorials and examples, see http://wdvl.internet.com/Multimedia/Java/
- JavaScript. Sun, working with Netscape, took a developing
script called LiveScript and made it more like Java, to run client-sided.
It is part of the code written into an HTML page, so runs right in the
Web page itself. It carries out a number of client-sided functions,
and I am always asking students for new bits of JavaScript code to add
to my collection. It is well worth your while to learn at least the
basics of JavaScript if you want to write better Web pages. JavaScript
does have its browser issues (for instance JavaScript 1.2 is not supported
within IE 4.0) and your use must be degradeable. Design with your viewer
in mind, and use only as it adds to your site, not just because you
can do it. And make sure the piece of script is written by a competent
programmer - you don't want to crash someone's system! Microsoft has
a similar script called JScript, and both programming languages use
a complex syntax like C/C++. Check out The
JavaScript Source for scripts you might use.
- VBScript. Visual Basic is a programming language
developed by Microsoft. It's more intuitive to use than JavaScript,
and doesn't have the case sensitivity that makes JavaScript more cumbersome
to write. It is the default language of ASP so is a great server-sided
script language for any servers running ASP. Because of its intuitive
code and excellent security, it was once referred as the "Java
Killer". However, it too is victim of the browser wars and can
only be used on IE v3.0 and higher. It is not supported in any Netscape
browser. Here's a VBScript tutorial you might enjoy: http://www.intranetjournal.com/corner/wrox/progref/vbt/index.html
- DHTML. Dynamic HTML extended HTML to overcome some
of the limitations in designing using strict HTML code. However, the
way the two major browsers choose to implement DHTML code differs and
causes problems in its use, even though it has been reviewed and recommended
for use by the World Wide Web Consortium (W3C).
- Internet Explorer
- version 4.0 or higher
- uses any tag on a page to accept a DHTML script
- you can dynamically alter the layout and content of your page
without going back to the server
- all code can reside within the one page
- Netscape 4.0
- Netscape is less consistent than IE in implementing DHTML.
- It's lack of versitility is due to a lack of the Document
Object Model (DOM) found in IE. The script can't access the
object (tag), but instead uses layers to achieve similar effect.
The idea behind DHTML is to allow script functions into every available
HTML tag. This is what conceptually moves HTML from a formatting script
to an actual programming-style language. Client-sided programming
like this gives all Web designers greater functionality and design possibilities.Try
this tutorial from Macromedia: Animating
layers in a timeline
- ActiveX. ActiveX is not a programming language, but
a hybrid of object-oriented programming that allows complete programs
to run inline. It needs a language like VBScript to render within a
browser.
- XML. This is Extensible Markup Language, a subset
of SGML. It is another method to markup documents. Verdict is still
out on how far it will be accepted by the design community. Acceptance
by browser developers and the W3C will determine its fate.
Plug-ins.
- To experience multimedia online, you'll need a computer equipped with
a sound and video card and special software programs called plug-ins.
A plug-in, also referred to as a player, extends the capabilities of
your web browser. Macromedia Shockwave - From the software program
Director, "shocked" movies can be created for viewing online,
or distributed via cd-roms (the original use in the game market.) Now
supports streaming audio and video, offering an extremely professional
development tool for creating online movies.Macromedia Flash -
Flash is a vector drawing program and a movie creation tool. For this
reason, it is quick to load, has adequate browser support, basic tools
can be quickly learned, and delivers a professional looking product
with relative ease. Downloadable video - By far, QuickTime is
the best example of this, although there is the AVI of Windows, and
MPEGs. QuickTime uses the .mov extension. QuickTime
is the multi-platform industry-standard multimedia architecture used
by software tool vendors and content creators to create and deliver
synchronized graphics, sound, video, text and music.
Embedded Sound.
- Digital audio files are digitized representations of sound waves,
and as such, they are still a strain to download for most users. Whenever
possible, minimizing the size of these files will make the viewer's
experience of your Web site a little more enjoyable. There are many
file formats currently available and they are identifiable by their
extensions. So which one should you use on your site? Depends on what
is your target audience, the available bandwidth, and the purpose of
the content.Most browsers can play standard digital audio files such
as AIFF (developed by Apple) and WAV (codeveloped by Microsoft and IBM).
In the early days of the Internet, these uncompressed files (along with
AU from the Unix time of Web development) were the only available formats
for playing audio. Current technologies easily decode MP3 and RealAudio,
and free players for these formats are available. To embed sound, try
http://wdvl.internet.com/Multimedia/Sound/
for a quick reference. If you are embedding sound, an MP3 is the only
way to go.
- MP3 - Is the file extension for MPEG, audio layer 3. Layer
3 is one of three coding schemes (layer 1, layer 2 and layer 3) for
the compression of audio signals. Layer 3 uses perceptual audio coding
and psychoacoustic compression to remove all superfluous information.
The result in real terms is layer 3 shrinks the original sound data
from a CD by a factor of 12 without sacrificing sound quality.
- Downloadable audio - AIFF (Apple sound file format), AU (Audio
sound file format for Unix and Sun, as well as PCs), AVI (Audio/Video
Interface for Windows 3.11 and Windows 95), MIDI (Musical Instrument
Digital Interface uses sound cards or dedicated MIDI processers to produce
orchestral-style sounds), MPEG (Motion Picture Experts Group, a platform-independent
audiovisual file format designed by an industry group), and WAV (Windows
Audio Format, or the audio portion of an AVI file). All of these require
a complete download before playing.
- Streaming audio - To deliver streaming audio, audio must be
converted into the streaming format (RA is the RealAudio file extension).
RealAudio offers an encoder to do this. These files are then put onto
a server equipped with User Datagram Protocol (UDP), other than the
usual TCP (Transmission Control Protocol) used by most Internet information
transfers.
- Webcasting or streaming
media. Simply said, you send the information directly to
the viewer without input from the viewer. If you are producing a live
Internet broadcast, you should use a streaming solution such as RealAudio,
QuickTime, or Windows Media. Although we can view streaming video,
it tends to still be choppy in appearance unless you're lucky enough
to have DSL. The Web
Developer's Virtual Library has a series of articles discussing
the use of streaming media.
- Web-based phones - Again using UDP and compression techniques,
the ability to have two-way conversations. Can be cheaper than the telephone,
but has the disadvantage of competing in network traffic.
- Live Delivery - In March 1992, the first audio cast internet
broadcast was made over MBone (Multicast Backbone - high speed Internet
line). The first video cast was in June. See
Microsoft's Multimedia On The Web.
|