The assignment

Create a network of pages to tell a story or poem

• Link words, phrases, or images to other pages or element that expand upon your narrative. Your website can be purely text-based or include images.
• Your website could be informative, artistic or fun. What’s important is that it demonstrates how the web can be used to communicate in a non-linear way.
• You must include at least 4 different pages/links, or include a single page with many layered elements
• See examples for inspiration (lat section)

Resources & Tips

Embedding Javascript

You’re not expected to use JS for this project. That said, if you feel inspired, follow these instructions for help in embedding Javascript to your webpage: Javascript Resources

Additionally, I’ve compiled a list of fun libraries to use: JS Libraries

Embedding SVGs

SVG - or scalable vector graphics - is a standard format for rendering graphics at the web that scales across sizes. Unlike a raster-based image format like PNG or JPG image which stores color values for pixels, an SVG stores images as a set of points and lines between points. This means that:

• SVGs retain their resolution as you resize them! As in - SVG images do not become blurrier if you make them bigger
• SVG images are rendered natively in the browser, so you can adjust individual elements within an SVG image using HTML, CSS, and Javascript

If you want to embed shapes or images in your project, and have them work in tandem with code, you should consider using an SVG. You can generate SVGs from just about any graphics editing tool - simply export the image from your tool into an SVG format.

To import the SVG into your project:

1. Open the exported SVG in VS code (left image)
2. Copy paste the whole file and add it into your HTML (right image)