Web Designing 101 Class


#21

Not sure. What I see is Text Document.


#22

That’s fine also.


#23

I am done.


#24

Course Text is here

What is HTML?

HTML is the standard markup language for creating Web pages.

* HTML stands for Hyper Text Markup Language
* HTML describes the structure of Web pages using markup
* HTML elements are the building blocks of HTML pages
* HTML elements are represented by tags
* HTML tags label pieces of content such as "heading", "paragraph", "table", and so on
* Browsers do not display the HTML tags, but use them to render the content of the page

#25

@Anelaw, paste this code in the text file and Save As “index.htm”

 <!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

#26

After that, open the file using your browser.


#27

The code is in an image, so you will have to type it manually in your text file.


#28

Okay. Because I was having trouble highlighting it.


#29

This is how the code works:

The <!DOCTYPE html> declaration defines this document to be HTML5
The <html> element is the root element of an HTML page
The <head> element contains meta information about the document
The <title> element specifies a title for the document
The <body> element contains the visible page content
The <h1> element defines a large heading
The <p> element defines a paragraph

#30

HTML Tags

HTML tags are element names surrounded by angle brackets:

<tagname>content goes here...</tagname>

HTML tags normally come in pairs like, the first tag in a pair is the start tag, the second tag is the end tag. The end tag is written like the start tag, but with a forward slash inserted before the tag name


#31

You can highlight and paste now @Anelaw


#32

gosh. I am done. Do I save and open now?


#33

Yes. loool Save as “Index.htm”. Then open it using your browser.


#34

Out put should look like this :point_down:t6::point_down:t6::point_down:t6:

Page Title

My First Heading

My first paragraph.


#35

Done!


#36

Next, I want you to edit the your Title to “My First Webpage”, Your Heading to “About @Anelaw” and the paragraph should be 5 lines describing your personality. This is mine:

<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
</head>
<body>

<h1>About Funsho</h1>
<p>Funsho is a quiet person. He enjoys reading books on history and sociology, he is single and enjoys the company of women, he is a Christian deist</p>

</body>
</html>

This is the result :point_down:t6::point_down:t6::point_down:t6:

My First Webpage

About Funsho

Funsho is a quiet person. He enjoys reading books on history and sociology, he is single and enjoys the company of women, he is a Christian deist


#37

So in summary, this is the structure of a webpage:


#38

hmm. Will the edits be in the original file? Because I cant see icons on the web page.


#39

Yes, edit your “index.htm” file to display like this :slight_smile:


#40

You are not supposed to see the tags on your webpage. Your webpage will only display whatever is between the body tag --> <body> </body>