ICM Blog Post 6

Our goal for week 6 was to create our own HTML page or modify/play with an existing website. We were to have pre-defined HTML elements, pre-defined CSS styles, HTML Elements generated by a p5 sketch, and some kind of mouse interaction with an HTML element. I decided to use the lovely specimen from the 1990s as a starting point and started by looking to change the background. I looked up old backgrounds and found this lovely picture, also shown below.

images.jpeg

I then decided to make a “retro” website about cookie monster (side note: I am not an avid cookie monster fan) off of the initial website from the 1990s. I used a lot of the same elements from the initial website, and replaced the images and text with information about cookie monster. I changed the order of some of the tables, changed the font, and tweaked some things from the original webpage. Below is a picture of the website that is extremely zoomed out, which can also be viewed here. The code for the website can be viewed here, which will not be copied below due to the massive amount of information.

A very lovely, simple picture of cookie monster, which is generated by a p5 sketch is at the bottom of the website. I wasn’t entirely sure how to incorporate HTML elements generated by the p5 sketch, so I just included the canvas from the p5 sketch. When you click the “click me click me click me” button, the background of the website changes color, which is shown below.

ezgif.com-video-to-gif.gif
ICMOlivia KungICM