Web Development
Part I
Lecture 09
ESS1004 – Basic IT Skills
Web development refers to the creating, building and
maintaining of websites.
It includes aspects such as web design, web publishing, web
programming and database management.
1. HTML – Describes the contents of the webpage
2. CSS – Used to add styles to a plain HTML document
3. JavaScript – Makes the website dynamic, responds to user
2
HTML
• HTML stands for Hypertext Markup Language.
• It is used to create web pages.
• It tells the web browser what content to display.
• Uses a pre-defined set of elements to identify content types.
3
HTML Document
•Can be created using a text editor.
•All the HTML documents should have the extension
filename.html
•It require a web browser to view the document
Activity : Find the Advantages and Disadvantages of HTML
4
HTML Page Structure
5
Element Description
<html> Represents the root of an HTML document
<head> Contains machine readable information about the
document. Ex: title, scripts, style sheets
<link> Specifies relationships between the current document and
an external resource.
This element is most commonly used to link to CSS.
<title> Document’s title that is shown in a browser’s title
bar/page’s tab.
<body> Represents the content of an HTML document
6
Follow the steps to create and view in
browser
1. Open the text editor ex: Notepad, Notepad++
2. Enter the lines of code
3. Save the file with .html extension (choose save type as All
files)
4. Go to the folder and click on the html document
7
HTML Tags
• Every HTML document consists of tags and character data.
• Tags are elements enclosed in angle brackets.
• Character data is the content between an opening and
closing tag.
<title>My Page</title>
8
<h1>Heading</h1>
9
<p>Paragraph</p>
10
<pre>Preformatted</pre>
11
Other Text Formatting Tags
12
<a>Anchor</a>
13
<img>Image</img>
<img src= “Image location” alt=“Alternative text if the image doesn’t load”>
14
<figure>Figure</figure>
<figcaption> - define a caption for the photo
15
<iframe>Iframe</iframe>
16
<hr>Horizontal</hr>
17
<marquee>Highlight</marquee>
This tag is mainly used to deliver a specific message
to the visitor or to scroll Ads on a page.
18
HTML Comments
19
Background & Text Color
20
Thank You !
21
