GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
IT6503 – WEB PROGRAMMING
Unit 1 LECTURE
Web page Designing using HTML
HTML:-
HTML is a markup language for describing web documents (web pages).
HTML stands for Hyper Text Markup Language A markup language is a set of markup tags
HTML documents are described by HTML tags
Each HTML tag describes different document content
Html structure:-
Basic Elements of Html:- LISTTABLESFORMS
NITHYAKANI.P UNIT-I Page 1
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
FRAMESLIST:-
HTML offers three ways to specify the lists of information.
All lists must contain one or more list elements.
LIST CODE DISPLAY
<html><head> <title> recruiters </title> </head> <body>
<ol><li> tcs</li><li> hcl</li><li> cts</li>
</ol> </body></html>
TABLE :-
The HTML tables allow users to arrange data into rows and columns of cells.
The HTML tables are created using the <table> tag in which the <tr> tag is used to create table
rows and <td> tag is used to create data cells.
NITHYAKANI.P UNIT-I Page 2
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
TABLE CODE DISPLAY
<!DOCTYPE HTML><html> <head><title>Campus Recruitment Program 2014-2015 </title> </head> <body> <table border="1"> <caption><h3><b> Eligibility criteria for Students <b> </h3> </caption> <tr> <th> Degree </th> <th>Percentage / CGPA</th> </tr> <tr> <td>X</td> <td>60%</td> </tr> <tr><td>XII</td> <td>60%</td> </tr> <tr> <td>B.TECH</td> <td>68% / 6</td> </tr> </table> </body> </html>
NITHYAKANI.P UNIT-I Page 3
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
FORM:- A form will take input from the user and then will post it to a back-end application such as CGI,
ASP Script or PHP script etc.
The back-end application will perform required processing on the passed data based on defined
business logic inside the application.
E.g.: online banking, online purchasing, online registration etc.
Form
elements
Starting Tag Ending Tag Description
Form <form> </form> defines the form
Input < input > - Get the input from the user
Select <select> </select> Defines the drop down list
Option <option> </option> Defines the option to select
INPUT TAG
ATTRIBUTESType Description
Text type=”text” Defines normal text input
Radio type=“radio" Defines radio button input (for selecting one of many choices)
Submit type=”submit” Defines a submit button (for submitting the form)
Password type=”password” Defines password. Masks the character as user enters
Checkbox type=”checkbox” Defines a checkbox button(for selecting one of many option)
FORM DISPLAY
NITHYAKANI.P UNIT-I Page 4
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
<!DOCTYPE HTML>
<html> <head>
<title>REG FORM</title></head> <body>
<h4>Student Info</h4>
<FORM>
Student Name:<input type="text" width="20">
<br> Batch:<select>
<option type="" value="2012 to 2016">
2012 – 2016 </option>
<option type="" value="2011 to 2015">
2011 – 2015 </option>
</select><br> <br>
</form></body> </html>
FRAMES:-Frames is used to display more than one HTML document in the same browser window.
Each HTML document is called a frame, and each frame is independent of the others.
Elements of Frames:
1. The Frameset Tag
The <frameset> tag defines how to divide the window into frames.
Each frameset defines a set of rows or columns.
The values of the rows/columns indicate the amount of screen area each
row/column will occupy.
Format:
<frameset cols=”25%,25%,50%”>
2. The Frame Tag
The <frame> tag defines what HTML document to put into each frame.
NITHYAKANI.P UNIT-I Page 5
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
FRAMES DISPLAY
<!DOCTYPE html><html><h1> placement <h1><frameset rows="50%,50%"><frame src="eligibility.html"><frame src="regform.html"></frameset></html>
CLIENT SIDE AND SERVER SIDE SCRIPTING:-
CLIENT SIDE SCRIPTING:-
The client-side environment used to run scripts is usually a browser.
NITHYAKANI.P UNIT-I Page 6
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
The processing takes place on the end users computer.
The source code is transferred from the web server to the users computer over the internet and run
directly in the browser.
The scripting language needs to be enabled on the client computer.
The problem with client-side scripts is the limit of control and problems with operating systems
and web browsers.
Languages:- JAVASCRIPT
VBSCRIPT
PYTHON
ACTION SCRIPT
Server side :-
The server-side environment that runs a scripting language is a web server.
A user's request is fulfilled by running a script directly on the web server to generate dynamic
HTML pages. This HTML is then sent to the client browser
It is usually used to provide interactive web sites that interface to databases or other data stores on
the server.
Server-side programming can also be encrypted when users send form variables, protecting users
against any hack attempts.
server-side programming languages are C#, VB.NET, and PHP, ASP, RUBY,JAVASCRIPT, PYTHON
NITHYAKANI.P UNIT-I Page 7
GIT-DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
NITHYAKANI.P UNIT-I Page 8