Html xhtml css
- 2. Your audience may view your site with many different devices and browser types.
- 3. The browser is not print!
- 4. No fixed page size No fixed page length User can change the font size User can link to her/his own local style sheet Screen size can be tiny or huge
- 6. Created by Tim Berners-Lee at CERN Open standard developed under supervision of the World Wide Web Consortium ( www.w3c.org ) Works to ensure the full potential of the Web for shared, integrated functionality is realized
- 7. HTML files Text files Contain mark-up tags Tags direct how page is to be displayed by browser Can be created from a simple text editor File extension .htm or .html
- 8. HTML was never intended to contain tags for formatting a document. HTML was intended to define the content of a document, like: <h1>This is a heading</h1> <p>This is a paragraph.</p> When tags like <font>, and color attributes were added to the HTML 3.2 specification, it started a nightmare for web developers. Development of large web sites, where fonts and color information were added to every single page, became a long and expensive process
- 9. Competing versions of browsers introduced features beyond the standards Inconsistent implementations of display engines and scripting Content and presentation mixed together Layout often done with tables Each element had many presentation attributes, resulting in laborious maintenance The “Slop Code Era”
- 10. XHTML is a version of HTML modified to conform to the XML standard Designed to separate content from presentation Content in XHTML Presentation controlled by Cascading Style Sheets (CSS) Extensible – Additional elements can be defined XML Compatible – Other XML based languages can be embedded in XHTML documents Like a programming language Specific syntax to use Validators help you get it right
- 11. Case is significant All elements must have begin tags and end tags <p>Hello</p> Empty elements contain their own end tag <br /> Attribute values must be enclosed in quotation marks More specfics available at http://www.w3.org/TR/xhtml1/#diffs
- 12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title> My Home Page </title> </head> <body> <h1> My Home Page </h1> <p> Welcome to my home page </p> </body> </html>
- 13. Declares the specific version of HTML or XHTML being used on the page Used by the browser to decide how to process the page Three types Transitional - Forgiving Strict – Requires adherence to standards Frameset – Use if page has frames Always first in file
- 14. Enter exactly as below <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN“ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Using Strict encourages standards based coding Validators will flag logical errors in your methods Your CSS will work better and more predictably
- 15. Are used to control how elements are presented in the Web page Use a different syntax that HTML/XHTML Work with the common visual browsers (Internet Explorer, FireFox, Opera) Used properly, can great simplify visual design, site management and content maintenance
- 16. HTML-Kit editor – http://chami.com/ Amaya editor – http://www.w3c.org/Amaya W3schools XHTML and CSS tutorials – http://www.w3schools.com/ Web Head Start tutorials – http://www.webheadstart.org/ Tidy Web Interface - http://www.washington.edu/webinfo/tidy.cgi CSS Validator - http://jigsaw.w3.org/css-validator/ Dave Raggett XHTML and CSS tutorials - http://www.w3.org/MarkUp/Guide/Overview.html Web Accessibility in Mind (WebAIM) - http://www.webaim.org/ Color contrast analyzer - http://www.visionaustralia.org.au/info.aspx?page=628 Stylin’ With CSS, A Designer’s Guide , Second Edition by Charles Wyke-Smith