Home

Pictures and Webpages

   

Introduction to Graphics Files

 

Overview

Graphic files are those that display graphics or pictures. You will need the right tool(s) to create them. In Microsoft Windows and Apple, one of the most popular applications to create or manipulate pictures is Adobe Photoshop. There are other applications such as Corel PaintShop Pro, etc.

Corel PaintShop Pro is cheaper than Adobe Photoshop and we can do anything that is necessary for webpage/graphics design. The cheapest solution in Microsoft Windows is Windows Paint or simply Paint. It is installed along with the operating system. Windows Paint is very limited and should serve only as a temporary solution.

Different applications are typically used in web design because it is not unusual that a certain feature is missing in one application that happens to have other good features missing from other applications. For example, because we don't know what applications you have, in this lesson, we are going to use Microsoft Office to partially work with graphics, transferred them to Windows Paint and PaintShop Pro to get the results we want.

Practical Learning: Creating a Graphics File

Instructions for Microsoft Windows and Microsoft Office

  1. If you are working from Microsoft Windows and if you have Microsoft Office, start Microsoft PowerPoint
  2. To create a blank slide, in the Home tab of the Ribbon, in the Slides section, click the arrow of the New Slide button and click Blank
  3.  On the Ribbon, click Insert
  4. To start a rounded rectangle, in the Illustrations section, click Shapes and click Rounded Rectangle.
    Click inside the blank slide
  5. While the shape is still selected on the slide, on the Ribbon, click Format
  6. Click Shape Outline -> Weight -> 1/4 pt
  7. In the same Format tab of the Ribbon, click Shape Outline and click the Black button
  8. Enlarge the shape to cover almost the whole width of the slide and approximately 3/4 of the height of the slide
  9. With the shape still selected, use the small yellow shape on its top-left corner to make the corner as small as possible without eliminating them completely

    Accessing a Control Panel

  10. With the shape still selected, press Ctrl + C (or copy the shape)
  11. Press Ctrl + V to paste
  12. Click the first shape (it should be positioned behind the new one)
  13. With the first shape selected, on the Ribbon, click Format
  14. Click Shape Effects -> Shaddow and click the second option: Offset Diagonal Bottom Right
  15. With the first shape still selected, in the Format section of the Ribbon, click Shape Effects -> Shaddow -> Shadow Options
  16. With the Shadow option selected, set the Blur to 6 pt and make sure the Distance is 3 pt
  17. Click Close
  18. Click the other/second shape, the one in the front, to select it
  19. With the front shape selected, in the same Format tab, click Shape Fill and click More Fill Colors...
  20. In the Custom property page, set the values of the color as Red = 237, Green = 242, and Blue = 249
  21. Click OK
  22. With the front shape still selected, on the Ribbon, click Format. Click Shape Effects -> Shaddow
  23. In the Inner section, click the middle option: Inside Center
  24. With the second shape still selected, in the Format section of the Ribbon, click Shape Effects -> Shaddow -> Shadow Options...
  25. Set the Blur value to 4 pt
  26. Click Color and click More Colors...
  27. Click Custom and set the color to Red = 85, Green = 142, and Blue = 213
  28. Click OK
  29. Click Close

    Accessing a Control Panel

  30. Click the shape behind to select it, copy (Ctrl + C)
  31. Paste it (Ctrl + V)
  32. Change its size to cover the top section of the slide and approximately one tenth of the height
  33. Click the top shape to select it
  34. Copy it (Ctrl + C)
  35. Paste it (Ctrl + V)
  36. With the top front shape selected, in the same Format tab, click Shape Fill and click More Fill Colors...
  37. In the Custom property page, set the values of the color as Red = 237, Green = 242, and Blue = 249
  38. Click OK
  39. With the top front shape selected, on the Ribbon, click Format. Click Shape Effects -> Shaddow
  40. In the Inner section, click the middle option: Inside Center
  41. With the top front shape still selected, in the Format section of the Ribbon, click Shape Effects -> Shaddow -> Shadow Options...
  42. Set the Blur value to 4 pt
  43. Click Color and click More Colors...
  44. Click Custom and set the color to Red = 85, Green = 142, and Blue = 213
  45. Click OK
  46. Click Close

    Accessing a Control Panel

  47. Position the shapes so that the light blue one is on top of the blue one in each section
  48. Move the shapes slightly to the left of the slide

    Accessing a Control Panel

  49. On the Ribbon, click Insert
  50. To draw a circle, in the Illustrations section, click Shapes and click Oval
  51. Click inside the slide
  52. While the circle is still selected on the slide, on the Ribbon, click Format. Click Shape Outline -> Weight -> 1/4 pt
  53. Still in the Format section of the Ribbon, click Shape Fill and click the white color
  54. With the circle shape still selected, on the Ribbon, click Format
  55. Click Shape Effects -> Shaddow
  56. In the Outer section, click the middle option: Offset Center
  57. Move the circle to the middle-left section of the top shapes

    Accessing a Control Panel

  58. On the Ribbon, click Insert
  59. In the Illustrations section, click Shapes and click Text Box
  60. Click an empty area on the slide
  61. Type W
  62. Select the W you just typed
  63. Change its font to Copperplate Gothic Bold and its size to 36
  64. With the letter still selected, on the Ribbon, click Format
  65. Click the arrow of the WordArt styles and select the middle bottom option
  66. Click the corner of the shape that contains the letter to select it
  67. Press Ctrl + C to copy
  68. Press Ctrl + V to pase
  69. Select the new W and type L to replace it
  70. Select both shapes and move them to the circle

    Accessing a Control Panel

  71. On the Ribbon, click Insert
  72. In the Illustrations section, click Shapes and click Text Box
  73. Click an empty area on the slide
  74. Type Watts A Loan
  75. Select the text you just typed
  76. Change its font to Bodoni MT Black and its size to 32
  77. With the text still selected, on the Ribbon, click Format
  78. Click the arrow of the WordArt styles and select the Gradient Fill - Blue, Accent 1
  79. Still in the Format section of the Ribbon, click Shape Effects -> Shadow and, in the Outer section, click the first option
  80. Move the text box to the center of the top rectangles

    Accessing a Control Panel

  81. Click a white area on the slide to make sure nothing is selected
  82. On your keyboard, press Print Screen
  83. Start a graphics application and if necessary, create a new document
  84. Paste the contents of the clipboard (in PaintShop Pro, on the main menu, click Edit -> Paste As New Image; in Windows Paint, press Ctrl + V)
  85. Click the Selection tool
  86. Make a selection from the top-left corner of the top shapes to the bottom-right side of the slide

    Selecting a Title

  87. Copy the selection (you can press Ctrl + C)
  88. Start a new file and paste the selection (in PaintShop Pro, on the main menu, click Edit -> Paste As New Image; in Windows Paint, click File -> New, when asked whether you want to save, click No, then press Ctrl + V)
  89. Make a new selection from the top-left corner to the bottom-right corner of the top shapes just to make sure you don't touch the big shapes 

    Selecting a Title

  90. Copy the selection
  91. Start a new file and paste the selection

    Creating a Title

  92. Save the file as bg1 and make it a GIF file. Save it in the images sub-folder of the wattsaloan folder
  93. Make a selection that contains only the top side of the two large shapes shapes

    Creating a Title

  94. Copy the selection
  95. Start a new file and paste the selection

    Creating a Title

  96. Paste in a new document (in PaintShop Pro, on the main menu, click Edit -> Paste As New Image; in Windows Paint, click File -> New, if asked whether you want to save, click No, then press Ctrl + V)
  97. Save the file as bg2a and make it a GIF file. Save it in the images sub-folder of the wattsaloan folder
  98. Make a new selection from the left side to the right side of the big shape without touching their top or bottom sides

    Creating a Title

  99. Copy the selection and paste it in a new file as bg2b and make it a GIF file. Save it in the images sub-folder of the wattsaloan folder
  100. Make a new selection from the left side, just above the rounding half circle to the bottom-right side of the big shape without touching their top or bottom sides

    Creating a Title

  101. Copy the selection and paste it in a new file
  102. Save the file as bg2c and make it a GIF file. Save it in the images sub-folder of the wattsaloan folder Open the index.htm file in your text editor
    • If you are working from Microsoft Windows and if you have Microsoft Office, start Microsoft PowerPoint. To create a blank slide, in the Home tab of the Ribbon, in the Slides section, click the arrow of the New Slide button and click Blank
    • If you are on Linux, start LibreOffice Draw
  1. Created a rounded rectangle:
    • Microsoft PowerPoint: On the Ribbon, click Insert.
      To start a rounded rectangle, in the Illustrations section, click Shapes and click Rounded Rectangle.
      Click inside the blank slide
      While the shape is still selected on the slide, on the Ribbon, click Format. Click Shape Outline -> Weight -> 1/4 pt
    • LibreOffice Draw: Click the arrow of the Basic Shapes button and click Rectangle, Rounded

      Rounded Rectangle

      Draw a rounded rectangle

 
 
 

