SlideShare uma empresa Scribd logo
1 de 21
Baixar para ler offline
Web Content
The 3 Components of the Web

●   Resource Identification
    –   Using URI (URN/URL)
    –   Aka Web Addressing
●   Interaction
    –   Protocol: HTTP
●   Content/Format
    –   How information/data is written
    –   HTML : basic web programmers must-know
    –   XML based formats
    –   Other formats.
    –   Specifications on how content is to be rendered.
Content Formats

●   Text                   ●   Binary
    –   HTML                   –   Graphics
    –   XML                    –   Audio/Video
    –   Plain Text             –   Java Applets
    –   CSS*                   –   Flash
    –   Javascript code*       –   Etc...
The Web Browser: Content
Renderer
●   The Client Application
    –   In charge of communication with a web server
    –   Renders the content (The browser is a document
        parser).
         ●   By parsing HTML
         ●   ....or XML
         ●   Apply stylings (default or via CSS)
    –   The Browser is the requestor, parser and renderer
Web Browser

●   Thin browser/thin client
    –   Renders only basic content: HTML, plain text
●   Thick browser/thick client
    –   Requires the help of plugins and helper applications to
        render web page content.
         ●   E.g. Java applets require a JRE configured witht the browser
         ●   E.g. Flash animation requires a Runtime environment for
             flash.
         ●   E.g. Audio/Video requires media players with codecs
HTML

●   Hypertext Markup Language
    –   A web programmer's basic content markup language.
    –   Last Version* : 4.01
    –   Update: HTML 5/XHTML 5 is under development.
    –   Markup Language
         ●   Marks up elements of the web page thru the use of tags.
    –   An Application of SGML (Standard Generalized
        Markup Language)
         ●   A metalanguage
HTML

●   Allows Authors to
      * Publish online documents with headings, text, tables,
      lists, photos, etc.
       * Retrieve online information via hypertext links, at
      the click of a button.
       * Design forms for conducting transactions with
      remote services, for use in searching for information,
      making reservations, ordering products, etc.
       * Include spread-sheets, video clips, sound clips, and
      other applications directly in their documents.
HTML Document Design
Considerations
●   Separate structure and presentation
    –   Preferable practice: HTML document contains web
        page contents only, use Style Sheets to specify
        rendering.
●   Consider universal accessibility to the web
    –   Web should be available to everyone.
    –   Authors should consider variety of browsers
         ●   E.g. Speech-based browsers, braille browsers, etc.
●   Help User Agents(Browsers) with Incremental
    Rendering
HTML (SGML) – Language of tags


             <tag>Content</tag>

                 <singleton/>


     <a>, <b>, <table>,<ol>, <hr/>, etc...

  Use tags to mark elements of the document.
HTML and Why The Shift to XML-
based Formats
●   HTML can be written in a bad way.
    –   Browsers must therefore be robust in handling “Bad
        HTML”
         ●   Implication: Browser code more complicated and larger than
             it should be.
    –   Not standardized and browsers do not impose
●   HTML is not relevant/practical in NEW
    environments where web access is made
    –   Consider the different ways to access the Internet esp.
        on “devices” with limited resources.
XML: Ultimate Web Content
Format
●   XML
    –   Extensible Markup Language
    –   A meta language as compared to SGML
    –   Simpler and “smaller” than SGML
         ●   XML is simplified SGML
    –   Strict
         ●   All XML-based documents must follow rules on well-
             formedness.
    –   Standardized Parsers
    –   Text Format
    –   Tag-based
XML: XHTML --> HTML with an X
●   XHTML 1.0
    –   Current web content trend
    –   HTML with the rules of XML plus more.
    –   Imporant Differences with HTML
         ●   XHTML elements (tags) are properly nested [Universal
             XML rule]
         ●   XHTML documents must be well-formed [Universal XML
             rule]
         ●   Tag names and attributes MUST lowercase.
         ●   XHTML elements (tags) must be closed [still on being well-
             formed].
         ●   Some HTML elements not supported, some attributes are
             required.
         ●   Doctype required.
         ●   Can be “mixed” with other XML documents.
         ●   Authors may create user-defined tags.
