Вы находитесь на странице: 1из 15

Program Semester Subject Code Subject Name Unit number

: MBA : IV : MI0041 : Java and Web Design :2

Unit Title
Lecture Number Lecture Title

: Basic Web Page Development


:2 : Basic Web Page Development

HOME

C onfidential NEXT

Unit-2 Basic Web Page Development

Basic Web Page Development

Objectives :
To analyse the basic tags that structure the HTML document.

To build a Web page with a mark-up language.


To organise your Web content for effective presentation. To use links to effectively guide the reader to the content. To decide if you need use a Web page development tool.

2
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Lecture Outline
Introduction World Wide Web

HTML Basics
Creating HTML Document Building a Web Page Basic Aspects of Web Layout

Create Web Page Using Notepad


Text and Image Formatting Hyperlinks Web Development Tools

Summary
Check Your Learning Activity
3
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Introduction

Website is a collection of many Web pages.

We can create a user friendly Website by:


Making a clear presentation of the data on the Web page. Using text and graphics to make the Web page user friendly.

In this session, we will learn the techniques of developing a basic Web page.

4
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

HTML Basics

Hyper Text Mark-up Language (HTML): One of the most popular languages in the creation of Web page. Tim Berners Lee developed HTML in 1989.

HTML tags:

Inbuilt commands to determine operations that will be performed on


the text to be displayed on Web page.

Tags are written using angled brackets.

Start tag and end tag are two types of tags.


Example: <p> "The content of the paragraph" </p>

5
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Creating HTML Document

Nested HTML element

Tags used to provide hyperlink

Attribute

Value

Appears as hyperlink on Web page and when clicked opens up www.google.com 6

PREVIOUS HOME

CNEXT onfidential

Unit-2 Basic Web Page Development

Building a Web Page

1
Gather the right content

2
Organise the content logically

3
Design the Web page with simple and reliable interfaces, and navigations

4
Plan for the placement of content on Web page

7
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Basic Aspects of Web Layout

Space and white space:

- Utilise the entire space on the Web page.


- Consider the screen resolution. Images and graphics: - Check image size and position. Text width / Scan length: - Set a proper width.

8
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Create Web Page Using Notepad

1.

Write a HTML code using notepad.

2.

Give a name for your document and save it as HTML document using .html or .htm extension.

3.

Locate the HTML document and double click on it to view the Web page.
9
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Text and Image Formatting

10
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Hyperlinks

Hyperlinks refer to links in a Web page. Syntax to create hyperlink: <a href="url">Link text</a> Example: <p>The national bird of <a href = "http://www.indiafirst.com"> India</a> is Peacock.</p> Example to link an image to an URL: <a href="http://www.imageworld.com"><img src="Picture12.gif"

width="130" height="101"></a>

11
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Web Development Tools

Web development tools are software that assists in designing Web pages easily and efficiently. Popular Web development tools: Dreamweaver

- was initially developed by Macromedia but is owned by Adobe.


FrontPage - is developed by Microsoft.

12
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Summary

HTML is one of the most popular languages used in the

creation of Web page.


HTML tags refer to inbuilt commands to determine operations that will be performed on the text to be displayed on Web page. To build a Web page we have to gather and organise content, then design the Web page interfaces, and then plan to place content on Web page. Popular Web development tools are dreamweaver and FrontPage.

13
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Check Your Learning

1. What is a HTML tag?

Ans. HTML tag is an inbuilt commands to determine operations that will


be performed on the text to be displayed on Web page. 2. Name any two popular Web development tools.

Ans. Dreamweaver and FrontPage.


3. What is the syntax to create a hyperlink? Ans. <a href="url">Link text</a>

14
PREVIOUS HOME
CNEXT onfidential

Unit-2 Basic Web Page Development

Activity

1.

Make a list of the popular Web developing tools available in the market today, and analyse how they can be used to build a Web page.

15
PREVIOUS HOME
Confidential

Вам также может понравиться