Web Standards And Protocols

3,729
-1

Published on

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,729
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
82
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • It’s all well and good to simply write up a web page and publish it to the Internet, but to make it good you’ll need to do some research
  • Here are seven essentials of what makes a good website.
  • PurposeAll sites have a purpose; it’s a matter of you deciding what the purpose of your site will be and what audience you will need to target.
  • DesignWe are talking about things like colour choice, alignments, visual interest, and meaningful metaphors.
  • MessageContent is the message, each page within a site needs to have a goal, to serve its purpose in the overall scheme of the site.
  • ArchitectureArchitecture is the basis of how the website is organised.
  • Usability and AccessibilityNot everyone will be able to access a site due to various circumstances; different equipment, connections and even disabilities can prohibit users accessing a site. You need to take these in to consideration.
  • Online MarketingIt’s not enough to just have a website on the Internet, you need to be able to direct traffic to the site, and otherwise it may fail its purpose.
  • Technical ConsiderationsWhen we look at the technical side of a site, many variables are looked at from domain names (will it be easy to remember); is the ISP reliable, will they be able to accommodate to future technological changes as a site grows.
  • If you want your site to be used by as many people as possible, then you should build it using web standards.
  • “Web standards” are, basically, an approach to building websites that ensure they work correctly in any modern browser.Web standards sites use a combination of technologies, namely XHTML, CSS and unobtrusive JavaScript (also called DOM scripting).
  • If you’ve just started to learn web design, you’re lucky - you can use web standards to build a site that works in different browsers without too much effort – but things weren’t always this easy.Most web designers want to be able to create attractive websites with magazine-quality photography and print-like layouts.However, the Web was designed to share scientific information, not to be a marketing tool. As a result, HTML is great for marking up physics papers, but very poorly designed for producing attractive, commercial websites.To get round the limitations of HTML, web designers used to use HTML tags in ways they were not designed for. For example, using data tables to position elements on the page.As well as being inefficient, this approach caused problems getting sites to look right on different browsers.At one time, this old-fashioned approach was the only reliable way of producing attractive websites.However, for the last few years, the main browsers have supported CSS fairly well, making a modern, web standards approach to building websites possible.
  • Web standards sites are better than other sites for several reasons:
  • They should work perfectly on any modern browser
  • They are quicker to load
  • They tend to appear higher on search engines
  • They’re accessible to people with disabilities
  • They’ll work on older browsers, even if they don’t look perfect
  • They can work on other devices like PDAs or Web TV
  • You can change the design of your site easily
  • The World Wide Web Consortium (W3C) is an international consortium where member organisations, a full-time staff, and the public work together to develop Web standards.
  • To lead the World Wide Web to its full potential by developing protocols and guidelines that ensure long-term growth for the Web.
  • The most common of used validator is the Markup Validation Service that checks the markup (HTML, XHTML) of Web documents. The benefit of validation cannot be overstated. No matter how much XHTML documents are created, they should always be validated.Validation involves checking the web document to ensure that it meets the appropriate specification and follows the rules. Unfortunately, few tools actually create 100 percent correct markup and even when building web documents by hand it is easy to make mistakes
  • Do understand the differences between HTML 2.0, HTML 3.2, and the different flavours of HTML 4.01 and XHTML 1.0. Decide which design strategy to follow while using them
  • Do provide alternatives if at all possible if you use nonstandard HTML tags
  • Do test your pages in multiple browsers
  • Do write your pages clearly and concisely
  • Do organise the text of your page so that your visitors can scan for important information
  • Do spell check and proofread your pages
  • Do group related information both semantically (through the organisation of the content) and visually (by using headings or separating sections with rule lines)
  • Do use a consistent layout across all your pages
  • Do use link menus to organise your links for quick scanning, and do use descriptive links
  • Do have good reasons for using links
  • Do keep your layout simple
  • Do provide alternatives to images for text-only browsers
  • Do try to keep your images small so that they load faster over the network
  • Do be careful with backgrounds and coloured text to avoid making your pages flashy by unreadable
  • Do always provide a link back to your home page
  • Do match topics with pages
  • Do provide a signature block or link to contact information at the bottom of each page
  • Do provide single-page, non-hypertext versions of linear documents
  • Do write context – independent pages
  • Don’t link to irrelevant material
  • Don’t write web pages that are dependent on pages before or after them in the structure
  • Don’t overuse emphasis (such as boldface, italic, all caps, link text, blink or marquees)
  • Don’t use terminology that’s specific to any one browser (“click here,” “use the Back button,” and so on)
  • Don’t use heading tags to provide emphasis
  • Don’t fall victim to the “Here” syndrome with your links
  • Don’t link repeatedly to the same site on the same page
  • Don’t clutter the page with a large number of pretty but unnecessary images
  • Don’t split individual topics across pages
  • Web Standards And Protocols

    1. 1. Web Standards and Protocols
    2. 2. Web Standards and Protocols
    3. 3. What Makes a Good Website? 1. Purpose 2. Design 3. Message 4. Architecture 5. Usability & Accessibility 6. Online Marketing 7. Technical Considerations
    4. 4. What Makes a Good Website? 1. Purpose 2. Design All sites have a purpose; it’s a 3. Message 4. Architecture 5. Usability & Accessibility matter of you deciding what the 6. Online Marketing 7. Technical Considerations purpose of your site will be and what audience you will need to target.
    5. 5. What Makes a Good Website? 1. Purpose 2. Design We are talking about things like 3. Message 4. Architecture 5. Usability & Accessibility colour choice, alignments, visual 6. Online Marketing 7. Technical Considerations interest, and meaningful metaphors.
    6. 6. What Makes a Good Website? 1. Purpose 2. Design Content is the message, each 3. Message 4. Architecture 5. Usability & Accessibility page within a site needs to have a 6. Online Marketing 7. Technical Considerations goal, to serve its purpose in the overall scheme of the site.
    7. 7. What Makes a Good Website? 1. Purpose 2. Design Architecture is the basis of how 3. Message 4. Architecture 5. Usability & Accessibility the website is organised. 6. Online Marketing 7. Technical Considerations
    8. 8. What Makes a Good Website? 1. Purpose 2. Design Not everyone will be able to access 3. Message 4. 5. Architecture Usability & Accessibility a site due to various circumstances; 6. Online Marketing 7. Technical Considerations different equipment, connections and even disabilities can prohibit users accessing a site. You need to take these in to consideration.
    9. 9. What Makes a Good Website? 1. Purpose 2. Design It’s not enough to just have a 3. Message 4. Architecture 5. Usability & Accessibility website on the Internet, you need 6. Online Marketing 7. Technical Considerations to be able to direct traffic to the site, and otherwise it may fail its purpose.
    10. 10. What Makes a Good Website? 1. Purpose 2. Design When we look at the technical side of a 3. Message 4. Architecture site, many variables are looked at from 5. Usability & Accessibility 6. Online Marketing domain names (will it be easy to 7. Technical Considerations remember); is the ISP reliable, will they be able to accommodate to future technological changes as a site grows.
    11. 11. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    12. 12. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    13. 13. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    14. 14. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    15. 15. Web Standards • Introduction • What are Web Standards? • They should work perfectly on • What’s the big deal? • Advantages of Web Standards • The w3C any modern browser • Markup Validation
    16. 16. Web Standards • Introduction • What are Web Standards? • They should work perfectly on • What’s the big deal? • Advantages of Web Standards • The w3C any modern browser • Markup Validation • They are quicker to load
    17. 17. Web Standards • Introduction • What are Web Standards? • They should work perfectly on • What’s the big deal? • Advantages of Web Standards • The w3C any modern browser • Markup Validation • They are quicker to load • They tend to appear higher on search engines
    18. 18. Web Standards • Introduction • What are Web Standards? • They should work perfectly on • What’s the big deal? • Advantages of Web Standards • The w3C any modern browser • Markup Validation • They are quicker to load • They tend to appear higher on search engines • They’re accessible to people with disabilities
    19. 19. Web Standards • Introduction • What are Web Standards? • They’ll work on older browsers, • What’s the big deal? • Advantages of Web Standards • The w3C even if they don’t look perfect • Markup Validation
    20. 20. Web Standards • Introduction • What are Web Standards? • They’ll work on older browsers, • What’s the big deal? • Advantages of Web Standards • The w3C even if they don’t look perfect • Markup Validation • They can work on other devices like PDAs or Web TV
    21. 21. Web Standards • Introduction • What are Web Standards? • They’ll work on older browsers, • What’s the big deal? • Advantages of Web Standards • The w3C even if they don’t look perfect • Markup Validation • They can work on other devices like PDAs or Web TV • You can change the design of your site easily
    22. 22. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    23. 23. Web Standards • Introduction • What are Web Standards? To lead the World Wide Web to • What’s the big deal? • Advantages of Web Standards • The w3C its full potential by developing • Markup Validation protocols and guidelines that ensure long-term growth for the Web.
    24. 24. Web Standards • Introduction • What are Web Standards? • What’s the big deal? • Advantages of Web Standards • The w3C • Markup Validation
    25. 25. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do understand the differences between HTML 2.0, HTML 3.2, and the different flavours of HTML 4.01 and XHTML 1.0. Decide which design strategy to follow while using them
    26. 26. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide alternatives if at all possible if you use nonstandard HTML tags
    27. 27. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide alternatives if at all possible if you use nonstandard HTML tags • Do test your pages in multiple browsers
    28. 28. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide alternatives if at all possible if you use nonstandard HTML tags • Do test your pages in multiple browsers • Do write your pages clearly and concisely
    29. 29. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do organise the text of your page so that your visitors can scan for important information
    30. 30. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do organise the text of your page so that your visitors can scan for important information • Do spell check and proofread your pages
    31. 31. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do organise the text of your page so that your visitors can scan for important information • Do spell check and proofread your pages • Do group related information both semantically and visually
    32. 32. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do use a consistent layout across all your pages
    33. 33. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do use a consistent layout across all your pages • Do use link menus to organise your links for quick scanning, and do use descriptive links
    34. 34. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do use a consistent layout across all your pages • Do use link menus to organise your links for quick scanning, and do use descriptive links • Do have good reasons for using links
    35. 35. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do keep your layout simple
    36. 36. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do keep your layout simple • Do provide alternatives to images for text-only browsers
    37. 37. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do keep your layout simple • Do provide alternatives to images for text-only browsers • Do try to keep your images small so that they load faster over the network
    38. 38. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do be careful with backgrounds and coloured text to avoid making your pages flashy by unreadable
    39. 39. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do be careful with backgrounds and coloured text to avoid making your pages flashy by unreadable • Do always provide a link back to your home page
    40. 40. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do be careful with backgrounds and coloured text to avoid making your pages flashy by unreadable • Do always provide a link back to your home page • Do match topics with pages
    41. 41. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide a signature block or link to contact information at the bottom of each page
    42. 42. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide a signature block or link to contact information at the bottom of each page • Do provide single-page, non- hypertext versions of linear documents
    43. 43. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Do provide a signature block or link to contact information at the bottom of each page • Do provide single-page, non- hypertext versions of linear documents • Do write context – independent pages
    44. 44. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t link to irrelevant material
    45. 45. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t link to irrelevant material • Don’t write web pages that are dependent on pages before or after them in the structure
    46. 46. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t link to irrelevant material • Don’t write web pages that are dependent on pages before or after them in the structure • Don’t overuse emphasis (such as boldface, italic, all caps, link text, blink or marquees)
    47. 47. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t use terminology that’s specific to any one browser (“click here,” “use the Back button,” and so on)
    48. 48. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t use terminology that’s specific to any one browser (“click here,” “use the Back button,” and so on) • Don’t use heading tags to provide emphasis
    49. 49. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t fall victim to the “Here” syndrome with your links
    50. 50. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t fall victim to the “Here” syndrome with your links • Don’t link repeatedly to the same site on the same page
    51. 51. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t fall victim to the “Here” syndrome with your links • Don’t link repeatedly to the same site on the same page • Don’t clutter the page with a large number of pretty but unnecessary images
    52. 52. Do’s and Don’ts of Web Design • The Do List • The Don’t List • Don’t split individual topics across pages
    53. 53. Produced by Steven Cahill steven.cahill@chisholm.edu.au
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×