Proliferations of XML-based
formats
●   MathML
     –   Mathematical equations
●   CML
     –   Chemical Markup Language
●   SVG
     –   Scalable Vector Graphics
●   SMIL
     –   Synchronized Multimedia Integration Language
●   GML
     –   G for Geographic
     –   G for Geometric
●   Etc...
XML – A Must Know

●   ...we will study XML in some greater detail in
    future discussions.
Additional Readings

●   HTML 4.01 Specification (W3C)
     –   http://www.w3.org/TR/REC-html40/cover.html
●   XHTML 1.0 The Extensible Hypertext Markup
    Language
     –   http://www.w3.org/TR/xhtml1/

●   XHTML Tutorial -- for your laboratory class
     –   http://www.w3schools.com/xhtml/default.asp

Mais conteúdo relacionado

Mais procurados

Xhtml and html5 basics
Xhtml and html5 basicsXhtml and html5 basics
Xhtml and html5 basics
messinam
 

Mais procurados (20)

HTML
HTMLHTML
HTML
 
Drupal based Municipality Website Training: Pokhara, May 17-19, 2015
Drupal based Municipality Website Training: Pokhara, May 17-19, 2015Drupal based Municipality Website Training: Pokhara, May 17-19, 2015
Drupal based Municipality Website Training: Pokhara, May 17-19, 2015
 
Html
HtmlHtml
Html
 
Dhtml ppt (2)
Dhtml ppt (2)Dhtml ppt (2)
Dhtml ppt (2)
 
Ict html
Ict htmlIct html
Ict html
 
HTML for absolutely begginers
HTML for absolutely begginersHTML for absolutely begginers
HTML for absolutely begginers
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Dhtml chapter2
Dhtml chapter2Dhtml chapter2
Dhtml chapter2
 
Web programming and services
Web programming and servicesWeb programming and services
Web programming and services
 
Unit 2 dhtml
Unit 2 dhtmlUnit 2 dhtml
Unit 2 dhtml
 
Web Pages
Web PagesWeb Pages
Web Pages
 
Web design using html
Web design using htmlWeb design using html
Web design using html
 
Web Development - HTML, CSS, JavaScript
Web Development - HTML, CSS, JavaScriptWeb Development - HTML, CSS, JavaScript
Web Development - HTML, CSS, JavaScript
 
Html
HtmlHtml
Html
 
