Chapter 10: Understanding the Standards

Similar documents
XML: Introduction. !important Declaration... 9:11 #FIXED... 7:5 #IMPLIED... 7:5 #REQUIRED... Directive... 9:11

Markup Languages SGML, HTML, XML, XHTML. CS 431 February 13, 2006 Carl Lagoze Cornell University

What is XHTML? XHTML is the language used to create and organize a web page:

CHAPTER 2 MARKUP LANGUAGES: XHTML 1.0

Announcements. Paper due this Wednesday

introduction to XHTML

Module 2 (III): XHTML

Web Development IB PRECISION EXAMS

Full file at New Perspectives on HTML and CSS 6 th Edition Instructor s Manual 1 of 13. HTML and CSS

HTML. Mohammed Alhessi M.Sc. Geomatics Engineering. Internet GIS Technologies كلية اآلداب - قسم الجغرافيا نظم المعلومات الجغرافية

Chapter 12: FORMATTING TEXT


Introduction to XML. An Example XML Document. The following is a very simple XML document.

HTML Overview. With an emphasis on XHTML

Structured documents

CSC Web Technologies, Spring Web Data Exchange Formats

Tutorial 1 Getting Started with HTML5. HTML, CSS, and Dynamic HTML 5 TH EDITION

CSI 3140 WWW Structures, Techniques and Standards. Markup Languages: XHTML 1.0

HTML is a mark-up language, in that it specifies the roles the different parts of the document are to play.

Web Design and Application Development

Introduction to XML. XML: basic elements

extensible Markup Language (XML) Basic Concepts

History of the Internet. The Internet - A Huge Virtual Network. Global Information Infrastructure. Client Server Network Connectivity

XHTML & CSS CASCADING STYLE SHEETS

XHTML. XHTML stands for EXtensible HyperText Markup Language. XHTML is the next generation of HTML. XHTML is almost identical to HTML 4.

Web Standards Mastering HTML5, CSS3, and XML

Understanding the Web Design Environment. Principles of Web Design, Third Edition

Copyright 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley. Chapter 7 XML

INTERNET!!!11!1. Beyond the Mouse A Short Course on Programming. 10b. HTML/CSS or: I m on the. Ronni Grapenthin. November 13, 2011

HTML: The Basics & Block Elements

Chapter 2:- Introduction to XHTML. Compiled By:- Sanjay Patel Assistant Professor, SVBIT.

Web Development & Design Foundations with XHTML. Chapter 2 Key Concepts

XML Metadata Standards and Topic Maps

7.1 Introduction. extensible Markup Language Developed from SGML A meta-markup language Deficiencies of HTML and SGML

Comp 336/436 - Markup Languages. Fall Semester Week 4. Dr Nick Hayward

HTML: Introduction CISC 282. September 11, What is HTML?

