SlideShare a Scribd company logo
1 of 26
1 CSWB 110 HTML / XHTML Tutorial 1.1 and 1.2 up to lists
2 History of the Internet   ,[object Object]
1989-90 the World Wide Web (WWW) Begins
1993 Mosaic is Released
1994 Netscape is Released
1995 Internet Explorer is Released,[object Object]
4 HyperTextDocuments An entire collection of linked documents is referred to as a Web site.   The hypertext documents within a Web site are known as Webpages. A Web page can contain text, graphics, audio, video. These are separate files that also reside with the html file
5 Web Servers and Web Browsers A Webpage is stored on a Web server  The browser or clientdisplays the Web page  The Web page is written in the HTMLlanguage They communicate with the HTTPprotocol
6 Search.htm
7 www.palomar.edu/search.htm search.htm image.jpg
8 How is the home page loaded?
9 www.palomar.edu searches for  default file
10 Which page to load as Home Page?? ,[object Object]
index.htm
home.html
home.htm
default.htm
default.asp, default.aspx, index.asp, index.aspx,[object Object]
Goal of XHTML Portability Accessibility Standardization 12
How was this accomplished Separation of content from presentation by using Cascading Style Sheets (CSS) CSS replaces many HTML attributes 13
14 Tools for Creating HTML Documents HTML Editor – Coffeecup Text editor – notepad Visual creator – Dreamweaver,  SharePoint Designer Converter – MSWord
The HTML Language Elements ( or tags) Attributes Values (of the attributes) 15
Characterisitcs of HTML5 Open platform Adapts to any device Native support for more powerful applications 16
   The HTML language consists of  “tags” or “elements” Tags can be two-sided: <body>     </body>  Enclose something – either content or more tags Tags can be one-sided: <br>  or  <br/>   No content, they are considered “empty” tags 17 XHTML syntax
HTML Tags and Attributes 18
The HTML Document Consists of two parts: Head section Where information for the browser goes Body section Where the content for the web pages goes 19

More Related Content

Viewers also liked

Sexual Harassment By School Employees
Sexual Harassment By School EmployeesSexual Harassment By School Employees
Sexual Harassment By School Employees
William Kritsonis
 
E Maturity and School Development
E Maturity and School DevelopmentE Maturity and School Development
E Maturity and School Development
Peter Micheuz
 
Extra Curricular Activities - Dr. W.A. Kritsonis
Extra Curricular Activities - Dr. W.A. KritsonisExtra Curricular Activities - Dr. W.A. Kritsonis
Extra Curricular Activities - Dr. W.A. Kritsonis
William Kritsonis
 
13 primary source pack isaiah 53 & tradition history
13 primary source pack  isaiah 53 & tradition history13 primary source pack  isaiah 53 & tradition history
13 primary source pack isaiah 53 & tradition history
Jonathan Swales
 
Ruby 1.9.2 has been released!
Ruby 1.9.2 has been released!Ruby 1.9.2 has been released!
Ruby 1.9.2 has been released!
Yuki Sonoda
 
League for Innovation Conference Presentation March 5 2014
League for Innovation Conference Presentation March 5 2014League for Innovation Conference Presentation March 5 2014
League for Innovation Conference Presentation March 5 2014
Randy Malta
 
קמפיין פסח 2010
קמפיין פסח 2010קמפיין פסח 2010
קמפיין פסח 2010
feelternet Ltd
 
Effective Presentations- Delivering the right message to stakeholders
Effective Presentations- Delivering the right message to stakeholdersEffective Presentations- Delivering the right message to stakeholders
Effective Presentations- Delivering the right message to stakeholders
Dennis Connelly
 
Chi2011 closing plenary
Chi2011 closing plenaryChi2011 closing plenary
Chi2011 closing plenary
desney
 

Viewers also liked (20)

Court Case 3
Court Case 3Court Case 3
Court Case 3
 
Sheri Miller-Williams & Dr. W.A. Kritsonis
Sheri Miller-Williams & Dr. W.A. KritsonisSheri Miller-Williams & Dr. W.A. Kritsonis
Sheri Miller-Williams & Dr. W.A. Kritsonis
 
Sexual Harassment By School Employees
Sexual Harassment By School EmployeesSexual Harassment By School Employees
Sexual Harassment By School Employees
 
E Maturity and School Development
E Maturity and School DevelopmentE Maturity and School Development
E Maturity and School Development
 
Dr. Grace Thomas Nickerson, PhD Dissertation Defense, Dr. William Allan Krits...
Dr. Grace Thomas Nickerson, PhD Dissertation Defense, Dr. William Allan Krits...Dr. Grace Thomas Nickerson, PhD Dissertation Defense, Dr. William Allan Krits...
Dr. Grace Thomas Nickerson, PhD Dissertation Defense, Dr. William Allan Krits...
 
