HTML5 App. Herman van Dompseler In samenwerking met SURFnet. 3 augustus 2012 Versie CONCEPT

Maat: px
Weergave met pagina beginnen:

Download "HTML5 App. Herman van Dompseler In samenwerking met SURFnet. 3 augustus 2012 Versie 0.3 - CONCEPT"

Transcriptie

1 Herman van Dompseler In samenwerking met SURFnet 3 augustus 2012 Versie CONCEPT

2 Contents Part 1: Wat is HTML Laat maar zien, wat kan ik met HTML5?... 4 HTML5 Resources... 7 HTML5 Apps... 7 Native vs Hybrid vs Web Apps... 8 Native Apps... 8 Web Apps... 9 Hybride Apps... 9 Een kijkje in de toekomst van Web Apps Ok, maar wat kies ik nu voor mijn project? Beslisboom Scenario s Native vs. Hybrid vs Web Resources Part 2: Hybride Apps uitgewerkt Architectuur Stand Alone - Hybride App Connected - Hybride App App design & App resources Libraries Backend libraries Frontend libraries Werken met Phonegap Audio voorbeeld Part 3: Een App bouwen voor Android Stap 1: Hello World Stap 2: Run en test je app Kopieer je App naar een device Stap 3: Welke Android versie? Stap 4. Directory structuur Stap 5. Icon & Start-up scherm Stap 6. Schermgrootte Schermtype definitie Images en text grootte

3 CSS layouts queries Stap 7: Events (backend) Stap 8: Events (frontend) Stap 9: Off You Go! Bijlage 1 index.html Bijlage 2 page.css Bijlage 3 layout.css Bijlage 4 event.js

4 Part 1: Wat is HTML5 HTML 5 is de nieuwe standaard voor het presenteren van webpagina s. HTML5 is niet één groot nieuw ding, maar een collectie van nieuwe standaarden en features op drie deelgebieden: 1. HTML5 2. Javascript (JS) 3. CSS3 Nieuw staat tussen aanhalingstekens omdat sommige HTML5 elementen al enige tijd te gebruiken zijn en andere elementen nog in ontwikkeling zijn. HTML 5 is daarom het best te omschrijven als een continue verbetering van de taal en tools voor het maken van web applicaties. Met de nadruk op applicaties ipv. statische pagina s. In de combinatie van HTML 5, Javascript en CSS3 zijn het de HTML <tags> die de declaratie van de elementen vormen. Met Javascript en CSS3 worden deze elementen dynamisch gemaakt. Bij programma s in Javascript ligt de focus op het procedureel aanpassen van de elementen. Met CSS3 worden de elementen vorm gegeven en ligt de focus op de positionering en transities van elementen. En ja, je kunt het nu meteen gebruiken. Of de specificatie nu af is of niet, alle browsers/devices ondersteunen een subset van de mogelijkheden. Een webpagina die begint met <!doctype html> is een HTML 5 pagina. Vervolgens is het belangrijk te kijken of de functionaliteit die je nastreeft beschikbaar is voor het platform waarop je het wilt laten zien. In één van de vele desktop browsers, op een Android of ios device. Op staat een overzicht van de functionaliteiten voor de verschillende platformen. Laat maar zien, wat kan ik met HTML5? In eerdere onderzoeken heb we al laten zien wat er zoal met HTML5 mogelijk is. Eind 2010 heeft een theoretisch onderzoek naar de HTML5 <video> tag laten zien wat er mogelijk is op video gebied met HTML5. Een demo pagina toont de implementatie. 4

5 Vervolgens is er begin 2011 onderzoek gedaan naar andere HTML5 elementen. Van verschillende HTML5 elementen is een proefimplementatie gedaan om de resultaten te tonen. Bijvoorbeeld het element <input type= date >. De Opera browser toont dan een datum prikker, daarvoor is geen code meer aan te pas gekomen. 5

6 Of de video wall, geschikt voor verschillende devices: desktop, tablet en mobile met dynamische elementen erin. Met deze video wall, kunnen 9 video s parallel afgespeeld worden. De metadata werd lokaal opgeslagen op het device en is daardoor instant te raadplegen. Eind 2011 is er een proof of concept gemaakt van een HTML5 Video Annotatie Player. Waarmee het mogelijk is een HTML5 video met meerdere mensen te annoteren en met sociale media erover te praten. Daarnaast is deze video player gepresenteerd in een <canvas> element om de video speler een gaming karakter te geven. Ook is er gekeken naar ondertiteling met WebVTT. 6

7 Al deze onderzoeken waren vrij theoretisch en technisch georiënteerd, met proof of concept implementaties. Ze tonen aan dat alles wat denkbaar is, eigenlijk ook met HTML5 te maken is. Kijk eens op of te zien dat het echt mogelijk is. Dit document zal een praktische handleiding worden voor het maken van HTML5 Apps met een eigen App als resultaat. HTML5 Resources HTML specificatie van W3C CSS beschrijving van W3C All HTML 5 All Javascript All CSS 3 ff checken https://developer.mozilla.org/en/javascript/ (voor welk platform?) (oh, kan dat ook!) (en dit ook) (wow) HTML5 Apps HTML5 is een webtechnologie, waarmee informatie toegankelijk wordt gemaakt via webbrowsers, tot voorkort voornamelijk toegepast op desktop en laptop computers met een scherm, toetsenbord en muis. Maar dit verandert, net zoals het Internet zich uitbreidt naar andere devices, zoals 7

8 smartphones, tablets, maar denk ook aan auto s, koelkasten en anderen apparaten die aan internet verbonden worden. Zo zal ook HTML5 zich uitbreiden om een interface te bieden aan deze apparaten. De eerste logische stap is een HTML5 interface voor smartphones en tablets. Devices met aanraakschermen die (bijna) altijd verbonden zijn met Internet. Een website die geoptimaliseerd is voor gebruik op een smartphone of tablet wordt een Web App genoemd. Dit is een website die opgevraagd wordt met de browser van het device en die specifiek voor het device is ontworpen. De site reageert op het touchscreen en kan interactie hebben met bijvoorbeeld de GPS positie van het device. Voor een Web App is het typisch om naar een URL te browsen. Web Apps zijn het tegenovergestelde van Native Apps. Native Apps zijn voor een specifiek device gemaakte toepassingen, al dan niet verbonden met het Internet. Native Apps zijn programma s die zonder webbrowser werken, maar juist rechtstreeks op het device zijn aangesloten. Een Native App wordt typisch uit de App store gedownload, waarna deze gebruikt kan worden. Het is een gevecht tussen deze twee uitersten: En er zit nog van alles tussen in. Goed beschouwd zijn er vier typen Apps te onderscheiden. 1. Native Apps, specifiek voor een device gemaakte toepassing, met specifieke code 2. Hybride Apps, voor een device gemaakte toepassing met generieke code 3. Web Apps die specifiek voor een mobiel device/platform zijn gemaakt a. Kunnen geïnstalleerd en gestart worden als Native Apps b. Interactieve/touch gui c. Client side rendering d. Offline available 4. Web sites, een website die geoptimaliseerd is voor mobiele platformen a. Worden bezocht door er naartoe te browsen b. Navigatie UI/algemene look & feel c. Server side rendering d. Alleen online De laatste laten we even buiten beschouwing, een aangepaste website wordt vaak ook als voorbeeld van Web App aangehaald, maar dat doen we hier niet. Dus als in dit document gesproken wordt over Web Apps, dan gaat het om specifiek voor een mobiel device gebouwde toepassing. En wat is dan een HTML5 App? Dat is een App die met HTML5 technologie is gemaakt en dat kan zowel een Web App als een Hybride App opleveren. Native vs Hybrid vs Web Apps Native vs Web apps is een strijd tussen twee filosofieën. Met aan beide kanten voor- en tegenstanders. En waar twee vechten om een been Native Apps De voordelen van Native Apps: 8

9 Direct toegang tot de device hardware, zoals camera s etc. EN direct interactie met het device, zoals notificaties aan de gebruiker EN integratie met andere apps o Web Apps hebben beperkt toegang tot het device Runs faster, wat voornamelijk geldt voor grafisch intensieve applicaties Native Apps kunnen de look & feel van het mobile OS gebruiken, dat levert een smooth user experience o Web Apps kunnen een native gevoel geven, door ze te starten vanaf het device en geen browser raamwerk om de App heen te maken. Bijkomend voordeel, de App store: Apps kunnen worden geplaatst in App stores en zijn daardoor makkelijk toegankelijk en kunnen makkelijk op het device geplaatst worden. o Web Apps worden via websites gedistribueerd Met Apps in App stores is ook geld te verdienen, via de App store kan een bedrag voor het downloaden van de App worden gevraagd, waarvan 70% voor de App ontwikkelaar is. Web Apps De voordelen van Web Apps: Write once, run many, een generiek platform voor meerdere devices o Native Apps moeten voor iedere platform opnieuw gebouwd worden Bijkomend voordeel, content beheer: De content wordt van internet gehaald, er is dus één content store, die ook voor andere doeleinden, zoals een website, gebruikt kan worden. Content is daardoor makkelijk te beheren/wijzigen o bij Native Apps moet een nieuwe App worden geplaatst in de App store bij iedere update. Er wordt gezegd dat dit een tijdrovend en niet een triviaal proces is, vanwege oa. keuringen door App store owners. De overeenkomsten tussen Native en Web Apps: Ja, die zijn er ook Beiden typen apps zijn online/offline te gebruiken De programmeertalen waarin Native dan wel HTML5 Apps worden gemaakt verschillen wel: Android is Java, ios is objective C en in HTML5 gebruik je Javascript. Maar met alle talen is hetzelfde te bereiken. Het is vaak de persoonlijke voorkeur van de maker die bepaalt wat het beste werkt. Voor native development heeft iedere aanbieder zijn eigen software development kit (SDK) waarmee ontwikkelaars aan de slag kunnen. Voor Web Apps gebruikt de ontwikkelaar zijn eigen favoriete tools. Hybride Apps Even samenvattend: Native Apps zijn voor een specifiek device gemaakte toepassingen en een Web App is een website, specifiek voor een device gemaakt. 9

