Taking Your Talent to the Web- P25 ppsx

As mentioned earlier in this chapter, Java can be used to create full-scale programs applications, miniature programs that download quickly when needed applets, or server-side servlets..

time” or “movies” directory, and so on As described in Chapter 7, this makes

it easier to find pieces and write appropriate file references during the site’s creation and subsequent maintenance If for some reason you prefer to save your SSI files in a directory called “rosebud,” the reference would read:

<! #include virtual=”/rosebud/menu.inc” >

Now simply use that line of code in every HTML document where you for-merly had to cut and paste a heap of menu bar markup Then upload your HTML pages to the web server

Some folks use a different file extension, such as shtmlor shtm, if their HTML file contains an include, and some servers require this But if you can stick to the htmlfile extension, you’ll avoid confusion and heartache down the road

Why confusion and heartache? We knew you were going to ask For one thing, imagine that your static htmlpages have been bookmarked by vis-itors and search engines You then start changing your file extensions All

of a sudden, your internal and external links are broken, your visitors are confused, and the search engines that ranked you so highly are pointing to nonexistent pages

Are You Being Served?

You’ve replaced redundant markup with neat, clean includes What’s the next step? There probably isn’t one Most web servers natively support SSIs

If it doesn’t work right away, you might need to contact the company host-ing your site (or the network administrator if your company hosts its own sites) and ask that the configuration file be changed to permit SSIs Unless the hosting company hires trained monkeys as tech support, complying with your request will take two minutes

Of course, if you are sane, you will have made this phone call before

chang-ing all your HTML pages Or you will have created a test HTML page, uploaded it, and confirmed with your own eyes and mouse cursor that it works

More than one SSI can be put to use on each page You can replace the

“header,” the “footer,” or just about any piece of the puzzle Using SSI, you can replace all or nearly all of the dull, repetitive junk that holds web pages together

In turn, you can begin viewing HTML pages as content containers rather than tortuous masterpieces of visually oriented markup—because content containers are exactly what they are and were always intended to be This

might not be the true separation of style from content, but it will do until the real thing comes along