Software Tools
Software ToolsSoftware Tools
Software Tools
 
Heaven and Hell
Heaven and HellHeaven and Hell
Heaven and Hell
 
Extra Curricular Activities - Dr. W.A. Kritsonis
Extra Curricular Activities - Dr. W.A. KritsonisExtra Curricular Activities - Dr. W.A. Kritsonis
Extra Curricular Activities - Dr. W.A. Kritsonis
 
Istanbul issep2014
Istanbul issep2014Istanbul issep2014
Istanbul issep2014
 
13 primary source pack isaiah 53 & tradition history
13 primary source pack  isaiah 53 & tradition history13 primary source pack  isaiah 53 & tradition history
13 primary source pack isaiah 53 & tradition history
 
Christmas: Light Shines Through Darkness
Christmas: Light Shines Through DarknessChristmas: Light Shines Through Darkness
Christmas: Light Shines Through Darkness
 
Dr. William Allan Kritsonis - Americans with Disabilities Act in Education, PPT.
Dr. William Allan Kritsonis - Americans with Disabilities Act in Education, PPT.Dr. William Allan Kritsonis - Americans with Disabilities Act in Education, PPT.
Dr. William Allan Kritsonis - Americans with Disabilities Act in Education, PPT.
 
Regular Sch. Discipline, Suspension, Expulsion
Regular Sch. Discipline, Suspension, ExpulsionRegular Sch. Discipline, Suspension, Expulsion
Regular Sch. Discipline, Suspension, Expulsion
 
Ruby 1.9.2 has been released!
Ruby 1.9.2 has been released!Ruby 1.9.2 has been released!
Ruby 1.9.2 has been released!
 
League for Innovation Conference Presentation March 5 2014
League for Innovation Conference Presentation March 5 2014League for Innovation Conference Presentation March 5 2014
League for Innovation Conference Presentation March 5 2014
 
קמפיין פסח 2010
קמפיין פסח 2010קמפיין פסח 2010
קמפיין פסח 2010
 
Effective Presentations- Delivering the right message to stakeholders
Effective Presentations- Delivering the right message to stakeholdersEffective Presentations- Delivering the right message to stakeholders
Effective Presentations- Delivering the right message to stakeholders
 
Copyright Laws PPT. - William Allan Kritsonis, PhD
Copyright Laws  PPT. - William Allan Kritsonis, PhDCopyright Laws  PPT. - William Allan Kritsonis, PhD
Copyright Laws PPT. - William Allan Kritsonis, PhD
 
Dr. Fred C. Lunenburg, Critical Thinking & Constructivism - Published in NATI...
Dr. Fred C. Lunenburg, Critical Thinking & Constructivism - Published in NATI...Dr. Fred C. Lunenburg, Critical Thinking & Constructivism - Published in NATI...
Dr. Fred C. Lunenburg, Critical Thinking & Constructivism - Published in NATI...
 
Chi2011 closing plenary
Chi2011 closing plenaryChi2011 closing plenary
Chi2011 closing plenary
 

Similar to CSWB 110 Tutorial1 Part A

2 Html Intro
2 Html Intro2 Html Intro
2 Html Intro
drauscher
 
MINOR PROZECT REPORT on WINDOWS SERVER
MINOR PROZECT REPORT on WINDOWS SERVERMINOR PROZECT REPORT on WINDOWS SERVER
MINOR PROZECT REPORT on WINDOWS SERVER
Asish Verma
 
Is it time to start using HTML 5
Is it time to start using HTML 5Is it time to start using HTML 5
Is it time to start using HTML 5
Ravi Raj
 

Similar to CSWB 110 Tutorial1 Part A (20)

Iwt module 1
Iwt  module 1Iwt  module 1
Iwt module 1
 
Web engineering
Web engineeringWeb engineering
Web engineering
 
wt mod1.pdf
wt mod1.pdfwt mod1.pdf
wt mod1.pdf
 
introduction_to_web_technology.pdf
introduction_to_web_technology.pdfintroduction_to_web_technology.pdf
introduction_to_web_technology.pdf
 
2 Html Intro
2 Html Intro2 Html Intro
2 Html Intro
 
Web Programming introduction
Web Programming introductionWeb Programming introduction
Web Programming introduction
 
Full Stack Development Course in Gurgaon
Full Stack Development Course in GurgaonFull Stack Development Course in Gurgaon
Full Stack Development Course in Gurgaon
 
Training report on web developing
Training report on web developingTraining report on web developing
Training report on web developing
 
