HyperText Markup Language (HTML)

Suggested Reading

HTML & XHTML The Definitive Guide by Chuck Musciano and Bill Kennedy (O'Reilly)

Chapters 2, 3, 4, 6, 7 and 10

History

Tim Berners-Lee is the inventor of the concept of the Web. In 1989, he came up with the concept of the ability to cross link documents between computers. HTML was created based on an existing markup language SGML. The idea was that HTML would provide some formatting guidelines that a remote viewing application could use to render the text in a more readable fashion. Browsers can easily show plain text files, Yes, it works, but most people like to have some formatting.

Because different applications were used to view the HTML, and different screen resolutions were used, HTML was designed to "loosely" format the code shown in a browser or HTML application. Consequently, much of HTML is comprised of tags that do some formatting of text, but leave some of the layout to the browser itself. Later versions of HTML began to create Frames or Layouts that let web designers have a little more control over the layout of their pages.

As new versions of HTML come out, new features are added. The latest official version of HTML is 5. Version 5 had major upgrades from HTML 4, although HTML 4 still works just fine.

Yes, I know that some of the content in this section is based on HTML 4. Much of it still works in 5, and it is far more straightorward than some of the HTML 5 standard. I still use it for many simple uses...it is not forbidden, it just doesn't have as many features.

We will touch on HTML 5 in next weeks class, but for the inexperienced, there is nothing wrong with getting your feet wet with HTML 4.0 (and even using deprecated tags), as all browsers still support this format. Remember, in this weeks material, we'll cover HTML 4, which while dated, still works quite well. HTML 5 was designed to support the more advanced features found in browsers, and while important, is best covered in a complete HTML design class.

Definitions

Internet

The Internet is a worldwide, publicly accessible network of interconnected computer.

The World Wide Web (WWW)

The WWW is the set interlinked hypertext documents accessible from the public internet. Note that this is not defined in terms of computers on the internet, it instead defines a single interconnected "document.

The HyperText Transfer Protocol (HTTP)

Is a communications protocol that is used by web browsers to obtain information from the WWW. A communications protocol is the set of standard rules for data representation, signaling, authentication and error detection required to send information over a communications channel.

HTTP is a request/response protocol. A client (usually your browser), connects to a port on a machine that provides http services. Many times port 80 is used for HTTP connections.

HTTP is often allowed through corporate firewalls for two reasons. First, it is a standard service that most users now expect to have access to, and second, the firewall maintains the fact that it is your computer that requests the information from the remote site. When the remote site sends something back to your computer, the firewall knows that it is a response to an original request, and lets it pass. You, in effect, "invite" the information from the remote computer into your site.

Hyper Text Markup Language (HTML)

HTML is a markup language. A markup language contains text, and information that is used to provide instructions as to how to mark up that text when presented. HTML is written in terms of tags which are enclosed by "<>". This markup gives instructions to your web-browser so that it knows how to render the text on a page.

Tomcat

Apache Tomcat is an open-source web server and servlet container. It is the software that runs on a server that listens for external connections from a web browser, and then sends content to that web browser. Typically, Tomcat listens to port 80 on a server for any connection requests. When your browser "talks" to a server, it connects to this port and then uses the HTTP protocol to request and then receive information from that server, that in turn is rendered by your browser into the pages you see on your computer. Besides showing HTML, Tomcat is capable of hosting Java Servlets, JavaServer Pages, and WebSockets. This allows Tomcat to serve as a general "web server".

Some HTML Examples

Even though many of these examples use the older, deprecated, markup styles that are deprecated in HTML 4.0, I think briefly going over them makes the initially learning of HTML a little easier. Later we'll learn more about style sheets and the current "correct" way to use HTML. Yes, I know that if you try validating your HTML page using these older style markups will result in many deprecation warning. This first page just introduces some ideas.

In addition, these tags are deprecated, not eliminated. Deprecated means that at some future date, they may no longer be supported. Personally, based on how Java has evolved, I'd bet that most of these tags will work for many, many years to come before they are eliminated. Depending on how your are using your HTML, I personally feel that a quick <b></b> tag is a lot cleaner than going to CSS. In addtion, just because a browser may understand CSS, doesn't mean that some other renderers of HTML may like it as much as the old tags.

So those of you that know CSS, just treat this as an historical lesson. But to those of you who haven't ever looked at HTML before, it still is a good place to start.

As was mentioned in definitions slide, HTML is a mixture of text and "markup". The markup is merely text surrounded by <> and </> characters. In older HTML (before CSS), if you wanted to make the words "Grand Teton" in bold, you would just place <b> before the text and signal the end of the bold markup with a </b> markup. Note that this style of markup is no longer encouraged (it is deprecated) so this is for historical purposes only!

So does all HTML do is markup fonts? No, it can control layout and some content format, but can't enforce an exact look and feel. The text below is the HTML used to make a simple web page. You can see there are plenty of identifiers bounded by <> and </> symbols, we'll talk about them more later. Note, for this first example, we won't use CSS as much as we should.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"https://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Home Page for Bob Evans </title>
</head>

<body bgcolor="#B0F5B0" text="#000000" link="#0000EE"
vlink="#551A8B" alink="#FF0000">
<center>
<table border=3 bgcolor="#3366FF">
<tr><td><strong class="title">Home Page for Bob Evans </strong></td></tr>
/table>
</center>
<p>
<table>
<tr><td><b>Bob Evans </b><br>
President<BR>
<A HREF="https://beartoothmountain.com/">
rbevans.com.</A><BR>
Top of the world <BR>
Wyoming<BR>
<I>email:</I>
<A HREF="mailto:bob@beartoothmountain.com">foo@beartoothmountain.com</A><br>
<I>Phone:</I> (555)555-5555<BR>
<td><IMG SRC="../Images/small-beartooth.jpg" alt="Beartooth mountains"
WIDTH="300" HEIGHT="193" HSPACE="5"></td></tr>
</table>
</body>
</html>

The above code produces the following web page:

Creating A Web Page

While you can create HTML in any location and view it though a browser as a file, you would typically install the HTML you create in a location that will be served up by a web server. In this class, we'll use the Tomcat web server from Apache for our projects.

Where HTML goes is a function of each web server, so our exercises will serve as a rough example of where yours may go on a different web server.

We will be using Tomcat on the class computer as our HTML web server. To create a web page on the class computer, you will need the following:

1. Some type of editor. This can be a simple text editor or an HTML editor (like NVU/Kompozer from sourceforge.net or bluefish from bluefish.openoffice.nl, or Dreamweaver from Adobe)
2. You need to have Tomcat installed on your PC to test things.

More detailed information will follow, but for now let's take at some basic HTML markup that we'll use making some simple web pages.

You may ask yourself, why go through all of this tag stuff, aren't there good HTML "What you see is what you get" (WYSIWYG) editors out there? Well, if all you were doing was writing HTML, they would be excellent solutions. However, when you write Servlets, JSP or GWT code later on, you will output raw HTML, and you need to know how it is used in order to create presentable web pages.

One final note, whenever you update something on the web server, your browser may or may not decide to show that new information to you. That is because browsers "cache" pages, which means that if you revisit a page you've just visited, the browser says "Hey, I just loaded this page, I don't need to fetch it again, I have a temporary copy right here". How do you get around this? Three ways:

1. Quit the browser completely (all windows) and restart it (awkward)
2. Disable caching in your browser (works, but makes everything slower)
3. Press the magic key that tells the browser to reload, but not from cache. In firefox, if you hold down the SHIFT key when clicking the reload icon, the browser will go back to the server for new information.

Main HTML Elements

The table below shows the main types of HTML elements used in HTML Transitional and Frames, they are not used in Strict HTML 4.0, as style-sheets are used to define styles within the body. You may see these used in many web pages still. Main elements are used to organize the document and classify major sections, they don't do individual formatting. We will talk about style sheets in the next module.

So in our original example above, we saw the following lines of HTML

• <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "https://www.w3.org/TR/html4/loose.dtd">
  This tells the browser that we will be using HTML version 4.01 for this document
  
• <html>
  Indicated the beginning of the HTML part of the document
  
• <head>
  Indicating the beginning part of the HEAD part of the document
  
  • <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    cues to browsers as to what type of content this HTML has
    
  • <TITLE>Home Page for Bob Evans </TITLE>
    The title that will appear on the browser
    
• </head>
  The end of the HEAD declaration
  
• <body bgcolor="#B0F5B0" text="#000000" link="#0000EE"
  vlink="#551A8B" alink="#FF0000">
  The beginning of the body of the HTML. Here we have several embedded tags
  • BGCOLOR - specifies the background color of the window (green in this case)
  • TEXT - specifies the color of regular text (black in this case)
  • LINK - specifies the color of an HTML link (blue in this case)
  • VLINK - specifies the color of a link after it has been followed
  • ALINK -specifies the color of a link while it is being followed (red in this case)

Note that colors are often described in HEXADECIMAL format. A low value means no color, a high value means a lot of that color. The Hexadecimal pattern is in the form of RED-GREEN-BLUE with two characters for each color. 00 being black, FF being the maximum color. So the link color of #000000 is black, while the color of #0000FF would be bright BLUE.

General HTML Markup

Okay, everything in italics below is for informational purposes only. It is the was older way web pages were made. I find myself reluctant to just remove it, because if I just wade into CSS directly, I think I'll lose too many people. So, read the italicized section below for historical purposes, but know that you should use CSS now, and we'll cover it in the next module. Remember, one reason HTML did so well is that it is forgiving, and supported older formats, and it still does. You may come across this formatting in web pages even now.

Every tag consists of a tag name, which may be followed by a set of optional tag attributes. According to the HTML standard, tag and attribute names are not case sensitive, so <HTML> and <html> will both be valid. Many times you will see HTML tags in upper case for readability, but it is good practice to leave them lower case, which would be compatible with XHTML standards.

Tags are ended with the same tag name, proceeded by a "/".

Tags can be nested, but you must end them in the opposite order that they were created. So to make "Grand Teton" centered and bold you would have something like

<center><b>Grand Teton</b></center>

(Note that the <center> tag has been deprecated in HTML 4.0, but we'll use it here for simplicity). The HTML standard lets you omit some ending tags. The browser is supposed to be smart enough to end them for you. Many times you will see tags like <p>, <br> or even <body> without the corresponding end tags. <br> is special in that there is not </br> end tag in HTML.

Remember, since HTML isn't controlling the entire layout of your document, some things that you would have in a text file are ignored in HTML. One particularly noteworthy item is that HTML only recognizes explicit line breaks caused by <div>, <p> and <br> tags. This means that extra lines caused by carriage returns in your original text will be ignored.

Block Level Elements

Our first glimpse of formatting within the <body> tag will be some simple block-level elements. These elements usually control size of text, style of text, and alignment. The also define different types of lists, tables and other miscellaneous markings.

Heading Elements - DEPRECATED

Our first tags will be heading tags. These are commonly used to define heading in a document, and are usually associated with the size and weight of the text.

It turns out that the Heading tag can have quite a few attributes associated with it. For now, we will only look at the "align" attribute. The align attribute specifies where the text shall be aligned on the page. To make a heading aligned in the center of your page, you would type

<h2 align="center">Heading</h2>

This will produce the following:

Heading

The align attribute may have values of left, center or right.

<h1> text is usually used for document titles, <h2> headers for section titles. You will notice that <h6> is quite small and is often not used for any "heading" functions.

Paragraph <p>

The <p> tag indicates a start of a paragraph. Often, people use this as a traditional line break, but it is actually signaling the start of a new paragraph, not the end of one. As an example

As with other tags, the <p> tag has 17 different attributes that can be used with it. One of the most common tags used is the align attribute, but it has been deprecated in HTML 4. If used, it controls the placement of the text on the page.

Pre-Formatted Paragraphs <pre>

The <pre> tag specifies a block of code that is to be shown in the browser "as is". The text shall be in the exact character and line spacing written in the HTML. "Pre" is often used when showing code or some text where it is important to preserve the initial formatting as much as possible. Sometimes it is a good exercise to remind yourself how much control HTML has over the presentation of text when you see an example like below. In the first case, the <pre> tags are used around some text with extra space and line feeds. If the <pre> tags are removed, the rendered text looks quite a bit different from the original text!

With the <pre> tags...





<pre>

     This

        is  a 

          test

        

of the 

         pre 

  format



</pre>

     This

        is  a 

          test

        

of the 

         pre 

  format





	

Without the <pre> tags...



     This

        is  a 

          test

        

of the 

         pre 

  format

Some, but not all, browsers support a "width" attribute which asks the browser to make the <pre> formatted text a certain number of characters in width.

Line Breaks <br>

The <br> tag is effectively a line break. It signals the browser to start the text that follows on the next line, but not as a new paragraph, just a new line.

This is

an 

		 

example with no

"<br>" tags used

This is<br>

an<br>

<br>

example with<br>

"<br>" tags used

Horizontal Lines <hr>

The <hr> tag works like a <br> tag, bug places a horizontal line across the page. There are four main attributes that you may tend to use to modify the behavior of the <hr> tag.

There is no extra vertical space around a horizontal line unless you place it there.

The code:

<hr width="80%" align="center">

Produces the following line:

Which should span 80% of the display window.

Special Characters

It turns out that since some of the characters are used for HTML tags, it takes a little more effort to get those characters printed out the screen. If you want to have the text "<b>Grand Teton</b>" printed to the screen, you need to use special characters to get the < and > characters to print out instead of being parsed. The HTML required for the above text would be:
&lt;b&gt;Grand Teton&lt;/b&gt;

Ordered Lists

HTML has fairly good support for generating ordered lists. In fact, you can easily nest lists, and supply your own numbering scheme when you create ordered lists. Ordered lists automatically increment each number/letter for each entry in the list. You also have the ability to change the start value of the list.

Ordered Lists are first declared with the <ol> tag, and then each List Item is identified with a <li> tag. The end </li> tag is not required, but it is still good practice to include it. Below is an example of an ordered list.

One useful attribute of the <ol> tag is the "type" attribute. This lets you vary the type of label you have for your ordered list

The <li> tag specifies the individual list items. Normally you want to let the browser automatically increment each value, and keep the style specified in the <ol> tag. Attributes exist to change style and number "mid-stream" in a list, but aren't commonly used.

Unordered Lists

An unordered list is just a collection of items, with each item proceeded by a bullet or other symbol. Unordered lists are created just like ordered lists, but use the <ul> tag instead.

Unlike the ordered list, as of HTML 4.0 there is no longer a "type" attribute that allows the user to specify the type of bullet used.

Nested Lists

You can nest lists as much as you want, the browser will take care of the numbering for you! In the example below, the first case shows the list without the optional </li> tags, the second uses them.

Text Level Tags - DEPRECATED

Our next set of HTML tags is used to format and control different sections of text. HTML was created to convey more meaning that could be expressed in simple ASCII text. As I've mentioned before, to accommodate different display environments, HTML was designed to help markup text, but not to do page layout. You can't know what font and font size a user may have their browser set to, but you can provide markup instructions to make the text larger, smaller, bold, have emphasis, etc.

It turns out there are two ways to markup text. The first is content-based text styles which try to provide meaning to code. Rather than tell the browser to make something bold or italic, these tags try to convey meaning to the text. That way, if the user isn't using a traditional browser (think access for the blind), these tags provide more meaningful clues to a non-text browser than bold or italic would. The second way is marking up based on physical styles. This is what most people are used to, since it parallels the use of a word-processor. Here you explicitly tell the browser to make text bold or italic.

Content-based style tags

Below are the major types of content based tags available.

Note that there is no guarantee as to how the browser will render these styles, but the use of content-based styles is more in line with the design goals of HTML than the use of physical styles.

Physical style tags

There are several physical text styles. Some have been deprecated as of HTML 4.0, but may still be supported in some browsers. Also note that some browsers may not recognize the <big> and <small> tags as well. The <big> and <small> tags can be nested like this <big><big>Bigger</big></big> to have a larger effect on the text.

Font tags

The <font> and <basefont> tags have been deprecated in HTML 4.0, although most browsers still support it. The <font> and <basefont> tags lets you change the size, color and style of text. The common use of style-sheets has made this markup obsolete. This is because a font tag must be defined each time it is used, but if you are using style sheets, the font is defined once, and then the style is used throughout the document.

Hypertext Links

Hypertext links are what makes the web the web. These are the links that are placed in a document, that when clicked on by a user, takes the user someplace else. A Hypertext link can take you to another place within a page, within a document or to another site completely.

A Hypertext link is usually looks something like this:

<a href="https://host/path/filename">Text to be marked</a>

The notice that the href part of the hypertext link is an attribute to the <a> tag. The href says that when you click on the "Text to be marked", the browser should load the content found at that location into the browser. The <a> tag (or anchor tag) has no real name, other than the A element, but is used not only as a way to send your browser to another location, but also as a target for that journey.

When links navigate within a web a site, they are often Relative links, which just a filename or relative path in the link. These are interpreted with respect to the location of the current file.

<a href="chapter2.html">Chapter 2</a>

In this case, you will find the Chapter 2 file in the same directory you currently are in.

Most browsers have the ability to display the target of a Hypertext link before you actually click on it. Move your mouse over a Hypertext link, but don't click on it, and look at the bottom bar of your browser, it will display the target, or href part of the link.

If you want to have finer grained control over where to take a user with a Hypertext link, you can use the ability to place an arbitrary "marker" in your text by creating a named section. This creates a label that can be accessed with a hypertext link.

<a name="mylabel">Section 2</a>

The above line marks the text Section as an "anchor" so that it may be the destination of another link. The value of this attribute must be a unique anchor name. The scope of this name is the current document.

So to go to another section within you document, you place a # symbol in front of the label you created. As an example:

<a href="#mylabel">See Section 2</a>

This will make a Hypertext link than when clicked, will take you to the anchor labeled mylabel within the same document.

If you want to go to a different document, place an absolute or relative url in front of the # symbol.

<a href="chapter4#mylabel">See Section 2</a>

Images

Embedding images in your code is also straightforward. There is an <img> tag, with plenty of attributes of course, that allows you to insert a graphic into the text flow of your document. There is no implied newline or line break with the image tag, so it can exist anywhere in your code.

The format of the image isn't specified in the HTML standard, rather, it is up to the browser to know how to display the image. Common supported formats are GIF, JPEG and sometimes PNG. The GIF format is used more often now that there is no longer licensing issues with its use. JPEG and PNG have, as always, been free.

As an example, the following code:

<img src="../Images/teton.jpg" width="400" height="257">

Will load the following image into this page

As mentioned, there are several attributes that can be used with the <img> tag.

The src and alt attributes have already been shown, but the align attribute bears closer inspection. The HTML standard doesn't specify default alignment for images, so if you rely on the default there are no guarantees where it will appear.

The HTML standard specifies five values for alignment, left, right, top, middle and bottom, although Netscape and IE have added other extensions.

The examples below all are of the basic form:

<img src="../Images/smallduke.gif" align="left" width="50" height="50">Text that follows

The only difference in each case is the value for the align attribute

Alignment	Description
left	Places the image to the left of the text, and any subsequent text flows around the image. On many browsers, the top of the image will be aligned with the top of the line of text. Notice how the text flows around the image
right	Places the image to the right of the text, and any subsequent text flows around the image. Like the left alignment, the text is aligned with the top of the image and flows around the image. When the bottom of the image is reached, the text continues as normal.
top	The top of the image is aligned with the top edge of the tallest item in the current line of text. If there are no other images in the current line, the top of the image is aligned with the top of the text. Note that in at least some browsers, the text will not wrap around the image as it will with left alignment.
bottom	Aligns the bottom of the image with the bottom of the line of text.
middle	There are small differences in how the browsers handle this attribute. Basically it aligns the middle of the image with the text, however the spec isn't specific about what part of the text is aligned. Some browsers put the baseline of the text at the middle of the image, some put the middle of the text with the middle of the image.

Tables

Many of the tags in tables are also deprecated, as you should use style sheets for modern HTML. It turns out tables are very commonly used in HTML. This is for several reasons.

1. Much of the data to be viewed is in tabular format
2. Tables are used as basic formatting tools, allowing you to align components in a grid like fashion.

An example of HTML which produced a table is as follows:

<table width="600" border="1">
  <tr bgcolor="#99CCFF">
    <td><div align="center">Campground</div></td>
    <td><div align="center">Benefits</div></td>
  </tr>
  <tr>
    <td>Red Lodge</td>
    <td>Next to a stream </td>
  </tr>
  <tr>
    <td>Crazy Creek </td>
    <td>Located close to Cooke City </td>
  </tr>
</table>

The code above produces the table you see below

The <table> tag starts a table immediately after the text before the tag by placing a table on a new line. When the </table> tag is reached, the text is continued on the next line. The only content allowed within the <table> tags is one or more <tr> tags, which define a table row, and a few other tags which control table sectioning.

<table> tag

The table tag has several attributes that can be specified

Table Caption <caption> tag

The caption tag allows you to place a caption above or below a table. There is an optional align attribute that can be either top or bottom to place the caption accordingly.

Table Row <tr> tag

Once you define the basic table, you need to start defining the rows, and then the elements in each row. The <tr> tag marks the beginning of a row of table data. You will often notice that the end </tr> tag is optional, and is often omitted in HTML for readability.

Every row in a table has the same number of cells as the row with the most number of cells. Cells are added to rows with fewer items as needed.

As with the table tag, the tr tag has numerous attributes that control placement of content in each row:

Table Header and Table Data ( <th> and <td> ) Tags

Lastly, there are two tags to define individual cell contents. They are the <th> (table heading) and <td> (table data) tags. The <th> tag is very similar in function to the <td> tag except most browsers render the <th> data in bold face. Like the <tr> tag, you will often notice that the end </td> and </th> tags are optional, and are often omitted in HTML for readability.

Like many of the other table tags, there are many attributes to modify display function of cell content.

HTML 4.0 Table Tags

New in HTML 4.0 are several tags which further help formatting tables.

Without going in to to much detail (consult the reference book), the code below:

<table border=2 cellspacing=3 cellpadding=3 rules=groups>
  <caption align=bottom>Different Hikes and their difficulty</caption>

  <colgroup span=2>

  <colgroup span=2>

  <thead>

    <tr>

      <td colspan=2 rowspan=2>
      <th colspan=2 align=center>Difficulty
    <tr>
      <th>Scale 1-10
      <th>Type of Hike
  <tbody>
    <tr align=center>
      <th rowspan=4>Hike
      <th>Native Lake
      <td>6
      <td>Avid Hiker
    <tr align=center>
      <th>The beaten path
      <td>9
      <td>Serious Hiker
    <tr align=center>
      <th>Beartooth Lake
      <td>3
      <td>Family Outing
  <tfoot>


  <tr>
    <td colspan=4 align=center>
        Note: Hikes based on summer weather
</table>

Produces the following table: Note, not all browsers may support the above tags, so the look may vary from browser to browser.

<div> and <span> tags

The <div> and <span> tags are most often used with Cascading Style Sheets (CSS) which is covered in the next module, but they can still be used with basic tags. The <div> and <span> tags allow you to markup sections of text, the difference between the two is that <div> acts like a <p> attribute and causes a paragraph break when it is used, <span> does not.

if you don't use style sheets, you should still use the <div> tag instead of older, deprecated tags like <center>. This will give you more flexibility when more XML parsers become available. Also, you can use the id and name attributes to name your sections so that your Web pages are well formed (always use the name attribute with the id attribute and give them the same contents).

Because the <center> tag has been deprecated in HTML 4.0, it is a good idea to start using

<div style="text-align: center;"> ..... some text... </div>

Which would center the text in your document.

You can use the <span> tag if you want to change the style of elements without placing them in a new block-level element in the document.

So, if you wanted to markup text within a <h2></h2> tag set, you could do something like this:

<h2>The word <span style="color : #f00;">RED</span> is in red!</h2>

would produce something like this:

The word RED is in red!

HTML 5

HTML 4.0 came out in 1997, which is a long time ago in web-years. After the strict XHTML attempt failed, work was again started on the next version of HTML. HTML 5 supports XHTML format, but it does not require it. When you consider how much has changed in the years since HTML 4 was approved, you realize a great deal has been demanded from browsers.

Besides cleaning up HTML in general, a lot of work been done in the area of browser capabilities. There is a lot in your browser that depends on plug-ins, and the W3C wanted to remove the need for common plugins in current browsers.

I'm not going to go into a lot of detail in this section, mostlty because to adequatelyt cover HTML 5 you really should take a full HTML class, and there will be backward compatibility for a long time (it will be a long process to have HTML 5 widely used).