Web Programming for Non-Programmers

DH 110

Fall 2017

Credits: 4

Requirements Met: SC

Class Meeting Metadata
Meets: MW
R (lab)
2:30 - 3:55pm
8:35 - 10:00am
Classroom: CGL 211 (MW) & CGL 114 (R)
Instructor's Metadata
Instructor: Jason T. Mickel, Ph.D.
E-Mail: mickelj@wlu.edu How to Email a Professor
Phone: (540) 458-8653
Office: Leyburn M33
Office Hours: M 11:15 - 12:15
W & R 1:00 - 2:00
Or by appointment

Programming Assignment #1: Introducing Yourself in HTML50 points

Due Tuesday, September 19 @ 11:55pm


Learning new languages to build web pages is hard enough without having to dream up content. Let's put your new HTML skills to use by developing a personal profile page that you could share with a future employer.

Steps to Complete the Assignment

  1. Click the link above and follow the same steps as you did in Lab 00 or refer to "Getting Started with VSCode and GitHub".
  2. Inside the folder for bio-YOURUSERNAME in VSCode, create a new file called index.html.
  3. Establish the framework for a new HTML document as discussed in class including the DOCTYPE, html, head, and body tags.
  4. Add a title tag to the head portion of the file with a value of Personal Profile for YOUR_NAME (e.g. "Personal Profile for Jason T. Mickel").
  5. Within the body tags:
    1. Your full name in an a level 1 heading tag.
    2. Add a div set of tags. Within the div, add your major(s) and minor(s) in bold followed by your expected graduation year in italics (but not bold) and surrounded by parentheses.
    3. Surround both the heading with your name and the div with your majors/minors with header open and close tags.
    4. Create a section with a brief introductory paragraph about yourself inside it.
    5. Start a new section that contains a level 2 heading of "Key Traits:" followed by an unordered list of three of your strengths that you want others to know about.
    6. Start another new section containing a level 2 heading of "Working On:" followed by an unordered list of two things you would like to improve on.
    7. Start a third section with a level 2 heading of "Learning Programming Will:" followed by an ordered list of the top three things that you hope to do with the knowledge you get from this course.
    8. Start a final section with a description list of three websites would recommend to someone interested in topics related to your major or future major. The description term should be the name of the site, which links to the site's URL, and each link should open in a new window. The description definition should offer a brief summary of what the site is about or covers. Do your links actually work?
    9. Create a footer section with the word "Copyright", the current year, and your name.
  6. Use GitHub desktop to commit and sync your project by completing the steps listed in the document from step 1 above.


HTML should be properly formatted following the style conventions discussed in class.

You can use the live preview extension in VSCode to test the page as you're building (click Preview Available in the lower left of the VSCode window), but when you're finished, be sure to check the live URL at https://dh110f17.github.io/bio-YOURUSERNAME (e.g. "https://dh110f17.github.io/bio-mickelj") to see that it is completely uploaded and working.

The final result should look similar to this:

Sample image for how the results of Lab 1 should look

Grading Specifications

You will be graded on:

  1. Accurately meeting all of the specifications above
  2. Following HTML coding rules and conventions discussed in class and in the textbook

The lab will begin with a full score of 50 points and deductions will be made according to the amount and severity of errors.