 |
HTML Tables |
|
|
|
A table is a two-dimensional list of items arranged in columns and rows. Each value of the table is put at the intersection of a column and a row.
|
To initiate a table, create an element named table:
<table></table>
A row is a horizontal arrangement of items. A row is created using
a tag named tr. The tr element must be nested in a table element.
Here is an example:
<table><tr></tr></table>
In the same way, you can create as many rows as you want.
A column is a vertical arrangement of items. A column is created using
a tag named td. The td element must be nested in a tr element (which,
remember, itself must be created inside a table element). Here is an example:
<table><tr><td></td></tr></table>
In the same way, you can create as many rows as you want as long as
you remember to nest each row in a tr element.
To make your code easy to read and manage:
- You should put the start and the end tags of the table each on its own line. Here is an example:
<table><tr><td></td></tr>
</table>
- Each start tag of the row should start on its own line and it should be indented from the table element. Here is an example:
<table>
<tr><td></td>
</tr>
</table>
- If necessary (you will judge for yourself, with experience), each start tag of the column should start on its own line and it should be indented from the tr element. Here is an example:
<table>
<tr>
<td></td>
</tr>
</table>
In a traditional table of a database or a spreadsheet, a value is
created at the intersection of a column and a row. In HTML, a value in a table is
created in the td element. This means that a value is created between the start
tag and the end tag of the td element. When specifying a value in a cell, of
course the value can be anything, including text. Here are examples:
<html>
<head>
<title>Road System Database</title>
</head>
<body>
<table>
<tr>
<td>Road System Database</td>
</tr>
</table>
<table>
<tr>
<td><b>Road Name</b></td>
<td><b>Road Type</b></td>
</tr>
<tr>
<td>MD 410</td>
<td>Road</td>
</tr>
<tr>
<td>I-81</td>
<td>Interstate</td>
</tr>
<tr>
<td>US 75</td>
<td>Road</td>
</tr>
</table>
</body>
</html>
This would produce:
|
The Characteristics of a Table
|
|
As it is traditionally done with HTML elements, the characteristics
of a table are set using the attributes of its start tag. You might have realized that
the table element means nothing unless rows and columns are added to it. On the
other hand, some characteristics set on the table as parent will affect the columns and
the rows (and actually vice-versa).
A table has some other characteristics available through its
attributes. Still, it is recommended that you set some or most of its characteristics
using CSS.
- Most attributes are optional, but in most circumstances, some tags absolutely need one or more attributes in order to have any significant meaning
- Some tags (almost) require attributes. Such tags mean nothing in the absence of their attribute(s). This means that you can omit the attribute(s) and nothing would happen
- The names of all attributes are based on HTML standards. The values of some attributes are provided or defined in HTML. The values of many other attributes must be created from external languages (JavaScript, CSS, etc). This means that adding an attribute is not enough: another language can (must) define the role of such an attribute. In our HTML lessons, we review only the tags that do not require an attribute from an external language
- Most attributes are appropriate for only some tags. This means that some attributes have no effect when used in the wrong tag
By default, a table is transparent and doesn't show its limits. To let you
show the borders of a table, the table start tag has an attribute named border.
This attribute can be left empty or it can have a natural number (0, 1, 2, etc). Here is an
example:
<html>
<head>
<title>Road System Database</title>
</head>
<body>
<table border="0">
<tr>
<td><p><b>Road System Database</b></p></td>
</tr>
</table>
<table border="5">
<tr>
<td><b>Road Name</b></td>
<td><b>Road Type</b></td>
</tr>
</table>
</body>
</html>
This would produce:
The border attribute is optional. If you don't specify it, the
table would behave as if the border was set to 0. Here is an example:
<html>
<head>
<title>Road System Database</title>
</head>
<body>
<table>
<tr>
<td><p><b>Road System Database</b></p></td>
</tr>
</table>
<table border="5">
<tr>
<td><b>Road Name</b></td>
<td><b>Road Type</b></td>
</tr>
</table>
</body>
</html>
A table has a size. The horizontal measurement of the table is its width.
The width is created as an attribute named width to the table. The width can be provided
as a fixed natural numbers or as a relative value:
- If you want the table to cover a fixed width, set the value of the width attribute to a constant number
- If you want the table to cover the whole width from where it is (such as from the left side of the monitor if the table is directly created in the body element) to the right border of its parent), set the width value to 100%
- If you want the table to cover only a relative portion of the width from where it is (such as from the left side of the monitor if the table is directly created in the body element) to the right border of its parent), set the width (or the height) value to a percentage value, such as 75% to cover 3/4 of the width
 Practical Learning: Setting the Widths of Columns
