Voor klas MV42A, MV42B, MV42C, MV42D en MV42E staat de webopdracht voor periode 4 in n@tschool. Als je bent in gelogd zoek dan naar de studieroute web.
Campagne – Doelgroep – Persona
Iconset & spritesheet
De nieuwe opdracht iconset en spritesheet voor de interactiefgroep van klas MV42C, MV42D en MV42E staat in n@tschool > studieroute MediaXtra
Mobile first | stap 3 mediaqueries
Opdracht 3 voor de 2e klassen grafisch en multimedia staat op docs.google.com/…
Mobile first! | Stap 2 mediaqueries
Mobile first!
Voor onze responsive website beginnen we eerst met de mobiele versie.
Om zo snel mogelijk de techniek onder de knie te krijgen kijken we nu nog niet zo zeer naar vorm maar meer naar leesbaarheid op mobiel.
Lees de complete opdracht voor deze les bij Koen Veldhuizen: https://docs.google.com/...
Aan het eind van les inleveren!
Introductie Media Queries
Bijna iedereen heeft wel eens een website op zijn mobiel of tablet bekeken. De ene website werkt heel goed op je mobiel en lijkt bijna op een App terwijl de andere geschaald is, de tekst niet is niet te lezen en je moet “Pinchen” / “Zoomen” om alle inhoud te zien.
Stelling
Als je website niet goed werkt op een mobile device dan is je website onbruikbaar.
Website uploaden met Cyberduck
Als je een website hebt gemaakt dan moet je deze ook op het web publiceren zodat hij voor iedereen zichtbaar wordt. Dit wordt ook wel uploaden genoemd. Het uploaden van de bestanden (zoals html en css bestanden en plaatjes) doe je met behulp van een ftp-programma.
In deze handleiding leer je hoe dat werkt op de webruimte van school. We gebruiken het gratis ftp-programma Cyberduck “Website uploaden met Cyberduck” verder lezen
The Hans Brinker Budget Hotel Experience – 4
Hoe haal ik mijn bezoekers over… – 3
Als mediavormgever is het belangrijk dat je een goede website kunt bouwen. Maar hoe haal je de bezoeker over om ook gebruik te maken van je website? Je hebt aan de vormgeving gedacht je hebt de teksten en afbeeldingen goed geselecteerd en de interface werkt ontzettend goed. Wat gebeurt en nu met de site?
Webfonts -2
Door webfonts te gebruiken heb je veel meer keuze aan lettertypes dan tot voor kort op het web mogelijk was. Er zijn een aantal verschillende manieren om webfonts toe passen. Bijvoorbeeld:
- Googlefonts
- Fontsquirrel (lees ook de lesbrief)
- Via de interface van dreamweaver CC
Je kunt bij deze opdracht zelf kiezen welke manier je gebruikt. Als je kiest voor Googlefonts of via de interface van dreamweaver CC dan vind je prima uitleg door de link te volgen.
Voor het gebruik van Fontsquirrel fonts kun je de uitleg in deze lesbrief webfonts volgen.
Taken
Maak zelf een document waarin je 2 webfonts toepast. Stel daarbij minimaal de volgende elementen in:
- <body>
- <h1>
- <h2>
- <p>
- #header
- .introtekst
Single Page Parallax | opdracht 2
Maak een website waarbij alles op een lange ‘page’ staat. Door middel van verschillende scrollsnelheden ga je naar de volgende menu-items / rubrieken van de site.
De complete opdracht kun je als pdf downloaden
Een werkend voorbeeld staat hier: SinglePage Parallax voorbeeld
Full Page Parallax
Een geavanceerd versie waar de hoogte en breedte zich aanpast aan de afmetingen van je browservenster: Full Page Parallax