Guru days 5.10.2011 html5 ja silverlight

  • 653 views
Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
653
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
7
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Guru Days — Riittääkö HTML5 sovellusalustaksi?
    Jani Järvinen, Moonsoft OyC# MVP
    5.10.2011
  • 2. Mikä on HTML5 ja mihin sitä tarvitaan?
    HTML5-kehittäminen Visual Studio 2010:llä
    Miten tukea useita alustoja ja päätelaitteita HTML5-sovelluksissa
    Silverlightintulevaisuus, jyrääkö HTML5 yli?
    Entä tuleva Windows 8?
    Keskustelua sekä kysymyksiä ja vastauksia
    5.10.2011
    Agenda 5.10.2011
  • 3. Mikä HTML5?
    Tutustutaan ehdotukseen uudeksi standardiksi
    5.10.2011
  • 4. Määrittelyvaiheessa oleva standardi
    HTML5 tuo monia tervetulleitauudistuksia
    Paljon muutakin kuin pelkkä ääni ja kuva
    Se mikä mediassa tunnetaan HTML5:näon itse asiassa joukko erilaisia standardiluonnoksia
    Taustalla W3C, WHATWG ja IETF
    http://dev.w3.org/html5/spec/Overview.html
    5.10.2011
    HTML5 – yleiskuva
  • 5. Canvas-elementti
    Ääni- ja videotoiston tuki ilman selainlaajennuksia
    Semanttiset elementit
    Web Storage
    WebSockets
    Geolocation API
    Web Workers
    Drag & drop
    Application Cache (offline-käyttö)
    Mikroformaatit
    CSS3, lukuisat uudet moduulit

    5.10.2011
    HTML5:n uutuuksia
  • 6. <!DOCTYPE html>
    <html lang="fi">
    <headmanifest=”cache.manifest”>
    <meta charset="utf-8">
    <title>HTML5-esimerkki</title>
    <scriptasyncsrc="koodia.js” />
    </head>
    <body>
    <headerid="main-header"></header>
    <sectionid="content">
    Tekstiä...
    <asideid="form">
    <formaction="/liity" method="post">
    <input id="email" type="email">
    </form>
    </aside>
    <figure>
    <a href="/sivu2"><img src="kuva1.png" alt="kuvaus"></a>
    </figure>
    </section>
    </body>
    </html>
    5.10.2011
    HTML5-esimerkki
  • 7. Merkitys sisällölle
    Otsikot, sivuhuomautukset, leipäteksti, alaviitteet, jne.
    HTML5:n header-, footer-, section-, aside-elementit, jne.
    Korvaavat div-elementit
    Mikroformaatit (microdata)
    Tarjoavat mahdollisuuden kuvata sisältöä vieläkin tarkemmin, esimerkiksi osoitetiedot
    Esim. Google tukee
    <section itemprop="address" itemscopeitemtype="http://data-vocabulary.org/Address">I live at <span itemprop="street-address">1234 Peach Drive</span><span itemprop="locality">Warner Robins</span> <span itemprop="region">Georgia</span></section>
    5.10.2011
    Semanttisuus
  • 8. <canvasid=”mycanvas" width="300" height="300"></canvas>
    <scripttype="text/javascript">
    varmyCanvas = document.getElementById(”mycanvas");
    varmyContext = myCanvas.getContext("2d");
    myContext.fillStyle = '#00f';
    myContext.strokeStyle = '#F63806';
    myContext.lineWidth= 4;
    myContext.fillRect(0,0,300,300);
    myContext.strokeRect(0,0,300,300);
    myContext.moveTo(150,0);
    myContext.lineTo(0,150);
    myContext.lineTo(150,300);
    myContext.lineTo(300,150);
    myContext.lineTo(150,0);
    myContext.fillStyle= '#F63806';
    myContext.strokeStyle = "#000";
    myContext.fill();
    myContext.stroke();
    </script>
    5.10.2011
    Canvas-esimerkki
  • 9. Microsoft-ohjeistusta:
    Internet Explorer 10 Guide for Developers
    http://msdn.microsoft.com/en-us/ie/gg192966
    5.10.2011
    Muita uutuuksia
    CACHE MANIFEST/test.css/test.js/test.png
    functionshowMap(position) { … } navigator.geolocation.
    getCurrentPosition(showMap);
    varecho = new Worker('echo.js'); echo.onmessage = function(e) {alert(e.data); }
  • 10. Mitä ominaisuuksia sovellusalustalta vaaditaan?
    5.10.2011
    HTML5 sovellusalustana
  • 11. Microsoft ja HTML5
    Mitä kehittäjille tarjotaan tänään?
    5.10.2011
  • 12. Kehittäjille on tarjolla kehitysvälineitä sekä selain
    Visual Studio 2010 SP1
    HTML5-syntaksin validiointi
    IntelliSense-tuki
    CSS3-ominaisuuksia
    Internet Explorer
    9.0-versio saatavilla RTM:nä
    10.0-versio Windows 8 Preview:n mukana
    Muita ohjelmistoja joissa HTML5-tukea
    Expression Web 4
    5.10.2011
    Microsoft ja HTML5
  • 13. Asentamalla SP1:n VisualStudioon saadaan käyttöönHTML5-ominaisuuksia
    Validitointituki
    Tarkistaa HTML5-syntaksin
    Ei itsessään päivity jatkuvasti,aivan viimeisimpiä asioita ei tueta
    Katso ”Web Standards Update forVisual Studio 2010 SP1”
    IntelliSense-tuki
    Tuki uusille elementeille, jne.
    5.10.2011
    Visual Studio 2010
  • 14. ASP.NET WebForms ei kunnolla tue HTML5:ttä
    Paremmat mahdollisuudet löytyvät uusista tekniikoista
    Erityisesti ASP.NET MVC
    Perinteisiä WebForms-kontrolleja ei käytetä
    Mahdollisuus paremmin vaikuttaa tuotettavaan koodiin
    HTML-helper -olio ei tunne HTML5-toimintoja
    Tuleva Visual Studio ”11” sisältää parempaa tukea
    Mukana Windows 8 DeveloperPreviewssä
    5.10.2011
    ASP.NET ja HTML5
  • 15. Semanttinen suunnittelu
    Visuaalista tukea ei toistaiseksi lainkaan
    SVG-grafiikka
    Vektorigrafiikkamuoto (Scalable Vector Graphics)
    Mitä ratkaisuja Microsoftilla on tarjota?
    Expression Web, Expression Design
    Semanttinen Word?
    Toistaiseksi tarvitaan myös esim. Adoben tuotteita, kuten Illustrator
    5.10.2011
    Mille muulle tarvitaan tukea?
  • 16. Miten tuetaan useita alustoja?
    Yhteensopivan koodin kirjoittaminen
    5.10.2011
  • 17. Wikipedia 4.10.2011:
    5.10.2011
    Selaintuki (pc-selaimet)
  • 18. Haaste: suuri määrä päätelaitteita ja selaimia
    HTML5:n myötä tilanne toivottavasti paranee
    Kestää vuosia saavuttaa vakaa tila
    Vertailun vuoksi: HTML5:n arvellaan olevan suositus vasta vuonna 2022
    Nyrkkisääntö
    Älä yritä seurata selaimia ja niiden versionumeroita
    Pikemminkin kysy selaimelta tuetaanko ominaisuutta vai ei
    Vertaa: ASP.NET ja IE 10.0
    Testaa, testaa, testaa
    5.10.2011
    Useiden alustojen tukeminen
  • 19. jQuery ja jQuery UI
    Nykypäivän peruskirjastot käyttöliittymiin
    Tulevat mukana ASP.NET 4 -sovelluksissa
    WebForms ja MVC
    Modernizr
    Hyödyllinen kirjasto, jolla voidaan tarkistaa selainten HTML5-yhteensopivuus
    www.modernizr.com
    5.10.2011
    JavaScript-kirjastoja
  • 20. HTML5-tuki tulossa kovaa vauhtia myös mobiiliselaimiin
    Toistaiseksi tuki hajanaista, mutta seuraava laitesukupolvi on selvästi parempi
    Esimerkiksi Microsoft Windows Phone 7.5 ”Mango”
    Internet Explorer 9 -selain runkona
    Toisin sanoen, myös HTML5-tukea
    5.10.2011
    Mobiilimaailma
  • 21. Voiko sama HTML5-sovellus toimia kaikissa ympäristöissä?
    PC, tabletti, mobiili, …
    Erilaiset käyttötilanteet, erilaiset ruutukoot, …
    Kevyempi vaihtoehto
    Sovellus kaikille selaimille yhdessä ympäristössä
    Entä taustajärjestelmät?
    Toimiiko sama toteutus niissä?
    Tekniikka vielä uutta
    Laajaa sovellusmäärää ei vielä ole
    5.10.2011
    Samalla toteutuksella?
  • 22. Windows 8
    Mitä kehittäjille tarjotaan tänään?
    5.10.2011
  • 23. Kaksi käyttöliittymää
    Perinteinen Windows 7 ja Metro
    Metroa ohjelmoidaan uusillaWindows Runtime -rajapinnoilla (WinRT)
    Teknisinä välineinä
    HTML5 + CSS + JavaScript
    C# ja XAML
    C++ ja XAML
    Perinteiset välineet eivät kelpaa Metroon
    C#, .NET
    Win32
    5.10.2011
    Windows 8
  • 24. 5.10.2011
    Windows 8
  • 25. Tarjoaa sovellusten tyypillisesti tarvitsemia palveluita, mm.
    Käyttöliittymä- ja shell-integraatiot
    Tietokantayhteydet
    Tilanhallinta
    jne.
    Käytettävissä Metro-sovelluksista JavaScript-kirjastojen kautta
    WinJS-kirjastot
    5.10.2011
    Windows Runtime
  • 26. Silverlight-sovellusten kehittämisen käyttöliittymäkieli
    Extensible Application Markup Language
    Tärkeä osa Windows Phone -kehittämistä
    Tuettuna myös Windows 8:ssa
    5.10.2011
    XAML-kieli
  • 27. Keskustelua
    Mikä on HTML5:n tulevaisuus, entä miten käy Silverlightille?
    5.10.2011
  • 28. Mikä on Silverlight-tekniikan tulevaisuus?
    Jos kerran HTML5:llä voi tehdä kaiken, miksi käyttää hopeavaloa?
    Onko XAML-osaaminen hukkaan heitettyä?
    Kannattaako Suomessa edes tehdä ohjelmistoja, kun HTML+JavaScript -koodauksen voi ostaa vaikkaAasiasta kolmasosalla hinnasta?
    Entä .NET-osaaminen, tarvitaanko sitä jatkossa?
    Jos sovelluksista tulee Metro-sovelluksia, onko opeteltava uusi Windows Runtime?
    5.10.2011
    Miten käy Silverlightin?
  • 29. Jaa ajatuksiasi
    Esitä kysymyksiä
    5.10.2011
    Sana on vapaa!
  • 30. Kehittäjäkoulutuksissa ota yhteyttä Salcomiin
    myynti@salcom.fi
    puh. 020 764 1010
    www.salcom.fi
    5.10.2011
    Kiitos!