xHTML basic commands provide for headers, links, images, and special characters.
Headers are pre-defined style formats that have a hierarchical structure that allows for the multi-level organization and presentation of documents through the use of header element types. Headers can have different font sizes, position structure (left, center, or right), and font types. XHTML Basic provides for six headers or header elements, h1 through h6. The h1 header is the largest, and h6 is the smallest.
Example 2 and figure 1.3 shows the use of the six headers in a sample XHTML Basic program. This program lists on the screen of the cell phone, the words “level 1 header, “level 2 header”, up to “level 6 header”, where level 1 header is the largest – h1 – to the smallest - h6.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" http://www.w3.org/TR/xhtml;-basic/xhtml-basic10.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title> Using Headers</title> <head> <body> <h1> Level 1 header</h1> <h2> Level 2 header</h2> <h3> Level 3 header</h3> <h4> Level 4 header</h4> <h5> Level 5 header</h5> <h6> Level 6 header</h6>
Links or Hyperlinks are tags, icons, or images that contain a crossed reference address (name or IP address) that allows the link to redirect the source of information to another document or file. These documents or files may be located anywhere the link address can be connected to. The hyperlink provides references, or links, to other resources such as XHTML Basic documents and images. In XHTML Basic, both text and images can be hyperlinks.
The a (anchor) element creates links. The text or image between the <a>…</a> tags is the hyperlink that appears on the document. The href attribute specifies the location of the linked source, such as a web page or a file.
Example 3 and figure 1.4 shows a XHTML Basic program that uses the hyperlink to a web site. After the words “Select a Website”, “Get Java Runtime”, “Go to Microsoft”, and “Go to Local Page” are all hyper links to either another web site, or in the last case to a local page on the current website. In this example, the tags <strong>…</strong> are used to make the words within them bold or emphasized. Also, a <br/> command, same as WML and HTML is used to force a new line after each hyperlink. Also, the third hyperlink is a relative link to another xhtml document in the same folder.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W#C//DTD XHTML Basic 1.0//EN" http://www.w3.org/TR/xhtml;-basic/xhtml-basic10.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title> Hyperlinks</title> <head> <body> <p><strong>Select a website</strong></p> <a href="http://www.javasoft.com"> Get Java Runtime</a><br/> <a href="http://www.microsoft.com"> Go to Microsoft</a></br> <a href="xhtmlex1.html"> Go to Local Page</a> </p> </body> </html>
Images are data files that organize their digital information in a format that can be used to recreate a graphic image when the image file is received and decoded by an appropriate graphics application. The two most popular image formats that Web developers use are GIF and JPEG. In WML documents there also are WBMP formats used for images. In general, wireless web clients cannot display large images due to the small screen size. Therefore, care must be used in selecting the images used for a wireless device.
The img element is used to insert an image into a document. The src attribute of the img element specifies the image file’s location. Also, there are optional attributes width and height that can be used to specify the image’s height and width in pixels. If these attributes are omitted, the actual size of the image will be used. There is also another required attribute besides src, which is alt, which is used by the browser to display the value of the alt attribute if it cannot get or display the image.
Example 4 and figure 1.5 shows an XHTML Basic document using the img element. Note that this image is in the same directory as the XHTML Basic document, and therefore only the relative address of the image is given. If the image were in another directory, the absolute address would be used to locate the image.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" http://www.w3.org/TR/xhtml;-basic/xhtml-basic10.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title> Using an image</title> <head> <body> <p> <img src = "ppc1.gif" height="40" width="40"alt="pda image"/> </p> </body> </html>
Like WML, some HTML Basic elements are called empty elements and they contain attributes only, and do not markup text (there is no text between the start and end tags). Empty elements such as img must be terminated with the / inside the closing right bracket (>) or by explicitly including the end tag.
Images can also be used as hyper links just by inserting the img element within the a tags.
Example 5 and figure 1.6 shows the use of an image as a hyper link, with the height and width specified as well as the alternative text to be displayed if the image cannot be found or displayed.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" http://www.w3.org/TR/xhtml;-basic/xhtml-basic10.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title> Image Link</title> <head> <body> <p> <a href=http://www.mindspring.com> <img src= "mshead.gif" height="40" width="40"alt="Mindspring image"/> </a> </body> </html>
When marking up text, certain characters or symbols (e.g. >) may be hard to embed directly into an XHTML document. Some keyboards may not provide these symbols or there presence may cause syntax errors. For example, the line
<p> if x < 9 then increment x by 1</p>
Causes a syntax error because it uses the < character which is reserved for start and end tags. XHTML Basic provides special characters or entity references (in the form &code;) for representing these characters. The previous line corrected is:
<p> if x < 9 then increment x by 1 </p>
In this line, the special character < represents the < symbol. For a complete list of character entity references, see web-site: www.w3.org/TR/REC-html40/sgml/entities.html.
This form for special characters - &code; is the same as used for WML. The code may be letters such as “lt” or “gt” or “amp”, or the code may be the actual ASCII value for the special character. (e.g. & - this is the ASCII code for an ampersand.)
Example 6 and figure 1.7 shows the use of some special characters used in XHTML Basic. This code displays the sentence “Statistically > Ѕ of the people on the web are < 50” when displayed on the wireless device. The code in the example used for the fraction Ѕ is “½.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" http://www.w3.org/TR/xhtml;-basic/xhtml-basic10.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title> Special Characters</title> <head> <body> <p> Statistically > ½ of the People on the web are < 50. </p> </body> </html>
