Scribd
Upload
28 views5 pages

Web Development - Day - 01 With Zain Ali

Learning web development from scratch

Uploaded by

isaacnewtondewizard
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
28 views5 pages

Web Development - Day - 01 With Zain Ali

Learning web development from scratch

Uploaded by

isaacnewtondewizard
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Web Development Course: Day One Material

Welcome to Day One of the Web Development Course! Today, we'll be starting with the basics of HTML.
By the end of this session, you should have a good understanding of what HTML is and how to create a
basic web page.

Day One Agenda:


1. Introduction to HTML

2. HTML Document Structure

3. Basic HTML Tags

4. Creating Your First Web Page

1. Introduction to HTML

HTML (Hypertext Markup Language) is the standard language used to create web pages. It provides the
structure of a webpage, allowing you to organize content using elements and tags.

2. HTML Document Structure

A basic HTML document consists of the following parts:

Code:

<! DOCTYPE html>

<Html>

<head>

<title>My First Web Page</title>

</head>

<body>

<h1>Welcome to My Web Page</h1>

1 Prepared by | Zain ali Contact us: +923225511832


<p>This is a paragraph of text on my web page.</p>

</body>

</html>

Description of code:

<!DOCTYPE html>: Declares the document type and version of HTML.

<html>: Root element of an HTML page.

<head>: Contains meta-information about the document, such as its title.

<title>: Sets the title of the document, which appears in the browser tab.

<body>: Contains the content of the HTML document, displayed in the browser.

3. Basic HTML Tags

some essential HTML tags you'll use frequently:

1-Headings: `<h1>` to `<h6>`

<h1>This is a heading</h1>

<h2>This is a subheading</h2>

2-Paragraphs: `<p>`

<p>This is a paragraph.</p>

3-Links: `<a>`

<a href="https://www.google.com">Visit Google</a>

4-Images: `<img>`

<img src="sample_image.jpg" alt="Description of image">

Lists:
1- Unordered Lists: `<ul>` and `<li>`

2 Prepared by | Zain ali Contact us: +923225511832


<ul>

<li>Item 1</li>

<li>Item 2</li>

<li>Item 3</li>

</ul>

2- Ordered Lists: `<ol>` and `<li>`

```html

<ol>

<li>First item</li>

<li>Second item</li>

<li>Third item</li>

</ol>

4. Creating Your First Web Page

So we create simple web page

1. Open a Text Editor:

- Use any text editor like Notepad (Windows), TextEdit (Mac), or a code editor like VSCode, Sublime
Text, or Atom.

2. Write the HTML:

<!DOCTYPE html>

<html>

<head>

<title>My First Web Page</title>

</head>

3 Prepared by | Zain ali Contact us: +923225511832


<body>

<h1>Welcome to My Web Page</h1>

<p>This is my first web page. I'm learning HTML!</p>

<a href="https://www.google.com">Click here to visit google</a>

<h2>My Favorite Animals</h2>

<ul>

<li>Cats</li>

<li>Dogs</li>

<li>Elephants</li>

</ul>

</body>

</html>

3. Save the File:

- Save the file with a `.html` extension, for example, `index.html`.

4. Open in Browser:

- Open the saved file in a web browser to see your web page in action.

So finally Wrap-Up day 01

Congratulations on completing Day One! Today, you learned the basics of HTML and created your first
web page. Practice writing more HTML to get comfortable with the tags and structure.

4 Prepared by | Zain ali Contact us: +923225511832


Homework:

1. Create an HTML document about your favorite hobby.

2. Use headings, paragraphs, lists, and links in your document.

Stay tuned for tomorrow's session, where we'll dive deeper into HTML and also I check your assigned
homework first before move on so done this on time and we learn more advanced elements and
attributes.

5 Prepared by | Zain ali Contact us: +923225511832

You might also like