1 / 28

Hypertext Markup Language

Hypertext Markup Language. What is HTML?. Key part of the original proposal for the Web Subset of SGML Standard Generalized Markup Language – used to prepare computer generated documents for publishing on a printing press

waldemar-buckminster
Download Presentation

Hypertext Markup Language

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Hypertext Markup Language

  2. What is HTML? • Key part of the original proposal for the Web • Subset of SGML • Standard Generalized Markup Language – used to prepare computer generated documents for publishing on a printing press • HTML documents are straight ASCII text documents. Not a proprietary document format • Straight ASCII code to keep the size of the file down.

  3. HTML, continued • Can be read and created by simple text editors • Notepad on Windows platform • SimpleText on Macintosh platform • vi on UNIX (or Linux) platform • Not a programming language • HTML is a markup language in the sense of printing and publishing • You markup your document and a Web browser interprets your markup code. • HTML is platform independent

  4. HTML is a Client-Side Application • Specifies the structural aspects of a document • Leaves the question of how to display the different elements in the document entirely up to the Web browser • So document might look different in different browsers. • This keeps the HTML files relatively small.

  5. SERVER Server Computer is only responsible for conveying the structural componentsof the document. The Client Computer determines the formatting characteristics.

  6. Factors that Can Influence the Display of Your Web Page The user’s; • Browser • Monitor Size • Current Monitor Resolution • Installed Fonts • Browser Window Size • Viewing Hardware; laptop, palm device, etc. • Operating System (Mac and PCs interpret colors differently to the screen)

  7. XHTML • HTML is being replaced by a new language  XHTML • Very similar to HTML • STRICT coding standards, so that many different types of browsers can display the information. • For this course we will follow those rules

  8. XHTML Rules • All tag and attribute names must be in lowercase • Empty tags must be written with an extra slash at the end • You can never omit an end tag • Attributes must always have a value. • Attribute values must always be quoted

  9. Additional Good HTML Coding Practices • Insert spaces in your HTML code to separate the different sections • Spaces do not show up in the web page • Horizontal and vertical space can really make the code much easier to read • Type in end tags as soon as you type in the start tag • Have a “template” set up with the basics, cut down on your typing • Use CUT and PASTE

  10. HTML Coding Practices, continued • Sign and date all documents in your site, so that a user can form some impression of the authority of the document (how recent and how reliable the information is). • Date should be given January 20, 2003 (vs. 1/20/04) • Provide a link to the home page • Provide a link for email to you • You could put all this information in the document’s head

  11. Editors • Use Notepad or WordPad or Textpad • Download Textpad  textpad.com

  12. Advantages Gives full control over tagging & Layout Gives access to all possible tags and all their possible attributes Allows for easier production of clean, easy to read & edit HTML Disadvantages Requires greater knowledge & understanding of the markup language and process Harder to edit content, since both content and markup displayed together Text Editors

  13. Advantages Simplifies complex markup tasks Allows for easier editing because the markup is not shown or at least not emphasized in the display Disadvantages User has less control over structure and layout of markup Limits or controls users choice of tags & attributes Will rewrite or at a minimum reformat your markup Web Authoring Packages (WYSIWYG)

  14. Why use HTML over a WYSIWYG Editor? • Page 31 – Q&A box – “Understanding HTML will allow you to edit the HTML code directly to make modifications not supported by the WYSIWYG editor.”

  15. Using Textpad Save as an HTML type of file.

  16. Using Textpad After you save the file as an HTML type – Textpad will then add the color coding to the display.

  17. CONTENTThe part that shows up on the web page. START TAG END TAG HTML Elements • Includes headings, paragraphs, hyperlinks, lists, images, etc. <p>sample text</p>

  18. Start tag – defines document as HTML file Document Head – does not show up on the web page, this is used for document information Start tag – BODY, all of the web page content is between the two BODY tags End Body tag End tag – indicates the end of the HTML file

  19. Heading Start Tag – This one is level 1, the highest Heading End Tag Paragraph Start Tag – paragraphs have space before and after them on the web page, breaks up the text List Start Tag – notice that each item in list gets a separate start and end tag UL End Tag Paragraph End Tag Unordered Start List Tag – this one is using the circle type of bullet List End Tag

  20. Saved as html file

  21. This is how is looks in Windows Explorer.

  22. This how it looks in Opera.

  23. This is how it looks in Mozilla Firefox.

  24. Explorer

  25. Opera

  26. Firefox

More Related