NGMS Hulstrom

HTML

Beginning:

Follow the basic structure - like a stick person without legs!

<!doctype html>
<html>

<head>
<title>This is My First Webpage</title>
</head>

<body>

Hello World!!!!

</body>
</html>

Which looks like: THIS

NOTE: Almost all tags begin <tag> and end </tag>

NEW PAGE!

Open notepad
Save the document as index.html into a new folder in your H drive in Tech ed – name the folder hobbies
Create your open and closing tags for your HTML, HEAD, TITLE, and BODY.
Make the background of your page yellow and the title of your page (at the top of the browser) say “(your name)’s Hobbies”
Within your BODY tags, create these elements:

A size 1 heading <h1> containing the same information as your title.
because we want it to show up inside your page as a heading.
Write a paragraph (about 50 words) [this begins and ends with a <p> tag] summarizing at least two of your hobbies.
Create a link to a new HTML page <a>in each hobby name (e.g., if you say you like cooking, then link that word to a page titled cooking.html).
Use breaks <br> to add a few blank lines below your paragraph. At that point, create a link that says ‘E-mail me’ to your preferred e-mail address.

Make sure you save your HTML page in Notepad and upload it to your shared folder on Google Drive.
Let me know when you are finished

More Tags:

<blockquote> This one pulls things away from BOTH edges of the page - right and left margins. You can use several to get more indented.
<body bgcolor="hex code or common color like red" background="bg.jpg">
TAG: body FIRST ATTRIBUTE: bgcolor SECOND ATTRIBUTE: background
each are set to a value using = as the assignment character
Note: there is a space before each attribute
<a href="http://www.google.com" target="_blank">
TAG: a FIRST ATTRIBUTE: bgcolor SECOND ATTRIBUTE: background
<img src="location and name of file with extension - like: images/flower.jpg" height="250px">
TAG: img FIRST ATTRIBUTE: src SECOND ATTRIBUTE: background
EXTRA PRACTICE: Create new pages for each of your hobbies.