html comprehensive concepts and techniques intro project introduction to html

HTMLComprehensive Concepts and Techniques

Intro Project

Introduction to HTML

2

Objectives

Describe the Internet and its associated key terms

Describe the World Wide Web and its associated key terms

Identify the types and purposes of Web sitesDiscuss Web browsers and identify their

purposeDefine Hypertext Markup Language (HTML)

and the standards used for Web development

3

Objectives

Describe Web editors and their relationship to Web development

Discuss the five phases of the Web development life cycle

Describe Web site layouts and the purpose of each layout

Describe the importance of testing throughout the Web Development Life Cycle

4

The Internet

Worldwide collection of networks that link together millions of businesses, the government, educational institutions, and individuals

5

The Internet

A network is composed of a group of computers that are connected together to share resources and information

The Internet backbone is a high-speed data line that connects major computer systems

An Internet Service Provider (ISP) is a company with a permanent connection to the Internet backbone

6

The World Wide Web

Part of the Internet that supports multimedia and consists of a collection of linked documents, called Web pages

A Web site is a collection of Web pages that are created and maintained by an organization or individual

Relies on Hypertext Transfer Protocol (HTTP)

7

Web Servers

Web pages are stored on a Web server or host

Publishing is the process of copying files to a Web server

8

Web Site Types and Purposes

9

Internet Site

10

Internet Site

11

Web Browsers

Web Browsers are required to view Web pages– Microsoft Internet Explorer– Netscape Navigator

Uniform Resource Locator (URL)Web pages are linked together by the

use of hyperlinksClicking a hyperlink allows you to move

quickly from one Web page to another

12

Hyperlinks

13

Hypertext Markup LanguageHypertext Markup Language (HTML) is

used to create Web pages– Set of special instructions called tags and

markups

Web page files contain text and HTML tags– Tags mark the text to define how it

displays when viewed in a browser• Ex. <B> <P> <HR>

14

15

Hypertext Markup LanguageHTML is platform independent

– Can be created on one type of computer and viewed on another type of computer

World Wide Web Consortium maintains HTML standards– Several versions of HTML exist today– Each new version expands capabilities

16

17

HTML Elements

HTML is a subset of Standard Generalized Markup Language (SGML)– SGML is a standard for how to organize

and tag elements of a document

<B>sample text</B>

18

HTML Elements

19

HTML Coding Practices

Use capitalized tags to separate tags from contents

Use ending tags whenever possibleSeparate sections of HTML code with

spaces

20

tags are capitalized

spaces between sections of code

use of ending tags

21

Web Editors

Text Editor– Program that allows a user to enter,

change, save, and print text, such as HTML

– No advanced features– Allows you to develop HTML documents

easily

22

23

Web Editors

HTML Editor– Program that provides basic text-editing

functions– Microsoft’s Save as Web Page feature

WYSIWYG Editor– Utilizes a graphical user interface– Microsoft FrontPage– Macromedia Dreamweaver

24

Web Development Life CycleEnsures project consistency and

completeness– Planning– Analysis– Design and Development– Testing– Implementation and Maintenance

25

26

Web Site Planning

Identification of the Web site goals or purpose

Understand who will use the Web siteUnderstand what Web technologies

you will useIdentify the content owners and

authorsDecide what and where information will

go on the Web site

27

Web Site Analysis

Identify the tasks users need to complete

Consider the processes required to support Web site features

One of the more important phases in the Web Development Life Cycle

28

Web Page Design and DevelopmentPurpose

– Professors publish to inform students– Businesses publish to advertise products

or to give support– Organizations publish to keep members

informed– Individuals publish to share hobbies and

knowledge

29

30

Web Page Design and DevelopmentWeb Site Organization

– Linear Web site layout– Hierarchical Web site layout– Webbed Web site layout– Narrow Web site layout– Deep Web site layout

31

Web Page Design and Development Linear Web Site Layout

Webbed Web Site LayoutHierarchical

Web Site Layout

Deep Web Site Layout

Narrow Web Site Layout

32

Web Site Testing

Web sites should be tested at various stages of the WDLC

Review of Web page content, functionality, and usability

Usability is the measure of how well the Web page allows a user to accomplish goals– Usability testing

33

34

Web Site Implementation

and MaintenanceImplementation involves the publishing

of Web pages to a Web serverDetermine who is responsible for

updates to the Web pageLimit the ability of certain users to

update the Web pageWeb site monitoring

– Utilize logs to keep track of Web site usage and statistics

35

Summary

Describe the Internet and its associated key terms

Describe the World Wide Web and its associated key terms

Identify the types and purposes of Web sitesDiscuss Web browsers and identify their

purposeDefine Hypertext Markup Language (HTML)

and the standards used for Web development

36

Summary

Describe Web editors and their relationship to Web development

Discuss the five phases of the Web development life cycle

Describe Web site layouts and the purpose of each layout

Describe the importance of testing throughout the Web Development Life Cycle