Dynamic html (#1)
Dynamic  html (#1)Dynamic  html (#1)
Dynamic html (#1)
 
Dhtml
DhtmlDhtml
Dhtml
 
Web Designing
Web DesigningWeb Designing
Web Designing
 
Xhtml
XhtmlXhtml
Xhtml
 
Xhtml and html5 basics
Xhtml and html5 basicsXhtml and html5 basics
Xhtml and html5 basics
 

Destaque (11)

Chapter2c
Chapter2cChapter2c
Chapter2c
 
Chapter1b
Chapter1bChapter1b
Chapter1b
 
Cmsc 100 xhtml and css
Cmsc 100 xhtml and cssCmsc 100 xhtml and css
Cmsc 100 xhtml and css
 
Chapter2a
Chapter2aChapter2a
Chapter2a
 
Chapter2b
Chapter2bChapter2b
Chapter2b
 
Chapter2a
Chapter2aChapter2a
Chapter2a
 
linked list (CMSC 123)
linked list (CMSC 123)linked list (CMSC 123)
linked list (CMSC 123)
 
Chapter1c
Chapter1cChapter1c
Chapter1c
 
Cmsc 100 (web programming in a nutshell)
Cmsc 100 (web programming in a nutshell)Cmsc 100 (web programming in a nutshell)
Cmsc 100 (web programming in a nutshell)
 
Chapter2d
Chapter2dChapter2d
Chapter2d
 
Chapter1a
Chapter1aChapter1a
Chapter1a
 

Semelhante a Cmsc 100 (web content)

Lecture3 introduction towebpages
Lecture3 introduction towebpagesLecture3 introduction towebpages
Lecture3 introduction towebpages
amitpatil777
 
Web Development From the Ground Up, a Series for Novice ...
Web Development From the Ground Up, a Series for Novice ...Web Development From the Ground Up, a Series for Novice ...
Web Development From the Ground Up, a Series for Novice ...
webhostingguy
 
Html xhtml css
Html xhtml cssHtml xhtml css
Html xhtml css
L15338
 

Semelhante a Cmsc 100 (web content) (20)

Xml
XmlXml
Xml
 
HTML AND XML ppt.pptx
HTML AND XML ppt.pptxHTML AND XML ppt.pptx
HTML AND XML ppt.pptx
 
Introduction To Web (Mukesh Patel)
Introduction To Web (Mukesh Patel)Introduction To Web (Mukesh Patel)
Introduction To Web (Mukesh Patel)
 
Lecture3 introduction towebpages
Lecture3 introduction towebpagesLecture3 introduction towebpages
Lecture3 introduction towebpages
 
Java Web Services
Java Web ServicesJava Web Services
Java Web Services
 
Unit 01 (1).pdf
Unit 01 (1).pdfUnit 01 (1).pdf
Unit 01 (1).pdf
 
HTML_DOM
HTML_DOMHTML_DOM
HTML_DOM
 
WEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTMLWEB TECHNOLOGY:Web Essentials and Markup Language HTML
WEB TECHNOLOGY:Web Essentials and Markup Language HTML
 
Introduction to XML
Introduction to XMLIntroduction to XML
Introduction to XML
 
Differences between HTML and XML.pdf
Differences between HTML and XML.pdfDifferences between HTML and XML.pdf
Differences between HTML and XML.pdf
 
Html and Xhtml
Html and XhtmlHtml and Xhtml
Html and Xhtml
 
The XML Forms Architecture
The XML Forms ArchitectureThe XML Forms Architecture
The XML Forms Architecture
 
Xhtml
XhtmlXhtml
Xhtml
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
00 introduction
00 introduction00 introduction
00 introduction
 
Markup For Dummies (Russ Ward)
Markup For Dummies (Russ Ward)Markup For Dummies (Russ Ward)
Markup For Dummies (Russ Ward)
 
Html Concept
Html ConceptHtml Concept
Html Concept
 
Web Development From the Ground Up, a Series for Novice ...
Web Development From the Ground Up, a Series for Novice ...Web Development From the Ground Up, a Series for Novice ...
Web Development From the Ground Up, a Series for Novice ...
 
WEB Module 1.pdf
WEB Module 1.pdfWEB Module 1.pdf
WEB Module 1.pdf
 
Html xhtml css
Html xhtml cssHtml xhtml css
Html xhtml css
 

Último

Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
ZurliaSoop
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
ciinovamais
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
kauryashika82
 

Último (20)

Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
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
 
Unit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptxUnit-IV; Professional Sales Representative (PSR).pptx
Unit-IV; Professional Sales Representative (PSR).pptx
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
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
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
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...
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Activity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdfActivity 01 - Artificial Culture (1).pdf
Activity 01 - Artificial Culture (1).pdf
 
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in DelhiRussian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
Russian Escort Service in Delhi 11k Hotel Foreigner Russian Call Girls in Delhi
 
Magic bus Group work1and 2 (Team 3).pptx
Magic bus Group work1and 2 (Team 3).pptxMagic bus Group work1and 2 (Team 3).pptx
Magic bus Group work1and 2 (Team 3).pptx
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
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...
 
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...
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 

Cmsc 100 (web content)

  • 2. The 3 Components of the Web ● Resource Identification – Using URI (URN/URL) – Aka Web Addressing ● Interaction – Protocol: HTTP ● Content/Format – How information/data is written – HTML : basic web programmers must-know – XML based formats – Other formats. – Specifications on how content is to be rendered.
  • 3. Content Formats ● Text ● Binary – HTML – Graphics – XML – Audio/Video – Plain Text – Java Applets – CSS* – Flash – Javascript code* – Etc...
  • 4. The Web Browser: Content Renderer ● The Client Application – In charge of communication with a web server – Renders the content (The browser is a document parser). ● By parsing HTML ● ....or XML ● Apply stylings (default or via CSS) – The Browser is the requestor, parser and renderer
  • 5. Web Browser ● Thin browser/thin client – Renders only basic content: HTML, plain text ● Thick browser/thick client – Requires the help of plugins and helper applications to render web page content. ● E.g. Java applets require a JRE configured witht the browser ● E.g. Flash animation requires a Runtime environment for flash. ● E.g. Audio/Video requires media players with codecs
  • 6. HTML ● Hypertext Markup Language – A web programmer's basic content markup language. – Last Version* : 4.01 – Update: HTML 5/XHTML 5 is under development. – Markup Language ● Marks up elements of the web page thru the use of tags. – An Application of SGML (Standard Generalized Markup Language) ● A metalanguage
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13. HTML ● Allows Authors to * Publish online documents with headings, text, tables, lists, photos, etc. * Retrieve online information via hypertext links, at the click of a button. * Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc. * Include spread-sheets, video clips, sound clips, and other applications directly in their documents.
  • 14. HTML Document Design Considerations ● Separate structure and presentation – Preferable practice: HTML document contains web page contents only, use Style Sheets to specify rendering. ● Consider universal accessibility to the web – Web should be available to everyone. – Authors should consider variety of browsers ● E.g. Speech-based browsers, braille browsers, etc. ● Help User Agents(Browsers) with Incremental Rendering
  • 15. HTML (SGML) – Language of tags <tag>Content</tag> <singleton/> <a>, <b>, <table>,<ol>, <hr/>, etc... Use tags to mark elements of the document.
  • 16. HTML and Why The Shift to XML- based Formats ● HTML can be written in a bad way. – Browsers must therefore be robust in handling “Bad HTML” ● Implication: Browser code more complicated and larger than it should be. – Not standardized and browsers do not impose ● HTML is not relevant/practical in NEW environments where web access is made – Consider the different ways to access the Internet esp. on “devices” with limited resources.
  • 17. XML: Ultimate Web Content Format ● XML – Extensible Markup Language – A meta language as compared to SGML – Simpler and “smaller” than SGML ● XML is simplified SGML – Strict ● All XML-based documents must follow rules on well- formedness. – Standardized Parsers – Text Format – Tag-based
  • 18. XML: XHTML --> HTML with an X ● XHTML 1.0 – Current web content trend – HTML with the rules of XML plus more. – Imporant Differences with HTML ● XHTML elements (tags) are properly nested [Universal XML rule] ● XHTML documents must be well-formed [Universal XML rule] ● Tag names and attributes MUST lowercase. ● XHTML elements (tags) must be closed [still on being well- formed]. ● Some HTML elements not supported, some attributes are required. ● Doctype required. ● Can be “mixed” with other XML documents. ● Authors may create user-defined tags.
  • 19. Proliferations of XML-based formats ● MathML – Mathematical equations ● CML – Chemical Markup Language ● SVG – Scalable Vector Graphics ● SMIL – Synchronized Multimedia Integration Language ● GML – G for Geographic – G for Geometric ● Etc...
  • 20. XML – A Must Know ● ...we will study XML in some greater detail in future discussions.
  • 21. Additional Readings ● HTML 4.01 Specification (W3C) – http://www.w3.org/TR/REC-html40/cover.html ● XHTML 1.0 The Extensible Hypertext Markup Language – http://www.w3.org/TR/xhtml1/ ● XHTML Tutorial -- for your laboratory class – http://www.w3schools.com/xhtml/default.asp