Web design basics 1

18
MS Alam TRIVUz Class # 02 TRIVUz Academy WebSite Development Web Design - 1

description

WebSite design basics

Transcript of Web design basics 1

Page 1: Web design basics 1

MS Alam TRIVUz

CEO, Shabaka Soft Ltd.

Class # 02

TRIVUz Academy

WebSite Development

Web Design - 1

Page 2: Web design basics 1

What to do?

Page 3: Web design basics 1

Before we Start

Web Design Basics

Session # 01

Web Server (Hosting)

Web Pages(Web Site)

FTP

File Transfer Protocol

Have a look, figure out which part we are going to do first.

Page 4: Web design basics 1

Before we Start

Web Design Basics

Session # 01

Web Server (Hosting)

Web Pages(Web Site)

FTP

File Transfer Protocol

Have a look, figure out which part we are going to do first.

1. Create our first web Document called Webpage

Page 5: Web design basics 1

Define Task

Web Design Basics

Session # 01

1. Create our first web Document

called Webpage

2. Upload our page to webserver

3. Browse our site using any web

browser

Page 6: Web design basics 1

Tools & LanguageCreating Web

Page

Web Design - 1

1. A Text Editor, maybe notepad

2. Basic Knowledge of HTML

Page 7: Web design basics 1

What is HTML?

HTML

Web Design - 1

Page 8: Web design basics 1

IntroductionHTML

• HTML stands for Hyper Text Markup Language

• HTML is not a programming language, it is a

markup language

• A markup language is a set of markup tags

• HTML uses markup tags to describe web pages

- w3schools.com

Web Design - 1

Page 9: Web design basics 1

HTML TagsHTML• HTML markup tags are usually called HTML tags

• HTML tags are keywords surrounded by ange

brackets like <html>

• HTML tags normally come in pairs like <b> and

</b>

• The first tag in a pair is the start tag, the

second tag is the end tag. It also known as

opening tags & closing tags.

- w3schools.com

Web Design - 1

Page 10: Web design basics 1

HTML Documents

HTML

• HTML documents describe web pages

• HTML documents contain HTML tags and plain

text

• HTML documents are also called web pages

• Web browser can read HTML documents and

display them as Web Pages.

- w3schools.com

Web Design - 1

Page 11: Web design basics 1

Our First HTML DocumentHTML

<html>

<body>

<h1>Our first Heading</h1>

<p>

This is our first paragraph in web page

created with HTML markup language

</p>

</body>

</html>

Web Design - 1

Page 12: Web design basics 1

Saving HTML DocumentHTML

To save HTML document follow the step

1. Click File > Save As

2. Name the file as index.html

3. Open the index.html with any web browser

- w3schools.com

Web Design - 1

Page 13: Web design basics 1

OutputHTML

Page 14: Web design basics 1

More HTML TagsHTML

Lets learn more HTML Tags

Bold Tag: <b>Text</b>

Italic Tag: <i>Text</i>

Underline Tag: <u>Text</u>

Paragraph Tag: <p>Text</p>

HTML Images: <img src=“path/image.jpg” />

Hyper Link: <a href=“file.html”>Link

Text</a>

Web Design - 1

Page 15: Web design basics 1

HTML ElementsHTML

Web Design - 1

An HTML element is everything from the start tag to the end tag:

Start Tag * Element content End tag *

<p> This is paragraph </p>

<a href=“index.html”>

This is a link </a>

<br />

Page 16: Web design basics 1
Page 17: Web design basics 1
Page 18: Web design basics 1

Thank You

MS Alam TRIVUz

Head of ResearchTRIVUz Network (IT Research Since 2003)

Lead Software EngineerRxRD Inc, Florida, USA

CEOShabaka Soft Ltd.

[email protected]+88 01712 084408