10 Een Hybride App is de combinatie: een Native App met HTML embedded. De HTML5, CSS3 en Javascript kan in de App opgeslagen worden (zoals bij een Native App) of van het web worden gedownload. Een Hybride App geeft de flexibiliteit van een Web App en de user experience van een Native App. Voordelen ten opzichte van een Native App: Write once, in HTML5 Voordelen ten opzichte van Web Apps: Gebruik een framework (Phonegap bv.), die de directe toegang tot het device omzet in webservices die met HTML5 zijn te raadplegen. Kunnen in App stores worden geplaatst en kan dus ook voor betaald worden. Een kijkje in de toekomst van Web Apps Web Apps zullen waarschijnlijk meer op Native Apps gaan lijken. De volgende ontwikkelingen zijn nu gaande: WebGL voor het versnellen van 3D grafische mogelijkheden in de browser Web App stores, om ook met Web Apps geld te kunnen verdienen en ze makkelijk te kunnen vinden/installeren. o Open App Market is een Web App store: o Google heeft een eigen Webstore, https://chrome.google.com/webstore# o Mozilla werkt aan een Web App store, https://www.mozilla.org/en- US/apps/partners/ Er zullen steeds meer toegangsmogelijkheden komen voor Web Apps om van device specifieke toepassingen gebruik te maken. GPS is er bijvoorbeeld al. Meer zal er volgen. Ok, maar wat kies ik nu voor mijn project? Je kunt een afweging maken op basis van de genoemde verschillen tussen de type Apps. Onderstaande vergelijking kan je daarbij helpen. Hier worden de Apps vergeleken op: Device Access: de toegang tot de verschillende functionaliteiten van het device. o Web Apps hebben duidelijk minder toegang tot functionaliteiten ten opzichte van de andere twee typen. Speed: de snelheid waarmee de App moet werken en reageren. o Native Apps zijn het snelst te maken. Development cost: de prijs voor het ontwikkelen van de App. o De ontwikkeling van Native Apps zal in veel gevallen het intensiefst zijn, omdat voor iedere device specifieke expertise nodig is. App store (en het Approval Proces): heeft de App een plekje in de App store o Web Apps zijn niet in een App store te plaatsen 10

11 Taken from: Het zal echter niet voldoende zijn om op deze manier naar je App ontwikkeling te kijken. Wat in ieder geval ook meegenomen moet worden is: Het soort App. o Ontsluit de toepassing veel content of is er juist veel interactie in de vorm van gaming. Welke uitstraling heeft de App. o Wil je naadloos aansluiten bij het device of juist aansluiten bij je eigen huisstijl/website. Waar zitten de gebruikers. o Je kunt bijvoorbeeld specifiek willen ontwikkelen voor iphone/ipad gebruikers. Met welke technologie zijn de eigen ontwikkelaars bekend. o Wat bijvoorbeeld HTML5 betreft kan dit aansluiten bij de ontwikkeling van websites die vaak al gaande is. Het is min of meer bekende technologie. Beslisboom Onderstaande flowchart helpt je bij het maken van een keuze. Er zijn drie gezichtspunten. Bekijk het ontwikkelen van de App: 1. Vanuit je eigen wens om een app te maken. 2. Vanuit de gebruikers van je App. 3. Vanuit de ontwikkelaar van de App. De kosten voor het ontwikkelen van de App zijn niet in deze beslisboom meegenomen. Het is duidelijk dat een aangepaste website die je gebruikt als Web App de minste kosten met zich mee brengt. Voor het ontwikkelen van device specifieke apps, zijn de kosten hoger en afhankelijk van het design. 11

12 12

13 Scenario s 1. Je wilt een high speed game ontwikkelen, en geen concessies wat betreft snelheid en grafische kwaliteit doen. De flowchart brengt je bij: Native App. 2. Je wilt een toepassing ontwikkelen waarbij je toegang nodig hebt tot de camera van het device. De flowchart brengt je bij: Hybrid App. (Native is ook een optie) 3. Je hebt online content aan te bieden en een mooie vormgeving ontwikkelt. Je hebt niet specifieke device toegang nodig. Je wilt wel dat mensen voor gebruik van je App betalen De flowchart brengt je bij: Hybrid App. 4. Je hebt online content aan te bieden, wat je deels ook gebruikt op je site. Voor de App heb je een nieuw design gemaakt, geschikt voor het formaat van het device. Je wilt dit net als je website gratis aanbieden De flowchart brengt je bij: Web App. 5. Je wilt dat je website ook op een smartphone of tablet is te bekijken met de browser van het device. De flowchart brengt je bij: Optimaliseer je website. Native vs. Hybrid vs Web Resources The battle The debate an in-depth video of the differences 13

14 Part 2: Hybride Apps uitgewerkt In dit hoofdstuk duiken we de wereld van Hybride Apps in. Om de App in een breder kader te plaatsen wordt eerst de architectuur geschetst. Vervolgens een klein beetje aandacht voor het design van de APP en daarna zoomen we in op de belangrijkste libraries die nodig zijn. Architectuur Voor het ontwikkelen van een Native iphone of Android App worden de volgende stappen ondernomen. De programmeur schrijft zijn code in Objective C of Java. Hij maakt gebruik van een SDK als raamwerk voor zijn code. In het build proces wordt een App gemaakt. (.app of.apk) De app wordt in een App store aangeboden van waaruit hij op een device kan worden gedownload en geïnstalleerd. iphone en Android App ontwikkel methode 14

15 Stand Alone - Hybride App Om te kunnen programmeren in HTML5, CSS3 en Javascript moet er een brug gevormd tussen deze code en de App SDK. Hiervoor zijn verschillende Libraries gemaakt: 1. Frontend Libraries: javascript libraries die het maken van de look & feel van je applicatie verzorgen. Een voorbeeld hiervan is jquery Mobile. 2. Backend Libraries: javascript libraries die toegang tot de SDK en functionaliteiten van het device verzorgen. Een voorbeeld hiervan is Phonegap. Hybride App ontwikkel methode 15

16 Connected - Hybride App In de standalone Hybride App staat alle HTML5, CSS3 en Javascript in de App zelf. Echter niet alle resources hoeven in de App te staan. Een App kan web resources voor content gebruiken. Net zoals een bestaande website de web resources gebruikt. 16

17 Hybride App + Website ontwikkel methode In deze architectuur zijn, ten opzichte van de stand alone versie, twee stromen toegevoegd. Daarmee worden een API server en een Web server gerealiseerd. 1. De backend stroom: vanuit de resources is een database opgebouwd die via eigen code en een favoriet raamwerk op Internet wordt ontsloten middels een API. Een API levert data in een XML en/of JSON formaat. 2. Een frontend stroom: vanuit HTML5, CSS3 en Javascript wordt al dan niet met een (jquery) library een website gebouwd. De XML of JSON uit de API levert content aan deze website. Deze website is te bekijken met een browser op een device. Merk op dat dit ook een smartphone of tablet kan zijn. In deze connected architectuur zie je duidelijk de belangrijkste overeenkomsten tussen ontwikkelen voor web sites en Apps: Programmeer in HTML5, CSS3 en Javascript (de grijze blokken) en maak daarbij gebruik van libraries. Daar is het in dit onderzoek natuurlijk allemaal om te doen. Put uit één bron van resources. Resources kunnen ofwel toegankelijk gemaakt worden via de App ofwel via de API, die op zijn beurt ook de website van content voorziet. App design & App resources Een goed interactie design van een App is van essentieel belang. Zomaar een website kopiëren is niet de optimale oplossing. Waar met name rekening mee moet worden gehouden is het formaat van het device. Een scherm van een smartphone is het kleinst en een smartphone wordt vaak in portrait bediend. Een tablet scherm is groter en wordt weer vaker landscape gebruikt. Een smartphone kan op ieder moment van de dag op iedere lokatie gebruikt worden. Dat moet snel en effectief werken. Dat is een andere beleving dan wanneer je met een tablet of laptop op schoot aan het browsen en lezen bent. Ook qua visueel design vergt het bouwen van een App aandacht. Het is belangrijk te bepalen in hoeverre aangesloten moet worden bij het design van het device waarop gekeken wordt. Design van een App is verder geen onderdeel van dit rapport. Google en Apple hebben beiden richtlijnen voor het ontwikkelen van een App, die erg interessant zijn om te lezen. Android: ios: ehig/introduction/introduction.html Een belangrijke vraag die nog wel beantwoordt moet worden alvorens een Connected Hybride App te gaan ontwikkelen is: 17

