Guru days 5.10.2011 html5 ja silverlight

Guru Days — Riittääkö HTML5 sovellusalustaksi?Jani Järvinen, Moonsoft OyC# MVP5.10.2011

Mikä on HTML5 ja mihin sitä tarvitaan?HTML5-kehittäminen Visual Studio 2010:lläMiten tukea useita alustoja ja päätelaitteita HTML5-sovelluksissaSilverlightintulevaisuus, jyrääkö HTML5 yli?Entä tuleva Windows 8?Keskustelua sekä kysymyksiä ja vastauksia5.10.2011Agenda 5.10.2011

Mikä HTML5?Tutustutaan ehdotukseen uudeksi standardiksi5.10.2011

Määrittelyvaiheessa oleva standardiHTML5 tuo monia tervetulleitauudistuksiaPaljon muutakin kuin pelkkä ääni ja kuvaSe mikä mediassa tunnetaan HTML5:näon itse asiassa joukko erilaisia standardiluonnoksiaTaustalla W3C, WHATWG ja IETFhttp://dev.w3.org/html5/spec/Overview.html5.10.2011HTML5 – yleiskuva

Canvas-elementtiÄäni- ja videotoiston tuki ilman selainlaajennuksiaSemanttiset elementitWeb StorageWebSocketsGeolocation APIWeb WorkersDrag & dropApplication Cache (offline-käyttö)MikroformaatitCSS3, lukuisat uudet moduulit…5.10.2011HTML5:n uutuuksia

<!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.2011HTML5-esimerkki

Merkitys sisällölleOtsikot, sivuhuomautukset, leipäteksti, alaviitteet, jne.HTML5:n header-, footer-, section-, aside-elementit, jne.Korvaavat div-elementitMikroformaatit (microdata)Tarjoavat mahdollisuuden kuvata sisältöä vieläkin tarkemmin, esimerkiksi osoitetiedotEsim. 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.2011Semanttisuus

<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.2011Canvas-esimerkki

Microsoft-ohjeistusta:Internet Explorer 10 Guide for Developershttp://msdn.microsoft.com/en-us/ie/gg1929665.10.2011Muita uutuuksiaCACHE MANIFEST/test.css/test.js/test.pngfunctionshowMap(position) { … } navigator.geolocation.getCurrentPosition(showMap);varecho = new Worker('echo.js'); echo.onmessage = function(e) {alert(e.data); }

Mitä ominaisuuksia sovellusalustalta vaaditaan?5.10.2011HTML5 sovellusalustana

Microsoft ja HTML5Mitä kehittäjille tarjotaan tänään?5.10.2011

Kehittäjille on tarjolla kehitysvälineitä sekä selainVisual Studio 2010 SP1HTML5-syntaksin validiointiIntelliSense-tukiCSS3-ominaisuuksiaInternet Explorer9.0-versio saatavilla RTM:nä10.0-versio Windows 8 Preview:n mukanaMuita ohjelmistoja joissa HTML5-tukeaExpression Web 45.10.2011Microsoft ja HTML5

Asentamalla SP1:n VisualStudioon saadaan käyttöönHTML5-ominaisuuksiaValiditointitukiTarkistaa HTML5-syntaksinEi itsessään päivity jatkuvasti,aivan viimeisimpiä asioita ei tuetaKatso ”Web Standards Update forVisual Studio 2010 SP1”IntelliSense-tukiTuki uusille elementeille, jne.5.10.2011Visual Studio 2010

ASP.NET WebForms ei kunnolla tue HTML5:ttäParemmat mahdollisuudet löytyvät uusista tekniikoistaErityisesti ASP.NET MVCPerinteisiä WebForms-kontrolleja ei käytetäMahdollisuus paremmin vaikuttaa tuotettavaan koodiinHTML-helper -olio ei tunne HTML5-toimintojaTuleva Visual Studio ”11” sisältää parempaa tukeaMukana Windows 8 DeveloperPreviewssä5.10.2011ASP.NET ja HTML5

