The basic language of the Web is HTML (Hypertext Markup Language), a markup language that uses tags to specify the structure of the page content. HTML is easy to use and to learn; for example, take a look at the following:

<h2>My Web Page</h2>

This markup shows an h2 heading that tells the browser to display the text information between the opening and closing tag in a specific way -- including the size of the text, the weight of the text, and spacing before and after the text.

You can change the presentation of the h2 heading through HTML tags, such as <font>:

<h2><font color="red"><em>My Web Page</em></font></h2>

You can also change the presentation using CSS (Cascading Style Sheets) to obtain the same effect, as shown in the following code:

<style type="text/css">
  h2 {color: red;
  font-style: italic;}
</style>

CSS is the Web-standard compliant way to achieve these results. You can read more about Web standards at the W3C Web site (http://www.w3.org/).

This style block added to the head section of your page applies the style (red and italic) to the content of every <h2> in the page.

Web designers and developers have taken HTML to the limits of its capability to control page presentation. With the addition of CSS and multimedia elements, HTML can be used to create amazing visually interesting displays of information. But what if you want to interact with your Web visitors, not just show them information? In that case you need to add something more to HTML.

Wait just a minute. Aren't HTML forms interactive? Okay, you're right! So before you move on to an overview of Web programming languages, take a brief look at the interactivity available with HTML forms.

HTML forms are a unique part of HTML because to function, they need an additional language to process the form data. Basically, what the HTML part of forms code does is to do what markup languages do best: specify the formatting of the form.

Figure 1-1 shows a basic HTML form. As you can see, this form includes two textboxes, two radio buttons, three checkboxes, a text area, and a button used to submit the information. Each of these form elements gives the visitor an opportunity to interact with the page and enter information.

Figure 1-1: HTML form.

HTML provides the markup tags to create the structure of this form, and most forms you see on Web pages have a similar appearance -- a text box may have a different size or different color background, but otherwise they usually look very much the same.

HTML can easily create the structure of a form, but the additional pieces that you see in the HTML code are there to interact with a script. The HTML creates the format for the user to input data; however, after the data is there, you need a script to work with this information.

Take a quick look at a few details of the HTML forms code and see how it's used to interact with a script. The following is the forms code from the HTML page displayed in Figure 1-1:

<form action="artform.pl" method="post" name="form1">
  First Name:
<input name="text1" type="text" size="20"><br><br>
  Last Name:
<input name="text2" type="text" size="20"><br><br>
  Age:<br><br>
<input name="age" type="radio" value="1-17">
  1-17 yrs<br><br>
<input name="age" type="radio" value="18 and 
  over" checked>
18 yrs and over<br><br>
I would like to learn to work with:<br><br>
<input name="media1" type="checkbox"
  value="wc">watercolors<br>
<input name="media2" type="checkbox" 
  value="ac">acrylics<br>
<input name="media3" type="checkbox"
  value="pl">pastels<br><br>
<textarea name="interest" cols="50" rows="4">
  I am interested in art lessons 
  because:</textarea><br><br><br>
<input name="submit" type="submit" 
  value="Send me an application now!">
</form>

The first line of the form code includes an action attribute:

action="artform.pl"

This is the script that will execute to process the data that's submitted when the user clicks the Send me an application now! button. This script has a .pl file extension, which means that it's written in the Perl language. You'll be taking a closer look at Perl and other Web scripting and programming languages later in this lesson. Perl is one of many languages that can be used to process input data from HTML forms and send information back to the user via an HTML page.

Notice that most of the form elements include a name and a value attribute. The back-end script processes these name-value pairs and then sends the information as you've specified in the script: a database entry, an e-mail, or an HTML page.

The submit button is designed to send the information from the Web page to the script when the button is clicked. Clicking a button is an event . Because you can add actions to trigger scripts to run when events occur, buttons are used not only to submit forms data, but to also start any script that you've connected to that event. You'll be looking at events in detail in Lesson 6.

Scripting or Programming: What's the Difference? Good question! The distinction is a bit fuzzy because most scripting languages continue to develop additional capabilities that make the distinction even less clear. Here's one way to look at the difference: A scripting language needs another program, such as a Web browser. The browser actually runs the script when it reads the script code in an HTML page. Without an additional program, a computer can't run a script. A programming language is more independent; a computer can run the program without an additional program. Programming languages usually have additional features not available in scripting languages, such as classes in object-oriented programming languages such as C++ and Java. Scripting languages use variables, loops, conditionals, and other programming features, and has more in common with programming than differences. In the final analysis, scripting is programming -- a special type of programming, perhaps, but programming nevertheless.

Web programming languages are usually classified as server-side or client-side. Some languages, such as JavaScript, can be used as both client-side and server-side languages, but most Web programming languages are server-side languages.

The client is the Web browser, so client-side scripting uses a Web browser to run scripts. The same script may produce different effects when different browsers run it.

A Web server is a combination of software and hardware that outputs Web pages after receiving a request from a client. Server-side scripting takes place on the server. If you look at the source of a page created from a server-side script, you'll see only the HTML code the script has generated. The source code for the script is on the server and doesn't need to be downloaded with the page that's sent back to the client.

The major languages used today for Web programming are ASP (Active Server Pages), PHP (PHP Hypertext Preprocessor), Perl, VB Script (Visual Basic Script), and JavaScript. ASP, PHP, and Perl are server-side languages; VB Script and JavaScript are client-side languages. Although JavaScript can be used on the server side, its major use is on the client side, using the browser to run its scripts.

Any of these languages can be used for Web programming. The one you choose to use in any particular instance depends on the tasks you want to accomplish with the script. You can even use a server-side and client-side language in the same Web page -- for example, ASP is usually used with VB Script.

The following sections review the major features of each of these languages. You'll find that each language has its dedicated group of supporters, but the differences between them are actually small. In general, they can all perform the same functions; they just do them a little differently.

ASP is technically not a language; it's a Microsoft server technology that's used along with a client-side scripting language. Using a server-side technology with a client-side scripting language is a powerful combination. VB Script is generally the language used with ASP, but JavaScript can also be used.

Anytime you use server-side scripting or technologies, you, of course, need a server. ASP can be used on Window's built-in Web servers, either PWS (Personal Web Server) or IIS (Internet Information Services), depending on the version of the Microsoft Windows operating system installed on your computer. You can also download IIS from Microsoft's Web site. Although this won't allow you to serve your pages on the Web, it will allow you to test your ASP pages locally, as if they were on a remote Web server.

If you don't want to configure your own Web server, you can also use an ASP Web Hosting provider. An excellent ASP host that offers free hosting (as well as paid hosting) is Brinkster. If you're not using the Windows operating system, you can still run ASP by using InstantASP.

If you're using Microsoft Windows XP Home Edition, there's no support for running a Web server. Test your ASP pages on a free host instead.

ASP can be embedded in HTML code, similar to the following code that uses ASP to display the current server time. The ASP part of the code is bolded.

<html>
<head>
<title>What Time is It?</title>
</head>
<body>
The server says the time is:
<%response.write(time())%></body>
</html>           

The Web page is saved with an .asp file extension that tells the server to use the ASP scripting engine. The server generates HTML from the ASP code, and then sends HTML output to the client. Unlike HTML, you can't view the ASP source code in the client; you can only view the generated HTML.

The main advantages of ASP are that it's easy to learn and easy to use.

What can you do with ASP?

• Process forms data from HTML forms.
• Make dynamic changes to HTML pages.
• Access a database and return information to an HTML page.

For more information on ASP, see:

• 4GuysFromRolla.com
• ASPFAQs.com
• ASP 101

PHP is an open-source, server-side scripting language that's similar to ASP. PHP code can also be embedded in HTML pages, such as the following that displays a text message:

<html>
<head>
<title>Embedding PHP</title>
</head>
<body>
<?php 
 echo "Welcome to my PHP page"; 
 ?>
</body>
</html>

The PHP code in this HTML page is run on the server. HTML is sent to the client, but, similar to ASP, you can't view the server source code that generated the HTML.

To use PHP, you need a server that supports PHP and that'll run files with a .php file extension. You can use a Web host that supports PHP, or you can test PHP locally by installing both PHP and a Web server that supports PHP on your computer. IIS supports PHP; Apache is also a popular open-source Web server that includes PHP support. It can be downloaded for free from the Apache Software Foundation. Download the latest version of PHP.

The main advantages of PHP are as follows:

• It can be used on all the major operating systems
• It supports a wide range of databases
• It can output images, PDFs, and media files as well as HTML
• It includes sophisticated text processing features

You can also do the following with PHP:

• Process forms data from HTML forms.
• Make dynamic changes to HTML pages.
• Access a database and return information to an HTML page.

MySQL (http://www.mysql.com/downloads/index.html) is an open-source database that's often used with PHP.

For more information on PHP, see:

• php
• Zend
• The PHP Resource Index

Perl is a popular open-source, server-side scripting language that's supported and developed by a devoted group of users. Perl was derived in large part (but not exclusively) from the C programming language, and is a high-level programming language with a wide range of capabilities. It's best known for its text processing capabilities. It's not as easy to learn and use as ASP or PHP, and can't be embedded directly in HTML pages.

Perl was originally developed for Unix, but also exists in a Windows version (ActivePerl). An extensive collection of modules for Perl can be used to extend its functionality. You can download Perl, ActivePerl, and Perl modules.

Perl scripts can be uploaded to a Web server and then activated by calling them from an HTML form, as in the forms code example earlier in this lesson. Perl is often used with CGI (Common Gateway Interface). CGI is a standard that allows client browsers to exchange information with applications located on a Web server. Perl can also be run directly on a computer without using a browser or a Web server.

You can use Perl to generate HTML output, as in the following code:

#!/usr/bin/perl
print "Content-type: text/html\n\n";
print "<html><head><title>Outputting HTML 
with Perl</title>";
print "</head><body>";
print "<h2>Welcome to my Perl page</h2>";
print "</body></html>";

The main advantages of Perl are as follows:

• It's sophisticated, full-featured text processing features
• It has pre-existing modules that allow rapid application development

You can do the following with Perl:

• Process data forms from HTML forms.
• Make dynamic changes to HTML pages.
• Use a Perl module to access a database and return information to an HTML page.
• Develop complex applications.
• Use regular expressions for complex text manipulation and searches.

For more information on Perl, see:

• perl.com
• Perldoc.com
• Beginner's Guide to CGI Scripting with Perl

VB Script is a subset of Microsoft's Visual Basic programming language that's mainly used with ASP. Internet Explorer contains a VB Scripting engine that runs VB Script code in HTML pages.

VB Script is a client-side scripting language that is similar to JavaScript in its structure and use. This tutorial won't explore the features of VB Script, because JavaScript is the industry standard for client-side scripting, and isn't limited to use in Internet Explorer.

If you'd like more information on VB Script, see:

• VBScript Introduction
• Microsoft's VBScript Documentation

JavaScript is the most popular and widely used client-side Web programming language. JavaScript is not only easy to learn and use, but it's also a diverse language with extensive features for client-side use.

Netscape originally created JavaScript for scripting in the Netscape browser. Microsoft then developed its version known as JScript. JavaScript and JScript are similar, although not identical, and JavaScript is much more widely used.

JavaScript is a full-featured scripting language that works well as a way to learn basic Web programming techniques. You'll be using JavaScript through the rest of this course to illustrate programming concepts.

The main advantages of JavaScript are as follows:

• Widespread use
• Widespread availability
• It's supported in most widely used browsers, such as Netscape, Internet Explorer, and Opera

You can do the following with JavaScript:

• Validate the data collected with HTML forms.
• Make dynamic changes to HTML pages.
• Use events to trigger dynamic changes such as image rollovers.
• Perform calculations.
• Display date and time on a page.
• Get user input through alert boxes and prompt dialogs, and respond in real-time.

And that's just for starters!

In the meantime, if you'd like more information on JavaScript, see:

• JavaScript Tutorial
• Javascript.com
• JavaScript Central

Moving On

In this lesson, you learned how to add basic Web programming skills to your Web toolkit to create dynamic effects and add interactivity to HTML pages. You found out about the key features of the major Web scripting and programming languages, such as JavaScript. In Lesson 2, you'll learn some basic programming terminology. In addition, you'll learn how to add JavaScript to HTML pages to create interactivity, do calculations, and add strings of text together.

Before you move on, don't forget to do the assignment and take the quiz. In addition, visit the Message Board to introduce yourself to your fellow students and find out what they're up to.