1. GDSC – Fayoum University
2022 – 2023
WEB Development Introduction
2. What is Web Development?
Web development is the process of building and maintaining a website for
the internet or an intranet that is accessed through a web
browser and hosted on a server, either on on-premises hardware or in
the cloud. This includes everything from single plain-text webpages up to
complex web applications.
3. CODING
Web developers build websites by coding using different programming
languages. These languages consist of unique vocabularies, syntax
and commands that define the visual representation and functionality of
websites. Which language is used for development depends on
the platform, operating system or style of the website.
4. Some of the most common coding languages
include the following:
HTML
CSS
JavaScript
Python
C/C++
C#
5. What is HTTP?
-HTTP stands for Hyper Text Transfer Protocol
-WWW is about communication between web clients and servers
-Communication between client computers and web servers is done by
sending HTTP Requests and receiving HTTP Responses
6. World Wide Web Communication
-The World Wide Web is about communication between
web clients and web servers.
-Clients are often browsers (Chrome, Edge, Safari), but
they can be any type of program or device.
-Servers are most often computers in the cloud.
7. HTTP Request / Response
Communication between clients and servers is done
by requests and responses:
1- A client (a browser) sends an HTTP request to the web
2- A web server receives the request
3- The server runs an application to process the request
4- The server returns an HTTP response (output) to the
browser
5- The client (the browser) receives the response
8. What is a web browser?
• A web browser is a computer program that allows users to view
information, graphics, interactive pages and videos on the
Internet. Web browsers also know how to communicate with
web servers that host websites and pages that are transmitted to
computers.
9. 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.
10. The <!DOCTYPE html> declaration defines that this document is an HTML5
document
The <html> element is the root element of an HTML page
The <head> element contains meta information about the HTML page
The <title> element specifies a title for the HTML page (which is shown in
the browser's title bar or in the page's tab)
The <body> element defines the document's body, and is a container for all
the visible contents, such as headings, paragraphs, images, hyperlinks,
tables, lists, etc.
The <h1> element defines a large heading
The <p> element defines a paragraph
11. What is an HTML Element?
An HTML element is defined by a start tag, some content,
and an end tag:
<tagname> Content goes here... </tagname>
The HTML element is everything from the start tag to the
end tag:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
13. Empty HTML Elements
HTML elements with no content are called empty elements.
The <br> tag defines a line break, and is an empty element without a
closing tag.
14. <HTML> statements….<HTML>
●HTML tag: It is the root of the HTML document which is used to specify that the
document is HTML.
Document structure tags:
<head> statements….<head>
●Head tag: is used to contain all the head elements in the HTML file. It contains
the title, style, meta, … etc.
<body> statements….<body>
●Body tag: It is used to define the body of an HTML document. It contains images,
tables, lists, … etc.
15.
16. <title> name of the page.. <t/itle>
●Title tag: It is used to define the title of an HTML document.
Head tags:
18. <h1> name of the page.. </h1>
●Heading tag: It is used to define the heading of an HTML document.
Body tags:
19. <p> Statements ... </p>
●Paragraph tag: It is used to define paragraph content in an HTML document.
i
b
em
u
strike
Small
span
pre
Other tags :
20. ●Anchor tag: It is used to link one page to another page.
<a href ="url.."> statement.. </a>
<hr width ="val.." size ="val..">
●Horizontal rule tag: It is used to display the horizontal line in an HTML document.
<br>
●Break line tag: It is used for making a new line.
<!-- comment -->
●Comment tag: It is used to set the comment in an HTML document. It is not visible
on the browser.
22. <img src="path of img.." Alt=".."/>
<form >
<input type="…." name="….">
<button value="….." >
<form >
Type of inputs :
• Text
• Mail
• Number
• File
23. ●Radio button tag: It is used to select only one option from the given options.
25. ●Table tag: A table tag is used to create a table in an HTML document.
●Tr tag: It is used to define a row of an HTML table.
●Th tag: It defines the header cell in a table. By default, it set the content with the bold and
center property.
table