🍎
Introduction to Web Development
  • Introduction To Web Development
  • Tools
    • Notes: Web Development Process
    • Notes: Replit
    • Notes: GitHub
    • Notes: Replit + GitHub Integration
    • GitHub Pages Hosting
  • Week 1: HTML
    • Notes: HTML
    • Notes: Working With Images
    • Project: Hello World
    • Project: Subject of Interest
  • Week 2: CSS
    • Notes: CSS
    • Using CSS for Layout
      • Notes: Box Model
      • Notes: Flexbox
      • Notes: Responsive Layout
    • Project: Styling Subject of Interest
    • Project: Image Gallery
  • Week 3: JavaScript and HTML Forms
    • Notes: JavaScript
    • Notes: Processing HTML Forms with JavaScript
    • Project: Dynamic Style Change
    • Project: Mad Libs
  • Week 4: Web Site Using Bootstrap
    • Notes: Anatomy of a URL
    • Notes: Content
    • Notes: Bootstrap
    • Notes: Overriding Bootstrap
    • Notes: Favicons
    • Notes: License
    • StartBootstrap Templates
    • Project: Bootstrap Website
  • Wrap Up
  • Videos
Powered by GitBook
On this page
  1. Week 1: HTML

Project: Subject of Interest

PreviousProject: Hello WorldNextWeek 2: CSS

Last updated 1 year ago

This is an assignment where you will choose a photo you find interesting and some URLs that you can link to from a web page that are related to the photo. You'll create a paragraph about your photo and then code some items in a list that allow your user to navigate to the web pages that relate to the photo.

Here are some specific instructions:

  • Navigate to or

  • Use the search tool to find a horizontal image (width is greater than height) that you find interesting

  • Download the image on a device that you can run replit on so that you can upload it to replit

  • Start a replit with an HTML/CSS/JS Template

  • Upload the image to replit

  • Modify the HTML content so that you can write a paragraph, display an image, and provide a list of links to web pages that related to the image

Use the tags below to render elements from your HTML code:

  • h1 Header 1

  • p Paragraph

  • div Division

  • img Image

  • h2 Header 2

  • ol or ul Ordered List or Unordered List

  • a Anchor

  • li List Item

  • footer Footer

Here's a picture of a pages created to fullfill these requirements.

Unsplash.com
Pexels
Subject of Interest