Semanttinen suunnitteluVisuaalista tukea ei toistaiseksi lainkaanSVG-grafiikkaVektorigrafiikkamuoto (Scalable Vector Graphics)Mitä ratkaisuja Microsoftilla on tarjota?Expression Web, Expression DesignSemanttinen Word?Toistaiseksi tarvitaan myös esim. Adoben tuotteita, kuten Illustrator5.10.2011Mille muulle tarvitaan tukea?

Miten tuetaan useita alustoja?Yhteensopivan koodin kirjoittaminen5.10.2011

Wikipedia 4.10.2011:5.10.2011Selaintuki (pc-selaimet)

Haaste: suuri määrä päätelaitteita ja selaimiaHTML5:n myötä tilanne toivottavasti paraneeKestää vuosia saavuttaa vakaa tilaVertailun vuoksi: HTML5:n arvellaan olevan suositus vasta vuonna 2022NyrkkisääntöÄlä yritä seurata selaimia ja niiden versionumeroitaPikemminkin kysy selaimelta tuetaanko ominaisuutta vai eiVertaa: ASP.NET ja IE 10.0Testaa, testaa, testaa5.10.2011Useiden alustojen tukeminen

jQuery ja jQuery UINykypäivän peruskirjastot käyttöliittymiinTulevat mukana ASP.NET 4 -sovelluksissaWebForms ja MVCModernizrHyödyllinen kirjasto, jolla voidaan tarkistaa selainten HTML5-yhteensopivuuswww.modernizr.com5.10.2011JavaScript-kirjastoja

HTML5-tuki tulossa kovaa vauhtia myös mobiiliselaimiinToistaiseksi tuki hajanaista, mutta seuraava laitesukupolvi on selvästi parempiEsimerkiksi Microsoft Windows Phone 7.5 ”Mango”Internet Explorer 9 -selain runkonaToisin sanoen, myös HTML5-tukea5.10.2011Mobiilimaailma

Voiko sama HTML5-sovellus toimia kaikissa ympäristöissä?PC, tabletti, mobiili, …Erilaiset käyttötilanteet, erilaiset ruutukoot, …Kevyempi vaihtoehtoSovellus kaikille selaimille yhdessä ympäristössäEntä taustajärjestelmät?Toimiiko sama toteutus niissä?Tekniikka vielä uuttaLaajaa sovellusmäärää ei vielä ole5.10.2011Samalla toteutuksella?

Windows 8Mitä kehittäjille tarjotaan tänään?5.10.2011

Kaksi käyttöliittymääPerinteinen Windows 7 ja MetroMetroa ohjelmoidaan uusillaWindows Runtime -rajapinnoilla (WinRT)Teknisinä välineinäHTML5 + CSS + JavaScriptC# ja XAMLC++ ja XAMLPerinteiset välineet eivät kelpaa MetroonC#, .NETWin325.10.2011Windows 8

Tarjoaa sovellusten tyypillisesti tarvitsemia palveluita, mm.Käyttöliittymä- ja shell-integraatiotTietokantayhteydetTilanhallintajne.Käytettävissä Metro-sovelluksista JavaScript-kirjastojen kauttaWinJS-kirjastot5.10.2011Windows Runtime

Silverlight-sovellusten kehittämisen käyttöliittymäkieliExtensible Application Markup LanguageTärkeä osa Windows Phone -kehittämistäTuettuna myös Windows 8:ssa5.10.2011XAML-kieli

KeskusteluaMikä on HTML5:n tulevaisuus, entä miten käy Silverlightille?5.10.2011

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.2011Miten käy Silverlightin?

Jaa ajatuksiasiEsitä kysymyksiä5.10.2011Sana on vapaa!

Kehittäjäkoulutuksissa ota yhteyttä Salcomiinmyynti@salcom.fipuh. 020 764 1010www.salcom.fi5.10.2011Kiitos!

Guru days 5.10.2011 html5 ja silverlight

More Related Content

Similar to Guru days 5.10.2011 html5 ja silverlight (20)

More from Salcom Group (7)

Guru days 5.10.2011 html5 ja silverlight