1. Chapter 1 Introduction to HTML
Main Reference: Shelly Cashman, Woods and Dorin (2007), HTML – Comprehensive Concepts and Techniques, Fourth Edition

2. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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 sites
Discuss Web browsers and identify their purpose
Define Hypertext Markup Language (HTML) and the standards used for Web development
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

3. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

4. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
1. The Internet
Worldwide collection of networks that link together millions of businesses, the government, educational institutions, and individuals
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

5. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

6. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
2. 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)
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

7. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
Web Servers
Web pages are stored on a Web server or host
Publishing is the process of copying files to a Web server
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

8. Web Site Types and Purposes
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

9. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
Internet Site
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

10. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
Internet Site
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

11. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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 hyperlinks
Clicking a hyperlink allows you to move quickly from one Web page to another
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

12. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
Hyperlinks
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

13. 3. Hypertext Markup Language
Hypertext 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>
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

14. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

15. Hypertext Markup Language
HTML 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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

16. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

17. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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>
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

18. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
HTML Elements
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

19. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
HTML Coding Practices
Use capitalized tags to separate tags from contents
Use ending tags whenever possible
Separate sections of HTML code with spaces
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

20. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
tags are capitalized
spaces between sections of code
use of ending tags
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

21. 4. Tools for Creating HTML Documents
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

22. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

23. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

24. 5. Web Development Life Cycle
Ensures project consistency and completeness
Planning
Analysis
Design and Development
Testing
Implementation and Maintenance
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

25. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

26. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
Web Site Planning
Identification of the Web site goals or purpose
Understand who will use the Web site
Understand what Web technologies you will use
Identify the content owners and authors
Decide what and where information will go on the Web site
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

27. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

28. Web Page Design and Development
Purpose
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

29. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

30. Web Page Design and Development
Web Site Organization
Linear Web site layout
Hierarchical Web site layout
Webbed Web site layout
Narrow Web site layout
Deep Web site layout
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

31. Web Page Design and Development
Hierarchical Web Site Layout
Webbed Web Site Layout
Narrow Web Site Layout
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

32. Web Page Design and Development
Linear Web Site Layout
Deep Web Site Layout
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

33. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
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
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

34. DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1
EXAMPLE: WEB SITE USABILITY QUESTIONNAIRE
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1

35. Web Site Implementation and Maintenance
Implementation involves the publishing of Web pages to a Web server
Determine who is responsible for updates to the Web page
Limit the ability of certain users to update the Web page
Web site monitoring
Utilize logs to keep track of Web site usage and statistics
DDZ 2112 WEB BASED APPLICATION DEVELOPMENT 1