disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Exploring the knowledge on Web WIDE Meeting December 2014 - Key note session Hirotaka Nakajima Keio University, Graduate School of Media and Governance https://keybase.io/nunnun 1
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. 2 November 2011 http://www.w3.org/html/logo/
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. 3 October 2014 http://www.w3.org/2014/10/html5-rec.html.en
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. 4 HTML5 Past and Now http://www.w3.org/html/logo/ http://www.w3.org/2014/10/w3c-highlights/ • Semantics • Multimedia • Offline & Storage • 3D, Graphics & Effects • Device Access • Performance & Integration • Connectivity • CSS3 • Security and Privacy • Core Web Design and Development • Device Interaction • Application Lifecycle • Media and Real-Time Communications • Performance and Tuning • Usability and Accessibility
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Differences 5 Unchanged Removed Added •Multimedia •Device Interaction •Performance •Core Web Design •Offline •Semantics •Security & Privacy •Application Lifecycle •Usability & Accessibility •Realtime Communication
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Multimedia 6 Past Now Future audio video <audio> Web Audio API Video from Big Buck Bunny Web Audio API Demo: http://labs.dinahmoe.com/plink/ iSight indicator on the new MBP photo by Nobuyuki Hayashi available under a Creative Commons Attribution-NonCommercial- ShareAlike 2.0 Generic https://flic.kr/p/qJJy5 •Web MIDI API •Speech API (Recognition) <video> Camera API •Encrypted Media Extensions •Media Source Extensions
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Device Interaction 7 Past Now Future Location Icon from Google Chrome, Calendar and Message App Icon from Mac OS X Yosemite, Orientation Icon from iOS 8 Web Intents Image from http://webscripts.softpedia.com/blog/Check-Out-quot-Web-Intents-quot-Working-in-Google- Chrome-251331.shtml Ambient Sensor Image from http://forums.macrumors.com/showthread.php?t=1409199 •GeoLocation •Calendar •Messaging •Orientation •Network Service Discovery •Web Intents •SysApps WG •Camera API •Wake Lock •Ambient Light •TCP Socket •Vehicle keepScreenAwake = true;
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Performance 8 Past Now Future Navigation Timing API Image from http://www.html5rocks.com/en/tutorials/webperformance/basics/ •Web Worker •XMLHTTP Request2 •Navigation Timing •Performance Timing •Beacon API
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Core Web Design 9 Past Now Future Standards for Web Applications on Mobile: current state and roadmap: http://www.w3.org/Mobile/mobile-web-app-state/ •WebGL •Border-radius •New input form •Responsive UI •Vertical Text •Shadow DOM •Web Components •Past: Rich Interface •Now: Integrated UI both Mobile and Desktop, I18N •Future: Capsulation of UI
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Offline 10 Past Now Future •LocalStorage •Indexed DB •File API •AppCache •Offline Events •Service Worker •Past & Now: Basic feature of offline application •Future: more advanced & optimised offline features
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Realtime Communication 11 Past Now Future •HTTP/1.1 •XHR •WebSocket •Server Side Event •SPDY •WebRTC •http2 •ORTC •WebRTC Data Channel •Network WebSocket WebRTC Image from http://www.geek.com/news/chrome-and-firefox-play-nice-in-webrtc-interop-demo-1538511/ •Past: bidirectional communication with server-client •Now: bidirectional communication between browser •Future: local area communication
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Semantics 12 Past Now Future •RDFa •Microdata •schema.org •LinkedOpenData •CSV on the Web •json-ld •RDF Data Shapes •Past: Strict XML •Now: more realistic, trends on Open Data •Future: more easier format, json? xml?
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Security and Privacy 13 Past Now Future •CSP(Content Security Policy) •CORS (Cross Origin Resource Sharing) •Do-Not-Track •Web Crypto •CSP v2 •https mandatory •Restrict API on cleartext •Past: Restrict the origin of resources •Now: Let application to extend its restriction •Future: More secure
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Usability and Accessibility 14 Past Now Future •WCAG(Web Content Accessibility Guideline) •WAI-ARIA •main element •SVG •MathML •Indie UI •Indie Event •Past: Only Guideline •Now: Only modules to provide accessible website •Future: Easier deployment
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Future Web 15 Past Now Future Sensor Image from http://www.clipartsfree.net/svg/776-wireless-sensor-vector.html
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Rendering 16 • Accessibility More deployment needed • One UI, All Devices, Users • Screen type Mobile, PC, Wearable, Signage • HTML as a only documenting format? • PDF, Word are dead? • Spreadsheet, slides? • Maybe TeX can be replaceable?
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Runtime 17 • Web as an only single application runtime? • ECMAscript is fastest compare to other scripting language • Client-side: Browser, Server-side: node.js etc • OS-like features • Certified API; Bluetooth, TCP Socket • Just a browser and light kernel • Chromebook, Firefox OS • OS is just a under layer of browser? JavaScript is a real programming language: http://blog.erratasec.com/2012/09/javascript-is-real-programming-language.html
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Connectivity 18 • http is already dominant protocol on the internet • Web of Things • Web = URI?; possibly Restful API • All the sensors have URI? Domain? Certification? • P2P again? (because of WebRTC) • DNS and PKI work well with this model?
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Security and Privacy 19 • HTTPS everywhere • http2 encryption draft • TAG Finding on Transitioning the Web to HTTPS • How to migrate old web? ignore? http-over-tls? • Code Signing • Introduced in CSP v2 • App Cache poisoning, safe API usage • Reliable and safe form • Still using password?
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Semantics 20 • Open Data = Yes!! • Linked Open Data ….? • Open Data and Private Data • AAA mechanism is needed • Reliable and safe method to handle big data (e.g. sensor data) • Microdata/formats, Rich Snippet = Yes but that’s all? • need an evolution like Google’s PageRank
disclosure of these slides are not permitted without permissions. Keio University logo is licensed by its copyright holder. Web considered useful 21 • W3C says; Web for All, Web on Everything • So many things are undone = lots of research topic!
nunnun
anjn
kanamasa
nagix
.jpg){kind=avatar}
m3_engineering
scotthsieh825
nrinetcom
.png){kind=icon}
pharma_x_tech
kakehashi
mixi_engineers
kawakawa2222
hamadakoji
lauravandoore
revolveconf
jeffersonlam
holman
michaelherold
mojombo
nonsquared
philhawksworth
samlambert
lynnandtonic
jennybc
eileencodes
