Course Outcomes

Understand the principles of creating an effective

web page, including an in-depth consideration of
information architecture.
Develop a web page using HTML and CSS.
Develop responsive web pages with the help of CSS
 Demonstrate the JavaScript functions and events.
Construct websites using text, images, links, lists,
and tables for navigation and layout.
 Exposure To HTML
HTML document structure
 Working with HTML basic elements like title, head,
body
 Working with Root and Metadata
 Script and NonScript
 Horizontal Rules and line breaks and paragraph,
working with citation, quotation,definitions and
comments
 Types of Tags in HTML
 Working with Text, Links, Images , URLS, Multimedia
and Interactive in HTML
• Formatting text with HTML physical style
elements, Formatting text with HTML logical style
elements
 Creating links with anchor tag
 Multimedia- audio,video tags and attributes like
controls, autoplay and loop
 Working with images in a web page
 Cascading Style Sheets (CSS)
Introduction To CSS, Inline CSS, internal CSS and
external CSS
Introduction To CSS, Inline CSS, internal
 CSS selectors-type, id and class
CSS and external CSS • CSS selectors-
type, id and class • CSS properties-text
controlling and text formatting • CSS Box
 CSS properties-text controlling and text formatting
Model- Padding, Margin, Border • Div and
Span Tag in CSS, Working with
 CSS Box Model- Padding, Margin, Border
background Images

 Div and Span Tag in CSS, Working with background

Images
 Working with Tables and Forms
Working With Tables-Colspan and Rowspan
 applying css on tables
 creating hoverable tables
Working with Forms- action attribute, get and post
methods
 Form Elements and Controls Like Text Inputs,
TextArea, Buttons, CheckBoxes, Dropdown Boxes,
Radio Buttons, Select and File Select
 applying css on all controls of forms
 CSS Grids and Webpage Layouts
Grid introduction
 Grid container
 Grid Item
 Creating different layouts for webpage
 JavaScript Application Development
Incorporating JavaScript in the HEAD andBODY
element, Using an External JavaScript file, Using
variables and operators
 Usingcontrol statements such as if...else, switch,
break and continue, Using loopingstatements such as
while, do...while, for, Using Popup boxes such as
Alert, Confirm,and Prompt
 Working with JavaScript Objects,Properties and
Methods
 JavaScript Functions,Events and Validation

Working with Functions-Using function arguments

and return statement
 Working with JavaScript Events like Form Based,
Keyboard Based and Mouse Based
 JavaScript Form Validation
 Javascript DOM
DOM introduction
 DOM methods
 DOM document
 DOM elements
 DOM HTML, DOM CSS
 DOM Events
 Book and Web site References
Text Books: 1. HTML 5 COVERS CSS3, JAVASCRIPT,XML,XHTML,AJAX
by KOGENT LEARNING, DREAMTECH PRESS
 References:
1. WEB ENABLED COMMERCIAL APPLICATION DEVELOPMENT USING
HTML, DHTML,JAVASCRIPT, DHTML AND PHP by IVAN BAYROSS, BPB
PUBLICATIONS
2. BEGINNING HTML, XHTML, CSS AND JAVASCRIPT by JON DICKETT,
WILEY
Web Sites:
1.https://www.w3schools.com/
2.https://www.javatpoint.com/https://www.javatpoint.com/
 INTERNET PROGRAMMING
Program: A collection of instructions that can be executed by
a computer to perform a specific task.
Programming Language: Comprising a set of instructions that produce
various kinds of output.
Internet: A system architecture that has revolutionized
Communications and methods of commerce by allowing
various Computer Networks around the world to interconnect.
Internet Programming: It includes the syntax of scripting languages
and Internet programming concepts and examines topics related to
client-side scripting language programming as well as introducing topics
related to server-side scripting.
Example: HTML, CSS. Java script, SQL, PHP, Python, and . Net
 INTERNET PROGRAMMING
WWW: World Wide Web, which is also known as a Web, is a collection
of websites or web pages stored in web servers and connected to local
computers through the internet. Invented by a British scientist, Tim
Berners-Lee in 1989
URL: A web page is given an online address called a Uniform Resource
Locator (URL)
Difference between World Wide Web and Internet:
 INTERNET PROGRAMMING
Hypertext Markup Language (HTML): It is used for creating web pages.
It describes the structure of web pages through HTML elements or tags.
These tags are used to organize the pieces of content such as 'heading,'
'paragraph,' 'table,' 'Image,' and more. You can write HTML in any simple
editor such as Notepad. And other software such as Adobe
Dreamweaver, Sublime, NetBeans, Notepad ++, etc., are mainly used for
writing and editing HTML. ".html" or ".htm" are the two extensions used
to write and save HTML files; we can write HTML code in any text editor
and save it as "filename.html" or "filename.htm".
Web browser: It is commonly known as a browser, is a program that
displays text, data, pictures, videos, animation, and more. It provides a
software interface that allows you to click hyperlinked resources on the
World Wide Web.
Examples:
INTERNET PROGRAMMING
 INTERNET PROGRAMMING
Write HTML in Notepad: It is a basic application that comes with the
Windows operating system; It is commonly used to write and save texts.
Below are four steps to write, save, and run HTML using Windows
Notepad:
Step-1: Open a notepad
Step-2: Write HTML Code
Step-3: save the file as HTML document (i. e. filename.html or
filename.htm)
Step-4: Run the HTML page using any browser
Description of HTML
<!DOCTYPE>: It defines the document type or it instruct the browser about the version
of HTML.
<html > :This tag informs the browser that it is an HTML document. Text between html
tag describes the web document. It is a container for all other elements of HTML except
<!DOCTYPE>
<head>: It should be the first element inside the <html> element, which contains the
metadata(information about the document). It must be closed before the body tag
opens.
<title>: As its name suggested, it is used to add title of that HTML page which appears at
the top of the browser window. It must be placed inside the head tag and should close
immediately. (Optional)
<body> : Text between body tag describes the body content of the page that is visible to
the end user. This tag contains the main content of the HTML document.
<h1> : Text between <h1> tag describes the first level heading of the webpage.
<p> : Text between <p> tag describes the paragraph of the webpage.
Features of HTML:
1) It is a very easy and simple language. It can be easily understood and modified.
2) It is very easy to make an effective presentation with HTML because it has a lot of
formatting tags.
3) It is a markup language, so it provides a flexible way to design web pages along with
the text.
4) It facilitates programmers to add a link on the web pages (by html anchor tag), so it
enhances the interest of browsing of the user.
5) It is platform-independent because it can be displayed on any platform like
Windows, Linux, and Macintosh, etc.
6) It facilitates the programmer to add Graphics, Videos, and Sound to the web pages
which makes it more attractive and interactive.
7) HTML is a case-insensitive language, which means we can use tags either in lower-
case or upper-case.
Building blocks of HTML:
An HTML document consist of its basic building blocks which are:
Tags: An HTML tag surrounds the content and apply meaning to it. It is written between
< and > brackets.
Attribute: An attribute in HTML provides extra information about the element, and it is
applied within the start tag. An HTML attribute contains two fields: name & value.
Elements: An HTML element is an individual component of an HTML file. In an HTML
file, everything written within tags are termed as HTML elements.
Example:
<!DOCTYPE html>  
<html>  
  <head>  
    <title>The basic building blocks of HTML</title>  
 </head>  
  <body>  
       <h2>The building blocks</h2>  
       <p>This is a paragraph tag</p>  
       <p style="color: red">The style is attribute of paragraph tag</p>  
  </body>  
</html>