Two months ago, I explained the basic way the World Wide Web works. [HTML 101: Web Basics for Authors] It’s a remarkably simple paradigm. A program running on your computer called a web browser (Firefox, Chrome, Safari, Internet Explorer, etc.) sends a request to a web server – a program running on some distant computer connected to yours via a network. The request includes an item called a URL, which identifies the content you are requesting. The web server locates the desired content and sends that data back to your browser over the network. Then your browser renders (formats and displays) the newly received page on your screen.

In the most straightforward case, the requested content already exists as a file (usually holding HTML) stored on the web server. The server merely retrieves that file from disk and sends it back, unmodified. Websites that operate this way are known as static web sites. On a static website, a request for a particular URL will always display the same information.

Very few modern web sites are completely static. The world has decreed that static sites are just not cool. Pundits proclaim that every site needs to be dynamic: displaying animation or videos, changing in response to user interaction, allowing viewers to upload photos, add comments, “like” content or forward links to friends. After reading about the incredibly simple request-response cycle that underlies all web communication, you may wonder how all this complex, flashy active content works. That’s my topic for this month. I’m going to give you a brief survey of some of the different mechanisms web sites use to move beyond static page displays.

Why do you need to know about this? In order to make intelligent choices about the active content you want on your own sites and blogs. There’s a temptation to add as much active content as possible to your sites. After all, static web sites are boring, right? However, there are risks and costs associated with active content, and as I discuss the various approaches you might adopt, I want to point these out.

And lest you make the erroneous assumption that static websites are useless and hopelessly old-fashioned, let me point out that both my author website, http://www.lisabetsarai.com, and the ERWA website, (https://erotica-readers.com), use primarily static content. Certainly, dynamic content is essential for some kinds of web applications. I’ve yet to be convinced that an author site is one of them.

I’m going to quickly discuss six mechanisms for adding active content to a web site: server-side programs, JavaScript, animated GIFs, plug-ins (including Flash), applets and ActiveX controls, and HTML5. I’ll conclude by offering my own recommendations for using active content.

Server-Side Programs
The most powerful and flexible way to make a web site behave dynamically is server-side programming. In this scenario, when the web server receives a URL, it doesn’t look up a file. Instead, it runs some software. This software will create the content to be returned to the requester.

Server-side software can be enormously complex. It can do calculations, retrieve or store information in data bases, even send requests to other web servers. E-commerce sites (like Amazon or Adult DVD Empire), social network sites, blogging platforms (like Blogger and WordPress), and most other large scale web applications depend heavily on server-side programming.

One commonly used technique for invoking server-side programs is HTML forms. HTML includes tags for creating text fields, drop down lists, radio buttons, push buttons and other sorts of user interface controls as part of a web page. Every HTML form is associated with an action that is invoked when the user clicks the Okay or Submit button. A form action is a special URL that identifies the program to be run (on the server) when the button is clicked. The browser automatically sends the material the user has entered in the form as part of the request. Then the server program can use that information to do something intelligent (like adding a user to your address list database, or recording a comment).

Most authors probably won’t be writing any server-side code, although creating scripts to do simple tasks isn’t all that hard. Still, you can always hire someone to do this sort of work for you, or find free server-side scripts that you can incorporate into your site. Server-side programming has two huge advantages. First, it has pretty much unlimited power and flexibility. Second, there’s generally little security risk to the user because the programs are executing on a different computer.

On the negative side, sites that rely entirely on server-side programs may not feel very responsive or natural. The browser has to wait for the reply to its request. The delay includes not only transmission time over the network but also processing time on the server. Long waits can be annoying and frustrating for users.

JavaScript
JavaScript is a programming language that runs on your computer, inside your browser. Web pages sent from the server can include JavaScript programs, embedded in the HTML. When the browser receives the page data, it will process and possibly execute the JavaScript code, which may modify the appearance or the content of the page.

