Web Development I


Columbia College Chicago | Spring 2020

Assignments

Assignment 02a: HTML Basics

Prompt

Create 3 HTML pages that look like the 3 screen shots I've uploaded here. The three files should be called:

  1. elements.html
  2. basic-portfolio.html
  3. nested-lists.html

How to submit:

Upload the three files to Assignment 02a on Canvas.

How to receive full credit:

  • I should be able to download and look at each of your uploaded files.
  • Visually, your pages should like the screenshots.
  • For the elements.html file, your page should use the appropriate elements (h1, h2, h3, p, ul, etc.) as stated in the screenshot
  • If you use images, make sure to use images that you find online that you link to. I won't be able to see images you have on your own computer.

Notes for getting started:

  • Write clean code! Make sure you indent and nest your tags correctly, so that it's easy to tell what tags are inside of other tags, and whether or not you still need to close a tag
  • You can use whatever colors, links, or images you'd like, but the spacing and structure of each page should mirror the example screenshots
  • For your CSS styling, use in-document styling (write your CSS in between two
    <style>
    tags in the
    <head>
    ) section of your .html file. (although typically, we write our CSS in separate documents).
  • If you get stuck, try to think about your problem in human language, and Google it!
    • For example: if you don't know how to make a list with bullet points, you don't have to know exactly what that's called in HTML; you can just Google 'How to make a bullet point list in HTML.'