('cre Learning that works for Utah STRANDS AND STANDARDS WEB DEVELOPMENT 1

Motivation (WWW) Markup Languages (defined). 7/15/2012. CISC1600-SummerII2012-Raphael-lec2 1. Agenda

Chapter 13: Introduction to XML. Informatics Practices Class XII. By- Deepak Bhinde

Chapter 1 Getting Started with HTML 5 1. Chapter 2 Introduction to New Elements in HTML 5 21

Aleph - Web Opac Accessibility. Accessibility in Aleph500 Web OPAC

Chapter 1: Getting Started. You will learn:

TagSoup: A SAX parser in Java for nasty, ugly HTML. John Cowan

Review of HTML. Chapter Pearson. Fundamentals of Web Development. Randy Connolly and Ricardo Hoar

Lesson 12: JavaScript and AJAX

ISO/IEC TR TECHNICAL REPORT

Chapter 16: PAGE LAYOUT WITH CSS

Introduction to HTML5

2009 Martin v. Löwis. Data-centric XML. XML Syntax

HTML: The Basics & Block Elements

Session 23 XML. XML Reading and Reference. Reading. Reference: Session 23 XML. Robert Kelly, 2018

Website review google.com

Website review excitesubmit.com

Shankersinh Vaghela Bapu Institue of Technology

Accessibility of EPiServer s Sample Templates

MRK260. Week Two. Graphic and Web Design

Announcements. 1. Class webpage: Have you been reading the announcements? Lecture slides and coding examples will be posted

ERTH 401 / GEOP 501 Computer Tools. Lecture 12: Websites. Ronni Grapenthin MSEC 356 x5924. November 13, 2017

A network is a group of two or more computers that are connected to share resources and information.

Introduction to Computer Science Web Development

Navigation. Websites need a formalized system of links to allow users to navigate the site

(1) I (2) S (3) P allow subscribers to connect to the (4) often provide basic services such as (5) (6)

UR what? ! URI: Uniform Resource Identifier. " Uniquely identifies a data entity " Obeys a specific syntax " schemename:specificstuff

Chapter 2 Creating and Editing a Web Page

Create web pages in HTML with a text editor, following the rules of XHTML syntax and using appropriate HTML tags Create a web page that includes

CS144 Notes: Web Standards

Hypertext Markup Language, or HTML, is a markup

Comm 244 Week 3. Navigation. Navigation. Websites need a formalized system of links to allow users to navigate the site

What is XML? XML is designed to transport and store data.

XML. XML Syntax. An example of XML:

Delivery Options: Attend face-to-face in the classroom or via remote-live attendance.

The XML Metalanguage

CSI 3140 WWW Structures, Techniques and Standards. Representing Web Data: XML

Website review dada-jd.com

XML. Objectives. Duration. Audience. Pre-Requisites

FUNDAMENTALS OF WEB DESIGN (46)

Skill Area 323: Design and Develop Website. Multimedia and Web Design (MWD)

HTML HTML/XHTML HTML / XHTML HTML HTML: XHTML: (extensible HTML) Loose syntax Few syntactic rules: not enforced by HTML processors.

JavaScript Context. INFO/CSE 100, Spring 2005 Fluency in Information Technology.

XML. Jonathan Geisler. April 18, 2008

Delivery Options: Attend face-to-face in the classroom or remote-live attendance.

Inf 202 Introduction to Data and Databases (Spring 2010)

JAVASCRIPT FOR PROGRAMMERS

HTML. Mendel Rosenblum. CS142 Lecture Notes - HTML

HTML TUTORIAL ONE. Understanding What XHTML is Not

Web Design and HTML. Web Page vs Web Site. Navigation. Links. A web page is a single page viewable using web browser. A web site is a set of web pages

Extensible Markup Language (XML) Hamid Zarrabi-Zadeh Web Programming Fall 2013

From administrivia to what really matters

XML 2 APPLICATION. Chapter SYS-ED/ COMPUTER EDUCATION TECHNIQUES, INC.

Announcements. 1. Class webpage: Have you been reading the announcements? Lecture slides and coding examples will be posted

Outline. XML vs. HTML and Well Formed vs. Valid. XML Overview. CSC309 Tutorial --XML 4. Edward Xia

XML is a popular multi-language system, and XHTML depends on it. XML details languages

E-Business Systems 1 INTE2047 Lab Exercises. Lab 5 Valid HTML, Home Page & Editor Tables

CompuScholar, Inc. Alignment to Utah's Web Development I Standards

COMP9321 Web Application Engineering

Overview. Introduction. Introduction XML XML. Lecture 16 Introduction to XML. Boriana Koleva Room: C54

Web Development and HTML. Shan-Hung Wu CS, NTHU

1. Please, please, please look at the style sheets job aid that I sent to you some time ago in conjunction with this document.

ibreathesports Inc. Apurva Alok Bernardo Silva

Website review dafont.com

Transcription:

Disclaimer: All words, pictures are adopted from Learning Web Design (3 rd eds.) by Jennifer Niederst Robbins, published by O Reilly 2007. Chapter 10: Understanding the Standards CSc2320

In this chapter History of HTML Three Versions: Strict, Transitional, Frameset XHTML and Syntax Document Type Declarations Standards vs. Quirks mode in Browsers Validating Markup Indicating Character Encoding

Why knowing the Standards? Professional web designers know that the best way to ensure consistency and accessibility across multiple browsers and devices is to write standards compliant web documents. Standards compliance simply means that your documents abide by all of the rules in the latest Recommendations published by the World Wide Web Consortium (the W3C). That includes HTML and XHTML for markup, but also other standards for style sheets (CSS) and accessibility.

The birth of HTML 1991: ~1995:

HTML History 1994: Browser started 1996: W3C released HTML 3.2

HTML 4.0 & 4.01 Not over, HTML in three flavors:

Transitional, Strict, Frameset

Meet the DTDs

Enter XML, then XHTML

Rewriting HTML

XHTML Syntax Element and attribute names must be lowercase. All elements must be closed (terminated). Empty elements must be terminated too. Attribute values must be in quotation marks. All attributes must have explicit attribute values. Elements must be nested properly. Always use character entities for special characters. Use id instead of name as an identifier. Scripts must be contained in a CDATA section.

XHTML Syntax Follow additional nesting restrictions.

Namespace and language requirements

From the Browser s Point of View

Declaring the Document Type

Available DOCTYPE declarations

Which One Should You Use?

What the pros do? Follow the XHTML 1.0 Strict DTD No deprecated and presentational elements Use style sheets

Validation your Documents To validate a document is to check your markup to make sure you have abided by all the DTD rules. Right now, browsers don t require documents to be valid. Validation includes: The inclusion of a DOCTYPE declaration. An indication of the character encoding for the document. The inclusion of required rules and attributes. Non-standard elements. Mismatched tags. Nesting errors. DTD rule violations. Typos, and other minor errors. Validation page: http://validator.w3.org/, give a try!!

Character Encoding Web is worldwide, there are hundreds of written languages. Various sets of characters have been standardized. E.g., the set of 256 characters most commonly used in Western languages has been standardized and named Latin-1 (or ISO 8859-1, to use its formal identifier). Unicode Biggest character sets, Unicode (ISO/IEC 10646) number of bytes:utf-8, UTF-16 or UTF-32 UTF-8 is recommended for all HTML 4.01, XHTML, and XML

Specifying the character encoding Way1: ask your server administrator to configure the server to include the character encoding. Way2: W3C also recommends that you include the character encoding in the document itself. In HTML 4.01 and XHTML 1.0 documents, character encoding is indicated using a meta element meta element: empty element provides information about the document e.g., creation date, author, copyright information character encoding and the type of file

Meta element meta element goes in the head of the document Example: The http-equiv attribute identifies that this meta element is providing information about the content type of the document. The content attribute provides the details of the content type in a two-part value. First part says: this is an HTML text file: text/html; The second part that specifies the character encoding for this document as utf-8.

Put It All together

Put It All together

Homework Reading Chapter 10 Quiz 2 on Wednesday (Oct. 6 th ) Excise: Try excise 10-2 on page 178: validating a document, and check the results. From now on, all your assignment (HTML pages) have be validated through w3 validator!!!