Often, JavaScript functions are written to respond to user actions, like mouse movement or button clicks, by changing the page content. For instance, if you go to my web site, (http://www.lisabetsarai.com/welcome.html), and run your mouse over the menu buttons on the left, you’ll notice they change color. This little bit of activity is handled by JavaScript. What is actually going on is that JavaScript is replacing one button image with another one in response to the mouse event. (If you want to look at this in detail, just select your browser’s “View Page Source” menu item.)

JavaScript is often used to validate data entered in forms (e.g. to make sure that all required fields have been filled in, or that a phone number has the correct structure.) It makes it possible to implement drop down menus and other flexible UI behavior on a mostly static page. JavaScript can draw graphics, change background or text, switch from one page or tab to another, even (under certain circumstances) send a new request to the server without redrawing the entire page.

JavaScript is surprisingly powerful. The “widgets” available on Blogger and many other sites are mostly chunks of JavaScript code that are designed to be embedded in a web page. For instance, if you go to my blog, (http://lisabetsarai.blogspot.com) you’ll notice a slide show of cover images in the upper left. I’m pretty sure this is handled by a JavaScript module downloaded from Google’s servers.

However, there are certain things a JavaScript program cannot do. In particular, JavaScript cannot read or write files on your local computer. This is a deliberate design decision which makes it less likely that a JavaScript routine might corrupt or compromise your computer.

Most websites these days (even my antediluvian site!) use at least a bit of JavaScript. However, there are risks in relying on JavaScript too heavily. Users can choose to disable JavaScript in their browsers (and some do). Furthermore, JavaScript doesn’t necessarily behave the same way in different browsers. You should be sure that your web site functions adequately with JavaScript turned off. A static site may be boring, but a broken site that prevents user navigation is far worse.

Animated GIFS
Animated GIFs are a simple, safe way to add a bit of activity to a page. As I explained last month, an animated GIF is an image file that includes multiple frames plus timing information. Browsers treat an animated GIF like any other image, downloading it to the browser memory the first time it is referenced by a page. This may cause some delay. After that, no further communication with the server is needed. However, switching frames does take some of the browser’s processing power. This may slow rendering on older computers.

You can make your own Animated GIFs. I use an ancient but reliable Windows program called GIF Construction set, from Alchemy Mindworks. You can also find animated GIFs on the web. For instance, I happened upon the sexy pole dancer below:

Animated GIFs are effective for things like click-through ads. They get a bit tiresome if you have too many of them, since they repeat forever. Also, it’s difficult to make a really complex animation using an animated GIF. With a dozen frames, even the cow above is more complicated than anything I’ve ever created.

Plug-ins and Flash
Real-time video content or complex animation requires more powerful technology than animated GIFs. To display video content, browsers use add-on program modules called plug-ins. A plug-in extends the functionality of a browser so that it can render additional kinds of content. Popular plug-ins are usually free to download and simple to install. However, you (or your visitors) must get the correct version for your operating system and browser. Also, many plug-ins have frequent updates, so managing them can be a chore.

Plug-ins are available for various audio/video formats such as MPEG, AVI, QuickTime and Adobe Flash. Flash is probably the most popular format for video and animation, partly because it was designed to be streamed over the Internet. Adobe also provides sophisticated authoring tools for creating Flash animations. If you’d like to see what Flash can accomplish in the hands of a true artist, visit Jacquie Lawson’s e-greeting card site and preview some of her gorgeous cards. Currently, YouTube streams its videos in Flash format.

Unfortunately, the Flash system and plug-ins have proven to have many flaws that make them popular vehicles for malware. Flash content is actually a downloaded program that runs, inside the plug-in, on your computer. Apparently it’s quite easy to embed malicious code in a Flash object. This code can subvert the security mechanisms of the browser and gain access to your files and operating system: stealing your personal data, compromising your identity, or turning your computer into a zombie that sends out spam messages or viruses upon command. The SANS security institute (http://www.sans.org) reports new Adobe Flash vulnerabilities on the average of once a month.

Some users (including your humble author) will refuse to install the Flash plug-in because of these security issues. Thus, you should make sure that your site or blog works well in the absence of a Flash player. Don’t rely on animations of any type to convey critical information or for navigation. You cannot assume that all your visitors will play your videos.

For a fine example of a site designed to work both with and without Flash, check out the Total-E-Bound store. If you have Flash installed, you’ll see a cool “book carousel” animation showing the latest releases, and a dynamic slide show of banner announcements above. Without Flash, the carousel is replaced by static cover images and you have to click the banner to move to the next announcement. However, the site conveys the same information, without looking ugly.

As a geek, I’m impressed!

Java Applets and ActiveX Controls
Most of the plug-ins you’re likely to encounter are oriented toward rich media. However, you can also download and install a plug-in that can run generic applications called “applets” inside the context of your browser. Applets are written in a programming language called Java. You might use an applet to embed a drawing application or whiteboard, a dynamic book reader, or an interactive puzzle on a web page.

ActiveX controls are similar to Java applets in concept. However, they work only in Microsoft’s Internet Explorer.

Using either of these mechanisms involves downloading a chunk of executable code from the web server. The HTML page hosting the applet or control includes a specification of where the code should come from. Once the program has been downloaded, the browser starts it running.

Applets and Active-X controls can do far more complicated things than any of the browser-based mechanisms I’ve discussed so far. However, the richer the functionality of an applet, the bigger the code object (usually) and the longer it takes to download. Also, for applets at least, you must install the plug-in, and the plug-in version needs to be compatible with the Java version of the applet. There was a great deal of excitement when applets were first introduced in the late nineties. These days, though, they do not appear to be all that widely used.

HTML 5
An effort is currently underway to define and standardize a new version of HTML that will provide new, platform-independent mechanisms for supporting active content. HTML 5 includes a <canvas> tag that will allow drawing on the page, <video> and <audio> tags to support rich media, and support for a powerful graphics format called Scalable Vector Graphics (SVG). The goal is to reduce the need for specialized plug-ins as well as to enhance the security of web applications.

Although the HTML 5 standard isn’t yet final, major browsers already implement many of its new features. If you’re starting from scratch building a new website, you may want to examine whether HTML 5 will give you a better way to support active content.

Active Content and You
When you see all the amazing things that can be done with Internet technology, you may lust after similarly sexy features for your own site or blog. Certainly, you want your users to enjoy the experience of visiting your site. Keep in mind, though, that every one of the active content techniques I’ve discussed above (except perhaps HTML5) has a downside.

Consider the performance implications of active content. Not every reader has a fast computer or even broadband Internet. I have people on my email list who still connect via dial-up. If you’re trying to lure readers from outside your continent, remember that your site is likely to load more slowly for them than it does for you. Every video, animation, widget, and even image that you add to your page slows the load time. I live in Asia and I can tell you, I’ve given up trying to access some sites. The content isn’t worth the frustration of waiting. Presumably you don’t want your readers to feel this way.

Consider security as well. Some active content techniques carry significant risk of transmitting malware. You don’t want your visitors catching viruses from your site! And if your visitors are more concerned about security than you are, and turn off Flash or JavaScript, make sure your message still gets through.

In short – think carefully about active content before you add it to your site. A simpler site will be clearer, faster and more reliable. Your ultimate objective is to get readers interested in your writing and hopefully, to buy your books. If you think you really need some dynamic content to achieve that goal, that’s fine. Just don’t be dazzled by pure coolness, to the exclusion of functionality.

Lisabet Sarai
May/June 2012

“Naughty Bits: The Erotogeek’s Guide for the Technologically Challenged Author” © 2012 Lisabet Sarai. All rights reserved. Content may not be copied or used in whole or part without written permission from the author.