Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
‫‪W3C - Intro and beyond‬‬

            ‫אייל סלע‬
  ‫מנהל פרויקטים, איגוד האינטרנט‬
 ‫הישראלי ומשרד ה- ‪W3C‬הישראלי‬

   ...
j.mp/w3cdoc


              www.w3c.org.il   2
‫סקירה והבנת החשיבות‬     ‫•‬
              ‫הכרת תקנים קיימים‬    ‫•‬
                    ‫על מה עובדים‬   ‫•‬
          ...
1. About W3C
2. Standards (and drafts…)
  – EmotionML
  – HTML 5
  – Semantic web
  – WCAG 2.0
  – Mobile Web Best Practic...
‫‪W3C‬‬
                            ‫ארגון בינלאומי‬     ‫•‬
                           ‫כ-053 ארגונים‬       ‫•‬
  ‫פורום...
CSS   HTML     XML
XSLT   OWL     RDF
     DOM    PNG
SVG           WCAG



         www.w3c.org.il   6
?‫מי חבר‬


www.w3c.org.il   7
www.w3c.org.il   8
‫המשרד הישראלי‬
                      ‫• הוקם ב-9991‬
‫• משנת 8002 -איגוד האינטרנט הישראלי‬
                           ‫• ...
‫איך נולד תקן‬
 ‫(המלצה)?‬

  ‫‪www.w3c.org.il‬‬   ‫01‬
1.Interest
      – (Member Submissions , Team monitors , Workshops)
      – (proposal, inside consensus)

2.new Activity /...
Recommendation track
                                   appropriate for widespread
                                   depl...
What we do




j.mp/w3cac

             www.w3c.org.il   13
23 Activities
71 groups




j.mp/w3cgro


                www.w3c.org.il   14
Into the rabbit hole…




       www.w3c.org.il   15
EmotionML
       (draft)




  www.w3c.org.il   16
‫טיפול במצבים רגשיים בעזרת‬
‫מערכות טכנולוגיות דורש ייצוג מתאים‬

                                                        ...