Introduction to HTML and Graphics Files

 

Overview

Graphic files are used to embellish a webpage. Some HTML elements directly support pictures. In reality, you can use graphics anywhere on a webpage. You just need to be creative (CSS has better support for graphics and pictures; in fact, it is recommended that you use CSS most of the time). Two of the HTML elements that support graphics are the body and the table (and its child elements).

Most of the HTML elements that support pictures have an attribute named background. The value of this attribute is the path to a picture, including its extension.

Practical Learning: Introducing Graphics in a Webpage

Here are the pictures we will use If you want to use them, right-click each and follow the options on the screen to save them. Save the pictures in the images folder of your website:

Background

Background

Background

Background

  1. From the root directory (the public_html directory or the wattsaloan folder), open the index.htm file
  2. 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" height="110" background="images/bg1.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>
    
            <br>
    
            <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 width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" height="50" background="images/bg2c.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    </div>
    
    </body>
    </html>
  3. Save and close the file
  4. Open the aboutus.htm file
  5. Change the file 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" height="110" background="images/bg1.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td>
    
            <h1 id="top" align="center">About Us</h1>
    
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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&apos;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 &amp; 
    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>&nbsp;</td>
                <td><p><strong>Catherine Watts</strong> founded <b>Watts A Loan</b> from a 
    shining idea of creating personal loans that rebuild people&#39;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&#039;s degree in business management and 
    a Master&#x00027;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&eacute;sum&eacute; includes many major financial firms of different 
    types of businesses, including accounting firms, consumer services, 
    and Internet startups.</p>
    
                  <p>Frank holds a Bachelor&apos;s degree in financial accounting and a 
    Master&#039;s degree in banking strategies. Frank is in charge of the 
    <b>Watts A Loan</b> business orientation 
    and financial goals.</p></td>
                <td>&nbsp;</td>
              </tr>
            </table>
    
            <hr>
    
            <table>
              <tr>
                <td colspan="2"><h3>Human Resource and Corporate Outreach Officer: Justine Bene</h3></td>
              </tr>
              <tr>
                <td>&nbsp;</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&#039;s degree in human resources and holds 
    many professional certifications.</p></td>
              </tr>
            </table>
    
            <hr>
       
            <h2 id="finances">Finances &amp; 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" align="center">
            <tr>
        	  <td align="center"><b>Department</b></td>
      	  <td align="center"><b title="This section includes the budget allocated to each department">Revenues</b></td>
              <td align="center"><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 align="right">3,500,000</td>
              <td align="center">23.33%</td>
            </tr>
            <tr>
              <td>Loans/Services</td>
              <td align="right">9,000,000</td>
              <td align="center">60.00%</td>
            </tr>
            <tr>
              <td>Marketing</td>
              <td align="right">1,120,000</td>
        	  <td align="center">6.80%</td>
            </tr>
            <tr>
              <td>R &amp; D</td>
    	  <td align="right">1,350,000</td>
    	  <td align="center">7.33%</td>
            </tr>
            <tr>
    	  <td>Community Outreach</td>
    	  <td align="right">480,000</td>
              <td align="center">2.53%</td>
            </tr>
          </table>
    
          <hr>
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" height="50" background="images/bg2c.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    </div>
    
    </body>
    </html>
  6. Save and close the file
  7. Open the offices.htm file
  8. 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" height="110" background="images/bg1.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="images/bg2b.gif">
        <tr>
          <td width="320">&nbsp;</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" background="images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td><hr></td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
    <table width="960" height="50" background="images/bg2c.gif">
      <tr>
        <td width="10">&nbsp;</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">&nbsp;</td>
      </tr>
    </table>
    </div>
    
    </body>
    </html>
  9. Save and close the file
  10. Open the process.htm file
  11. 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" height="110" border="0" background="images/bg1.gif">
        <tr>
          <td>&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" border="0" background="images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" border="0" background="images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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>
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" height="50" border="0" background="images/bg2c.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    
    </div>
    
    </body>
    </html>
  12. Save and close the process.htm file
  13. Open the products.htm file
  14. Change the file as follows:
    <html>
    <head>
    
    <title>Watts A Loan: Products</title>
    
    <head>
    <body>
    
    <div align="center">
    
      <table width="960" height="110" border="0" background="images/bg1.gif">
        <tr>
          <td>&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" border="0" background="images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td>
    
      <h1>Watts A Loan: Products</h1>
    
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" border="0" background="images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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>
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" height="50" border="0" background="images/bg2c.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    
    </div>
    
    </body>
    </html>
  15. Save and close the products.htm file
  16. From the services folder, open the index.htm file
  17. Change 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" height="110" background="../images/bg1.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="../images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>
    
            <br>
    
            <h1 align="center">Services</h1>
    
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="../images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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>
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" height="50" background="../images/bg2c.gif">
        <tr>
          <td width="10">&nbsp;</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">&nbsp;</td>
        </tr>
      </table>
    </div>
    
    </body>
    </html>
  18. Save and close the services/index.htm file
  19. From the services folder, open the outreach.htm file
  20. 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" height="110" background="../images/bg1.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
        <tr>
          <td width="10">&nbsp;</td>
          <td>&nbsp;</td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="../images/bg2a.gif">
        <tr>
          <td width="10">&nbsp;</td>
          <td>
    
            <br>
    
            <h1 align="center">Watts A Loan: Community Outreach</h1>
    
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
      <table width="960" background="../images/bg2b.gif">
        <tr>
          <td width="10">&nbsp;</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>
          </td>
          <td width="30">&nbsp;</td>
        </tr>
      </table>
    
    <table width="960" height="50" background="../images/bg2c.gif">
      <tr>
        <td width="10">&nbsp;</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">&nbsp;</td>
      </tr>
    </table>
    </div>
    
    </body>
    </html>
  21. Save and close the file.
    If you had set up a website and if you are working from your computer, upload the files now
  22. Preview the index.htm file from your website or from your computer, and click the links

The Icon in the Address Bar

If you want the browser to show an icon in the address bar when your website is accessed, create an icon graphics file:

  • The file must be a graphic of type icon
  • It must be named favicon
  • It must have the .ico extension
  • It must have a size of 16x16
  • The file must be installed at the root (public_html or wattsaloan) of your website

The probably question is, what application do you use to create the icon? I don't know. I personnally use Microsoft Visual Studio where I start by creating an MFC application. I cannot encourage you to install the whole Microsoft Visual Studio (it is freely available from the Microsoft website) just to design a simple icon (it is not realistic to me).

   
   
 

Previous Copyright © 2015, FunctionX Next