HTML 101


Published on

Published in: Technology, Design
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

HTML 101

  1. 1. EXERCISE 4: HTML 101<br />By Dan Adamo, Anna Kalimouline, Oliver Zhang, George Lewis, Daryl Lee <br />Class: MPM17<br />Date Due: October 12, 2011<br />
  2. 2. WHAT IS A WEBSITE?<br />A website is essentially a connected group of pages on the World Wide Web regarded as a single entity, usually maintained by one person or organization and devoted to a single topic or several closely related topics.<br />
  3. 3. What is a webpage?<br />A webpage, on the other hand, is a document on the World Wide Web, consisting of an HTML file and any related files for scripts and graphics, and often hyperlinked to other documents on the Web which are normally accessed by using a browser.<br />
  4. 4. How to Create a Website / WebPage<br />In order to create a website you need a few things:<br />A folder on a server<br />Notpad/TextEdit or Dreamweaver<br />FTP Client <br />Web Browser Ex. IE, Safari, Chrome<br />
  5. 5. Creating a Website / WebPage<br />Step 1: Open a Notepad and save as index.html<br />Step 2: The first thing you type in the notpad is the Doctype. So insert: <!DOCTYPE html><br />Step 3: Type <html> on next row and press "Enter" couple times just to give use some space to work with<br />Step 4: Type </html> on the last row<br />Step 5: We need to make a title of our page so next we type <title>"type your title here without quotation"</title><br />Step 6: Now the page is still empty. We have to type <body> on next row and type </body> on the row before </html><br />
  6. 6. Creating a Website / WebPage<br /><ul><li>Step 7: We begin the page with a heading. We will type <h1>"type your heading without quotation"<h1>.
  7. 7. Step 8: Finally, we need a paragraph on our page. To do that, we type <p> on next row and hit "Enter" a coupe time just to have some space for our paragraph. Then type </p>
  8. 8. Step 9: Now you can type anything you want in between <p> and </p></li></li></ul><li>Adding Links / Images to Webpage<br />Step 9: We can insert a link of other website by typing <a href="type the website address here inside the quotation"</a><br />Step 10: To display a picture on our page, we need to start on next row and type < imgsrc = "paste the link of the picture inside the quotation" /> (The image must be in the same folder as index.html)<br />Image:<br />Link:<br />
  9. 9. How to Post to Image Arts Server?<br />Step 1: Download FTP Client a universal client is FileZilla<br />Step 2: Connect to the image arts server by filling out the host:"". Your username:the initial of your first name + your full lastnameand your password:the last 7 digits of your student ID<br />Step 3: Find your personal folder which is located under a subfolder called /fmpm11 insert your Index.htmlfile plus any images or links into the folder.<br />Step 4: Your URL is user name <br />Ex.<br />