‫3 קטגוריות שימוש‬
• Data Annotation (of video, voice, text)
• Emotion Recognition (by sensors, recordings facial expressi...
j.mp/w3ceml


              www.w3c.org.il   19
HTML 5




    www.w3c.org.il   20
HTML 4 = static pages

HTML 5 = Runtime environments
-   (like Flash, Java J2ME/MIDP, Silverlight).
-   No downloads, in t...
Design Principles
1. Support existing content
2. Ensure interoperability
      Web, Mobile, Many browsers.

3. Precisely d...
‫תגיות עם משמעות סמנטית‬

      ‫• נגיש‬
    ‫• סמנטי‬




‫‪j.mp/w3cmnt‬‬


               ‫‪www.w3c.org.il‬‬    ‫32‬
Absent Elements
•   basefont
•   big               “their effect is purely
•   center            presentational and their
...
Custom Attributes
data-*

Authors can define any attribute they want

<div id="mydiv" data-brand="toyota" data-model="priu...
Forms
 Less JavaScript more built-
 in items.
 – <input type="date”> and
  no code.




              www.w3c.org.il   26
Video – built in, no plugins




www.youtube.com/html5


                        www.w3c.org.il   27
Canvas Demo




                                            HTML ‫יצירת גרפיקה בעזרת קוד‬




http://htmlfive.appspot.com/...
More abilities
•   drag-and-drop
•   Off line (like Google gears).
•   Geolocation API
•   Accesskey
•   Spellcheck




  ...
Growing support




    www.w3c.org.il   30
Semantic web




   www.w3c.org.il   31
Is about…
      machine interpretability of Web
                 content.

                 applications will
     process...
The semantic technology stack




  + SKOS
  + PODER




  33          www.w3c.org.il
RDF
34   www.w3c.org.il
~CSS for meaning


35       www.w3c.org.il
The element of the Semantic Web
                        Resource Description Framework (RDF)




<http://www.productivewis...
37   www.w3c.org.il   37
RDFa
38   www.w3c.org.il
website license – in RDFa




39      www.w3c.org.il
j.mp/w3clet


              www.w3c.org.il   40
www.w3c.org.il   41
www.w3c.org.il   42
Machines can read information about me




           www.w3c.org.il                43
www.w3c.org.il   44
j.mp/w3ccal
              www.w3c.org.il   45
j.mp/w3clet   www.w3c.org.il   46
www.w3c.org.il   47
www.w3c.org.il   48
www.w3c.org.il   49
Validation?

   www.w3c.org.il   50
www.w3c.org.il   51
www.w3c.org.il   52
YAY!

www.w3c.org.il   53
The RDFa wiki




j.mp/w3crdfa


                 www.w3c.org.il   54
RDFa and Drupal




http://www.youtube.com/watch?v=r4WgTRIRoa0



                       www.w3c.org.il        55
POWDER
56    www.w3c.org.il
POWDER
Protocol for Web Description Resources —mechanism to describe and
discover Web resources and helps the users to mak...
j.mp/w3cmok
              www.w3c.org.il   58
SKOS
59   www.w3c.org.il
skos
Many knowledge organization systems share a similar structure, and are used in
similar applications. SKOS captures mu...
OWL
61   www.w3c.org.il
OWL use?
Now:
   have complex data + willing to
   learn

Future (years):
    all organizations and professionals
    who ...
Web 2.0  web 3.0
you (will) have a
personal Website, with
your photos, your family
tree, your business
details, and aggre...
WCAG 2.0
Web Content Accessibility Guidelines




                www.w3c.org.il         64
Layers
•   Principles (4)
•   Guidelines (12)
•   Success Criteria
•   Sufficient and Advisory Techniques
                ...
Example guideline




   www.w3c.org.il   66
Example ‘How to meet’ page




       www.w3c.org.il        67
1 Perceivable
1.1 Provide text alternatives for any non-text
  content so that it can be changed into other forms
  people...
2 Operable

2.1 Make all functionality available from a keyboard.
2.2 Provide users enough time to read and use
  content....
3 Understandable
3.1 Make text content readable and
  understandable.
3.2 Make Web pages appear and operate in
  predictab...
4 Robust
4.1 Maximize compatibility with current and future
  user agents, including assistive technologies.




         ...
Alternate taxt




www.w3c.org.il   72
www.w3c.org.il   73
‫אין שינוי במסך ללא התראה, קפיצה‬
 ‫לתוכן, קישורים מובנים מההקשר‬




         ‫‪www.w3c.org.il‬‬           ‫47‬
‫ניתן לנווט עם המקלדת, יש מקש הפעלה,‬
          ‫יש טקסט חלופי‬




           ‫‪www.w3c.org.il‬‬         ‫57‬
Accessibility validator




j.mp/w3cacs
               www.w3c.org.il       76
Mobile Web Best Practices 1.0




             www.w3c.org.il     77
Some practices…
•   [CAPABILITIES] Exploit device capabilities to
    provide an enhanced user experience.
•   [TESTING] C...
Some practices…
•   [NAVBAR] Provide only minimal navigation
    at the top of the page.
•   [BALANCE] Take into account t...
Some practices…
•   [[ACCESS_KEYS] Assign access keys to links
    in navigational menus and frequently
    accessed funct...
Some practices…
•   [AUTO_REFRESH] Do not create periodically
    auto-refreshing pages, unless you have
    informed the ...
Mobile OK checker




                    j.mp/w3cmbl


 www.w3c.org.il             82
j.mp/w3cmox


              www.w3c.org.il   83
Some more

  notes
 groups
  drafts
  www.w3c.org.il   84
Multimodal Interaction

input :speech, handwriting, motion, keystrokes
Output: displays, pre-recorded & synthetic speech, ...
Authoring HTML: Handling Right-to-left Scripts




                 www.w3c.org.il                  86
j.mp/w3catag
               www.w3c.org.il   87
Authoring Tool Accessibility
         Guidelines (ATAG) 2.0
• Ensure that automatically generated content is
  accessible....
Further into the future
                        not intended for implementation yet
Geolocation API Specification define a...
Interesting Interest group (13)
                   you can participate
•   Internationalization
•   Mobile Web For Social ...
Incubator groups
    • Social Web
    • Rich Web Application Backplane
    ( a set of common building blocks for web appli...
‫תמונה כוללת‬

   www.w3c.org.il   92
‫מסמכים שפורסמו לאחרונה‬




‫‪j.mp/w3crct‬‬


                   ‫‪www.w3c.org.il‬‬      ‫39‬
www.w3c.org.il   94
What Can You Do?
–   Public review (drafts, last calls…)
–   Mailing lists & newsletter
–   Implementations
–   Interest &...
‫טיפים‬
• Cheatsheet [bit.ly/w3ccsh]
• Look for the Charter
• Documents has abstract




                www.w3c.org.il   ...
j.mp/w3cch


             www.w3c.org.il   97
www.w3c.org.il   98
‫מה אנחנו עושים‬
      2                            1

                        3

                                   4
   ...
‫• הירשמו לידיעון‬
                                  ‫• צרו קשר‬




j.mp/w3ccon           @isociltech @eyalsela

        ...
‫המצגת‬
 bit.ly/w3cint




www.w3c.org.il   101
Upcoming SlideShare
Loading in …5
×

W3 C Intro And Beyond - Eyal Sela

4,109 views

Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

W3 C Intro And Beyond - Eyal Sela

  1. 1. ‫‪W3C - Intro and beyond‬‬ ‫אייל סלע‬ ‫מנהל פרויקטים, איגוד האינטרנט‬ ‫הישראלי ומשרד ה- ‪W3C‬הישראלי‬ ‫‪www.w3c.org.il‬‬ ‫1‬
  2. 2. j.mp/w3cdoc www.w3c.org.il 2
  3. 3. ‫סקירה והבנת החשיבות‬ ‫•‬ ‫הכרת תקנים קיימים‬ ‫•‬ ‫על מה עובדים‬ ‫•‬ ‫איך מוצאים לבד‬ ‫•‬ ‫איך משתתפים‬ ‫•‬ ‫‪www.w3c.org.il‬‬ ‫3‬
  4. 4. 1. About W3C 2. Standards (and drafts…) – EmotionML – HTML 5 – Semantic web – WCAG 2.0 – Mobile Web Best Practices 1.0 – Some more 3. ‫ + תמונה כוללת‬What Can You Do? www.w3c.org.il 4
  5. 5. ‫‪W3C‬‬ ‫ארגון בינלאומי‬ ‫•‬ ‫כ-053 ארגונים‬ ‫•‬ ‫פורום ניטראלי ליצירת תקני רשת באינטרנט.‬ ‫•‬ ‫משימה:‬ ‫•‬ ‫להוביל את הרשת למיצוי הפוטנציאל על ידי פיתוח‬ ‫פרוטוקולים וקווים מנחים שיאפשרו את צמיחתה‬ ‫לטווח ארוך.‬ ‫‪www.w3c.org.il‬‬ ‫5‬
  6. 6. CSS HTML XML XSLT OWL RDF DOM PNG SVG WCAG www.w3c.org.il 6
  7. 7. ?‫מי חבר‬ www.w3c.org.il 7
  8. 8. www.w3c.org.il 8
  9. 9. ‫המשרד הישראלי‬ ‫• הוקם ב-9991‬ ‫• משנת 8002 -איגוד האינטרנט הישראלי‬ ‫• מטרות :‬ ‫1. להביא ליישום המלצות‬ ‫2. ערוץ קשר‬ ‫3. לוקליזציה ותקני עברית‬ ‫‪www.w3c.org.il‬‬ ‫9‬
  10. 10. ‫איך נולד תקן‬ ‫(המלצה)?‬ ‫‪www.w3c.org.il‬‬ ‫01‬
  11. 11. 1.Interest – (Member Submissions , Team monitors , Workshops) – (proposal, inside consensus) 2.new Activity / Group - (working/ interest/ coordination/incubator) - Charter - Members, Invited Experts, and Team. 3. Recommendation track j.mp/w3cdoc www.w3c.org.il 11
  12. 12. Recommendation track appropriate for widespread deployment and promote •Review -sufficient implementation experience •implementation -sent to the Advisory Committee for review •interoperability. -feedback - first implementation -Fulfill all requirements -seeks technical review bit.ly/w3cpro www.w3c.org.il 12
  13. 13. What we do j.mp/w3cac www.w3c.org.il 13
  14. 14. 23 Activities 71 groups j.mp/w3cgro www.w3c.org.il 14
  15. 15. Into the rabbit hole… www.w3c.org.il 15
  16. 16. EmotionML (draft) www.w3c.org.il 16
  17. 17. ‫טיפול במצבים רגשיים בעזרת‬ ‫מערכות טכנולוגיות דורש ייצוג מתאים‬ ‫טכנולוגיות קיימות:‬ ‫• רובוטים 'חברתיים' המשמשים כמדריכים במרכזי מבקרים‬ ‫• קול סינטטי (המיוצר באופן מלאכותי על ידי מחשב) המביע רגשות שמחה ועצב‬ ‫• אפליקציות המזהות רגשות של אנשים, תמיכה רגשית באנשים בעלי מוגבלויות כגון אוטיזם‬ ‫הדורש.‬ ‫93 שימושים אפשריים שונים ל-‪EmotionML‬‬ ‫‪www.w3c.org.il‬‬ ‫71‬
  18. 18. ‫3 קטגוריות שימוש‬ • Data Annotation (of video, voice, text) • Emotion Recognition (by sensors, recordings facial expression) • Emotion Generation (in syntactic speech, robots, light and sounds) www.w3c.org.il 18
  19. 19. j.mp/w3ceml www.w3c.org.il 19
  20. 20. HTML 5 www.w3c.org.il 20
  21. 21. HTML 4 = static pages HTML 5 = Runtime environments - (like Flash, Java J2ME/MIDP, Silverlight). - No downloads, in the browser. www.w3c.org.il 21
  22. 22. Design Principles 1. Support existing content 2. Ensure interoperability Web, Mobile, Many browsers. 3. Precisely define browser behavior Example: how “table” or “form” should act. 4. Handle errors Today 90% of the web is not “correct” 5. Evolution not revolution Keep the past. Enable the future. j.mp/w3cml5 www.w3c.org.il 22
  23. 23. ‫תגיות עם משמעות סמנטית‬ ‫• נגיש‬ ‫• סמנטי‬ ‫‪j.mp/w3cmnt‬‬ ‫‪www.w3c.org.il‬‬ ‫32‬
  24. 24. Absent Elements • basefont • big “their effect is purely • center presentational and their • font function is better • s handled by CSS" • strike • tt • u www.w3c.org.il 24
  25. 25. Custom Attributes data-* Authors can define any attribute they want <div id="mydiv" data-brand="toyota" data-model="prius"> www.w3c.org.il 25
  26. 26. Forms Less JavaScript more built- in items. – <input type="date”> and no code. www.w3c.org.il 26
  27. 27. Video – built in, no plugins www.youtube.com/html5 www.w3c.org.il 27
  28. 28. Canvas Demo HTML ‫יצירת גרפיקה בעזרת קוד‬ http://htmlfive.appspot.com/ www.w3c.org.il 28
  29. 29. More abilities • drag-and-drop • Off line (like Google gears). • Geolocation API • Accesskey • Spellcheck www.w3c.org.il 29
  30. 30. Growing support www.w3c.org.il 30
  31. 31. Semantic web www.w3c.org.il 31
  32. 32. Is about… machine interpretability of Web content. applications will process the content of information instead of just presenting it to humans. j.mp/w3cowl 32 www.w3c.org.il
  33. 33. The semantic technology stack + SKOS + PODER 33 www.w3c.org.il
  34. 34. RDF 34 www.w3c.org.il
  35. 35. ~CSS for meaning 35 www.w3c.org.il
  36. 36. The element of the Semantic Web Resource Description Framework (RDF) <http://www.productivewise.com/> <http://creativecommons.org/ns#attributionName> "Eyal Sela" . 36 www.w3c.org.il
  37. 37. 37 www.w3c.org.il 37
  38. 38. RDFa 38 www.w3c.org.il
  39. 39. website license – in RDFa 39 www.w3c.org.il
  40. 40. j.mp/w3clet www.w3c.org.il 40
  41. 41. www.w3c.org.il 41
  42. 42. www.w3c.org.il 42
  43. 43. Machines can read information about me www.w3c.org.il 43
  44. 44. www.w3c.org.il 44
  45. 45. j.mp/w3ccal www.w3c.org.il 45
  46. 46. j.mp/w3clet www.w3c.org.il 46
  47. 47. www.w3c.org.il 47
  48. 48. www.w3c.org.il 48
  49. 49. www.w3c.org.il 49
  50. 50. Validation? www.w3c.org.il 50
  51. 51. www.w3c.org.il 51
  52. 52. www.w3c.org.il 52
  53. 53. YAY! www.w3c.org.il 53
  54. 54. The RDFa wiki j.mp/w3crdfa www.w3c.org.il 54
  55. 55. RDFa and Drupal http://www.youtube.com/watch?v=r4WgTRIRoa0 www.w3c.org.il 55
  56. 56. POWDER 56 www.w3c.org.il
  57. 57. POWDER Protocol for Web Description Resources —mechanism to describe and discover Web resources and helps the users to make a decision whether a given resource is of interest. Profile matching Grouping Data retrieval efficiency Semantic Annotation www.w3c.org.il 57
  58. 58. j.mp/w3cmok www.w3c.org.il 58
  59. 59. SKOS 59 www.w3c.org.il
  60. 60. skos Many knowledge organization systems share a similar structure, and are used in similar applications. SKOS captures much of this similarity and makes it explicit, to enable data and technology sharing across diverse applications. classification Taxonomies Thesauri 60 www.w3c.org.il
  61. 61. OWL 61 www.w3c.org.il
  62. 62. OWL use? Now: have complex data + willing to learn Future (years): all organizations and professionals who produce/consume data j.mp/w3cowld 62 www.w3c.org.il
  63. 63. Web 2.0  web 3.0 you (will) have a personal Website, with your photos, your family tree, your business details, and aggregators then (will) turn this into added value by finding the links across the whole web. ]Economist 2008[ )illustration by David Simonds( j.mp/w3cweb 63 www.w3c.org.il
  64. 64. WCAG 2.0 Web Content Accessibility Guidelines www.w3c.org.il 64
  65. 65. Layers • Principles (4) • Guidelines (12) • Success Criteria • Sufficient and Advisory Techniques )‫(גם בעברית‬ • www.w3c.org.il 65
  66. 66. Example guideline www.w3c.org.il 66
  67. 67. Example ‘How to meet’ page www.w3c.org.il 67
  68. 68. 1 Perceivable 1.1 Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language. 1.2 Provide alternatives for time-based media. 1.3 Create content that can be presented in different ways (for example simpler layout) without losing information or structure. 1.4 Make it easier for users to see and hear content including separating foreground from background. www.w3c.org.il 68
  69. 69. 2 Operable 2.1 Make all functionality available from a keyboard. 2.2 Provide users enough time to read and use content. 2.3 Do not design content in a way that is known to cause seizures. 2.4 Provide ways to help users navigate, find content, and determine where they are. www.w3c.org.il 69
  70. 70. 3 Understandable 3.1 Make text content readable and understandable. 3.2 Make Web pages appear and operate in predictable ways. 3.3 Help users avoid and correct mistakes. www.w3c.org.il 70
  71. 71. 4 Robust 4.1 Maximize compatibility with current and future user agents, including assistive technologies. www.w3c.org.il 71
  72. 72. Alternate taxt www.w3c.org.il 72
  73. 73. www.w3c.org.il 73
  74. 74. ‫אין שינוי במסך ללא התראה, קפיצה‬ ‫לתוכן, קישורים מובנים מההקשר‬ ‫‪www.w3c.org.il‬‬ ‫47‬
  75. 75. ‫ניתן לנווט עם המקלדת, יש מקש הפעלה,‬ ‫יש טקסט חלופי‬ ‫‪www.w3c.org.il‬‬ ‫57‬
  76. 76. Accessibility validator j.mp/w3cacs www.w3c.org.il 76
  77. 77. Mobile Web Best Practices 1.0 www.w3c.org.il 77
  78. 78. Some practices… • [CAPABILITIES] Exploit device capabilities to provide an enhanced user experience. • [TESTING] Carry out testing on actual devices as well as emulators. • [URIS] Keep the URIs of site entry points short. www.w3c.org.il 78
  79. 79. Some practices… • [NAVBAR] Provide only minimal navigation at the top of the page. • [BALANCE] Take into account the trade-off between having too many links on a page and asking the user to follow too many links to reach what they are looking for. • [NAVIGATION] Provide consistent navigation mechanisms. www.w3c.org.il 79
  80. 80. Some practices… • [[ACCESS_KEYS] Assign access keys to links in navigational menus and frequently accessed functionality. • [LINK_TARGET_FORMAT] Note the target file's format unless you know the device supports it. • [POP_UPS] Do not cause pop-ups or other windows to appear and do not change the current window without informing the user. www.w3c.org.il 80
  81. 81. Some practices… • [AUTO_REFRESH] Do not create periodically auto-refreshing pages, unless you have informed the user and provided a means of stopping it. • [SUITABLE] Ensure that content is suitable for use in a mobile context. • [CLARITY] Use clear and simple language. www.w3c.org.il 81
  82. 82. Mobile OK checker j.mp/w3cmbl www.w3c.org.il 82
  83. 83. j.mp/w3cmox www.w3c.org.il 83
  84. 84. Some more notes groups drafts www.w3c.org.il 84
  85. 85. Multimodal Interaction input :speech, handwriting, motion, keystrokes Output: displays, pre-recorded & synthetic speech, audio, tactile mechanisms www.w3c.org.il 85
  86. 86. Authoring HTML: Handling Right-to-left Scripts www.w3c.org.il 86
  87. 87. j.mp/w3catag www.w3c.org.il 87
  88. 88. Authoring Tool Accessibility Guidelines (ATAG) 2.0 • Ensure that automatically generated content is accessible. • Guide authors to create accessible content. • Assist authors in checking for accessibility problems. • Assist authors with managing alternative content for non-text content. www.w3c.org.il 88
  89. 89. Further into the future not intended for implementation yet Geolocation API Specification define a secure and privacy-sensitive interface for using client-side location information in location-aware Web applications Voice Extensible Markup Language (VoiceXML) 3.0 interactive media dialogs that feature synthesized speech, recognition of spoken and DTMF key input, telephony, mixed initiative conversations, and recording and presentation of a variety of media formats including digitized audio, and digitized video. User Agent Accessibility Guidelines (UAAG) 2.0 XML Signature Best Practices best practices for implementers and users of the XML Signature specification www.w3c.org.il 89
  90. 90. Interesting Interest group (13) you can participate • Internationalization • Mobile Web For Social Development (MW4D) • Semantic Web • Semantic Web Health Care and Life Sciences • Web Accessibility Initiative • Research and Development • eGovernment Interest Group • ... j.mp/w3cac www.w3c.org.il 90
  91. 91. Incubator groups • Social Web • Rich Web Application Backplane ( a set of common building blocks for web applications.) • Open Web Education Alliance • Semantic Sensor Network j.mp/w3cin www.w3c.org.il 91
  92. 92. ‫תמונה כוללת‬ www.w3c.org.il 92
  93. 93. ‫מסמכים שפורסמו לאחרונה‬ ‫‪j.mp/w3crct‬‬ ‫‪www.w3c.org.il‬‬ ‫39‬
  94. 94. www.w3c.org.il 94
  95. 95. What Can You Do? – Public review (drafts, last calls…) – Mailing lists & newsletter – Implementations – Interest &incubator groups – Through us – Join as a member :‫בארץ‬ ‫• תרגם‬ ‫• הרצאות‬ ‫• שת"פ איתנו‬ www.w3c.org.il 95
  96. 96. ‫טיפים‬ • Cheatsheet [bit.ly/w3ccsh] • Look for the Charter • Documents has abstract www.w3c.org.il 96
  97. 97. j.mp/w3cch www.w3c.org.il 97
  98. 98. www.w3c.org.il 98
  99. 99. ‫מה אנחנו עושים‬ 2 1 3 4 Mailing list 6 5 UPA I18n ‫נציג‬ www.w3c.org.il 99
  100. 100. ‫• הירשמו לידיעון‬ ‫• צרו קשר‬ j.mp/w3ccon @isociltech @eyalsela www.w3c.org.il 100
  101. 101. ‫המצגת‬ bit.ly/w3cint www.w3c.org.il 101

×