Scribd
Upload
60 views45 pages

12 It Journal

Uploaded by

jyoshtna0075
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
60 views45 pages

12 It Journal

Uploaded by

jyoshtna0075
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 45

Roll No Exam No

“Education through Self-help is our Motto”-Karmaveer

Rayat Shikshan Sanstha’s

Sadguru Gadage Maharaj College, Karad.

CERTIFICATE
Department of Information Technology

Date: / /20

This is to certify that Mr./Miss --------------------------------------------------------------

-------------------------has satisfactorily carried out the required practical

work,prescribed by H.S.C Board, Kolhapur for J.C. course and this journal

represent his/her bonafide work in the year 2024-2025.

Teacher in Charge Examiner Head of Department

Information Technology
Index

Sr. Name of Experiment page


No no Date Signature
1 Creation of website using HTML5
Create a webpage using HTML5 and CSS code to
2 design a web page

create a website using HTML and CSS code


3 to design a web pages

4 Use of Audio on web pages using html5.

Use of Multiple Audio on web pages using


5 html5.

6 Use of video on web pages using html5.

Use of Multiple video on web pages using


7 html5.

With the help of the SEO tool which is freely


8 available optimize the website

With the help of the SEO tool which is freely


9 available optimize the website

10 Create a table using libreoffice

11 Create a queries using libreoffice

12 tally practical
Practical No 1
Q. Creation of website using HTML5
Create a website using HTML5 and CSS using any 4 css properties. Write a code for 2 separate pages having
different file name such first page as in-dex.html, 2 nd page as page 2.html as form.html. Use any theme such as
college profile or company profile etc. Every page must contain proper Meta information and design webpage as
follows-

1) The index page must contain a heading which is highest among other text on pages and must be at
center of the page. There must be a paragraph which introduces general information about the theme
chosen must have at least 3 physical style tags and one image with alternate text. This page must be
connected to other page with proper navigational links.
2) The 2nd page must contain the feedback or enrollment form related with theme chosen with feature of
html5. The form must contain text element and email address of the company or person. Include the
submit button.

*First coding:

<HTML>

<HEAD>

</TITLE> SKY EDUCATION </TITLE>

<Meta Charset="UTF-8">

<meta name ="author"content="Physical Tags">

<style>H1{border-style:dotted}

P{color:red;font-size:15pt}

b{text-decoration:overline}

u{text-align:right} </style>

</head>

<body>
<H1align="center">SKY EDUCATION </h1>

<P> everything is education, everything is learning, aim high, join sky </p>

<b>quality education</b><br>

<i>Experience Teacher </i><br>

<u> Regular test series</u><br>

<H3>Aim high, join sky</H3>

<img src="Tulips.jpg"width="150" Height="100"alt="sky"> <br><br>

<a href="second.html">second Page</a>

</body>

</html>

*Second coding:

<HTML>

<HEAD>

<TITLE>

FORM</TITLE>

<Meta charset="utf-8">
<meta name="author" content ="form">

<style>

H1{border-style:dashed}

body{background-color:aqua}

</style>

</head>

<body>

<H1 align="center">Entrollment Form</H1>

<form name="f1">

enter youe name

<input type="text"name="t1"required><br><br>

Enter your email

<input type="email"name="emailid"><br>

<input type="submit"name="submitbtn" value="submit">

</form>

<a href="ff.html">FIrst page</a>

</body>

</html>
Practical No.2
Q. Create a webpage using HTML5 and CSS code to design a web page as the layout
displayed below.

The top section will display the heading ,”Tourist places” in header. The section on the left has list of Cities. The
right hand side display tourist places in any one of the city.

Use Inline style sheet in the top section to display background colour for the text “Tourist places”. Use internal
stylesheet for the left and right section with background colour and font styles.

Tourist places

City Tourist places in Pune

1. Pune ● Shaniwarwada

2. Banglore ● Kelkar Museum

3. Hyderabad ● Sinhgad fort

4.Delhi

*First coding
<!DOCTYPE HTML>

<HTML>
<Head>

<Title>tourist place</title>

<style>

section {background-color:pink;width:50%;height:50%;float:right}

aside{width:50%;float:left}

ol{font-style:italic;font-size:15pt}

ul{font-weight:bold;font size:20pt}

</style>

</head>

<body>

<header style="background-color:skyblue;height:100pt">

<H1 align="center">Tourist place</H1>

</header>

<br>

<aside>

<H3>City</H3>

<ol>

<li>pune</li>

<li>banglore</li>

<li>hydrabad</li>

<li>delhi</li>

</ol>

</aside>

<section>
<H3>Tourist place in pune</H3>

<ul>

<li>shanivarwada</li>

<li>kelkar museum</li>

<li>sinhgad fort</li>

<li>aga khan palace</li>

</ul>

</section>

</body>

</html>
Practical No.3

Q.create a website using HTML and CSS code to design a web pages as
follows-
The first webpage will accept the name of the traveller, Date of travel, telephone number. It also has
submit button as an image.

The second webpage has information about the name of transporter, time, seat no and destination displayed
one below the other in the form of unordered list as

