Web Development
BY ABRAR AHMED
Marks distribution 2020-2021
Marks distribution Total Marks 100
Class Participation 20
(Behavior + Class work +Performance)
Assignments/Homework 20
Quiz/Practical Exam 40
Presentation 10
Project 10
What is Web Development
Web development is the work involved in developing a Web site for the Internet (World
Wide Web) or an intranet (a private network).
Web development can range from developing a simple single static page of plain text to
complex Web-based Internet applications, electronic businesses (Ecommerce), and
social networking.
https://www.bbc.com/
https://www.noon.com/
https://www.facebook.com/
https://www.emiratesnbd.com/
What is HTML?
HTML stands for Hyper Text Markup Language
HTML is the standard markup language for creating Web pages
HTML describes the structure of a Web page
HTML consists of a series of elements
HTML elements tell the browser how to display the content
HTML elements label pieces of content such as "this is a heading", "this is a paragraph",
"this is a link", etc.
What is an HTML Element?
An HTML element is defined by a start tag, some content, and an end tag:
<tagname> Your Content </tagname>
The HTML element is everything from the start tag to the end tag:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
HTML Code Editor
Download Notepad++
https://notepad-plus-plus.org/downloads/v7.8.8/
First HTML Code
<!DOCTYPE html> EXPLANATION
<html> The <!DOCTYPE> declaration represents the document type, and helps
browsers to display web pages correctly.
<head>
The <html> element is the root element of an HTML page
<title>Page Title</title>
The <head> element contains meta information about the HTML page
</head>
Metadata is "data that provides information about other data". In other words,
<body> it is "data about data."
The <title> element specifies a title for the HTML page (which is shown in the
<h1>My First Heading</h1>
browser's title bar or in the page's tab)
<p>My first paragraph.</p>
The <body> element defines the document's body, and is a container for all
<p>This is another paragraph.</p> the visible contents, such as headings, paragraphs, images, hyperlinks, tables,
lists, etc.
</body>
The <h1> element defines a large heading
</html>
The <p> element defines a paragraph
How to run HTML Code
1. Open Notepad++
2. Write Some HTML
3. Save the HTML Page in folder.
Select File > Save as > "index.htm“
4. View the HTML Page in Your Browser
HTML Page Structure
HTML Attributes
All HTML elements can have attributes
Attributes provide additional information about elements
Attributes are always specified in the start tag
Attributes usually come in name/value pairs like: name="value“
Example:
<a href="https://www.aisch.ae/ ">American International School</a>
<img src="img_girl.jpg" width="500" height="600">
HTML Basic Formatting - Tags
Formatting - Tags Description
<h1> <h6> Used for Headings, titles or subtitles
<p> paragraph- starts with a new line
<strong> Bold text format
<em> Italic text format
<small> Smaller text format
<sub> Subscript text format
<sup> Superscript text format
<del> Strike through format
<ins> Underlined format