World Wide Web
World Wide WebWorld Wide Web
World Wide Web
 
An Introduction to Cyber World to a Newbie
An Introduction to Cyber World to a NewbieAn Introduction to Cyber World to a Newbie
An Introduction to Cyber World to a Newbie
 
MINOR PROZECT REPORT on WINDOWS SERVER
MINOR PROZECT REPORT on WINDOWS SERVERMINOR PROZECT REPORT on WINDOWS SERVER
MINOR PROZECT REPORT on WINDOWS SERVER
 
Hyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style SheetHyper Text Markup Language, Cascading Style Sheet
Hyper Text Markup Language, Cascading Style Sheet
 
Html birth &amp; evolution
Html birth &amp; evolutionHtml birth &amp; evolution
Html birth &amp; evolution
 
ITEC229_Chapter2_new.ppt
ITEC229_Chapter2_new.pptITEC229_Chapter2_new.ppt
ITEC229_Chapter2_new.ppt
 
Lecture-1.pptx
Lecture-1.pptxLecture-1.pptx
Lecture-1.pptx
 
Is it time to start using HTML 5
Is it time to start using HTML 5Is it time to start using HTML 5
Is it time to start using HTML 5
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
html5 project.pptx
html5 project.pptxhtml5 project.pptx
html5 project.pptx
 
Html5
Html5Html5
Html5
 
WT Module-1.pdf
WT Module-1.pdfWT Module-1.pdf
WT Module-1.pdf
 

Recently uploaded

Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
ciinovamais
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 

Recently uploaded (20)

Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
Explore beautiful and ugly buildings. Mathematics helps us create beautiful d...
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...Kodo Millet  PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
Kodo Millet PPT made by Ghanshyam bairwa college of Agriculture kumher bhara...
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
Introduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The BasicsIntroduction to Nonprofit Accounting: The Basics
Introduction to Nonprofit Accounting: The Basics
 

CSWB 110 Tutorial1 Part A

  • 1. 1 CSWB 110 HTML / XHTML Tutorial 1.1 and 1.2 up to lists
  • 2.
  • 3. 1989-90 the World Wide Web (WWW) Begins
  • 4. 1993 Mosaic is Released
  • 5. 1994 Netscape is Released
  • 6.
  • 7. 4 HyperTextDocuments An entire collection of linked documents is referred to as a Web site. The hypertext documents within a Web site are known as Webpages. A Web page can contain text, graphics, audio, video. These are separate files that also reside with the html file
  • 8. 5 Web Servers and Web Browsers A Webpage is stored on a Web server The browser or clientdisplays the Web page The Web page is written in the HTMLlanguage They communicate with the HTTPprotocol
  • 11. 8 How is the home page loaded?
  • 12. 9 www.palomar.edu searches for default file
  • 13.
  • 18.
  • 19. Goal of XHTML Portability Accessibility Standardization 12
  • 20. How was this accomplished Separation of content from presentation by using Cascading Style Sheets (CSS) CSS replaces many HTML attributes 13
  • 21. 14 Tools for Creating HTML Documents HTML Editor – Coffeecup Text editor – notepad Visual creator – Dreamweaver, SharePoint Designer Converter – MSWord
  • 22. The HTML Language Elements ( or tags) Attributes Values (of the attributes) 15
  • 23. Characterisitcs of HTML5 Open platform Adapts to any device Native support for more powerful applications 16
  • 24. The HTML language consists of “tags” or “elements” Tags can be two-sided: <body> </body> Enclose something – either content or more tags Tags can be one-sided: <br> or <br/> No content, they are considered “empty” tags 17 XHTML syntax
  • 25. HTML Tags and Attributes 18
  • 26. The HTML Document Consists of two parts: Head section Where information for the browser goes Body section Where the content for the web pages goes 19
  • 27. Basic HTML Tags or Elements <html> <head> <title> </title> </head> <body> </body> </html>
  • 28. Paragraph Tag – centering – Block Level Element <p style=“text-align: center”> </p> values are left, right, center, justify Attribute CSS property CSS value 21
  • 29.
  • 32. Bold / Italic – Inline Elements <b>this is bold</b> <i>this is italic</i> Comments: <!-- --> 23
  • 33. Heading tags - bold, block-level element <h1> </h1> <h2> </h2> <h3> </h3> <h4> </h4> <h5> </h5> <h6> </h6> <h1 style=“text-align: center”> </h1> values are left, right, center, justify 24
  • 34. Deprecated - “align” attribute <h1 align=“center”> </h1> Replaced with CSS: <h1 style=“text-align: center”> </h1> 25 deprecated
  • 35. Now start learning to write HTML by using the elements we have just covered! 26