Wrap-Up:
HTML Pt. 3

Covered Materials:

The end of this module brought with it new techniques and tools for;

  • organizing websites
  • identifying & grouping specific elements within websites
  • including & embedding multi-media content
  • adding metadata to further define our webpages

At this point, you should be feeling comfortable with HTML and the ways that this markup language allows developers and content creators to build and create webpages.

Starting in Topic-02, we have started with the absolute basics of HTML and moved through many topics showing you how to leverage this language for content structuring and presentation. As with any new language, your comfort level and familiarity with HTML will increase with practice and use. This not only includes your own writing of webpages with HTML, but the necessary step of reading other’s HTML to understand how they use the language to present content and solve problems. This latter task is greatly facilitated by the open nature of the Internet, and the fact that all content is sent as documents to your web browser, allowing you to view others source code.

Remember to stay patient with yourself as you assimilate all of this new information you have learned and begin to create you own webpages. Learning a new language is not an easy task.

For your homework, you will be asked to practice the specific topics presented this week, while continuing to incorporating techniques introduced the previous four weeks. As you work on your assignments for the week, pay particular attention to:

  • structure
  • legibility
  • clarity
  • readability

This also means spending time thinking about grouping similar types of elements and identifying particularly important elements with the use of the id and class attributes. This is a crucial step to increased structural organization of your documents. This will be particularly true as we start looking at how to style our documents next week. Spending time thinking about clarity, readability, and organization this week will pay dividends.

Part 3/3 of Project 2

Concluding your chosen theme of cooking, arts and crafts, or academic lesson, you’re going to add audio-video content, iframes, and extra markup to your project.

These pages should be properly linked to each other and your index.html where applicable.

about.html

For this module, you should have created your about.html which is structured with ids and possibly divs and classes. It should also contain a self-hosted video or audio element (either one you source or the one I provided). This page could contain 3 paragraphs about you as a creator (chef, instructor, craftsperson, etc) or your resoning behind selecting your Instructable content. You should also include an address and map to your location (this can be UM or fictional).

more-info.html

In addition, you should have created a second page containing a third-party hosted video or audio piece. What you choose to include is up to you, but should be relatable to your project. This might be:

  • A podcast or video from a professional.
  • An audio recording of yourself discussing your Instructable.
  • A video featuring more information about your material.
  • A video showcasing something artsy or interesting about your material.
  • Etc.

readme.md

Continue documenting your learning progress in your Project 2 Readme as you go along. For example, can you describe what the difference is between self-hosted and third-party-hosted media?

Moving Forward

As mentioned, next week we will start to look at CSS or Cascading Style Sheets. The second of the three languages that all browsers must be capable of understanding. This is quite exciting, as it will allow you to transform your “plain” looking pages. This work will build directly off of your knowledge and understanding of HTML. Therefore, if you are still struggling with any topics or concepts, please leverage your resources (i.e. the instructors, class issues forum, and google) and take the time this week to bring everything taught so far in this semester together.

Homework

You are expected to have completed these tasks:

  1. Completed your about.html and more-info.html pages for Project 2, The Instructable, as per the requirements found on the previous page.
  2. Submitted a link to your (1) /project-2 repo and (2) live site (home page) to the Moodle Workshop.

Previous section: