M1: HTML & the Web
Class Recap: In this module, you were introduced to the history of the web and HTML. Some very basic HTML tags were introduced, as well as the syntax for writing them. In our class you set up your own domain, and web hosting service. And finally, you created your very first HTML page using a text editor.
Student Outcomes:
|
In class
Create an HTML document with your name as the main heading, your city as sub heading, a paragraph about yourself, and another paragraph about why you are interested in this subject.
Type Matters
I hope you had fun with this exercise. The point is that TYPE MATTERS.
Now think about the basic type setting method we learned in class. How to use simple hierarchy to design your page.
Now think about the basic type setting method we learned in class. How to use simple hierarchy to design your page.
M1 Discussion
What computer platform are you using: Mac, PC, or Linux?
What web browser do you use by default?
Also, if you have a smartphone, which platform do you use: IOS, Android, Windows Phone, Blackberry, etc.? Explain a bit why you chose each particular platform.
Please <click here> to participate discussion. (Participation points)
What web browser do you use by default?
Also, if you have a smartphone, which platform do you use: IOS, Android, Windows Phone, Blackberry, etc.? Explain a bit why you chose each particular platform.
Please <click here> to participate discussion. (Participation points)
M1 Homework:
1. View the videos in M2 and complete the tasks
2. Finish your introduction page and post the page on your site as index.html page
Due Date:
Description:
1.1 Secure a web host and domain name (Should be completed in class)
1.2 Create your first html document
Based on what you learn in class, create a simple HTML page to introduce yourself. Your introduction should include but not limited to:
a. Image(s). Suggested images: photographs of yourself or family, funny moment of your past. Save your images at 100% of the size you want to use at 72dpi. For example, if you need the images be 500px by 200px, save your image at that exact size at 72dpi. (We will talk more about the image later in this course).
b. An introduction with text (your name, major, and where you are from). You can add additional text (optional).
c. Your hobbies, interests, aspirations, experience, if any.
d. What is your plan after graduating from school.
e. Anything else could be helpful for your classmates to know you.
f. Once completed, please post the url address to discussion board.
Save your image(s) in a folder named “image”, save your introduction page as index.html, upload the “image” folder and this page to your web server, submit URL before next class.
1.1 Secure a web host and domain name (Should be completed in class)
1.2 Create your first html document
Based on what you learn in class, create a simple HTML page to introduce yourself. Your introduction should include but not limited to:
a. Image(s). Suggested images: photographs of yourself or family, funny moment of your past. Save your images at 100% of the size you want to use at 72dpi. For example, if you need the images be 500px by 200px, save your image at that exact size at 72dpi. (We will talk more about the image later in this course).
b. An introduction with text (your name, major, and where you are from). You can add additional text (optional).
c. Your hobbies, interests, aspirations, experience, if any.
d. What is your plan after graduating from school.
e. Anything else could be helpful for your classmates to know you.
f. Once completed, please post the url address to discussion board.
Save your image(s) in a folder named “image”, save your introduction page as index.html, upload the “image” folder and this page to your web server, submit URL before next class.
Purpose:
The purpose of this assignment is to introduce yourself to your classmate, also review the basic technical skills we’ve learned in class. Using basic html tags such as <img> <p> tags. Familiar yourself with basic html page structure.
The purpose of this assignment is to introduce yourself to your classmate, also review the basic technical skills we’ve learned in class. Using basic html tags such as <img> <p> tags. Familiar yourself with basic html page structure.
Tools:
Notepad, SimpleText, DreamWeaver, CoffeeCup, Coda2 (any software of your choice. We will demo DreamWeaver in class)
Notepad, SimpleText, DreamWeaver, CoffeeCup, Coda2 (any software of your choice. We will demo DreamWeaver in class)
Submission Directions:
- Secure a web host and domain name (Should be completed in class)
- Create a directory named "images"
- Upload your images to the "images" folder
- Upload your new index.html file to root directory (this file should replace the file we uploaded in class)
- Open a browser window, type in yourdomainname.html the new page should show up
- Check your page to make sure all the images show up on the page correctly (if you follow the direction your image tag should look like this: <img src="images/imagename.jpg">)
- <click here> to post your URL on homework submission discussion page
Grading Criteria:
Exceeds expectations (A/B) | Meets expectations (C) | Does not meet expectations (D/F) | |
---|---|---|---|
Content | Thorough and insightful understanding of content. | Complete understanding of content. | Shows incomplete understanding of material. Missing content. |
2pts | 1.5pts | 1pt | |
Creativity | Enthusiastically uses materials and ideas for enhancement. | Use of materials and ideas for enhancement. | Shows minimal effort for enhancement of materials and ideas. |
3pts | 2pts | 1pt | |
Technical | Excellent use of HTML and CSS. No broken links. Accessibility considered. | Good use of HTML CSS and JS. Meet technical requirement. | Site production is incomplete. Needs improvement. Site might contain missing links, missing graphics. |
3pts | 2pts | 1pt | |
Meeting Deadline | The assignment was turned in on time | The assignment was turned in late. | |
2pts | 0pt |