HW#1 --- last modified September 12 2022 19:16:37.

Solution set.

Due date: Sep 12

Files to be submitted:
  Hw1.zip

Purpose: To gain experience writing simple HTML pages.

Related Course Outcomes:

Specification:

1. In-Person Demo. Before or on the homework due date, each student needs to show me during the In-Class Exercise time or in my office hours on their laptop that they have installed Apache, PHP, and Mysql or MariaDB. You can do this by installing these individually or by installing a developer stack such as MAMP, WAMP server, or XAMPP. Depending on your setup, I will test that your installation is working by going to the phpMyAdmin page. This portion of the homework must be demo'd individually to receive points, not as a group. The remainder of the assignment can be done in a group.
2. For the second part of the homework I'd like you to experiment with your browsers web-developer tools. The top 20 US Web-sites vary considerably in the complexity of their landing pages and load times. Some use HTTP/3, some don't. Web Developer tools are an important set of tools built-into most modern browser. These tools both let you examine the structure of web-pages are why they were rendered in a given way, as well as let one time the load times of various components of a page. For this part of the assignment, I want you to use these tools to determine the following: (a) average download size and standard deviation of the landing page with resources. Here I want two averages (one for uncached/first-hit to the web site, one where resources might have been cached). (b) Make a histogram of caching mechanisms used by top 20 sites (as determinable by HTTP responses), and number of sites that use that mechanism. (c) Make a separate histogram with number of the top 20 sites using only HTTP/1.1, only HTTP/2.0, and only HTTP/3.0. (d) Somewhere on this last histogram indicate average download times for site in each of these categories.
3. For the last part of the homework, I would like you to make a website written using only modern HTML (no Javascript and no server side scripts) consisting of at least three pages. The theme for these pages should be connected to your political campaign to run for meme-catcher (not related to K-Pop group Dreamcatcher). You should image it is the far-future, so people no-longer run for dog-catcher/animal control. Instead, they try to control insidiously silly memes. Here are the minimal requirements for your website:
   1. Each page of your site should use a <link> tag to specify a favicon. You should include this icon in your Hw1.zip folder.
   2. Each page of your site should have at least two <a> tags to two other HTML 5/Living Standard validating pages in your site. The href attributes in these tags should use relative paths so it doesn't matter what folder your page is served from.
   3. Each page should have at least one <img> tag that correctly loads a png image that you include in your Hw1.zip folder. The src attribute of this tag should use a relative path.
   4. Each page should at least once constructively use the following tags: <ul>, <table>, <span>. You can use the span tag for example to give a tooltip for some item on the page.

Point Breakdown