Introduction To HTML

WEB DEVELOPMENT
(HTML&CSS)
PRESENTED BY:
SYED ABDULLAH HASSAN
M.ZAKRIYA

Internet
• Internet can be defined as the
worldwide network where
machines like computers, servers,
and smart devices are connected
together for communication and
data exchange purposes.
• Internet is the network of
networks interconnecting
computing devices located
throughout the world. These
networks use some
communication protocols to link
the network devices with each
other.

World Wide Web
• The World Wide Web (WWW) is a network of
online content that is formatted in HTML and
accessed via HTTP.
• The term refers to all the interlinked HTML pages
that can be accessed over the Internet.
• The World Wide Web was originally designed in
1991 by Tim Berners-Lee while he was a
contractor at CERN.
• The World Wide Web is most
often referred to simply as
"the Web."

Internet vs Web
• The internet is an enormous network of billions of
connected computers and other hardware devices. Each
device can connect with any other device as long as they're
both connected to the internet with valid IP addresses.
• Web, on the other hand, consists of all the web pages you
can view when you access the internet.
• The internet — not the web — is also used for email,
instant messages, newsgroups, and file transfers.
• In other words, the web is just a large portion of the
internet, but it isn't all of it.

Domain Name vs IP Address
• A domain name is your website name. A domain name is the
address where Internet users can access your website. A
domain name is used for finding and identifying computers on
the Internet.
• Computers use IP addresses, which are a series of number.
However, it is difficult for humans to remember strings of
numbers. Because of this, domain names were developed and
used to identify entities on the Internet rather than using IP
addresses.

Inter Service Provider
• An Internet Service Provider (ISP) is the
industry term for the company that is able to
provide you with access to the Internet,
typically from a computer.
• An ISP is your gateway to the Internet and
everything else you can do online. The second
your connection is activated and set up, you'll
be able to send emails, go shopping, do
research and more.

Website MindMap
 Structure
 Content
 Layout

Importance of HTML
• HTML is easy to use and
understand
• All browsers support HTML
• HTML is free
• Most development tools support
HTML
• HTML is most search engine
friendly
• In most cases, HTML is all you
need
• Everything is eventually translated
to HTML on internet.
HTML is the
"mother tongue"
of your browser.
HTML was invented in 1990 by a scientist called Tim Berners-Lee.

HTML: What is it?
• HTML stands for Hyper Text Markup Language
• An HTML file is a text file containing small markup tags
<HTML> </HMTL>
• The markup tags tell the Web browser how to display the
page
• An HTML file can be created using a simple text editor or a
WYSIWYG editor

Anatomy of a Website
Your Content + HTML: Structure + CSS: Presentation = Your Website
 A website is a way to
present your content to
the world, using HTML
and CSS to present that
content & make it look
good

HTML TAG SYNTAX
• An HTML element starts with a start tag /
opening tag
• An HTML element ends with an end tag /
closing tag
• The element content is everything
between the start and the end tag
• Some HTML elements have empty content
• Empty elements are closed in the start tag
• Most HTML elements can have attributes

HTML Page Structure
<!DOCTYPE html>
<html>
<head>
<title>
Title of the document
</title>
<link rel=“stylesheet” type=“text/css”
href=“main.css” />
</head>
<body>
<h1>
HTML Document
</h1>
<p>
This is a sample HTML document to
understand basic structure.
</p>
</body>
</html>

Tag Description
<html> Defines an HTML document
<title> Defines a title for the document
<body> Defines the document's body
<h1> to <h6> Defines HTML headings
<p> Defines a paragraph
<br> Inserts a single line break
<a> Defines a hyperlink
 Defines a comment
<strong> Defines important text
<img> Defines an image

Tag Description
<form> Defines an HTML form for user input
<input> Defines an input control
<textarea> Defines a multiline input control (text area)
<button> Defines a clickable button
<select> Defines a drop-down list
<optgroup> Defines a group of related options in a drop-down list
<option> Defines an option in a drop-down list
<label> Defines a label for an <input> element
<fieldset> Groups related elements in a form

What is CSS ?
• CSS stands
for Cascading Style Sheets
• Styles define how to
display HTML elements
• Styles were added to HTML
4.0 to solve a problem
• External Style Sheets can
save a lot of work
• External Style Sheets are
stored in CSS files

CSS Syntax
Selector
• all elements of a specific type, e.g. the second
level headers h2
• to elements specified by attribute, in
particular:
– id: is used to specify a style for a single, unique
element.
– Class : is used to specify a style for a group of
elements. Unlike the id selector, the class
selector is most often used on several elements..
Declaration Block
A declaration block consists of a list
of declarations in braces. Each declaration itself
consists of a property, a colon (:), and a value. If
there are multiple declarations in a block, a
semi-colon (;) must be inserted to separate
each declaration.

3 Ways to Insert CSS
• External style sheet
• Internal style sheet
• Inline style

Content Management Systems
• A content management system (CMS) is a
software application or set of related
programs that are used to create and
manage digital content.
– Better Content Management System
– Consistency in Look and Feel of Website
– Complete control over the Website
– Updatable Anytime with Simple
Customizations

Easy web development
• Wordpress.com
• Site123.com

Introduction To HTML

More Related Content

Similar to Introduction To HTML (20)

Recently uploaded (20)

Introduction To HTML

Editor's Notes