2.1: Core Concepts in HTML Coding
These videos introduce HTML coding and will help orient you to the subsequent lessons dealing with specific elements and attributes used in HTML coding. Note that these videos deal with some more advanced topics (like interactive forms); while learning these topics is easily within the reach of the self-taught student, they are beyond the scope of this course.
2.1.1: HTML Comments
Comments are a crucial part of well-written code. They can document the function of different elements of a site, which can be invaluable as you are learning code and may be prone to forgetting what different parts of your file are for. They also can be used to temporarily eliminate portions of your code that are not working correctly, which may be helpful as you troubleshoot problems. Finally, in advanced coding, comments are used to communicate with other web technologies - you may not need to know this now, but if you find comments that look a lot like computer code elsewhere on the Web, it may prove useful. Keep in mind however, that comments are delivered with the functioning code, so they are available to any curious user who looks at the source code for a website.
2.1.2: HTML Hyperlinks
Hyperlinks are the characteristic innovation of the Web that allows you to click on portions of a webpage in order to automatically navigate to another webpage, another part of your website, or even an anchor within the page you are currently using. Be sure to read each section of this article about hyperlinks.
Using the information from the above reading, try to include a link to a URL on the Web in your "index.htm" file. Then, try creating a second *.htm file with different content than "index.htm" and link to that on your home computer. Be sure to add comments describing the links you add.
2.1.3: HTML Lists
As you learned in subunit 1.3: Writing for the Web, users of the Internet tend to look for information very quickly and lists are a user-friendly way to make your information easy to find. Additionally, lists are often used to organize the elements of a menu; since we will be returning to this special use of lists, don't worry about it right now.
Using the information in the previous reading and your pre-writing assignment, try to incorporate one or two types of informational lists into your example webpage.
2.1.4: HTML Tables
Tables are used on the Web in much the same way that they are used in word processing: to present tabular data. This use-case is extremely helpful for users, as it makes information easy to locate and see. In this chapter, Mobbs notes that tables can also be used to structure the elements of a webpage, since you can include images, paragraphs, and many other elements inside each cell. Generally speaking, this is a use-case for tables that has been superseded by the use of CSS to position and organize content and should be avoided. In conceptual terms, the reason for this is that using tables to organize content is effectively a use of HTML for presentational information - which is CSS's job. Instead, tables should be used for semantic information - that is, to designate a part of an HTML file as tabular data, rather than to specify how that data is presented. That said, in some Content Management Systems, tables may be the only convenient way to organize content in an HTML file. In these cases, using tables to organize content is fine.
This chapter provides some additional syntax for tables that may be of use in situations where you must organize content using tables, rather than simply using them to present tabular data. Again: this is not a recommended practice and has been superseded by the use of CSS to position and organize content, but is sometimes necessary when content management systems limit the abstraction of presentational from semantic content.
Undertake the exercises suggested in the above article, then attempt to incorporate tabular data of some kind into your example "index.htm" webpage.
2.1.5: HTML Quotations
This chapter introduces tags for marking up quotations both in-line and as block-quotes.
Based on what you have just read, incorporate both types of quotations into your example "index.htm" webpage.