Web pages
Are really text documents, in spite of their fancy features
Can be created or viewed with any text editor, such as Microsoft Word or Windows Notepad
Have a file extension of either .htm or .html
HyperText Markup Language (HTML)
Enhances the capabilities of text-only documents to permit special text formatting, links to other pages, and the insertion of objects (audio files, graphic files, etc.). It also provides for the insertion and execution of Java applets.
Uses special tags (codes) within the text file. The tags are acted upon by the browser when the Web page is loaded.
Example: Displaying text in bold
<B> This will be bold </B>
Notes:
The <B> tag marks the beginning of bold text and the </B> marks the end of bold text
HTML tags are not case sensitive. These tags could have been coded <b> and </b>.
Most text formatting tags are paired. There is a beginning tag and ending tag.
- Other HTML tags exist to specify text size, italicizing, centering, the start of a new paragraph, etc.
Example: Inserting a graphic image
<IMG SRC=myPhoto.jpg WIDTH=100 HEIGHT=150>
Notes:
This tag has attributes (parameters) that specify the file name as well as the image width and height in pixels
Unlike HTML tags and attributes, file names are case sensitive. Proper capitalization must be maintained.
The image will appear at the location of the tag within the document
Tags that insert image objects and audio clips are not paired
Products like Netscape Composer and Microsoft FrontPage are typically used to build Web pages using a WYSIWYG (What You See Is What You Get) approach. The HTML tags are generated automatically.
The only HTML you are required to learn in this course involves launching a Java applet. While some packages help generate the tags, it is sometimes necessary to code or edit the tags manually.
Launching an applet in an HTML document
Example: Launching a simple applet
<APPLET CODE=MyApplet WIDTH=200 HEIGHT=100> </APPLET>
Notes:
In order to launch the applet, the browser must be Java enabled. Otherwise, the tags are ignored.
The attributes can be coded in any order
The CODE= attribute specifies the name of the applet's .class file (the bytecode file generated by the Java compiler). If no path is specified, the file is assumed to exist in the same server directory as the web page. This attribute may optionally be coded within quotes. For example, CODE="MyApplet.class"
The initial pixel width and height of the screen area used by the applet are specified by the WIDTH= and HEIGHT= attributes. A call to the resize() method within the applet class can modify this size. A maximum size of 600 x 400 is recommended for proper display regardless of the graphics resolution.
There are many other attributes for an <APPLET ...> tag but only the ones shown in this example are required.
Example: Launching an applet that receives a parameter
<APPLET CODE=Msg WIDTH=200 HEIGHT=100>
<PARAM NAME=taxRate VALUE=.06> </APPLET>Notes:
The <PARAM> tag is required for each parameter that is passed to an applet.
The NAME= attribute specifies the case-sensitive identifier of the parameter. The VALUE= attribute specifies a case-sensitive string value associated with the parameter. It must be coded in quotes if it contains any spaces. For example, a <PARAM> tag to pass a message to an applet might contain the attribute VALUE="Hello world!"
- To retrieve the parameter's value from the browser, the following expression must be coded within the applet:
getParameter("taxRate")
In this example, the value received from the browser would be a String object having the value ".06"
There is no restriction on the number of parameters. Simply code a PARAM tag for each one and place them between the <APPLET> and </APPLET> tags.
A sample applet that receives a parameter
This applet is a very slightly modified version of the applet from the previous lesson. The message it displays when the user clicks the button is received as a parameter from the HTML within the Web page.
To test the applet, a tag such as
<PARAM NAME=message VALUE="Java is fun!">
must exist in the App.html source file between the <APPLET ...> and </APPLET> tags. To verify that the tag exists, or to add it if it doesn't, use any text editor (such as Notepad).
The applet's code is as follows:
import java.awt.*;
import java.awt.event.*;
import java.applet.*;
public class App extends Applet implements ActionListener {
Button b = new Button("Show message");
TextField message = new TextField("", 15);
public void init() {
resize(300, 100);
setBackground(Color.lightGray);
b.addActionListener(this);
add(b);
message.setFont(new Font("Serif", Font.ITALIC, 24));
message.setForeground(Color.red);
message.setEditable(false);
add(message);
}
public void actionPerformed(ActionEvent e) {
if (message.getText().length() == 0) {
message.setText(getParameter("message"));
b.setLabel("Clear message");
}
else {
message.setText("");
b.setLabel("Show message");
}
}
}
Posting a Web page that launches a custom applet
All you must do is upload the .html file of the Web page and the .class file of the applet to your Web server. The rest is automatic!
Lab exercise for Ferris students
E-mail your answers to this assignment no later than the due date listed in the class schedule.
Review questions
True or False: If a Web page plays an audio clip, the audio clip must be stored within the Web page.
True
False
Which one of the following satisfy the minimum tag requirements for launching an applet?
<APPLET CODE=someApplet WIDTH=50 HEIGHT=75> </APPLET>
<APPLET CODE=someApplet WIDTH=50 HEIGHT=75>
<APPLET CLASS=someApplet WIDTH=50 HEIGHT=75> </APPLET>
<APPLET CLASS=someApplet WIDTH=50 HEIGHT=75>
<APPLET CODE=someApplet> </APPLET>
A parameter passed to an applet from the launching Web page may be of what data type?
only a primitive type (boolean, char, byte, short, int, long, float, or double)
any primitive type or a string
only a string
only a char, int, or double primitive type
only a char, int, or double primitive type or a string
If the following tag is associated with an applet being launched from an HTML document, which of the statements below are true? (choose two)
<PARAM NAME=x VALUE=y>
the applet will receive two parameters
the applet will receive one parameter
the expression: getParameter("x") will return a string with the value "y"
the expression: getParameter(x) will return a string with the value "y"
the expression: getParameter("NAME") will return a string with the value "x"