DOCSLIB.ORG

Html-Elements.Pdf

Html-Elements.Pdf

All elements are sorted with in their groups in prioritized order. Recom mended (X)HTML ver sions are mint- colored. - Element Document structure - <html> - <head> <body> <title> <meta> HTML 3.2 <link> HTML 4.01 strict <style> HTML 4.01 transitional <script> HTML 4.01 frameset <noscript> Standards XHTML 1.0 strict <base> <basefont> Non element markup constructs XHTML 1.0 transitional <?xml ?> XHTML 1.0 frameset <!DOCTYPE> XHTML 1.1 <!-- --> XHTML 1.1 Basic <![CDATA[ ]]> XHTML 2.0 D (X)HTML 5.0 Information D [B]lock/[I]nline/[T]able D B [I]nvisible/[N]ormal/[R]eplaced Copyright: Lars Gunther. Creative Commons: Attribution-NonCommercial-ShareAlike 2.5 B http://creativecommons.org/licenses/by-nc-sa/2.5/ D N (X)HTML Best Practice Cheat Sheet I D N Semantic meaning The main I D content The docu ments title or I name I s Indicates explicit relationship between- this docu ment and other resources. As such there are I good uses! Usability & Accessibility I* Make unique for I every page s I I I Best practice I Unobtrusive DOM-scripts, s XML declara please! I tion Unnecessary with unobtrusive script What flavour ing techniques! Forbidden in XHTML of (X)HTML is 5. I used? Code com I ment External style - Unparsed Better skip. It will put MSIE <= 6 in quirks mode and is NOT obligatory. In sheets are usually character theory best place to specify encoding for offline usage of an XHTML docubest SEO notes data ment. Keep scripts ex Highly ranked ternal and will be the - many link-text - Only ”name = 'description'” is useful Use CSS - Notable browser issues Required in every - version since HTML 2.0! Use richly while learning and de veloping Use for inline JavaScript in XHTML Margin: 8px; Unstyled appearance Test for capabili ties, not browsers! Text on the title-bar - Not ignored by true XML parsers! Ignored by MSIE for scripts Page - Will control stan Script may have output 1 dards compliance or quirks mode MSIE has tional Opera may ignore CSS if MIME is true XHTML comments - condi - - Version: 1.09 All elements are sorted with in their groups in prioritized order. Recom mended (X)HTML ver sions are mint- colored. - Element Basic semantics - <h1> to <h6> - <hgroup> <p> <em> HTML 3.2 <strong> <abbr> HTML 4.01 strict <acronym> HTML 4.01 transitional <blockquote> HTML 4.01 frameset <q> <cite> StandardsXHTML 1.0 strict <ins> <del> XHTML 1.0 transitional <dfn> <h> XHTML 1.0 frameset <mark> Hypertext XHTML 1.1 XHTML 1.1 Basic <a> XHTML 2.0 (X)HTML 5.0 Information [ c li /[ B]lo k/[I]n ne T]able B [I]nvisible/[N]ormal/[R]eplaced Copyright: Lars Gunther. Creative Commons: Attribution-NonCommercial-ShareAlike 2.5 http://creativecommons.org/licenses/by-nc-sa/2.5/ (X)HTML Best Practice Cheat Sheet B N B Heading N Semantic meaning I The hgroup element represents the heading of a section. The element is used to group a set of h1– I N h6 elements when the heading has multiple levels, N such as subheadings, alternative titles, or taglines. I Paragraph N Emphasized I text Use in correct or N Strongly em der B phasised text Usability & Accessibility N Abbreviation I N I Acronym N I* Longer quote Usually spoken - louder I* N Short quote Usually spoken I really loud! - N B Who is cited ” All acronyms are abbreviations”. N Make sure they are not confused with N Inserted text links. CSS-speech: Spell out ini I tialisms. Best practice N Deleted text Defined word N Heading Marked or Do not equate with highlighted ”italics” I text Do not equate with Better turn under ”bold” lining off N Highly ranked Link SEO notes Do not equate with ”indentation” Not the quote as Emphasised - words may get such - Link text should higher ranking. be understand able out of con text. May contain block elements in (X)HTML 5. Use with ”section” Notable browser issues In future, use to highlight matches to search string - - Any element with an id can replace Not in MSIE Large bold text, its use as ”anchor” gradually smaller. Margin-top/bottom Unstyled appearance No quotation marks in MSIE Margin-top: 1em; Italics rel=”nofollow” means it will not Bolder increase targets page rank. abbr[title], acro rel=”canonical” nym[title] { border- marks the pre bottom: dotted 1px; Page ferred URL for a ] resource. Indented right and left. 2 Quotation marks Italics - - Underlined Strike through Italics Probably like h1, h2, etc. Blue underlined text. Images get a blue border. Version: 1.09 All elements are sorted with in their groups in prioritized order. Recom mended (X)HTML ver sions are mint- colored. - Element Page structure - <div> - <span> <pre> <hr> <address> HTML 3.2 <section> HTML 4.01 strict <article> HTML 4.01 transitional <aside> HTML 4.01 frameset Standards XHTML 1.0 strict <header> XHTML 1.0 transitional <footer> XHTML 1.0 frameset <figure> XHTML 1.1 <headings> XHTML 1.1 Basic <listing> <xmp> XHTML 2.0 (X)HTML 5.0 Information [B]lock/[I]nline/[T]able D B D I [I]nvisible/[N]ormal/[R]eplaced Copyright: Lars Gunther. Creative Commons: Attribution-NonCommercial-ShareAlike 2.5 http://creativecommons.org/licenses/by-nc-sa/2.5/ B N (X)HTML Best Practice Cheat Sheet N B Part of page N Semantic meaning B R B Thematic N break B Contact in R formation Is a semantic el ement available? Document or If so, use that in B application N stead. Usability & Accessibility section Stand alone N capable sec - tion ” B tangentially Always use hCard for addresses, but related to the in combination with <address> for content” contact info. The header element represents - Section takes pri N a group of introductory or Avoid ”divitis” ority over h1-h6 - gational Avoid ”spanma - B typically contains the section's nia” heading (an h1–h6 element or Best tice an prac contain other content, such as a B Do not use for N table of contents,hgroup a search form, aids. A header element visual purposes or any relevant only. Footer for a R section B element), but can also - Paragraph - B with a caption Does not equal <div> Set a heading SEO notes logos navi Caption will prob - ably be mandated. Content may be a Today: Good val image. ues for id or class attributes! May override Notable browser issues ”width” in MSIE - Color' for MSIE, 'background-color' Proposed re - for Gecko placement for misuse of fieldset' - Preformatted Unstyled appearance A bar Italics Page 3 (Parsed as CDA TA, preserved whitespace) - Version: 1.09 All elements are sorted with in their groups in prioritized order. Recom mended (X)HTML ver sions are mint- colored. - Element Visual formatting - <br> - <b> <i> <sub> <sup> <big> HTML 3.2 <small> <tt> HTML 4.01 strict <center> <font> HTML 4.01 transitional <u> HTML 4.01 frameset <s> <strike> Standards XHTML 1.0 strict <nobr> <wbr> XHTML 1.0 transitional XHTML 1.0 frameset D XHTML 1.1 D D XHTML 1.1 Basic D D D XHTML 2.0 D D D D (X)HTML 5.0 D D D Information [B]lock/[I]nline/[T]able D D I D D D I [I]nvisible/[N]ormal/[R]eplaced Copyright: Lars Gunther. Creative Commons: Attribution-NonCommercial-ShareAlike 2.5 http://creativecommons.org/licenses/by-nc-sa/2.5/ I D N (X)HTML Best Practice Cheat Sheet D I N (Line break) I N I N Semantic meaning I N N s I B N N (”Smallprint” I in (X)HTML N 5) sab l ty Acc bility I N U i i & essi I E.g. Use with simple math, footnotes, I N and when part of language idiom. I N I N N May be only op N tion for a WYSI WYG editor Best practice Avoid underlining always (even with CSS), since it will look like a link. - - Use CSS May get a sligthly elevated rank SEO notes Use CSS or <del> Use CSS instead Notable browser issues Line break Bolder Italics Unstyled appearance Subscript Superscript Bigger Smaller NS 4 proprietary, but works in all Fixed width font MSIE proprietary Centers every thing! Page Changes font set tings 4 Underlined Strike through - No line breaks in cell Suggestion for line - break. Version: 1.09 All elements are sorted with in their groups in prioritized order. Recom mended (X)HTML ver sions are mint- colored. - Element Tables - <table> - <tr> <th> <td> <caption> HTML 3.2 <thead> <tbody> HTML 4.01 strict <tfoot> HTML 4.01 transitional <col> <colgroup> HTML 4.01 frameset StandardsXHTML 1.0 strict XHTML 1.0 transitional XHTML 1.0 frameset XHTML 1.1 XHTML 1.1 Basic XHTML 2.0 (X)HTML 5.0 Information [B]lock/[I]nline/[T]able T [I]nvisible/[N]ormal/[R]eplaced Copyright: Lars Gunther. Creative Commons: Attribution-NonCommercial-ShareAlike 2.5 T http://creativecommons.org/licenses/by-nc-sa/2.5/ (X)HTML Best Practice Cheat Sheet T N N T Tabular data T N Semantic meaning Table row T N Heading for row or col N umn T Table data N Table caption T Describe format T N Table head - with ”summary” N T Table body Use ”scope” or Usability & Accessibility I ”headers/id” Table footer I Table column Often a good idea to have Group of col umns Not for layout Best practice - Can be used in stead of grouping <tr> with the class attribute SEO notes - Notable browser issues Hard to style MSIE needs this one for dynamical ly created tables Visible borders MSIE catches too Table cell with Unstyled appearance many style-rules! bold, centered text Safari does not support colgroup A table cell Centered above the table Repeats on each page when printing - Page 5 Version: 1.09 All elements are sorted with in their groups in prioritized order.

View Full Text

Details

  • File Type
    pdf
  • Upload Time
    -
  • Content Languages
    English
  • Upload User
    Anonymous/Not logged-in
  • File Pages
    13 Page
  • File Size
    -

Download

Channel Download Status
Express Download Enable

Copyright

We respect the copyrights and intellectual property rights of all users. All uploaded documents are either original works of the uploader or authorized works of the rightful owners.

  • Not to be reproduced or distributed without explicit permission.
  • Not used for commercial purposes outside of approved use cases.
  • Not used to infringe on the rights of the original creators.
  • If you believe any content infringes your copyright, please contact us immediately.

Support

For help with questions, suggestions, or problems, please contact us