Introduction: Intermediate HTML

intro

Now that you have been introduced to some basic HTML tags, it is time to expand your knowledge of the markup language in order to add hyperlinks, images, and tables to your web page. These elements of HTML, particularly hyperlinks and images are what make HTML-created web pages user-friendly and visually-appealing.

Objectives

objectives By the completion of the module, students will be able to:

  • Use the <a></a> tag to create hyperlinks (absolute reference links, relative reference links, and email links) in an HTML document.
  • Differentiate between an absolute reference link and a relative reference link.
  • Explain when each reference type (absolute and relative) would be used in a web page / site.
  • Identify the parts of a URL; to include: the protocol, the domain name, the domain type, the file path, and the file name
  • Include important attributes in the opening <a> tag to make it functional and informational; attributes to include:
    • href=""
    • target=""
    • title=""
  • Understand basic image vocabulary to include: raster-based image, pixel, and resolution.
  • Differentiate between the different web-compliant image file formats available.
  • Analyze image and web design needs and use appropriate image file formats to suit those needs.
  • Add an <img> tag and src="" attribute to display an image in a web page.
  • Understand that images are not stored in an HTML document but their location is referenced by the src="" attribute.
  • Add the alt="" attribute to the <img> tag and explain why it is a best practice to do so.
  • Specify the dimensions of an image using the width="" and height="" attributes.
  • Determine an image’s width and height dimensions using Microsoft Paint.
  • Zip/compress folders for submission.
  • Create an HTML table using <table>, <tr>, <th>, and <td> tags.
  • Add a border to a table using the border="" attribute.
  • Modify the color of a table, a row[s], or data cell[s] using the bgcolor="" attribute.
  • Change the background color of a page using the bgcolor="" attribute in the <body> tag.