SSI can do many things besides what we’ve outlined here It can insert appropriate text, HTML, or CSS based on the user’s browser It can indicate when the page was last updated (<! #echo var=”LAST_MODIFIED” >), give the current date and time, and do other funky tricks

And, as we’ve said, SSI is the low end Imagine the possibilities if you begin

to work with more advanced server-side technologies

Advantages of SSI

If a site changes—or perhaps we should say when a site changes (for

instance, when a new section must be added to the menu bar)—the power

of SSI is revealed What was true for CSS is just as true for SSI: It is easier

to edit a single document (menu.inc) than it is to change hundreds or thousands

Hopefully, your client is not about to wantonly add new sections to the menu or demand changes to the appearance of the menu after the site is nearly built In a perfect world, you have followed the suggestions in Chap-ter 7, and the client has signed off (and paid part of your fee) at each stage

of completion Therefore, the client has a vested interest in following

through with the plan he committed to and paid for and has no vested

interest in pulling last-minute changes to prove that he is the dominant monkey in this rainforest

But clients are clients, and change happens SSI is a simple way of pro-tecting yourself from hours of tedious replacement tasks

Disadvantages of SSI Being a server-side technology, SSI eats up processing power from the server Every time a visitor hits a page containing a replaced SSI element, the markup describing that element must be fetched from the server—like

a stick in the jaws of a panting mastiff

If you’re building a professionally hosted site with plenty of server power

in reserve, such demands on the server are no problem If you’re hosting the site on your home computer and connected to your home cable modem, there could be a problem Given sufficient traffic, the toll on your PC might

be noticeable, and the site might “slow down” for your visitors during times

of peak traffic On the other hand, if you’re hosting an extremely popular site on your home computer, maybe it’s time to upgrade your server

If you are interested in server-side technologies, Jeff Veen’s The Art & Sci-ence of Web Design (New Riders: 2001) discusses the subject in more

detail—and using better words and stuff If you are uninterested in server-side technologies to the point of anxiety, you’ll be happy to know that we’ve finished discussing them

Now let’s look at a technology you will frequently encounter in your career but will never even contemplate programming yourself Let’s talk about Java First of all, what the heck is it?

COOKIN’ WITH JAVA Java is an object-oriented programming language developed by Sun Microsystems (http://www.sun.com/) primarily for the Web And just what, you ask, is an object-oriented programming language? An object-oriented language is one that reuses software objects the same way you might re-use custom shapes you’d created in Adobe Illustrator or a sales executive might reuse chunks of boilerplate text about “tremendous synergies, should our two companies work together.”

In Illustrator, you can recombine basic button shapes, spirals, or complex outlines to create new artwork from predesigned fragments Similarly, a Java programmer can combine entire libraries worth of coded objects to build new programs from existing parts Reusing graphic elements makes

you faster and more productive; reusing code objects does the same thing

for Java programmers

Reusable parts: that’s the idea Sun’s programmers called these parts

objects Sun didn’t invent this idea Windows, Mac OS, and UNIX also reuse

code objects (Windows DLLs, anyone?) But in operating systems like Win-dows, Mac OS, and UNIX, these reusable parts are immediately compiled down to machine code In Java, they are compiled to an intermediary for-mat called “bytecode,” which is then interpreted by a Java Virtual Machine, about which we’ll have more to say in just a moment

As mentioned earlier in this chapter, Java can be used to create full-scale programs (applications), miniature programs that download quickly when

needed (applets), or server-side servlets Servlets are full-fledged but small

application fragments that run in the context of the server—as Photoshop plug-ins run in the context of Photoshop

Ghost in the Virtual Machine But there’s a catch Just as Windows programs require a Windows envi-ronment and Mac programs are designed for Macs, Java programs must run

in a Java environment

Does this mean that you have to go out and buy a Java computer? No, it simply means that Java programs are designed to run in Java-capable web browsers (Netscape Navigator, Microsoft Internet Explorer), Java-capable web-enabled devices, or special Java devices (such as Java-powered digi-tal television-top boxes and remotes) They do this by means of Java Vir-tual Machines, which we promise, really truly promise, we will describe in just a moment

Netscape was the first browser to support Java, and the point of the Sun/Netscape partnership, as explained in Chapter 2, was to smash Win-dows hegemony while getting Java onto as many platforms as possible, by way of the browser They succeeded at getting Java onto as many platforms

as possible One out of two ain’t bad

Today most browsers and computer operating systems support Java It gets

a bit more complicated when the browser or OS maker offers an “improved”

Java environment that Sun does not consider truly Java-compatible, but we’ll get to that later Java-capable browsers might run on any computing platform (Windows, Mac OS, Linux, UNIX, or BeOS) as long as the browser manufacturer supports that platform

What makes all of this work? The Java Virtual Machine does You might think of the Virtual Machine as a streamlined computer operating system (OS) running inside another computer OS—a Java computer running inside Windows, for example Or you might think of it as an interpreter, turning spoken words into sign language for the hearing-impaired

This Virtual Machine is sometimes included with the browser Early versions

of Netscape included a Virtual Machine customized for each OS This added significantly to the download time but ensured that users would have the then-new Java technology at their disposal

In other cases, the Virtual Machine is built into the operating system For instance, Apple Macintosh OS9 includes “Mac OS Runtime for Java,” a Java Virtual Machine whose sole purpose is to run Java programs on the Mac

If you install IE5 Macintosh Edition on a pre-OS 9 Mac, you might get Java errors because IE5/Mac expects a more recent Virtual Machine than the one on your system You can correct this problem by upgrading to OS9 or

by downloading a more recent version of Mac OS Runtime for Java from

http://developer.apple.com/java/classic.html The program is free

As you can see, the tantalizing potential of Java lies in its ability to work

in any operating system equipped with a Java Virtual machine—in other words, theoretically at least, to run on any operating system Practically speaking, developers could build a word processor or a full-blown office suite that runs in any Java-capable web browser and on any operating sys-tem with a Virtual Machine Of course, companies that make word proces-sors and full-blown office suites might not like that idea They might dislike

it so much that they would end up building their own web browser and tak-ing over the market…not that we’re mentiontak-ing any names There is, in fact,

a Java word processor (indeed, there is an entire Java office suite), and we hear it works quite well

Where the web designer fits in

As a web designer, you might be called upon to embed a Java applet in an HTML page (Again: An applet is a self-contained piece of code that runs within a Java-capable browser, as Photoshop plug-ins run within Photo-shop.) This is simply a matter of using the HTML <OBJECT>or <APPLET>

tag or another very basic HTML tag—no problem at all At other times, you might use Java to compensate for a missing plug-in on a visitor’s system For instance, the IpixViewer plug-in, like Apple’s QuickTime VR (see the sec-tion, "Turn on, Tune in, Plug-in" later in this chapter), enables visitors to explore 360º panoramic views of any location that can be photographed It’s an extraordinary plug-in that does a remarkable job But not many peo-ple know about this plug-in, so not many have downloaded it Therefore you might feel that IpixViewer content cannot be used on your site Not to worry! The missing plug-in can be replaced by a Java applet and compiled down to native, platform-specific code via the Java Virtual Machine:

<applet name=”IpixViewer” code=”IpixViewer.class” archive=”IpixViewer.jar” height=”210”

➥width=”280”>

<param name=”URL” value=”zabptcaj.ipx”>

<param name=”Spin” value=”on”>

</applet>

If the HTML just listed looks odd to you, don’t sweat it Your Java developer will tell you what needs to be included on the page Your job will be to insert it, test it, and verify things such as height and width (Is the result-ing image in fact 210 pixels high? Does it look right? If not, change the numbers and try again.) By the way, this same technique works for other multimedia content, such as Flash If the visitor lacks the Flash plug-in, a Java applet can display the Flash content Your developers will create the applet and the complex code that determines whether or not the applet is needed on each visitor’s system Your job is simply to plug in some HTML and test

The other reason you need to know about Java is that in spite of its utopian aims and utilitarian benefits, Java can sometimes be problematic And as a

user-oriented web designer, you need to be aware of that

Java Woes

We can do this two ways: the short, brutal version or the long, boring, polit-ically correct version

Here’s the short, brutal version: From a user experience perspective, Java often sucks It can be as unstable as Norman Bates, drain resources like Australians drain beer steins, and crash more frequently than a drunk dri-ver’s Pinto

For those who expect us to be fair, a long, carefully guarded, politically cor-rect version follows Feel free to skip it unless you are an attorney for Sun Microsystems In which case, we meant to say that Java is the best thing since the Magna Carta

Java Woes: The Politically Correct Version

At times, companies have created their own Java Virtual Machines that dif-fer subtly from Sun’s Sun does not like that, and you can understand why

Java is not open source; it is a protected product Differing Virtual Machines can sometimes prevent Java from fulfilling its promise This has led some developers to avoid using Java As a web designer, you will want

to stay aware of these issues if there’s a possibility of their affecting your site and your users

Java can also sometimes drain the computer’s memory resources because the user is essentially running a second operating system (Java) within his existing OS Not to mention the fact that the user is likely running a Java-based application on an unstable web browser with all its memory-hog-ging plug-ins, on top of any other software programs he might have running in the background, and on top of a possibly unstable base operat-ing system such as an older version of Mac OS, which can be wonderful but not entirely stable

The older the computer and the less memory at its disposal, the greater the possibility of woe Attention, Sun attorneys: We do not wish to overstate these issues All that is usually required is for the user to increase the amount of memory allotted to the browser Unfortunately, most web users don’t realize this, so they don’t do it Result: instability

The memory problem is not a Java problem per se; plug-ins like Flash and Shockwave also work better if the user increases his browser’s memory par-tition Fortunately, during the installation process, Shockwave and Flash alert users to the issue and offer to increase the browser’s memory auto-matically if the user clicks the OK button Java does not do this because Java is typically preinstalled on the user’s machine when it arrives from the factory

Given that browser makers know most users are going to encounter Java and are going to install and run plug-ins, why don’t they increase the default memory partition of their browsers? In a word: competition The

browser makers want to prove that their product uses less memory than

the competitor’s, so the browser installs itself with the lowest memory allotment possible It will operate under those conditions just fine as long

as users rarely venture beyond all-text websites Most users do venture far beyond, whether knowingly or not So most users are practically guaran-teed to encounter browser instability on sites that use Java or plug-ins or even large, memory-draining background images

Though Java tends to work well in Windows and UNIX, it’s a mixed bag in Mac OS Even on top-of-the-line G4 Macs with 1.5GB of installed RAM, T3 connections, and system buses capable of transferring over 1GB of data per second, Java can sour

These same Macs can rotate a 40MB Photoshop image faster than Google can track down your ex-girlfriend At speeds exceeding 5.5 gigaflops, they can outperform Pentiums with twice the rated clock speed But a stupid

“rippling water” Java applet on a personal site at Geocities can take down these mighty Macs Java is cross-platform but not always reliably so Attention, lawyers: We do not wish to overstate these issues

Then of course, Java does not work at all in text-based browsers such as Lynx, nor will it function in older browsers such as Internet Explorer 2 And users of even the newest browsers might “turn off” Java in their prefer-ences, thus defeating the development team’s efforts to use Java on the site

This is not a Java problem per se Users can also turn off JavaScript and style sheets They can refuse to install plug-ins, tell the browser to use

“their” background colors instead of yours, and in every other way imagi-nable assert their right to see the Web as they wish to see it, thus turning your beautiful site into a sea of sewage that strangely pleases them

The workaround, as always, is to provide alternatives Simple HTML menus and alternative content go a long way toward keeping sites accessible, no matter what technologies are intended for their use under optimal

condi-tions We do not wish to understate this issue We wish to strongly

empha-size it Make accessibility part of the plan at all times

Java Joys Despite hiccups, Java is cross-platform, and it does many things very well, such as “stepping in” to replace missing plug-ins For instance, as just described, Flash files can be run as Java applications in Netscape Naviga-tor if the user does not have the Flash plug-in That is fairly remarkable It

is handled by Flash itself When saving the file, Flash generates code that will call upon a built-in Java action if the plug-in is not detected in the user’s browser

Beyond all that, Java applets and Java servlets (smaller, more stable

mini-applications of Java that run on the server) can be used to help create dynamic, database-driven websites Java is ideally suited for sophisticated tasks that take place under the hood Because Java works cross-platform and cross-browser (despite problems just mentioned), it might be prefer-able to use Java for complex tasks, rather than relying on proprietary, plat-form- and browser-specific technologies such as VBScript and ActiveX

Java seems less valuable to us when it is used to create dynamic menus or

to trigger the rotation of ad banners In both cases, JavaScript/ECMAScript

is a lighter, more stable choice that is also a web standard, tends to use fewer computing resources, and works better across platforms

Seeing as we’ve mentioned Java and JavaScript in the same paragraph, we might as well restate that the two technologies should not be confused, in spite of their similar names JavaScript is a complex but interpreted pro-gramming language that works in web browsers Java is a full-fledged, object-oriented programming environment that can drive entire devices or can be used to build complete applications Nearly all web designers work with JavaScript, whether on the programming level or simply via cut-and-paste No sane web designer attempts to program in Java Even insane web designers avoid it

The true power of Java is now being manifested beyond the browser Instead of web surfing, consumers are channel surfing via Java-powered

TV devices (www-us.semiconductors.com/news/content/file_501.html) Java and Linux are now creating Internet appliances that require no understanding of Java or Linux (http://www.linuxdevices.com/news/ NS5323294840.html) Java is finding its way into Personal Digital Assis-tants (PDAs), cell phones, and even server-side technologies (http:// www.alistapart.com/stories/beyond/2.html) Keep your eye on Java as your career unfolds, and use it judiciously as your sites evolve

R ICH M EDIA : E XPLODING THE “P AGE ”

We say web “pages” because our minds cannot let go of the publishing model we grew up with But rich web media give the lie to the “page”

metaphor These pages are not pages This is not a pipe This is not my

beau-tiful wife

Let’s see how standard technologies and popular plug-ins push the Web way beyond the cosmologies of print design We’ll start with some web standards you might or might not know about

Virtual Reality Modeling Language (VRML) VRML, though nearly dead from disuse, is the standard language for the animation and 3D modeling of geometric shapes It allows 3D scenes to be

viewed and interactively manipulated on the Web Using a special VRML browser, the web user can connect to an online VRML site, choose a 3D