Going Beyond Html

Web Site Programming

Going Beyond HTML

Learning Team B

WEB 420

Web Site Programming

Going Beyond HTML

In the early years of "The Web", HTML documents presented text and pictures in a static manner like a newspaper. Since that humble beginning newer technologies have helped designers to bring static pages to life: Scripting languages like JavaScript can programmatically manipulate web pages. Powerful scripting languages like Perl, PHP, and ASP can provision web pages with data from databases. Most recently, the addition of multimedia files have altered the user's experience even more.

This paper reviews in greater detail technologies that have helped enrich the user's experience beyond a simple web page and to compare and contrast those technologies where it is effective to do so.

Java vs. JavaScript

Many people use the words Java and JavaScript interchangeably or confuse the two. Java and JavaScript are both similar and yet very different depending on how one views them. Let's take a look at their history.

James Gosling of Sun Microsystems created Java, an Object Oriented Programming (OOP) language.. Netscape created the JavaScript language, also an OOP language. JavaScript and Java are distant cousins. They share a similar syntax and many of their programming structures are similar. However, JavaScript contains a much smaller and simpler set of reserved words than Java.

The main difference between the two can be summarized like this: Java is a much larger and more complicated language that creates "standalone" applications while JavaScript must be placed inside an HTML document to function.

There are also differences in how source statements are converted to executing code, some of which affects the way the users sees each language when surfing the net. Java must be compiled into what is known as a byte code before it can be run. The compilation checks the source statements for errors, which must be corrected before the program can run.

JavaScript is text-based. It is included in an HTML document and run by the browser. JavaScript's compilation step is postponed until the code is executed by the browser. This delays the discovery of errors. Often in JavaScript, the user discovers the compilation errors. Of course, both Java and JavaScript are susceptible to the same degree of runtime errors.

Note that Java applets run independent of the HTML document that is calling for them. The delivery of the applet is done through a download. The HTML document calls for the application, it downloads to the user's cache, and waits to run.

Table 1: JavaScript vs. Java

JavaScript Java

Interpreted (not compiled) by client. Compiled on server before execution on client.

Object-based. Code uses built-in, extensible objects, but no classes or inheritance. Object-oriented. Applets consist of object classes with inheritance.

Code integrated with, and embedded in, HTML. Applets distinct from HTML (accessed from HTML pages).

Variable data types not declared (lose typing). Variable data types must be declared (strong typing).

Dynamic binding. Object references checked at run-time. Static binding. Object references must exist at compile-time.

Cannot automatically write to hard disk. Cannot automatically write to hard disk.

JavaScript is an object oriented scripting language that runs inside a web browser, which helps minimize the upload and downloads of the bandwidth. JavaScript can be used in several scenarios, for instance dropdown navigation menus without having to interact with the server. The following example illustrates a sample of two dropdown menus giving the web page a dynamic interactive look when used.

Figure 1. Drop Down menu Sample

Sample Menu

Site Map

  

Close Window

(About.Com, 2006)

JavaScript is also used to rotate advertising on web sites either within the web page itself or having a CSS Sheet pulled by JavaScript on the server. The example on the next page provides a simple banner rotation on a web page without having to interact with a server.

Figure 2. Banner Rotation Sample

var how_many_ads = 3;

var now = new Date();

var sec = now.getSeconds();

var ad = sec % how_many_ads;

ad += 1;

if (ad == 1)

{

txt="The Infobay";

url="/";

alt="Banner Exchange";

banner="/js/pic1.gif";

width="468";

height="60";

}

if (ad == 2)

{

txt="Phil's MechWarrior2 Page";

url="/consult/";

...