|
|
- Open the offices.htm file
- Change it as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, office, location">
<meta name="description" content="This webpage presents the way to contact Watts A Loan.">
<title>Watts A Loan: Offices Locations</title>
<head>
<body>
<div align="center">
<h1 align="center">Watts A Loan: Offices Locations</h1>
<p><b>Watts A Loan</b> has offices in Montgomery County, Prince Georges County,
Baltimore, and Howard County.</p>
<h3><u>Montgomery Mall Office</u></h3>
<table width="300" border=1>
<tr>
<td><b>Watts A Loan - Montgomery Mall</b></td>
</tr>
<tr>
<td>822 Rocket Star Ave<br>
Bethesda, MD 20817</td>
</tr>
</table>
<u><h3>Upper Marlboro Financial District</h3></u>
<table width="300" border=1>
<tr>
<td><b>Watts A Loan - Financial</b></td>
</tr>
<tr>
<td>10715 Long Journey Rd<br>
Upper Marlboro, MD 20772</td>
</tr>
</table>
<h3><u>Baltimore Commercial Town</u></h3>
<table width="300" border=1>
<tr>
<td><b>Watts A Loan - Commercial Town</b></td>
</tr>
<tr>
<td>6915 Sonnett Blvd<br>
Baltimore, MD 21217</td>
</tr>
</table>
<u><h3>Columbia Town Center</h3></u>
<table width="300" border=1>
<tr>
<td><b>Watts A Loan - Columbia Town Center</b></td>
</tr>
<tr>
<td>6204 East Patuxent Rd<br>
Columbia, MD 21042</td>
</tr>
</table>
<hr width="960">
<p align="center"><a href="index.htm">Home</a> | <a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="https://www.sba.gov/" target="_top">Small Business Administration</a></p>
</div>
</body>
</html>
- Save the offices.htm file
- Preview the file in a browser
After viewing the webpage, return to your text editor
A table has a size, represented by the width and the
height attributes of the table element. The values can be provided as fixed natural numbers or as relative values:
- If you want the table to cover a fixed width (or height), set the width (or the height) value to a constant number
- If you want the table to cover the whole width (or the whole height) from where it is (such as from the left (or the top) side of the monitor if the table is directly created in the body element) to the right (or the bottom) border of its parent), set the width (or the height) value to 100%
- If you want the table to cover onlya relative portion of the width (or the height) from where it is (such as from the left (or the top) side of the monitor if the table is directly created in the body element) to the right (or the bottom) border of its parent), set the width (or the height) value to a percentage value
|
The Characteristics of the Cells of a Table
|
|
The width of a cell is the width of a column under which the cell
exists. To support the width of a cell, the start tag of the td element uses its
own width attribute.
The height of a cell is the distance from its top to its bottom border.
The height of a cell is controlled using the height attribute of the start tag of
the td element.
Practical Learning: Setting the Height of a Row |
|
- From the root of the website, open the index.htm file
- Change the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, watts a loan, wattsaloan">
<meta name="description" content="This is the corporate website of Watts A Loan, a small business that provides loans and financial services.">
<title>Watts A Loan</title>
<head>
<body>
<div align="center">
<table width="960">
<tr>
<td> </td>
<td>
<h1 align="center">Watts A Loan</h1>
<p>Welcome to <b>Watts A Loan</b>. We provide personal and business loans as well as various financial services. We are your one-stop shop for all types of financial needs.</p>
</td>
<td> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="10"> </td>
<td>
<p>Our customers include:</p>
<ul>
<li>Individuals:
<ul>
<li>Personal loans</li>
<li>Boat purchase</li>
<li>Vehicle financing</li>
<li>Musical instruments purchase</li>
</ul>
</li>
<li>Businesses:
<ul>
<li>Business startup
<li>Business improvement
<li>Late payroll
<li>etc
</ul>
</li>
<li>Organizations: Non-government organizations, Not-For-Profit organizations, limited liability needs, etc.</li>
</ul>
<p><b>Watts A Loan</b> is involved in community outreach activities, such as</p>
<ul type="square">
<li>Road clean-up</li>
<li>Events sponsoring
<ul>
<li>Marathons</li>
<li>Little league baseball</li>
<li>Community farmers</li>
</ul>
</li>
<li>School supplies purchase</li>
</ul>
<p>The goal is to make <b>Watts A Loan</b> accountable to the community and the environment by following the strict rules of <a href="http://www.federalreserve.gov/bankinforeg/reglisting.htm">government regulations</a>.</p>
<hr>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="offices.htm">Offices Locations</a> | <a href="process.htm">Loan Process</a> | <a href="services/index.htm">Services</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
<p><a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="offices.htm">Offices Locations</a> | <a href="process.htm">Loan Process</a> | <a href="services/index.htm">Services</a></p>
</body>
</html>
- Save and close the index.htm file
- Open the process.htm file
- Change the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, process, step">
<meta name="description" content="This webpage describes the process of applying or getting a loan from Watts A Loan.">
<title>Watts A Loan: Loan Process</title>
<head>
<body>
<div align="center">
<table width="960" border="0" border=1>
<tr>
<td width="10"> </td>
<td> </td>
<td width="30"> </td>
</tr>
<tr>
<td width="10"> </td>
<td>
<h1 align="center">Loan Process</h1>
<p><b>Watts A Loan</b> makes it very easy and fast to apply for a loan, get approved,
and receive your money.</p>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" border="0" border=1>
<tr>
<td width="10"> </td>
<td>
<h3>Personal Loans</h3>
<p>Our core business is based on personal loans. The simple steps to apply for a loan are:</p>
<ol>
<li>Contact us by calling our number or coming to one of our offices. We are
conveniently located near you</li>
<li>Fill out a short and easy-to-follow application. Of course, our employees are
at your service to assist you</li>
<li>Wait for one of our loan officers to contact you. Most applications are
processed the same day and the decision is time because we are very sensitive with
urgent situations</li>
<li>Once a decision is made, if the loan is approved, you will sign a few documents
for the loan payment and then you will receive a check either in the exact amount
you requested or the amount we thought is more suitable</li>
</ol>
<h3>Purchases</h3>
<p>As opposed to applying for a loan directly through us, you may want to
purchase an item (such as a musial instrument, a boat, a car, a motorcycle, a
lawnmower, anything).
<b>Watts A Loan</b> has a partnership with many local and domestic companies that sell
cars or various types of machines and all types of devices. The steps to apply for a
purchase are:</p>
<ol>
<li>Contact the seller or just go to their company</li>
<li>Select the desired item to choose and get the price</li>
<li>Fill out the application. All those companies have their appropriate loan/purchase
application</li>
<li>Wait for an answer. Most applications are processed in a matter of minutes and a
decision is made right away
<ul>
<li>If the loan is approved, you will sign a document for the loan payment and you
will receive the machine or object you applied for</li>
<li>If something did not work as expected, you will receive a response and possibly
an explanation</li>
</ul>
</li>
</ol>
<h3>Business Loans</h3>
<p>We make it convenient to apply for the right loan that will help your business meet
a timely requirement or purchase that valuable machine. We have various types of
packages or we can customize one for your particular needs. We support:</p>
<dl>
<dt>Budget Constraint Needs: We can help you to fill that sudden gap in your budget. We meet issues related to:</dt>
<dd>Cash Flow: A whole in your cashier box is not a negative sign for us and we
will deal with it</dd>
<dd>Deficit: Whether caused by slowness based on seasonal work or a decrease in your
sales, a deficit should not slow you down. We will make the necessary payments</dd>
<dd>Unaccountable Business Partners: Business partners may let you down. We won't</dd>
<dt>Payroll: We have the right amount to achieve your payroll at the last minute. We
are quiet familiar with:</dt>
<dd>Employees Concerns</dd>
<dd>IRS Deadlines</dd>
</dl>
<p>We will analyze your situation and come up with the right package for you. Just contact
us today. We can even come to your office or to meet with you anywhere.</p>
<p>Good luck and count on <b>Watts A Loan</b> to meet your financial needs</p>
<hr color="blue">
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50" border="0" border=1>
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="index.htm">Home</a> | <a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="offices.htm">Offices Locations</a> | <a href="services/index.htm">Services</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save and close the file
- Open the products.htm file
- Edit the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, product">
<meta name="description" content="This webpage describes the products provided by Watts A Loan.">
<title>Watts A Loan: Products</title>
<head>
<body>
<div align="center">
<table width="960">
<tr>
<td width="10"> </td>
<td>
<h1 align="center">Watts A Loan: Products</h1>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="10"> </td>
<td>
<p>Personal loans present various types of reasons to solve immediate and
insurmountable problems. <b>Watts A Loan</b> is the premier stop to address
such personal issues in a timely and up-to-the-point manner. Besides
personal loans, <b>Watts A Loan</b> provides many more solutions.</p>
<h3>Personal Loans</h3>
<p>Financial needs surround us and surprisingly sometimes arrive at a
critical time. <b>Watts A Loan</b> has previous experience on such issues
as house remodeling, family urgent matters (funeral, graduation, school
project, etc) uncontainable debt, bond posting, IRS past taxes, etc. Are
you in immediate need for cash? Do you urgently need financial assistance?
Contact us immediately and come directly to one of our offices</p>
<h3>Business Loans</h3>
<p> A good business must always be ready to seize an opportunity or to
make payments on time. Most of those situations require cash. A reliable
business always needs to keep cash in hand. Unfortunately, cash is not
always available at the right time, or the amount needed to solve an
important problem is not completely available. What do you when in
problem? Call us or drop to our office and we will carefully address
your concerns.</p>
<hr color="blue">
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50" border="0">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="index.htm">Home</a> | <a href="aboutus.htm">About Us</a> | <a href="offices.htm">Offices Locations</a> | <a href="services/index.htm">Services</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save and close the file
- From the services folder, open the index.htm file
- Edit the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, service">
<meta name="description" content="This webpage describes Watts A Loan services and other corporate activities.">
<title>Watts A Loan: Services</title>
<head>
<body>
<div align="center">
<table width="960">
<tr>
<td width="10"> </td>
<td>
<br>
<h1 align="center">Services</h1>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="10"> </td>
<td>
<p>Besides providing personal and business loans, <b>Watts A Loan</b>
is committed to its communities and the environment.</p>
<p><a href="outreach.htm">Community Outreach</a></p>
<p>Events Sponsorship</p>
<p>Support to Local Schools</p>
<hr color="blue">
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="../index.htm">Home</a> | <a href="../aboutus.htm">About Us</a> | <a href="../offices.htm">Offices Locations</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save and close the services/index.htm file
- From the services folder, open the outreach.htm file
- Edit the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, community, outreach">
<meta name="description" content="This webpage describes the community activities in which Watts A Loan is involved.">
<title>Watts A Loan: Community Outreach</title>
<head>
<body>
<div align="center">
<table width="960">
<tr>
<td width="10"> </td>
<td>
<br>
<h1 align="center">Watts A Loan: Community Outreach</h1>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="10"> </td>
<td>
<p><b>Watts A Loan</b> is seriously involved in the communities where its offices
are located. In recent years, <b>Watts A Loan</b> invested in the purchase of
school supplies for various institutions in the area. <b>Watts A Loan</b> also
participated in the sponsoring of a 5K marathon.</p>
<hr color="blue">
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="index.htm">Home</a> | <a href="../aboutus.htm">About Us</a> | <a href="../offices.htm">Offices Locations</a> | <a href="http://managementhelp.org/businessfinance/#anchor1860217" target="_blank">Financial Management</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save and close the services/outreach.htm file
In most tables, every columns has the same number of cells under it.
Sometimes you want one row to have be wider than other rows under the same column without
having resorting to create another table. If a cell's width covers more than one cell under
it, the cell is said to span the cells under it.
To support the spanning of cells, the td tag is equipped with an
attribute named colspan. The value of this attribute is the number of cells it spans.
Here is an example:
<html>
<head>
<title>Watts A Loan: Offices Locations</title>
<head>
<body>
<table width="300" border=1>
<tr>
<td colspan="2"><b>Watts A Loan - Montgomery Mall</b></td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>240-469-4804</td>
</tr>
<tr>
<td>Fax #</td>
<td>240-469-4826</td>
</tr>
</table>
</body>
</html>
Practical Learning: Spanning Some Cells |
|
- Access the offices.htm file
- Change the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, office, location">
<meta name="description" content="This webpage presents the way to contact Watts A Loan.">
<title>Watts A Loan: Offices Locations</title>
<head>
<body>
<div align="center">
<h1 align="center">Watts A Loan: Offices Locations</h1>
<p><b>Watts A Loan</b> has offices in Montgomery County, Prince Georges County,
Baltimore, and Howard County.</p>
<h3><u>Montgomery Mall Office</u></h3>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Montgomery Mall</b></td>
</tr>
<tr>
<td colspan="2">822 Rocket Star Ave<br>
Bethesda, MD 20817</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>240-469-4804</td>
</tr>
<tr>
<td>Fax #</td>
<td>240-469-4826</td>
</tr>
</table>
<u><h3>Upper Marlboro Financial District</h3></u>
<table width="300">
<tr>
<td colspan="2"><b><b>Watts A Loan - Financial</b></td>
</tr>
<tr>
<td colspan="2">10715 Long Journey Rd<br>
Upper Marlboro, MD 20772</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>301-627-4702</td>
</tr>
<tr>
<td>Fax #</td>
<td>301-627-6815</td>
</tr>
</table>
<h3><u>Baltimore Commercial Town</u></h3>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Commercial Town</b></td>
</tr>
<tr>
<td colspan="2">6915 Sonnett Blvd<br>
Baltimore, MD 21217</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>410-962-5005</td>
</tr>
<tr>
<td>Fax #</td>
<td>410-962-5017</td>
</tr>
</table>
<u><h3>Columbia Town Center</h3></u>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Columbia Town Center</b></td>
</tr>
<tr>
<td colspan="2">6204 East Patuxent Rd<br>
Columbia, MD 21042</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>410-730-2748</td>
</tr>
<tr>
<td>Fax #</td>
<td>410-730-2718</td>
</tr>
</table>
<hr width="960">
<p align="center"><a href="index.htm">Home</a> | <a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="https://www.sba.gov/" target="_top">Small Business Administration</a></p>
</div>
</body>
</html>
- Save the offices.htm file
- Preview the file in a browser
Nesting a table consists of creating it inside another element. Not all
elements allow table nesting. A nested table can be nested in a section (div, header,
section, main, footer, li, etc). A table can also be nested in another
table. In this case, the nested table must be created in a cell, that is, between the start and
the end tags of td.
Practical Learning: Nesting a Table |
|
- Access the offices.htm file
- Change the file as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, office, location">
<meta name="description" content="This webpage presents the way to contact Watts A Loan.">
<title>Watts A Loan: Offices Locations</title>
<head>
<body>
<div align="center">
<table width="960">
<tr>
<td width="10"> </td>
<td>
<h1 align="center">Offices Locations</h1>
<p><b>Watts A Loan</b> has offices in Montgomery County, Prince Georges County, Baltimore, and Howard County.</p>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="320"> </td>
<td>
<h3><u>Montgomery Mall Office</u></h3>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Montgomery Mall</b></td>
</tr>
<tr>
<td colspan="2">822 Rocket Star Ave<br>
Bethesda, MD 20817</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>240-469-4804</td>
</tr>
<tr>
<td>Fax #</td>
<td>240-469-4826</td>
</tr>
</table>
<u><h3>Upper Marlboro Financial District</h3></u>
<table width="300">
<tr>
<td colspan="2"><b><b>Watts A Loan - Financial</b></td>
</tr>
<tr>
<td colspan="2">10715 Long Journey Rd<br>
Upper Marlboro, MD 20772</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>301-627-4702</td>
</tr>
<tr>
<td>Fax #</td>
<td>301-627-6815</td>
</tr>
</table>
<h3><u>Baltimore Commercial Town</u></h3>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Commercial Town</b></td>
</tr>
<tr>
<td colspan="2">6915 Sonnett Blvd<br>
Baltimore, MD 21217</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>410-962-5005</td>
</tr>
<tr>
<td>Fax #</td>
<td>410-962-5017</td>
</tr>
</table>
<u><h3>Columbia Town Center</h3></u>
<table width="300">
<tr>
<td colspan="2"><b>Watts A Loan - Columbia Town Center</b></td>
</tr>
<tr>
<td colspan="2">6204 East Patuxent Rd<br>
Columbia, MD 21042</td>
</tr>
<tr>
<td width="50%">Office #</td>
<td>410-730-2748</td>
</tr>
<tr>
<td>Fax #</td>
<td>410-730-2718</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="960" height="10">
<tr>
<td width="10"> </td>
<td><hr></td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="index.htm">Home</a> | <a href="aboutus.htm">About Us</a> | <a href="products.htm">Products</a> | <a href="process.htm">Loan Process</a> | <a href="https://www.sba.gov/" target="_top">Small Business Administration</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save and close the offices.htm file
- Preview the file in a browser
- Open the aboutus.htm file and change it as follows:
<html>
<head>
<meta name="author" content="Catherine Watts">
<meta name="keywords" content="watts, personal, business, loan, about, us, wattsaloan, mission, statement, business, strategy, communitty, outreach">
<meta name="description" content="This webpage describes Watts A Loan business. The page also provides information about the management and the leadership personnel of the company.">
<title>Watts A Loan: About Us</title>
</head>
<body>
<div align="center">
<table width="960">
<tr>
<td width="10"> </td>
<td> </td>
<td width="30"> </td>
</tr>
<tr>
<td width="10"> </td>
<td>
<h1 id="top" align="center">About Us</h1>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960">
<tr>
<td width="10"> </td>
<td>
<p><b>Watts A Loan</b> is a financial management business founded in 2002
by Catherine Watts. The company creates loans and lends money to people
as well as businesses. <b>Watts A Loan</b> combines innovation in financial
services, expertise in loan management, and specialization in particular
needs. The company's customers include regular people (personal loans,
vehicle and boat financing, etc), small businesses (business startup), and
organizations (commercial or <abbr title="Non-Governmental Organization">NGO</abbr>).</p>
<p><b>Watts A Loan</b> started with one office. It has lately expanded and
is now represented in many communities. <b>Watts A Loan</b> has offices at
Wheaton Plaza (<i>mall</i>), at Montgomery Circle, and in Columbia. The
company plans to open new office in other cities while it is growing.</p>
<p>Besides regular business activities, <b>Watts A Loan</b> is committed
to financial responsibility (<em>risk management</em>), research &
development, and community outreach. The goals are to be financially
accountable and community oriented towards its customers and other
stakeholders.</p>
<h2 id="mission" title="A sentence that defines why a company exists and what its goals are.">Mission Statement</h2>
<h3>Our Mission</h3>
<p>To build-up people who inspire.</p>
<h3>Our Strategy</h3>
<p>To be the most recommendable financial lending institution in the areas where its offices are located.</p>
<h3>Our Ambition</h3>
<p>To re-invent the way people interpret commercial lending.</p>
<hr>
<h2>Company Leadership</h2>
<p><b>Watts A Loan</b> is lead by a team of business-minded and family-oriented professionals.</p>
<table>
<tr>
<td colspan="2"><h3 align="center"><h3><b>Watts A Loan</b> Owner and <abbr title="Chief Executive Officer">CEO</abbr>: Catherine Watts</h3></td>
</tr>
<tr>
<td> </td>
<td><p><strong>Catherine Watts</strong> founded <b>Watts A Loan</b> from a
shining idea of creating personal loans that rebuild people's lives
and challenge other financial institutions. Although primarily aiming
to cater to individual (<i>the personal niche</i>), Cathy quickly found
some individual personal needs and the increasing demanding world of
small businesses.</p>
<p>Catherine holds a Bachelor's degree in business management and
a Master's degree in banking processes.</p></td>
</tr>
</table>
<hr>
<table>
<tr>
<td colspan="2"><h3 align="right">Marketing Director and Business Strategist: Frank Heyman</h3></td>
</tr>
<tr>
<td><p><strong>Frank Heyman</strong> is a former business executive. His
résumé includes many major financial firms of different
types of businesses, including accounting firms, consumer services,
and Internet startups.</p>
<p>Frank holds a Bachelor's degree in financial accounting and a
Master's degree in banking strategies. Frank is in charge of the
<b>Watts A Loan</b> business orientation
and financial goals.</p></td>
<td> </td>
</tr>
</table>
<hr>
<table>
<tr>
<td colspan="2"><h3>Human Resource and Corporate Outreach Officer: Justine Bene</h3></td>
</tr>
<tr>
<td> </td>
<td><p><b>Justine Bene</b> manages human resources as well as community
outreach. She is in charge of all hiring steps and other personel issues.
When it comes to community outreach, Justine ensures that the company is
accountable to the community.</p>
<p>Justine has a Bachelor's degree in human resources and holds
many professional certifications.</p></td>
</tr>
</table>
<hr>
<h2 id="finances">Finances & Revenues</h2>
<p><b>Watts A Loan</b> is currently managing a budget of <b>$15,000,000</b>
and growing. The budget is shared among the company departments:</p>
<table width="350" border="8">
<tr>
<td><b>Department</b></td>
<td><b title="This section includes the budget allocated to each department">Revenues</b></td>
<td><b title="This section shows the budget fraction available for each department of the company">Margin</b></td>
</tr>
<tr>
<td title="The administration includes employees payroll, community services, etc">Administration</td>
<td>3,500,000</td>
<td>23.33%</td>
</tr>
<tr>
<td>Loans/Services</td>
<td>9,000,000</td>
<td>60.00%</td>
</tr>
<tr>
<td>Marketing</td>
<td>1,120,000</td>
<td>6.80%</td>
</tr>
<tr>
<td>R & D</td>
<td>1,350,000</td>
<td>7.33%</td>
</tr>
<tr>
<td>Community Outreach</td>
<td>480,000</td>
<td>2.53%</td>
</tr>
</table>
<hr>
</td>
<td width="30"> </td>
</tr>
</table>
<table width="960" height="50">
<tr>
<td width="10"> </td>
<td>
<p align="center"><a href="index.htm">Home</a> | <a href="offices.htm">Offices Locations</a> | <a href="services/index.htm">Services</a> | <a href="process.htm">Loan Process</a> | <a href="https://www.sba.gov/sites/default/files/files/FY%202013%20AFR%20from%20CV%20Dec%2016.pdf" target="_new">SBA - Accountability</a></p>
</td>
<td width="30"> </td>
</tr>
</table>
</div>
</body>
</html>
- Save the file
|
|