Skill objective

This class-long workshop will cover the basics of hosting files on a web server, HTML (Hyper Text Markup Language), and some CSS (Cascading Style Sheets). By the end of the workshop, we’ll be able to present text, links, and images on a website.

Assignment

1. First, you will create a personal homepage for the class. To do this, first download starter-package.zip. Then edit open up index.html in Sublime Text, the code editing program. Replace my name with your own name. Then put some sort of portrait or avatar in the place of my image. To do this, paste an image in the images/ folder. Then, in index.html, link it appropriately using the img tag.

2. You will then be making at least three different versions of your personal homepage. To do this, make a folder within “assignments” called “workshop01”. You will then create your versions here. You can call each one version1.html, version2.html, version3.html, etc.

3. Each version HTML page should display A) Your name B) An image of “you” C) A link to the next version. The point here is to get familiar with displaying text, displaying images, and linking (hypertext, the primary feature of HTML!)

3A) Put your name between h1 tags
3B) Put your image in with img tag
3C) Link to the next version with a tag

With CSS, please style each version in a different way. Think about how the styling (font choice, size, color, etc.) somehow resonating with the “version” of you. As discussed in the workshop, you can either choose to inline or external stylesheet.

When you are done

By Tuesday’s class, your personal homepage should have a link to 
“Workshop 1”. This should link to version1.html, which links to your other versions.Please make sure to have at least three versions.

To see my example versions, click here. To view the source code of a website in Chrome, click "View" in the top navigation, then Developer, then View Source.