18 Welke resource moet in de App en welke kan via de API opgehaald worden? Er zijn twee uitgangspunten: 1. De App moet een snelle response geven, dat zijn gebruikers ook van Native Apps gewend. 2. Er moet niet teveel data verkeer gegenereerd worden tussen App en API, dat bespaard de gebruiker netwerkkosten. Om aan deze uitgangspunten te kunnen voldoen is het zinvol zoveel mogelijk resources in de App beschikbaar te hebben en zo min mogelijk uit de API te halen. Toch kan het belangrijk zijn om content, wat toch al beschikbaar is op de website, via de API toegankelijk te maken, omdat: Content dan niet gedupliceerd hoeft te worden. Niet voor elke content wijzigingen een nieuwe App moet worden gemaakt. Content die uit de API opgehaald moet worden kan bovendien het beste in het JSON formaat worden beschreven, waarmee delen van een HTML pagina worden vervangen. De Javascript processing en de HTML rendering van de content vindt dan plaats op het device zelf. Hierdoor wordt de netwerkbelasting zo klein mogelijk gehouden en wordt de response van de API zo snel mogelijk gemaakt. Libraries In de architectuur is aangegeven dat gebruik gemaakt kan worden van verschillende libraries. Libraries verzorgen de koppeling met het achterliggende device, in dit document backend libraries genoemd. Of libraries leveren interface elementen, frontend libraries genoemd. Backend libraries Backend libraries maken verschillende functionaliteiten van een device toegankelijk voor javascript code. De library die in dit onderzoek verder wordt onderzocht is Phonegap. In Plaats van Phonegap wordt nu ook de naam Cordova gebruikt. Dit is de naam voor de core van het Phonegap systeem dat middels de Apache Software Foundation open source wordt aangeboden, terwijl Phonegap door Adobe is overgenomen. (http://incubator.apache.org/cordova/ ). Eeen aantal backend libraries: Phonegap: Appmobi: Appcelerator (Titanium): Frontend libraries Van frontend libraries die het ontwikkelen van de App interface eenvoudiger maken zijn meerdere smaken, die varieren van heel uitvoerige libraries tot kleine, handige scripts. Bekende libraries zijn: Modernizr: voor het detecteren van HTML 5 ondersteuning door de browser. jquery, en jquerymobile: voor een algemeen javascript framework. 18

19 jqtouch: en Zepto.js: alternatieve javascript raamwerken voor mobile devices. Sencha, biedt een compleet en uitgebreid raamwerk voor mobile development. Dojo, focused op het maken van een native look & feel mobile App. Werken met Phonegap Phonegap is een Javascript library, waarin functies zijn gedefinieerd die je kunt gebruiken om toegang te krijgen tot functionaliteiten van een device. Of het device nu een Android, iphone of ander device is, de Javascript functies zijn hetzelfde. Dit is een overzicht van de elementen waar Phonegap toegang toe geeft: Events, Events voor starten en pauzeren van App etc. Capture, voor het opslaan van geluid, foto s en videos met de bijbehorende tools van het device. Camera, voor het maken van een foto met de camera tool van het device. o Kan dus ook met capture, wat is het verschil? Media, voor het opslaan en afspelen van geluid, met oa. play en pause interface. Accelerometer, de bewegingssensor. o Geeft antwoord op de vraag naar welke kant beweegt het device. Compas, het kompas. o Geeft antwoord op de vraag welke kant wijst het device op. Geolocation, de GPS. o Geeft antwoord op de vraag waar bevindt het device zich. File, voor het maken van files op het device Storage, voor het maken van een Web SQL database voor het device Contacts, geeft toegang tot het adresboek van het device Notification, geeft toegang tot tekstuele notificaties, maar ook geluiden en vibraties etc. Device, geeft informatie over de hardware en software van het device Connection, geeft information over de netwerk status, wifi of 3G etc. De interface tot de functies van deze elementen staat op: 19

20 Audio voorbeeld Voor sommige functies is het mogelijk meerdere oplossing te kiezen, neem bijvoorbeeld het afspelen van geluid. De HTML5 oplossing voor afspelen van geluid is gebruik maken van de <audio> tag in de HTML pagina. Met javascript kan dan vervolgens de functie play() aangeroepen voor het afspelen van het fragment. De phonegap oplossing voor het afspelen van geluid is gebruik maken van het media object en ook dit object heeft een play() methode. Voordeel van gebruik van de Phonegap oplossing is dat het hiermee ook mogelijk is om audio op te nemen, met de startrecord() methode. Met de HTML5 oplossing is het alleen mogelijk af te spelen. 20

21 Part 3: Een App bouwen voor Android Hieronder volgt een stap voor stap handleiding voor het bouwen van een Hybride App met gebruik van Phonegap en de Android SDK. Stap 1: Hello World Hello World! Maak je eerste Phonegap project gebruikmakend van de handleiding op: Deze handleiding volgen komt neer op de volgende acties: Installeer Eclipse Download en configureer Android SDK Installeer Android Development Tools (ADT) plugin vanuit Eclipse Download Phonegap Opzetten van de development omgeving Stap 2: Run en test je app Daarvoor heb je eerder de ADT plugin geïnstalleerd. Het is belangrijk te begrijpen hoe je deze plugin kunt gebruiken om verschillende devices te simuleren. Hieronder zie je twee devices voor tests. 21

22 1. Dit is een emulatie van een Sony Experia U, een smartphone met High density scherm, portrait georiënteerd. a. resolutie: 480x854 b. density: Dit is een emulatie van een yarvik gotab, een tablet met een low density scherm, landscape georiënteerd. a. resolutie: 1024x768 b. density: 120 Als je een applicatie wilt testen, dan klik je op Run en kies je een van deze virtual devices waarop je wilt draaien. Kopieer je App naar een device Je zult je App eerder of later ook willen testen op een real device, naast deze virtuele devices. Daarvoor hoef je je App niet meteen in een store te plaatsen, maar kun je een zelf gemaakte.apk file op je device installeren. Je moet daarvoor wel iets doen. Maak eerst je eigen certificaaat waarmee je de App signeerd. o maak met keytool een key + keystore Exporteer je App o right klik projectnaam -> android tools -> export signed application package Verplaats.apk bestand naar je device o Koppel met usb je device en kopieer bestand 22

23 Installeer de.apk op je device. Het maken van het certificaat hoef je maar één keer te doen, je kunt hiermee alle toekomstige app signeren. Stap 3: Welke Android versie? Kijk op voor de laatste verdeling van de verschillende Android versies. In juli 2012 was het gebruik van Android: 2.1: Éclair: 4% 2.2: Froyo: 15% 2.3[.3]: Gingerbread: 60% 3.2: Honeycomb: 2% 4.0[.3]: Ice Cream Sandwich: 16% 4.1: Jelly Bean: 1% Door te ontwikkelen voor Android vanaf versie 2.1 wordt totaal dus 98% van de android gebruikers bereikt. Maar dat betekent dat je code moet voldoen aan API level 7 waarop Eclair is gebouwd. Terwijl Jelly Bean al op API Level 16 zit. Versie Gingerbread is veruit de meest gebruikte versie met 60% en Ice Cream Sandwich is de hardste stijger met nu 16%. Tijdens het opzetten van je project dien je hierin een keuze te maken. Stap 4. Directory structuur Tijdens het opzetten van je project ben je al verschillende directories in de Android SDK tegen gekomen. De belangrijkste voor het ontwikkelen van een HTML5 App is de directory assets/www. Dat is in feite de documentroot, zoals je hem ook gewend bent bij het ontwikkelen van een website. In deze directory is de index.html de eerste file die gestart wordt. Het is aan te bevelen om vervolgens de CSS, JS en graphics (GFX) in subdirectories te plaatsen. 23

24 Eclipse explorer voor Android Stap 5. Icon & Start-up scherm Alvorens je App start, zie je een start icoon, die jouw App representeert. Na klikken op het icoon verschijnt vervolgens een splash screen gedurende het opstarten van je App. Deze images moet je voor ieder platform apart behandelen. Bij Android wordt het start icoon gedefinieerd in de XMLmanifest file: In de directory res/drawable* staat de file ic_launcher.png, dit is het icoon. Als je een splash screen wilt tonen als je App start, dan geef je voor Android een splash screen op in de belangrijkste Java file met de volgende twee regels: 24

25 super.setintegerproperty("splashscreen", R.drawable.splash); super.loadurl("file:///android_asset/www/index.html", 10000); Dit splash screen blijft tien seconden staan, na het laden van je App kun je het screen eventueel eerder verwijderen met: settimeout(function() { navigator.splashscreen.hide();, 2000); Ook het splashscreen, splash.png, moet gekopieerd worden in de res/drawable* directories, net als het start icoon. Stap 6. Schermgrootte Op lees je over de verschillende formaten waar je rekening mee kan/moet houden. Android verdeeld de formaten met een eenheid: 'dp', dat staat voor density pixel. Een density pixel is het zelfde als een gewone pixel (px) bij een dichtheid van het scherm van 160 dpi (dot per inch). Dit wordt de gemiddelde dichtheid genoemd. Bij deze dichtheid is het meest geschikte formaat voor een button 48x48 pixels, zodat je comfortabel met je vinger kunt aanwijzen. Bij een dichtheid van het scherm van 240 dpi is de density 1,5 x zo groot. Dat betekent dat je op het scherm ook 1.5 keer zo grootte buttons moet neerzetten, 72x72 pixels dus, om het zelfde formaat button te creëren voor een vinger. Verschillende densities zijn: low: 120 dpi, 36x36 buttons medium: 160 dpi, 48x48 buttons high: 240 dpi, 72x72 buttons xhigh: 320 dpi, 96x96 buttons Verschillende schermgrootte worden uitgedrukt in density pixels: small: 426dp x 320dp normal: 470dp x 320dp large: 640dp x 480dp xlarge: 960dp x 720dp Ontwikkel je voor Android specifiek, dan kun je voor ieder formaat de juiste images maken en in de daarvoor bestemde directory neerzetten. De Android SDK bepaalt dan welk image, voor het device waar de App op draait, het meest geschikt is. 25

26 Schermtype definitie Het design van je App is hier van cruciaal belang. De drie belangrijkste designs die zijn te onderscheiden zijn: Ontwikkel voor een smartphone o width: < 768 o orientation: portrait o dpi: 160 Ontwikkel voor een tablet o width: > 768 o orientation: landscape o dpi: 160 Ontwikkel voor high resolution, ipad3 & new smartphones o Width: ALL o Orientation: ALL o dpi: > 240 Met een combinatie van deze designs kan voor veel devices ontwikkeld worden. In de voorbeeld App die is gemaakt komt dit tot uiting in een twee koloms applicatie voor een tablet en dezelfde data in één kolom voor een high resolution smartphone. Twee koloms tablet layout 26

27 Eén kolom smartphone layout Het voorbeeld van de code om dit te realiseren wordt in de bijlage gegeven. 1. Index.html staat in bijlage 1, dit is de html pagina 2. Page.css staat in bijlage 2, dit is de default vormgeving, zoals deze op het tablet wordt getoond. 27

28 3. Layout.css staat in bijlage 3, dit is de layout die wijzigt voor de smartphone en voor high density schermen. 4. Event.js staat in bijlage 4, dit is de koppeling tussen joouw applicatie en de Phonegap en jquerymobile events. Images en text grootte De button grootte is in het vorige hoofdstuk al ter sprake gekomen. Normale buttons zijn 48x48 pixels. Voor high density schermen gebruik je 72x72 pixels. Voor text grootte geldt hetzelfde. Normale text grootte is 12 pt. Voor high density schermen gebruik je dan 18 pt, zodat de tekst leesbaar blijft. Je kunt voor verschillende densities verschillende images gaan gebruiken. Let wel op dat je al je images in CSS moet definiëren om dit te laten werken. Een alternatief is om van vector images gebruik te gaan maken in SVG. Vector images is ook een HTML5 goodie en.svg files kun je gebruiken in de <img src= image.svg > tag. Een tool om SVG images te maken is Inkscape, CSS layouts queries Om de juiste layout te kunnen maken moet allereerst in de HTML code gedefinieerd worden hoe het scherm wordt gezien. Dit is de zogenaamde viewport. Voor gebruik met CSS willen we graag dat de viewport net zo groot is als het scherm. Zodat het device niet automatisch gaat zoomen. Deze viewport regel wordt opgenomen in de index.html: <meta name="viewport" content="user-scalable=no, width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1, target-densitydpi=device-dpi" /> In CSS kunnen we vervolgens het device herkennen en de layout afhankelijk maken queries: 1. Met CSS kun je voor portrait of landscape mode ontwikkelen: /* for portrait or landscape mode screen and (orientation: portrait) { /* portrait layout screen and (orientation: landscape) { /* landscape layout */ 2. Het ontwerp afhankelijk van de breedte van het scherm maken: /* fixed width layout */ /* standard width screen and (max-width: 767px) { 28

Summerschool Mobiele Apps 15-17 augustus 2012 Herman van Dompseler. HTML 5 App

Summerschool Mobiele Apps 15-17 augustus 2012 Herman van Dompseler. HTML 5 App Summerschool Mobiele Apps 15-17 augustus 2012 Herman van Dompseler HTML 5 App 1. Wat is HTML 5 2. HTML 5 Apps 3. Hybride App Architectuur 4. Een App maken Overzicht Deel 1: HTML5 HTML 5 gebruikt als verzamelnaam

Nadere informatie

HTML 5 App. Herman van Dompseler in opdracht van SURFnet. 20 december 2012 Versie 0.91

HTML 5 App. Herman van Dompseler in opdracht van SURFnet. 20 december 2012 Versie 0.91 Herman van Dompseler in opdracht van SURFnet 20 december 2012 Versie 0.91 Contents Inleiding... 4 Wat is HTML 5... 4 Wat is er mogelijk met HTML 5?... 5 HTML 5 handige links... 8 Part 1: HTML 5 Apps...

Nadere informatie

Talk Nerdy To Me 16-05-2012 NHL. Responsive Webdesign. Maarten van de Voorde mr10.nl Jan-Wessel Hovingh waxle.com

Talk Nerdy To Me 16-05-2012 NHL. Responsive Webdesign. Maarten van de Voorde mr10.nl Jan-Wessel Hovingh waxle.com Talk Nerdy To Me 16-05-2012 NHL Responsive Webdesign Maarten van de Voorde mr10.nl Jan-Wessel Hovingh waxle.com 1.1 Waarom is webdesign voor mobiel gebruik onvermijdelijk? in 2010 was er 600% groei in

Nadere informatie

Onderzoeksvaardigheden 2

Onderzoeksvaardigheden 2 Performance van Phonegap Naam: Datum: april 2012 Studentnummer: 0235938 Opleiding: CMD Docenten: Pauline Krebbers Modulecode: MEDMO101DT Modulenaam: Onderzoeksvaardigheden 2 / Media & Onderzoek Inhoudsopgave

Nadere informatie

Grafisch ontwerp. Referenties. https://developers.google.com/webmasters/mobile-sites/ http://www.bluetrainmobile.com/mobile-showcase

Grafisch ontwerp. Referenties. https://developers.google.com/webmasters/mobile-sites/ http://www.bluetrainmobile.com/mobile-showcase Mobiel Datanose Op dit moment is mobiel datanose niet goed gedaan; je krijgt gewoon de site te zien zoals je het te zien krijgt op pc's of laptops. Maar vaak heb je het probleem dat je op je mobiel moet

Nadere informatie

HTML5 VIDEO. Een stand van zaken Jeroen Wijering, LongTail Video

HTML5 VIDEO. Een stand van zaken Jeroen Wijering, LongTail Video HTML5 VIDEO Een stand van zaken Jeroen Wijering, LongTail Video WHOIS JW? Auteur van de JW Player (2005) Open-source Flash video speler voor embedden in websites. Gebruikt door YouTube in 1e jaar Helaas,

Nadere informatie

Werkomgeving. Android Studio. Android - werkomgeving 1/6

Werkomgeving. Android Studio. Android - werkomgeving 1/6 Android - werkomgeving 1/6 Werkomgeving Android Studio Installatie Ga naar de volgende URL: http://developer.android.com/sdk/index.html Klik op de knop "Download Android Studio for Windows" om het programma

Nadere informatie

MyMediasite Handleiding 2013 - V1.0

MyMediasite Handleiding 2013 - V1.0 MyMediasite Handleiding 2013 - V1.0 1 INHOUDSOPGAVE 1. INSTALLATIE 3 2.1 OPNEMEN: OPSTARTEN 4 2.2 OPNEMEN: NIEUWE PRESENTATIE 5 2.3 OPNEMEN: OPNAME PROCES 7 2.4. OPNEMEN: EIGEN MEDIA UPLOADEN 11 3. PRESENTATIE

Nadere informatie

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM

Eigen Widgets in CRM. Introductie. Limitering. Widgets beschikbaar stellen. Tips & Tricks Eigen Widgets in CRM Tips & Tricks Eigen Widgets in CRM Eigen Widgets in CRM Introductie De WebUI van CRM 7.0 maakt het mogelijk om je eigen widgets te maken en deze in je eigen view te gebruiken. Dat kan door gebruik te maken

Nadere informatie

01/05. Websites Nederland over. Mobile marketing. Whitepaper #03/2013. Mabelie Samuels internet marketeer

01/05. Websites Nederland over. Mobile marketing. Whitepaper #03/2013. Mabelie Samuels internet marketeer 01/05 Websites Nederland over Mobile marketing Mabelie Samuels internet marketeer 02/05 Mobile marketing Kunt u zich uw eerste mobiele telefoon nog herinneren? Die van mij was een Motorola, versie onbekend,

Nadere informatie

ONTWERPEN VAN INTERACTIEVE PRODUCTEN

ONTWERPEN VAN INTERACTIEVE PRODUCTEN ONTWERPEN VAN INTERACTIEVE PRODUCTEN WORKSHOP INTERACTIEF PROTOTYPE BOUWEN F. van Slooten WORKSHOP INTERACTIEF PROTOTYPE BOUWEN Ontwerp Keuze tool/techniek Maken layout 2 dagen: dinsdag 23 september Ochtend:

Nadere informatie

Acht stappen voor JSF

Acht stappen voor JSF Acht stappen voor JSF Inleiding In deze tutorial zullen we JSF (Java server faces) installeren. Wat we niet beschrijven is hoe te werken met JSF, over dit onderwerp zijn er genoeg boeken en internetsites

Nadere informatie

Bottleball Onderzoeksverslag MovingMonsters. Uitgevoerd door Arno Classens a.classens@student.fontys.nl

Bottleball Onderzoeksverslag MovingMonsters. Uitgevoerd door Arno Classens a.classens@student.fontys.nl Bottleball Onderzoeksverslag MovingMonsters Uitgevoerd door Arno Classens a.classens@student.fontys.nl 1 1. Inhoudsopgave Wat? Bladzijde 1. Introductie 3 2. Methodologie 4 3. Resultaten 3.1 Oriëntatie

Nadere informatie

IMG IS EVERYTHING FRONTEND DEVELOPMENT LES 6

IMG IS EVERYTHING FRONTEND DEVELOPMENT LES 6 IMG IS EVERYTHING FRONTEND DEVELOPMENT LES 6 VORIGE WEEK De principes van het web Multiscreen Responsive webdesign Mediaqueries Mobile first Even heel kort samenvatten waar we het ook al weer over hebben

Nadere informatie

Web Games en het mobiele web. Hoorcollege Webdesign 9 6 juni 2014 Christof van Nimwegen

Web Games en het mobiele web. Hoorcollege Webdesign 9 6 juni 2014 Christof van Nimwegen Web Games en het mobiele web Hoorcollege Webdesign 9 6 juni 2014 Christof van Nimwegen Webgames: scope dit college onderdeel Games staan nu centraal in deze faculteit. In een cursus over webdesign MOET

Nadere informatie

F U N C T I O N E E L O N T W E R P V O O R F U L L H O U S E M O B I LE ( V I S I O N V E R S I E )

F U N C T I O N E E L O N T W E R P V O O R F U L L H O U S E M O B I LE ( V I S I O N V E R S I E ) F U N C T I O N E E L O N T W E R P V O O R F U L L H O U S E M O B I LE ( V I S I O N V E R S I E ) Datum: 29-09-2010 Auteur: Dairo Bosschart Versie: 1.0 Document: Functioneel_ontwerp (vision versie).docx

Nadere informatie

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.2. Documentatie Onsweb Club plugin voor NHV verenigingen. Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor NHV verenigingen Versie 0.2 Laatste wijziging: 10 mei 2013 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Selenium IDE Webdriver. Introductie

Selenium IDE Webdriver. Introductie Selenium IDE Webdriver Het Wielsem 10, 5231 BW s- Hertogenbosch, telefoon 073-6409311 e- mail info@testwork.nl internet http://www.testwork.nl 1 Inhoudsopgave 1 Inhoudsopgave... 2 2 Selenium IDE... 3 3

Nadere informatie

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme >

Basis-theme. Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Basis-theme Manage Wiki > Look and Feel > Themes > Change or make a new theme > Make a New Theme > Naam invullen en de code van basis-theme kopiëren en erin plakken

Nadere informatie

Frontend performance meting

Frontend performance meting Frontend performance meting als aanvulling op de traditionele manier van performancetesten René Meijboom rene@performancearchitecten.nl Introductie Uitdaging bij huidige klant Succesvolle performancetest

Nadere informatie

INHOUD 1. Instructie installatie 2X client iphone & ipad... 4. 2. Downloaden app 2x client... 4. 3. Connections... 6

INHOUD 1. Instructie installatie 2X client iphone & ipad... 4. 2. Downloaden app 2x client... 4. 3. Connections... 6 INHOUD 1. Instructie installatie 2X client iphone & ipad... 4 2. Downloaden app 2x client... 4 3. Connections... 6 4. Werkplek Standby connection... 7 a. Een nieuwe connection toevoegen... 7 Alias... 8

Nadere informatie

Android Development CCSS2011

Android Development CCSS2011 Android Development Voor dummies, door dummies... Challenges in Computer Science Seminar LIACS, Universiteit Leiden 15 Februari 2011 Inhoud 1 Introductie 2 Development Environment 3 Programmeren voor Android

Nadere informatie

Release notes Argo 7. Interactieve LMS interface. Nieuwe interface voor lesmodules

Release notes Argo 7. Interactieve LMS interface. Nieuwe interface voor lesmodules Release notes Argo 7 Argo 7 heeft een interactief web design. Het is optimaal afgestemd op de grote diversiteit aan computerbeeldschermen, van grootbeeld desktops en notebooks tot tablets en smart phones.

Nadere informatie

Bart ter Steege bart.ter.steege@jungleminds.nl 06 8128 7569. The Mobile Mindmap

Bart ter Steege bart.ter.steege@jungleminds.nl 06 8128 7569. The Mobile Mindmap Titel Nationale project, Vakdag 10 maart Dialogue 2010 &/ Klantnaam Digital Marketing 2010 Titel The Mobile projectmindmap Bart ter Steege bart.ter.steege@jungleminds.nl 06 8128 7569 Best of Mobile Best

Nadere informatie

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com

Voor vragen: http://www.richard3332.nl/ of mail naar Richard3332@gmail.com Welkom bij mijn website tutorial (Deel 3) Ik ga uit van Microsoft XP voor de duidelijkheid. Ik heb dus geen idee of de programma s die ik gebruik ook op Vista werken. Notepad++ werkt zowieso op xp en Vista.

Nadere informatie

Scripting 2 TUTORIAL EEN APP ONTWIKKELEN VOOR ANDROID MET PROCESSING. ellipse(screenwidth/2, screenheight/2, 140,140); DOOR THIERRY BRANDERHORST

Scripting 2 TUTORIAL EEN APP ONTWIKKELEN VOOR ANDROID MET PROCESSING. ellipse(screenwidth/2, screenheight/2, 140,140); DOOR THIERRY BRANDERHORST Scripting 2 ellipse(screenwidth/2, screenheight/2, 140,140); TUTORIAL EEN APP ONTWIKKELEN VOOR ANDROID MET PROCESSING. DOOR THIERRY BRANDERHORST ANDROID APPLICATIES Tegenwoordig zijn er duizenden applicaties

Nadere informatie

HTML Graphics. Hans Roeyen V 3.0

HTML Graphics. Hans Roeyen V 3.0 HTML Graphics Hans Roeyen V 3.0 19 maart 2015 Inhoud 1. HTML5 Canvas... 3 1.1. Het Canvas element... 3 2. SVG Element... 9 2.1. SVG vergeleken met Canvas... 9 2.2. Een cirkel tekenen met SVG... 10 2.2.1.

Nadere informatie

Ontwikkelen voor Android. Het waarom, het hoe en het wat - Sander Tuit

Ontwikkelen voor Android. Het waarom, het hoe en het wat - Sander Tuit Ontwikkelen voor Android Het waarom, het hoe en het wat - Sander Tuit Over mij Mede-oprichter Androidworld Ontwikkelaar Androidworld-app @SanderTuit op Twitter, +SanderTuit op Google+ Over Androidworld

Nadere informatie

MOBILE De mogelijkheden van mobile apps

MOBILE De mogelijkheden van mobile apps MOBILE De mogelijkheden van mobile apps Gemak dient de mens INHOUD Apps zorgen voor gebruikersgemak 2 The future is mobile 3 De groei van apps 4 Verwachting = nieuwe standaard 4 Van website naar mobiel

Nadere informatie

TETRA HTML5. 4de gebruikersgroepvergadering 4 oktober 2013, Hasselt

TETRA HTML5. 4de gebruikersgroepvergadering 4 oktober 2013, Hasselt TETRA HTML5 4de gebruikersgroepvergadering 4 oktober 2013, Hasselt Agenda WP1: Administratie WP3 & WP4: Proof-of-Concept en performantietesten WP5 & WP6: Valorisatie en pilootprojecten Varia & broodjeslunch

Nadere informatie

Inhoud Wat is mobiel werken?... 2 Installeren VPN Client... 3 Laptop... 3 Windows 8... 4 Windows 7... 10 Mac OS X... 16 Linux... 16 Tablet...

Inhoud Wat is mobiel werken?... 2 Installeren VPN Client... 3 Laptop... 3 Windows 8... 4 Windows 7... 10 Mac OS X... 16 Linux... 16 Tablet... 333 Inhoud Wat is mobiel werken?... 2 Installeren VPN Client... 3 Laptop... 3 Windows 8... 4 Windows 7... 10 Mac OS X... 16 Linux... 16 Tablet... 18 ios (ipad)... 18 Android... 21 Windows... 21 Smartphone...

Nadere informatie

Altijd en overal online?

Altijd en overal online? Altijd en overal online? Smartphone Tablet E-Reader Netbook Notebook Chromebook Smartphones Bekende merken en types: Apple iphone 4 Samsung Galaxy S II HTC Desire HD Blackberry bold Steeds minder: Nokia

Nadere informatie

Technologieverkenning

Technologieverkenning Technologieverkenning Videocontent in the cloud door de koppeling van MediaMosa installaties Versie 1.0 14 oktober 2010 Auteur: Herman van Dompseler SURFnet/Kennisnet Innovatieprogramma Het SURFnet/ Kennisnet

Nadere informatie

Pro templates. Copyright Starteenwinkel.nl

Pro templates. Copyright Starteenwinkel.nl Pro templates Copyright Starteenwinkel.nl Lees in deze handleiding over: 1. PRO templates; voor wie geschikt? 2. Aan de slag met een PRO template 3. Template Designer 4. Template Editor 5. Sliders aanpassen

Nadere informatie

HTML. Media. Hans Roeyen V 3.0

HTML. Media. Hans Roeyen V 3.0 Media Hans Roeyen V 3.0 12 maart 2015 Inhoud 1. (Multi)Media op websites... 3 2. Flash en Websites... 4 3. Video op je website... 4 3.1. YouTube insluiten op de pagina... 4 3.2. Video zonder YouTube...

Nadere informatie

Responsive web applicaties op Oracle

Responsive web applicaties op Oracle APEX Responsive web applicaties op Oracle Spreker(s) : Datum : E-mail : Arian Macleane & Jacob Beeuwkes 06-06-2013 info@transfer-solutions.com WWW.TRANSFER-SOLUTIONS.COM Outline Trends APEX intro APEX

Nadere informatie

Functioneel Ontwerp / Wireframes:

Functioneel Ontwerp / Wireframes: Functioneel Ontwerp / Wireframes: Het functioneel ontwerp van de ilands applicatie voor op de iphone is gebaseerd op het iphone Human Interface Guidelines handboek geschreven door Apple Inc 2007. Rounded-Rectangle

Nadere informatie

2. Wat kost HBO GO? HBO GO is onderdeel van het HBO Pakket. Daarom betaalt u er niets extra voor.

2. Wat kost HBO GO? HBO GO is onderdeel van het HBO Pakket. Daarom betaalt u er niets extra voor. Q&A HBO GO Versie: 0 Versie: 1 Datum: 27 april 2012 ------------------------------------------------------------------------------------------------------------ Algemeen Instellingen Problemen oplossen

Nadere informatie

Modular Development. Een App in Facebook. Dennis van der Oost CMD2D 0822118. Module: CMDDEV01-7 Docent: Eric Mahieu. Eindverslag v.1.

Modular Development. Een App in Facebook. Dennis van der Oost CMD2D 0822118. Module: CMDDEV01-7 Docent: Eric Mahieu. Eindverslag v.1. Modular Development Een App in Facebook Dennis van der Oost CMD2D 0822118 Module: CMDDEV01-7 Docent: Eric Mahieu Eindverslag v.1.0 Inhoudsopgave - Inleiding - Concept omschrijving - Technisch onderzoek

Nadere informatie

Documentatie gereedschapbeheer android applicatie. GB Inspect. Handleiding Gereedschapbeheer android applicatie GB Inspect - 1

Documentatie gereedschapbeheer android applicatie. GB Inspect. Handleiding Gereedschapbeheer android applicatie GB Inspect - 1 GB Inspect Handleiding Gereedschapbeheer android applicatie GB Inspect Datum: 10 september 2014 Behorende bij app versie 1.1.5-1 1. Inleiding De Gereedschapbeheer.nl app is bedoeld voor het inspecteren

Nadere informatie

HANDLEIDING EXTERNE TOEGANG CURAMARE

HANDLEIDING EXTERNE TOEGANG CURAMARE HANDLEIDING EXTERNE TOEGANG CURAMARE Via onze SonicWALL Secure Remote Access Appliance is het mogelijk om vanaf thuis in te loggen op de RDS omgeving van CuraMare. Deze handleiding beschrijft de inlogmethode

Nadere informatie

Versie 0.6. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.6. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor KNKV verenigingen Versie 0.6 Laatste wijziging: 13 augustus 2013 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Websitecursus deel 1 HTML

Websitecursus deel 1 HTML Websitecursus deel 1 HTML WebCie A Eskwadraat www@a-eskwadraat.nl 8 april 2015 Inleiding Website cursus in drie delen: HTML CSS Javascript We gaan uit van geen voorkennis. Als je vragen hebt, stel ze!

Nadere informatie

De abonnementsduur van het contract is afhankelijk van uw bundelkeuze (camera en abonnement).

De abonnementsduur van het contract is afhankelijk van uw bundelkeuze (camera en abonnement). Panasonic Cameramanager Go! Cloud videobeveiliging per direct beschikbaar! Panasonic Cameramanager biedt ondernemers de mogelijkheid op afstand een oogje in het zeil te houden. Met de alles in 1 oplossing

Nadere informatie

Cisco Cloud. Collaboration. Ronald Zondervan David Betlem September, 2011. Presentation_ID 2010 Cisco Systems, Inc. All rights reserved.

Cisco Cloud. Collaboration. Ronald Zondervan David Betlem September, 2011. Presentation_ID 2010 Cisco Systems, Inc. All rights reserved. Cisco Cloud Collaboration Ronald Zondervan David Betlem September, 2011 1 E Open architectuur Uitgangspunten Gebaseerd op Open Standaarden telefonie, video, desktop integratie, beschikbaarheidsstatus (presence)

Nadere informatie

Gebruiksaanwijzing Samsung PV 210 Tablet PC. Inhoudsopgave

Gebruiksaanwijzing Samsung PV 210 Tablet PC. Inhoudsopgave Gebruiksaanwijzing Samsung PV 210 Tablet PC Inhoudsopgave 1 Introductie van uw TABLET...2 2 Accu...2 4 Interface en applicaties...4 5 HDMI & Host...5 6 Taal & keyboard...6 7 Beheren van Applicaties...7

Nadere informatie

Project plan. Erwin Hannaart Sander Tegelaar 61849 62407

Project plan. Erwin Hannaart Sander Tegelaar 61849 62407 Project plan Erwin Hannaart Sander Tegelaar 61849 62407 I4C2 I4C1 1 Inhoudsopgave Doel en doelgroep van het project... 3 Beschrijving van het project... 4 Benodigde materialen... 5 Te verwachten resultaten,

Nadere informatie

Drupal theming. 28 april 2014 - CVO Crescendo

Drupal theming. 28 april 2014 - CVO Crescendo Drupal theming 28 april 2014 - CVO Crescendo About-me.tpl.php Esther De Jonghe Drupal front end developer verleden: @cronos, @adforce, @puresign nu: freelance (wwwonderland) @estherdejonghe Wat is theming?

Nadere informatie

Bouw snel en eenvoudig een eigen mobile Virtual Reality app

Bouw snel en eenvoudig een eigen mobile Virtual Reality app Bouw snel en eenvoudig een eigen mobile Virtual Reality app Deze handleiding is opgesplitst in twee delen. Deel 1: Hoe gebruik je het Smart2VR CMS? Deel 2: Hoe gebruik je de Virtual Reality app? Deel 1:

Nadere informatie

Technisch Ontwerp W e b s i t e W O S I

Technisch Ontwerp W e b s i t e W O S I Technisch Ontwerp W e b s i t e W O S I WOSI Ruud Jungbacker en Michael de Vries - Technisch ontwerp Website Document historie Versie(s) Versie Datum Status Omschrijving / wijzigingen 0.1 20 nov 2008 Concept

Nadere informatie

TETRA HTML5. 3de gebruikersgroepvergadering 3 juni 2013, Gent

TETRA HTML5. 3de gebruikersgroepvergadering 3 juni 2013, Gent TETRA HTML5 3de gebruikersgroepvergadering 3 juni 2013, Gent Agenda WP1: Administratie WP6: Valorisatie WP3 & WP4: Proof-of-Concept en performantietesten Voorstelling online-offline POC HTML5 vandaag,

Nadere informatie

10. Single Page Applications

10. Single Page Applications WHITEPAPER IN 5 MINUTEN M E I 2 0 1 4 10. Single Page Applications Introductie De wereld verandert snel en gebruikers openen je site of applicatie steeds minder met een traditionele browser. Een site of

Nadere informatie

Inhoud Introductie Development Environment Programmeren voor Android Demo. Android Development. Sven van Haastregt

Inhoud Introductie Development Environment Programmeren voor Android Demo. Android Development. Sven van Haastregt Android Development Sven van Haastregt Challenges in Computer Science Seminar LIACS, Universiteit Leiden Februari 2012 Sven van Haastregt Android Development CCSS2012 1 / 19 Inhoud 1 Introductie 2 Development

Nadere informatie

MyMediasite Handleiding 2014 - V2.1

MyMediasite Handleiding 2014 - V2.1 MyMediasite Handleiding 2014 - V2.1 1 INHOUDSOPGAVE 1.1 INSTALLATIE 3 1.2 GEBRUIKER ACTIVEREN 4 1.3 GEBRUIKERSPROFIEL ONLINE INSTELLEN 4 1.4 INSTALLATIE OP TU LAPTOP 5 2.1 NIEUWE PRESENTATIE OPNEMEN 6

Nadere informatie

Kenmerken Nomadesk Software

Kenmerken Nomadesk Software Kenmerken Nomadesk Software DATABEVEILIGING Versleutelde lokale schijf Nomadesk creëert een veilige virtuele omgeving, een Vault, op uw lokale harde schijf. Alle mappen en bestanden opgeslagen op de Vault

Nadere informatie

STAGE VERSLAG LVB NETWORKS

STAGE VERSLAG LVB NETWORKS STAGE VERSLAG LVB NETWORKS Stagiair : Praktijkopleider : Stagebegeleider : Periode : Inlever Datum : Michael Scherpenisse Jeffrey van Draanen Bert de Boer 1 2 April, 2015 Opmerking Beoordeling stageverslag:

Nadere informatie

Gebruiksaanwijzing OV-NewBase www.overmax.nl

Gebruiksaanwijzing OV-NewBase www.overmax.nl Gebruiksaanwijzing OV-NewBase www.overmax.nl Snel Start Batterij management en opladen Voordat u het toestel in gebruik neemt, dient u de accu eerst geheel op te laden. Stop de lader in het toestel en

Nadere informatie

DRAADLOZE HDMI STICK

DRAADLOZE HDMI STICK DRAADLOZE HDMI STICK G E B R U I K S A A N W I J Z I N G Ondersteuning na aankoop. Gefeliciteerd met de aankoop van deze Draadloze HDMI Stick. Met de aankoop van dit apparaat krijgt u niet alleen een 3-jarige

Nadere informatie

Joomla Template & Bootstrap 3.0. JUGA 19-11-2013 Henk Rijneveld (henk@henkrijneveld.nl)

Joomla Template & Bootstrap 3.0. JUGA 19-11-2013 Henk Rijneveld (henk@henkrijneveld.nl) Joomla Template & Bootstrap 3.0 JUGA 19-11-2013 Henk Rijneveld (henk@henkrijneveld.nl) De case Joomla 3.laatst Helemaal responsive Fixed kop- en voetgebied Specifieke chrome Zoveel mogelijk zelf Joomla

Nadere informatie

LegManager Mobile Handleiding

LegManager Mobile Handleiding LegManager Mobile Handleiding Handleiding LegManager Mobile 1 1. Inhoud 1. INHOUD... 2 2. PROGRAMMAVEREISTEN... 3 a. Vragen, opmerkingen en suggesties... 3 b. Welke tablet/ipad of smartphone/iphone kan

Nadere informatie

Design for Mobile. Projectplan CMD jaar 2. Remco Dekker Daan van Klinken Sybren Wartna CMD3A UXD

Design for Mobile. Projectplan CMD jaar 2. Remco Dekker Daan van Klinken Sybren Wartna CMD3A UXD I C I Projectplan CMD jaar 2 Remco Dekker Daan van Klinken Sybren Wartna CMD3A UXD INHOUDSOPGAVE IPHONE PLATFORM 3 DE IPHONE 4 APPS 5 AAN DE SLAG MET APPS 6 BRIEFING 7 KONGINNEDAG 8 LOWLANDS 9 BUSINESS

Nadere informatie

iprova Suite Systeemeisen iprova 5 Hosting

iprova Suite Systeemeisen iprova 5 Hosting iprova Suite Systeemeisen iprova 5 Hosting Let op Dit document bevat de systeemeisen voor versie 5.0 van de iprova Suite. Door nieuwe ontwikkelingen kunnen de systeemeisen voor iprova wijzigen. Controleer

Nadere informatie

DrICTVoip.dll v 2.1 Informatie en handleiding

DrICTVoip.dll v 2.1 Informatie en handleiding DrICTVoip.dll v 2.1 Informatie en handleiding Nieuw in deze versie : Koppeling voor web gebaseerde toepassingen (DrICTVoIPwebClient.exe) (zie hoofdstuk 8) 1. Inleiding Met de DrICTVoIP.DLL maakt u uw software

Nadere informatie

TETRA HTML5. Gebruikersgroepvergadering 25 februari 2014, Hasselt

TETRA HTML5. Gebruikersgroepvergadering 25 februari 2014, Hasselt TETRA HTML5 Gebruikersgroepvergadering 25 februari 2014, Hasselt Agenda Pilootcase Yappa - Showroomr 3D CMS Phonegap / JQM ervaringen Verspreiding technologie Varia Planning Pilootcase Yappa - probleemstelling

Nadere informatie

Web Handleiding. semper vigilant Fall 2014 LOCALBOX 1.1.3

Web Handleiding. semper vigilant Fall 2014 LOCALBOX 1.1.3 Web Handleiding semper vigilant Fall 2014 Functionaliteiten web-based 2 Inloggen 2 Home 3 Uploaden: 4 Opties: 6 Map Delen: 6 Beheer Links 8 Functionaliteiten App-based 12 Hoger niveau 16 Acties op bestanden

Nadere informatie

Introductie testtooling Wink

Introductie testtooling Wink Introductie testtooling Wink SYSQA B.V. Almere Datum : 10-04-2013 Status : 1.0 Opgesteld door : Organisatie SYSQA B.V. Pagina 2 van 16 Inhoudsopgave 1 Inleiding... 3 1.1 Opbouw... 3 2 Wink... 4 2.1 Wat

Nadere informatie

Data Acquisitie in een modern jasje. Wordt het de tablet of toch iets anders?

Data Acquisitie in een modern jasje. Wordt het de tablet of toch iets anders? Data Acquisitie in een modern jasje. Wordt het de tablet of toch iets anders? Marco Bischoff Yokogawa Europe BV 7 november 2013 Yokogawa IA Control Products --- Business domain Technologischeontwikkelingen

Nadere informatie

Zelftest Java concepten

Zelftest Java concepten Zelftest Java concepten Document: n0838test.fm 22/03/2012 ABIS Training & Consulting P.O. Box 220 B-3000 Leuven Belgium TRAINING & CONSULTING INLEIDING BIJ DE ZELFTEST JAVA CONCEPTEN Om de voorkennis nodig

Nadere informatie

Markup: CSS en HTML5. Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen

Markup: CSS en HTML5. Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen Markup: CSS en HTML5 Hoorcollege Webdesign 5 16 mei 2014 Christof van Nimwegen 1 CSS: Waarom ook alweer. HTML was bedoeld voor documentstructuur (text met verschillende levels in headings en body text)

Nadere informatie

4 inch screen. The ARCHOS 40 Titanium is voorzien van een groot 4 inch scherm, ideaal voor mails, web of uw foto s of video s.

4 inch screen. The ARCHOS 40 Titanium is voorzien van een groot 4 inch scherm, ideaal voor mails, web of uw foto s of video s. Klik hier voor de specificaties 4 inch screen The ARCHOS 40 Titanium is voorzien van een groot 4 inch scherm, ideaal voor mails, web of uw foto s of video s. Uitstekende kijkhoeken De hoge kwaliteit van

Nadere informatie

Intramed OnLine instellen en gebruiken. Voor Android tablet of telefoon

Intramed OnLine instellen en gebruiken. Voor Android tablet of telefoon Intramed OnLine instellen en gebruiken Voor Android tablet of telefoon Inhoudsopgave Hoofdstuk 1 Algemeen...1 1.1 Toegang tot inlogportalen...1 Hoofdstuk 2 Basic account...3 2.1 Microsoft Remote Desktop

Nadere informatie

Taco Schallenberg Acorel

Taco Schallenberg Acorel Taco Schallenberg Acorel Inhoudsopgave Introductie Kies een Platform Get to Know the Jargon Strategie Bedrijfsproces Concurrenten User Experience Marketing Over Acorel Introductie THE JARGON THE JARGON

Nadere informatie

Zo draai je Android-apps op de pc

Zo draai je Android-apps op de pc Zo draai je Android-apps op de pc Deels overgenomen uit Computerworld Via de BlueStacks Android App Player kun je Android-apps op je pc laten draaien. Wij leggen je uit hoe je de software installeert,

Nadere informatie

APEX Templates. OGH APEX dag 30 maart. Art Melssen. 31 maart 2010

APEX Templates. OGH APEX dag 30 maart. Art Melssen. 31 maart 2010 APEX Templates OGH APEX dag 30 maart Art Melssen Introductie Over de spreker 4 jaar APEX ervaring / 7 jaar Oracle 10 jaar web technologie ervaring APEX trajecten o.a. bij Centraal Boekhuis en eboekhuis

Nadere informatie

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman

Versie 0.4. Documentatie Onsweb Club plugin voor KNKV verenigingen. Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Documentatie Onsweb Club plugin voor KNKV verenigingen Versie 0.4 Laatste wijziging: 19 juli 2012 Auteurs: Marien Dongstra, Sebastian Huisman Alle rechten in dit document zijn voorbehouden. www.onsweb.nl,

Nadere informatie

Handleiding: Whitelabel Customersite

Handleiding: Whitelabel Customersite ARGEWEB B.V. Handleiding: Whitelabel Customersite Controlportal.nl Argeweb Support 8-1-2009 Handleiding voor het gebruik maken van de Whitelabel Customersite op controlportal.nl, door Resellers van Argeweb.

Nadere informatie

Frontend ontwikkeling

Frontend ontwikkeling Frontend ontwikkeling Mark Jansen Edwin Vlieg PHPFreakz ledendag 10 november 2007 Frontend ontwikkeling De interface is je product richting de eindgebruiker Goede PHP code met een slechte interface geeft

Nadere informatie

Mobiel werken. 15.12.10 Mobiel Werken Sven Moreels 1

Mobiel werken. 15.12.10 Mobiel Werken Sven Moreels 1 Mobiel werken 15.12.10 Mobiel Werken Sven Moreels 1 Inhoud: Definitie van Mobiel werken Wat heb je nodig om mobiel te werken? Historiek mobiele connecties Historiek van de toestellen Operating systems

Nadere informatie

Card sorting Sitemap Use case. Wireframes Schermontwerpen Stijlgids. Niet in les gedaan! Via je einddocument. Verkennen. Genereren.

Card sorting Sitemap Use case. Wireframes Schermontwerpen Stijlgids. Niet in les gedaan! Via je einddocument. Verkennen. Genereren. Hoorcollege 4 Verkennen Genereren Evalueren Communiceren Card sorting Sitemap Use case Wireframes Schermontwerpen Stijlgids Niet in les gedaan! Via je einddocument Schermontwerpen Pauze Stijlgids Feedback

Nadere informatie

Th!nk mobile. Op Zig logisch. Menno Ouweneel Marketingmanager. Twitter: mouweneel Skype: menno_ouweneel

Th!nk mobile. Op Zig logisch. Menno Ouweneel Marketingmanager. Twitter: mouweneel Skype: menno_ouweneel Th!nk mobile Op Zig logisch Menno Ouweneel Marketingmanager Twitter: mouweneel Skype: menno_ouweneel Mobiele telefoons zullen de desktop computer passeren als het meestgebruikte apparaat voor internettoegang,

Nadere informatie

Documentatie WD32. Christine van Woensel M32

Documentatie WD32. Christine van Woensel M32 Documentatie WD32 Christine van Woensel M32 Ontwerpkeuzes per device resolutie Desktop (1025 1600px & 769 1024px): Tablet (481 768px): Smartphone (321 480px & tot 320px): Algemeen: Alle ontwerpen voor

Nadere informatie

RESPONSIVE DRUPAL THEMING MET SASS, COMPASS, SUSY EN AURORA DRUPAL TECH TALK 25 APRIL 2013 MARC VAN GEND TRIQUANTA

RESPONSIVE DRUPAL THEMING MET SASS, COMPASS, SUSY EN AURORA DRUPAL TECH TALK 25 APRIL 2013 MARC VAN GEND TRIQUANTA RESPONSIVE DRUPAL THEMING MET SASS, COMPASS, SUSY EN AURORA DRUPAL TECH TALK 25 APRIL 2013 MARC VAN GEND TRIQUANTA AGENDA Het Doel #responsivemobilefirsthtml5buzzwordcompliant CSS preprocessing SASS Werken

Nadere informatie

Web app Spaans voor kinderen

Web app Spaans voor kinderen Web app Spaans voor kinderen Naam: Yanette Wong Lozano Inhoudsopgave Inleiding... 3 Beschrijving applicatie... 4 Doelgroep... 4 Omgeving... 4 Technologische middelen... 4 User stories... 4 Site map...

Nadere informatie

Handleiding Certificaat installeren

Handleiding Certificaat installeren Handleiding Certificaat installeren Inhoudsopgave 1. Installatie op PC s met Windows 2 2. Voor niet-windows PC s en andere apparatuur 4 1.1. Microsoft Internet Explorer / Google Chrome 5 1.2. Mozilla Firefox

Nadere informatie

design ook items uitsnijden

design ook items uitsnijden (fig1) Hulplijnen zetten Om het ontwerp netjes uit te snijden is het handig om eerst hulplijnen te zetten. (fig1) Nu is het zaak om eerst voor je zelf te bepalen wat is layout en wat is design. Al het

Nadere informatie

Mobiele internet strategie

Mobiele internet strategie Mobiele internet strategie Waar staan we? Reduitlaan 33 Unit 2.09 4814 DC Breda +31 (0)76 888 00 88 info@e-sites.nl www.e-sites.nl BTW 1387489189 KvK 1891618948 Bank 1894894561 Inhoud Inleiding... 3 Wees

Nadere informatie

PRESTATIESITE WEBPAKKET

PRESTATIESITE WEBPAKKET PRESTATIESITE WEBPAKKET PRESTATIESITE Wij hebben al onze ervaring gebruikt om een gestandaardiseerd webpakket te ontwikkelen met een lay-out welke de focus heeft op leads en new business. Op deze wijze

Nadere informatie

3 Website opbouwen: vervolg

3 Website opbouwen: vervolg 3 Website opbouwen: vervolg 3.1 Elementen 3.1.1 Bestand Op je website kan je een bestand plaatsen (doc, pdf, ) dat door je bezoekers gedownload kan worden 3.1.2 Links. Zowel bij het typen van tekst (2.1.1)

Nadere informatie

5+1 OPLOSSINGEN VOOR EEN APP

5+1 OPLOSSINGEN VOOR EEN APP 5+1 OPLOSSINGEN VOOR EEN APP Auteur: Fokke Zandbergen App Imagineer 6 November 2013 5+1 OPLOSSINGEN VOOR EEN APP Introductie: 5+1 oplossingen voor een app 3 De kans 3 De uitdaging 3 Software 3 Hardware

Nadere informatie

Externe toegang met ESET Secure Authentication. Daxis helpdesk@daxis.nl Versie 2.0

Externe toegang met ESET Secure Authentication. Daxis helpdesk@daxis.nl Versie 2.0 Externe toegang met ESET Secure Authentication Daxis helpdesk@daxis.nl Versie 2.0 Inhoudsopgave: Inhoudsopgave:... 1 Inleiding:... 2 Stap 1: Download eenmalig Eset Secure Authentication op uw smartphone...

Nadere informatie

icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous

icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous icafe Project Joeri Verdeyen Stefaan De Spiegeleer Ben Naim Tanfous 2006-2007 Inhoudsopgave 1 2 1.1 Programmeertaal PHP5..................... 2 1.2 MySQL database......................... 3 1.3 Adobe Flash...........................

Nadere informatie

aanmaken van een webaccount om e-books te kunnen lenen P. 3-7 het lenen van e-books de basis P. 13-14

aanmaken van een webaccount om e-books te kunnen lenen P. 3-7 het lenen van e-books de basis P. 13-14 aanmaken van een webaccount om e-books te kunnen lenen P. 3-7 wachtwoord vergeten P. 8-9 uw account beheren P. 10-12 het lenen van e-books de basis P. 13-14 het lenen van e-books online lezen (is streamed

Nadere informatie

Self-Service Portal Registeren, downloaden & activeren van een soft token

Self-Service Portal Registeren, downloaden & activeren van een soft token Self-Service Portal Registeren, downloaden & activeren van een soft token Document versie: 3.2 Uitgavedatum: september 2014 Inhoud Introductie... 3 Over 2 e factor authenticatie... 3 Over egrid authenticatie...

Nadere informatie

Responsive & Adaptive

Responsive & Adaptive Responsive & Adaptive webdesign door online regisseur Snakeware versie 1.0 woensdag, 17 oktober 2012 Uitgebracht door: Auteurs: Snakeware Martiniplein 15e 8601 EG Sneek Dhr. Gerben Kuipers gerben@snakeware.nl

Nadere informatie

TAB07-210 XENTA 7c TAB07-211 XENTA 7c TAB07-212 XENTA 7c FIRMWARE UPGRADE INSTRUCTIES. Pagina 1 van 8

TAB07-210 XENTA 7c TAB07-211 XENTA 7c TAB07-212 XENTA 7c FIRMWARE UPGRADE INSTRUCTIES. Pagina 1 van 8 TAB07-210 XENTA 7c TAB07-211 XENTA 7c TAB07-212 XENTA 7c FIRMWARE UPGRADE INSTRUCTIES Pagina 1 van 8 VOORDAT U BEGINT: BACKUP BELANGRIJKE GEGEVENS! Bij het upgraden van uw Yarvik tablet zullen alle gebruikersinstellingen,

Nadere informatie

Handleiding. Certificaat installeren

Handleiding. Certificaat installeren Handleiding Certificaat installeren Inhoudsopgave 1. Installatie op PC s met Windows 2 2. Voor niet-windows PC s en andere apparatuur 3 1.1. Microsoft Internet Explorer / Google Chrome 3 1.2. Mozilla Firefox

Nadere informatie

Naam stagiair: Nick Swaerdens. Klas: 3IV2. Praktijkopleider: Jordy Pouw. Stagebegeleider: Ron Spitse. Stage periode tweede verslag:

Naam stagiair: Nick Swaerdens. Klas: 3IV2. Praktijkopleider: Jordy Pouw. Stagebegeleider: Ron Spitse. Stage periode tweede verslag: Nick Swaerdens 3IV2 10 / 06 / 2015 Naam stagiair: Nick Swaerdens Klas: 3IV2 Praktijkopleider: Jordy Pouw Stagebegeleider: Ron Spitse Stage periode tweede verslag: 2 april 2015 10 juni 2015 Inlever datum:

Nadere informatie

WHITEPAPER. Wat is een. Responsive website? Voordelen van een. Responsive website? Hoe start je met een. Responsive website? RESPONSIVE WEBSITES

WHITEPAPER. Wat is een. Responsive website? Voordelen van een. Responsive website? Hoe start je met een. Responsive website? RESPONSIVE WEBSITES WHITEPAPER RESPONSIVE WEBSITES Wat is een Responsive website? Voordelen van een Responsive website? Hoe start je met een Responsive website? INTRODUCTIE Met het downloaden van deze whitepaper kunnen we

Nadere informatie

Indoor Navigation System

Indoor Navigation System Project Indoor Navigation System Onderwerp: Indoor Navigation System Document: Handleiding Ontwikkeltools Groep: EII6RTa Auteurs: 1. Jordi Betting 109277 2. Jerome Bos 113180 3. Theo Miltenburg 112883

Nadere informatie