Name of transporter – Air Asia

Seat no – B39

Destination – Delhi

Both pages should be interlinked. Create external stylesheet with relevant tags.

First coding:

<!Doctype html>

<head>

<title>Information Form </title>

<link rel="stylesheet"type="text/css"

href="external.css">

</head>

<body>

<H1 align="center">Traveller Information Form</H1>

<form name=f1>

Enter Your Name

<input type="text" name="name">autocomplete<br><br>

Select Date of Travel

<input type="date"name="trdate"><br><br>

Enter Telephone Number


<input type="tel" name="phone" placeholder="123-456-7890"pattern="[0-9]{3}-[0-9]
{4}"required><br><br>

<input type="submit"name="submit" value="submit">

</form><br><br>

<a href="page2.html">

<img src="download.png"width="150"></a>

</body>

</html>

*Second coding:
<html>

<head>

<title>Information about Transport</Title>

<link rel="stylesheet"type="text/css"

href="external.css">

</head>
<body>

<H1 align="center">Information About Transporter</H1>

<ul>

<li>Name of Transporter-air Asia</li>

<li>Time-9:30am</li>

<li>Seat No-B39</li>

<li>Destination</li>

</ul>

<a href="page1.html">Connect First Page</a>

</body>

</html

For external

H1{color:navy;margin-left:20px}

body{color:red}

ul{font-family:algerian}
Practical No.4

Q. Use of Audio on web pages using html5.


Create a webpage named audio.html to set an audio file in web page with controls such that it uses html 5
elements. The audio file must play as soon as the webpage loads in browser and it will start over again, every
time when it is completed.

<!Doctype html>

<html>

<head>

<title>audio file</title>

</head>

<body>

<audio controls autoplay>

<source src="song.mp3"type="audio/mp3">

</audio>

</body>

</html>
Practical No.5

Q. Use of multiple Audio on web pages using html5.


Create a another webpage named audio1.html which provides
multiple source file formats for the same audio file that plays a
sound automatically with controls.The browser should display the
message with appropriate attribute,when audio file is not supported
by browser.The code must incorporate the list of sound files
formats(like wav,MP3 or ogg etc).

audio1.html

<html>
<head>

<title>multiple audio with controls</title>

<body>

<h1 align="center">Multiple Audio with controls</h1>

<h3>List of sound files formats</h3>

<ol>

<li>mp3-audio</li>

<li>ogg-audio</li>

<li>wav-audio</li>

</ol>

<audio controls>

<source src="C:\Users\ADMIN\Downloads\sample-3s.mp3"
type="audio/mpeg" >

</audio>

</body>

</html>
Output:
Practical No.6
Q.Use of video on web pages using html5.
Create a webpage named video.html to display a video file on web page and plays automatically.

<!Doctype html>

<html>

<head>

<title>video file</title>

</head>

<body>

<H1>video file</H1>

<video width="150" height"150" controls autoplay>

<source src="samplevideo.mp4" type="video/mp4">

</video>

</body>

</html>
Practical No: 7
Create a another webpage which provides multiple source file
formats for the same video file that plays a sound automatically
with controls.The dimensions of video area should be 100*100pixels.
The browser should display the message with appropriate
attribute,when video file is not supported by browser.The code must
incorporate the list of video files formats(like webM,MP4 or ogg
etc).

Vedio1.html

<!DOCTYPE html>

<html>
<head>

<title>Multiple Video File on web page with controls</title>

</head>

<body>

<h1 align="center">Multiple Video File on web page with controls</h1>

<h3>List of video files formats</h3>

<ol>

<li>mp4-video/mpeg</li>

<li>ogg-video/ogg</li>

</ol>

<video width="320" height="240" controls>

<source src="C:\Users\ADMIN\Downloads\sample-5s.mp4"
type="video/mp4">

<source src="C:\Users\ADMIN\Downloads\
file_example_OGG_480_1_7mg.ogg" type="video/ogg">

</video>

</body>

</html>
OUTPUT:
Practical No: 8
Q.With the help of the SEO tool which is freely available optimize the website
and write down the following findings.

1)Name of the website you are optimizing?


Ans:Freeimages.com
2)whether the site has title tag?

Q.3 Whether the site has Header Tags?If yes, which tags are there?
Q.4 Whether the imges used has Alt Atributes?

Q.5 What is the comment about usability

Practical No:9
Q.1 Total number of recommended improvement are?

Q.2 Mention grades given for the following point

i) SEO II) Usability III) Performance Iv)Security

Q.3 Whether the website has links with the social media? If Yes, Give name of
the social media.
Practical No:10

Q.1 Create a table student with fieldnames- roll no , studentname,


class, div, city,dob etc .Insert minimum 8 records
Practical No:11

Q.2 Create a table employee with field names-


empid,empname,empdept,empqual, empjoindate,empsal etc.insert
minimum 8 records.

Create queries to display records from the employee table

1) Where the employee qualifications is “MBA”


2) Where the employee Department is “Accounts”
3) Where the employee salary is >70000
4) Where the employee name is “ Mr.Suhas kale”
Practical No:12

You might also like