Doelpubliek • Bedrijven • Verenigingen • Iedereen die reclame voor zijn bedrijf of product wenst te maken Fictieve tekst op de indexpagina.

Slides:



Advertisements
Verwante presentaties
Bouw zelf een digitaal visitekaartje
Advertisements

Over de cursus Eenvoudige websites bouwen in Rijswijk
WWW’s World Wide Webs. Webshops trowaa.nl bol.com Onderwijs tudelft.nl steenenbrug.nl Non-profit organisatie rodekruis.nl demaakbaremens.org Onze sites.
Pagina-instelling.
Een afdelingswebsite bouwen met Google Sites
Word 2003 Tips en trucs Door Johan Lammers.
Klik in de berichtenbalk op Bewerken inschakelen,
Grafisch werken in ICT: Photoshop
Handboek verzenden van Nieuwsbrief Caribbean.nl 12 september 2012 •Ga naar CMS •Kies Nieuwsbrief Caribbean.nl.
29/03/2013. jQuery is  een JavaScript-bibliotheek die je kan integreren in je HTML-pagina.  Om animaties te maken, die SEO-vriendelijk(er) zijn  Door.
Bouw je eigen website met gratis software Je eigen website bouwen  Waarom?  Eigen zaak (  Vereniging (
Portfolio Website Tim Klijn Klas: MBI m1 Datum: 21 november 2007
W.H. Kaper, AMSTEL-instituut1/16 Website ontwerp met voorbeelden.
Websites maken Waarom? Voor Wie? Hoe?
15/10/2013. De meest voorkomende soorten navigatie zijn:  Tekstlinks  Afbeeldingen  Roll-over images  Flashnavigatie  jQuery-navigatie.
Databases via internet
Wat is het AnySurfer label? Een Belgisch kwaliteitslabel voor toegankelijke websites Bestaat uit een Basislabel en een Pluslabel Basislabel garandeert.
WELKOM! Les 1 Vandaag 1.Voorstellen 2.Inhoud en doel cursus 3.Inleiding website 4.Benodigde software 5.Inleiding HTML 6.Huiswerk 7.Afwas ☺
Het oog wil oog wat. Kijk ook op
E XPRESSION WEB maandag 3 december &
Vademecum Energiebewust Ontwerpen van nieuwbouwwoningen Eric van Zee 16 februari 2007.
HTML Les 1: Introductie HTML
CSS & HTML Les 2 Navigatie. De tag voor het maken van verwijzingen naar pagina’s of delen van een webpagina. Contact Het element wordt gebruikt om de.
Hotwheels park Gemaakt door Kursat ,Ali ,Mouniem.
Online Marketing voor het MBO “SEO, dat kun je zelf!”
Crashcursus HTML en CSS 2013
Website Usability.
Webpagina ’ s maken ITV 10 maart Onderwerpen Ontwerp en inhoud Navigatie HTML: de basis Webpagina’s in Word.
Hogeschool van Amsterdam - Interactieve Media – Internet Development – Jochem Meuwese - -
WEBSITES ONTWIKKELINGEN Trends en standaarden op het gebied van webdesign HTML, DHTML, XHTML, FLASH, CSS Henk Zegwaard december 2003.
Nieuw in LIPS VLUG 2 26 juni 2006 Kristof Brams. Overzicht Vernieuwde editor Printervriendelijke pagina Statistieken Variabele fontgrootte Grootte van.
Wat heb ik geleerd?  HTML/CSS/PHP Wat heb ik geleerd?  HTML/CSS/PHP  Tekenen.
Formuliervalidatie Met Javascript.
Deze presentatie mag noch geheel, noch gedeeltelijk worden gebruikt of gekopieerd zonder de schriftelijke toestemming van Seniornet Vlaanderen VZW Mijn.
Mijn eerste Website bouwen
3 factoren die de Google Ranking bepalen 1. Pagerank 3 factoren die de Ranking bepalen: “ Goede content “ 2. Duur op website + social media knoppen 3.
Van Abbemuseum.
Geen natuurlijke kleur. Het moet groen,bruin, zandkleurig etc. zijn. Maar geen blauw. Logo en plaatjes van het bedrijf.
Aan de slag met weblogs Pierre Gorissen 14 juni 2005.
Om willekeurig welke site en welk werk dan ook overzichtelijk te houden, moeten er eerst (sub)directories gemaakt worden: Bijeenkomst 2 online journalistiek.
G!DS Basismodule Trainingsdag 2 Naam, functie Datum, plaats.
Quiz Start.
Vraag studenten wie er wijn drinkt
Starten met PHP Dynamischer bouwen. PHP is een een scripttaal waarmee de server pagina’s in elkaar kunt laten zetten. Het verschil met HTML: Een php pagina.
Welkom De techniek van websites
Website Usability.
Navigatie zonder muis Zorg ervoor dat alle hyperlinks bereikbaar en activeerbaar zijn met het toetsenbord uitklapmenu: &
Starten met PHP Dynamischer bouwen.
Afbeeldingen op je webpagina
Portfolio: VROMANS PETER
robuust fantasy gelaagd transparant direct organisch textuur grillig sierlijk pretentieus gestileerd eenvoudig ingewikkeld realistisch ritme.
Trisha van Engelen Grijs
VIOT website Marjan Beneens ▪ Sabrina Carlier ▪ Caroline Michielssen
Design je eigen web-pagina Met behulp van Photoshop.
Presentatie slagharen
De basis-elementen Deel 2
Iedereen gebruikt social media.
Luca Badts MEB A 10/11/2015 KSA accessoires Webshop.
Opdracht 4 Video invoegen Gebruik deze presentatie om de opdracht te maken en zet hier je naam:.
Webpagina's maken met (X)HTML en CSS Lang leve het Kladblok!!! Verboden voor editors.
Eindbeoordeling websites Seminarie Webdesign. Technische puntenverdeling Niet online en losse bestanden
DIV Architecture Seminarie Webdesign. CSS-bestand oproepen Voeg tussen en de volgende lijn code toe om een CSS-file te laten werken: Zorg ervoor dat je.
CSS Cascading Style Sheets. CSS code HTML – Welke elementen op een pagina – Stuk code zegt iets over één element CSS – Hoe zien de elementen er precies.
Dia1 Microsoft PowerPoint is een computerprogramma van Microsoft. Het is een pakket waarmee vooral gemakkelijk presentaties gemaakt kunnen worden die.
MIJN WEBSHOP YANAH PRUYM, MEB D. HOME PAGINA
Workshop website bouwen Les 4. Wat heb je geleerd?
Sjabloonsite Koen Van Cauwenberge.
Omdat we op onze eigen account programmeren
Direct Realisatie Les 3 HTML en CSS in s Direct Realisatie Les 3.
Powershell & HTML.
Transcript van de presentatie:

Doelpubliek • Bedrijven • Verenigingen • Iedereen die reclame voor zijn bedrijf of product wenst te maken Fictieve tekst op de indexpagina

Inspiratie •Eerste inspiratie

Gebruikte programma’s •Macromedia Dreamweaver 2004 •Photoshop •dynamicdrive.com voor scriptsdynamicdrive.com •Jouwachternaam.nl voor FormMailJouwachternaam.nl

Mappenstructuur Eerste schema voor de navigatie van de website. Uiteindelijk heb ik deze nog kunnen vereenvoudigen tot 1 niveau

Schermresolutie •800px op 600px te groot •1024px op 768px past

•1152px op 864px Goed Schermresolutie •Laptop 1440px op 900px klein maar aanvaardbaar

Frames – Tabellen – Div’s •Tabellen: De achtergrondafbeeldingen staan in tabellen •Div: de grafische werken staan op layers om het aantal mappen en pagina’s te beperken •Frames: geen frames!!

CSS •Alle tekstopmaak staat in opmaak.css •Uitschuifbare navigatie staat in twee aparte scripts –ssm.js: Het script voor het uitschuiven van de navigatie –smmItems.js: de inhoud (links) van het uitschuifbare menu met de opmaak. Dit bestand zit er op twee verschillende niveaus in omdat de links niet identiek zijn.

Template •Er is 1 template gemaakt die op alle pagina’s is toegepast, uitgezonderd de indexpagina omdat de links van het uitschuifbare menu op de indexpagina op een ander niveau liggen dan de andere pagina’s •2 editable regions: de bovenste navigatie om makkelijk uit te breiden en de layers om gemakkelijk nieuwe werken toe te voegen

Klein medium •Omdat de website hoofdzakelijk grafisch is opgebouwd leent het zich niet goed voor kleine mediums. De uitschuifbare navigatie staat op een.js-script i.p.v. in de html pagina en kon dus niet op de manier omgezet worden zoals we in de cursus hebben geleerd met een aparte css-stijl. •Het is echter toch wel nuttig om informatie en contactgegevens te voorzien omdat dit fictieve bedrijf toch door andere bedrijven gevonden wil worden. Daarom het javascript op de index pagina dat PDA detecteert en door linkt naar een pagina met uitsluitend tekst.

•PHP of FormMail.pl? Ik heb gekozen voor FormMail omdat mijn Webhost geen PHP ondersteund voor het pakket dat ik heb. Nadeel: het gebeurt dat zoekmachines het adres uit de broncode genereren!! Om het probleem te minimaliseren heb ik het adres omgezet in decimale eenheden. Deze techniek is niet waterdicht maar beperkt de ‘zichtbaarheid’ van het adres toch enigszins. Contact Formulier

Problemen die ik tegen kwam •De eigenschappen van de layers heb ik niet in CSS opgenomen omdat deze verschillende afmetingen en posities hadden. De eigenschappen van de layers staan dus in de HTML van de bijbehorende pagina. •Het smmItems.js-script in Safari: –De achtergrond van de links uit het uitschuifbare hoort te verkleuren bij ‘mouse-over’. Bij Safari veranderde de achtergrondkleur van de website ook. –De grootte van het lettertype in het uitschuifbare menu is relatief. Op mijn laptop werd het uitschuifbare menu anders weergegeven. Puntgrootte in PUNTEN en PIXELS zetten werd niet geaccepteerd door dit script.

Kleuren UITEINDELIJK!!! koos ik voor neutraal blauw

•Mijn voorkeur gaat naar websites die horizontaal gecentreerd op het scherm staan maar in dit geval, met het uitschuifbare menu was dat geen optie. •Een voorbeeld van een eenvoudige website horizontaal gecentreerd (1 pagina in tabellen en layers ) Braziliaans Zomercarnaval Braziliaans Zomercarnaval Nota