Vliegende start. met Magix Webdesigner Premium 8 en Eduwebsupport

Vliegende start

met Magix Webdesigner Premium 8 en Eduwebsupport Maak een vliegende start met Magix webdesigner en volg alle stappen in deze manual. Alle belangrijke functies kom je vanzelf tegen en kun je oefenen. Uitgebreide documentatie vind je in de Magix Manual voor webdesigner en in de help-functie van de software.

Versie 1.1

EDUWebsupport Wegtersweg 12 7556 BR Hengelo Nederland www.eduwebsupport.nl [email protected]

© EDUWEBSUPPORT 2013 Vliegende start met Magix webdesigner en Eduwebsupport

1

Inhoud Inleiding ................................................................................................................................................... 3 1: Basis functies en instellingen .............................................................................................................. 3 1.1 Ongedaan maken .......................................................................................................................... 3 1.2 Afmetingen webpagina ................................................................................................................. 3 2: Tekengereedschappen. ....................................................................................................................... 4 2.1 Schalen .......................................................................................................................................... 6 2.2 Kleurverloop. ................................................................................................................................. 6 2.3 Transparantie. ............................................................................................................................... 6 2.4 Schaduw. ....................................................................................................................................... 7 2.5 Perspectief ..................................................................................................................................... 8 2.6 3D .................................................................................................................................................. 8 3: Tekst .................................................................................................................................................... 9 4: Pagina en lagengalerie ...................................................................................................................... 10 4.1 De achtergrond............................................................................................................................ 11 4.1.1 Page background .................................................................................................................. 11 4.1.2 Page background mee laten rekken. .................................................................................... 11 4.1.3 Pasteboard background ....................................................................................................... 12 4.1.4 Elementen herhalen ............................................................................................................. 12 5: Nieuwe pagina’s maken. ................................................................................................................... 14 6: Navigatie............................................................................................................................................ 14 6.1 Navigatie balken en buttons uit de galerie. ................................................................................ 14 6.2 Zelf een navigatieknop maken. ................................................................................................... 18 7: Foto’s en afbeeldingen ...................................................................................................................... 20 7.1 De bitmap-galerie ........................................................................................................................ 20 7.2 Nieuwe afbeeldingen plaatsen. ................................................................................................... 21 7.3 Down sampling ............................................................................................................................ 21 7.4 Foto’s bewerken .......................................................................................................................... 23 8: Layer en pop up ................................................................................................................................. 23 9: Nieuwe pagina toevoegen................................................................................................................. 24 10: Zoekmachine optimalisatie ............................................................................................................. 25 11: Eindopdracht ................................................................................................................................... 27 12: Website publiceren ......................................................................................................................... 27 12.1 Publiceren via eigen hosting provider. ...................................................................................... 27 12.2 Gratis publiceren ....................................................................................................................... 28 Vliegende start met Magix webdesigner en Eduwebsupport

2

Inleiding In deze “vliegende start” training leer je in heel korte tijd alle belangrijke basisbegrippen en de toepassing daarvan. Voor uitgebreide informatie over alle functies verwijzen wij je graag naar de Magix Manual die in het programma onder de knop ‘Hulp’ beschikbaar is. Om webdesigner goed onder de knie te krijgen adviseren we je om alle hoofdstukken in volgorde te lezen en de opdrachten uit te voeren. Aan het eind van deze vliegende start manual kun je je kennis testen met een opdracht. Succes!

1: Basis functies en instellingen Open Magix webdesigner door op het icoontje te klikken. We gaan eerst alle basis functies bespreken.

1.1 Ongedaan maken Met de blauwe pijl kun je de voorgaande bewerkingen ongedaan maken.

Bewerking ongedaan maken.

1.2 Afmetingen webpagina 1: Open het programma. Je krijgt nu de interface met een witte lege pagina. Dit is een webpagina zonder vulling. 2: Wijzig de afmetingen van de webpagina. Ga naar: Bestand > paginaopties. Je krijgt nu het volgende dialoogvenster.

Vliegende start met Magix webdesigner en Eduwebsupport

3

Vul bij breedte 1080 in. Selecteer aangepast. Je kunt nu de breedte van de toekomstige pagina ingeven. Afmetingen in de digitale wereld zijn altijd in pixels. Een 22 inch scherm heeft vaak 1600 pixels in de breedte. Maak je webpagina 1080 pixels breed. De lengte gaan we later aanpassen.

2: Tekengereedschappen. Met de tekengereedschappen maak je alle vlakken waaruit een webpagina bestaat. Selecteer het eerste gereedschap, de rechthoek, door er op te klikken.

Klik op de rechthoek. Klik en sleep een rechthoek op de pagina. Laat de linkermuisknop los. Dit is je resultaat:

Resultaat.


4

Klik op een van de kleuren op de onderste kleurenbalk, houd de linkermuisknop ingedrukt en sleep het kleurvlakje tot in de rechthoek.

Kleurenbalk. Dit is je resultaat:

Klik op het selectiegereedschap: Klik vervolgens op de rechthoek. Dit is nu je resultaat:

Geselecteerde rechthoek. De zwarte puntjes geven aan dat het object geselecteerd is. Alleen objecten die geselecteerd zijn kun je bewerken. Klik op het symbool van de rechthoek: Symbool rechthoek. Klik op de kwart cirkel. Dit is nu je resultaat:

De hoeken worden afgerond. Vliegende start met Magix webdesigner en Eduwebsupport

5

2.1 Schalen Klik met het selectiegereedschap op de rechthoek. Aan de zwarte puntjes rondom de rechthoek zie je dat deze geselecteerd is.

Slotje dicht.

slotje open. Als het slotje dicht is worden bij het slepen de lengte en breedte verhouding gelijk gehouden. Is het slotje open dan kun je de lengte en breedte onafhankelijk van elkaar wijzigen. Probeer het maar.

2.2 Kleurverloop. Klik met het selectiegereedschap op de rechthoek. Klik vervolgens op het emmertje. Klik nu links naast de rechthoek en sleep de cursor naar rechts. Dit is nu het resultaat.

Kleurverloop. Een kleurverloop is geen transparantie!

2.3 Transparantie. Maak een nieuwe rechthoek, en maak deze iets groter dan de vorige rechthoek. Geef de rechthoek een kleur en sleep de rechthoek op de groene rechthoek. Dit is nu je resultaat:


6

Blauwe op groene rechthoek. We gaan nu eerst de blauwe rechthoek onder de groene rechthoek plaatsen. Doe het volgende: Klik op Arrangeren en vervolgens op Zet achteraan. De blauwe rechthoek zit nu achter de groene rechthoek.

Dit is nu je resultaat:

Selecteer de groene rechthoek en klik op vulgereedschap. Verander lineair in vlakke vulling. De groene rechthoek wordt nu egaal groen.

Probeer ook eens de andere opties in het drop down menu!

2.4 Schaduw. Sleep de groene rechthoek een stukje onder de blauwe rechthoek. Klik op het volgende icoontje:


7

Klik in het groen vlak en sleep je cursor een stukje naar recht en naar boven. Je hebt nu een schaduw gemaakt. Dit is je resultaat:

Kijk wat er gebeurt als je de schuifregelaar Vervaging en Transparantie beweegt.

2.5 Perspectief Laat het groene vlak geselecteerd, en klik op het volgende icoontje: Selecteer een van de rode pijlen en sleep deze een beetje naar buiten. Dit is nu je resultaat:

2.6 3D Laat het groene vlak geselecteerd. En klik op het 3D icoontje. Klik ergens in het groene vlak en sleep de cursor een stukje naar rechts en naar beneden. Dit is nu je resultaat:

In de 3D werkbalk zitten schuifregelaars en icoontjes. Experimenteer hier mee. Vliegende start met Magix webdesigner en Eduwebsupport

8

3: Tekst Klik op et Tekst symbool, resultaat:

, en sleep de cursor een stukje naar rechts. Dit is nu het

Type de volgende tekst: “Dit is een experiment om te zien hoe het tekstgereedschap werkt” Dit kan je resultaat zijn:

Als er een cirkel met een pijl naar beneden verschijnt, dan is het tekstvlak niet groot genoeg. Ga op de rechter onderhoek staan en sleep/vergroot het tekstvlak tot de pijl is verdwenen. Je kunt ook direct tekst plaatsen, zonder eerst een tekstvlak te maken. Deselecteer het tekstvlak, klik op het tekst icoontje en klik vervolgens op een willekeurige plaats op je pagina. Dit is nu het resultaat:

Je hebt meer controle over tekst in een tekstvalk dan tekst die je zonder tekstvlak schrijft. Experimenteer met de functies in de tekstbalk voor teksten.


9

4: Pagina en lagengalerie Aan de rechterkant bevindt zich de pagina en lagengalerie. Met wat je tot nu toe hebt gedaan ziet de galerij er als volgt uit.

Normaal gesproken wordt alles wat je op een pagina plaatst automatisch in het MouseOff gedeelte van de galerij geplaatst. Elke teken- of tekstelement wordt geplaatst in een eigen laag, binnen de MouseOff laag. Klik op het open driehoekje links naast schaduwgroep. Je ziet dat er in deze schaduwgroep meerdere elementen bevinden.

Klik op het oogje naast de schaduwgroep en kijk wat er gebeurt. Klik op nieuw op het oogje. Klik op het slotje naast de schaduwgroep en probeer vervolgens het groene vlak te selecteren. Met het slotje vergrendel je de mogelijkheid een element te bewerken. Undo de laatste actie.


10

4.1 De achtergrond Een website in Magix heeft 2 achtergronden: Een Page background en een Pasteboard background. De 2 achtergronden zijn echter niet zichtbaar als je een nieuw document opent.

Nog geen page background en pasteboard.

De lagen page background en pasteboard background ontstaan op de volgende manier: 4.1.1 Page background Open een nieuw document. Sleep vanuit de kleurenbalk een kleur naar de pagina.

Door deze handeling wordt automatisch de laag page background aangemaakt. De schaduwlaag wordt ook automatisch aangemaakt.

Door de rechthoek in het tekengereedschap te selecteren wordt de Page background geselecteerd en kan deze worden bewerkt. Je kunt de pagina bijvoorbeeld voorzien van afgeronde hoeken.

De page backgrond is de onderste laag van de website.

4.1.2 Page background mee laten rekken. De afmeting van de achtergrond is de afmeting van de pagina die je in eerste instantie hebt ingesteld. Pagina’s kunnen echter verschillende lengtes hebben. Om te voorkomen dat je bij elke pagina opnieuw de lengte vooraf moet instellen, kun je de pagina automatisch laten mee rekken als je meer tekst en afbeeldingen toevoegt. Doe het volgende: Maak een pagina achtergrond zoals hierboven beschreven. Selecteer de pagina door er op te klikken. Klik op je rechtermuisknop. Je krijgt nu het volgende menu:


11

Klik op “positie op pagina” en klik op “Rekt mee met pagina”. Je bent nu klaar.

Als je nu een preview doet door op het oog in de werkbalk te klikken, dan zal je zien dat het hele scherm gevuld is met de gekozen kleur. Meestal is dat niet de bedoeling. Dit kun je vermijden door de Pasteboard background aan te passen. 4.1.3 Pasteboard background Het pasteboard is de ruimte aan weerszijden van je webpagina. Hoe groot deze ruimte is, is afhankelijk van de afmeting van je beeldscherm. Het pasteboard wordt ook wel de browser fill genoemd. Door een kleur van de kleurenbalk naar het pasteboard te slepen verandert deze van kleur en wordt automatisch de pasteboard background laag aangemaakt.

4.1.4 Elementen herhalen

De header en de footer van je website wil je meestal op elke pagina herhalen. Dat doe je op de volgende manier. Open een nieuwe website. Maak een rechthoek en plaats deze boven aan de pagina. Maak een nieuw rechthoek en plaats deze helemaal onder aan de pagina. Vliegende start met Magix webdesigner en Eduwebsupport

12

Ga naar de bovenste rechthoek, selecteer deze en klik op de rechtermuisknop. Klik in het menu op “Op alle pagina’s herhalen”.

Doe dit ook met de onderste balk. Echter selecteer naast “Op alle pagina’s herhalen” ook “Positie op pagina” en klik op “Duwen”. Er komt nu een dialoogvenster Duwen. Vul hier overal 0px in. Als je nu de onderste balk naar beneden schuift zal de achtergrond automatisch naar beneden meer rekken. Probeer het maar.

Dialoogvenster “Duwen”


13

5: Nieuwe pagina’s maken. Als je een nieuwe website start dan begint Magix automatisch met de index pagina. Dit is feitelijk de home page. Je kunt nieuwe pagina’s toevoegen door te klikken op onderstaande symbolen.

De lege pagina zal wel alle elementen hebben die op de originele pagina het kenmerk “Op alle pagina’s herhalen” heeft gekregen. Maar een nieuwe pagina. Als je klikt bij het nummer kun je de pagina een naam geven. Deze naam zal ook in de url verschijnen (de naam ‘index’ van de 1e pagina mag niet worden veranderd)

6: Navigatie. Navigatie is een van de belangrijkste elementen van een website. Magix heeft speciale tools om zelf mooi navigatie balken en buttons te maken.

6.1 Navigatie balken en buttons uit de galerie. De makkelijkste manier om je navigatiebalk te maken is door gebruik je maken van de standaard navigatiebalken en knoppen die je in de galerie kunt vinden.


14

Ga naar de “ontwerpgalerie”. Deze vind je rechtsboven.

knop Ontwerpgalerie. Ga naar Pagina elementen en selecteer “knoppen”

Selecteer de highlight Stretch. Klik er op en sleep deze naar je pagina.

Een stretch knop is een knop die volledig schaalbaar is. Je kunt hem zonder kwaliteitsverlies vergroten en verkleinen. Probeer het maar. Door dubbel te klikken in de knop kun je de tekst aanpassen.

Selecteer de knop en klik op de rechter muisknop. Selecteer in het menu dat nu verschijnt op Creëer navigatiebalk…


15

Het volgende dialoogvenster verschijnt:

Dubbel klik om een knop toe te voegen. Geef deze knop de naam van de pagina die je gemaakt hebt. Dubbel klik op het veld Url. Er komt een nieuwe popup. Selecteer: “Link naar” en kies vervolgens de pagina naar waar deze knop moet linken.


16

Met bovenstaande werkwijze kun je een hele reeks knoppen maken op elke plaats waar je maar wilt. Je kunt ook een volledige navigatiebalk uit de galerie selecteren en deze aanpassen.

Als je een element uit de galerie naar je pagina sleept krijg je soms de volgende popup:

Klik je op aanpassen dan wordt de kleurstelling van het element automatisch aangepast aan de kleurstelling van de pagina. Klik je op Niet aanpassen dan kun je vervolgens met de knop ‘Button Tone’ in de kleuren editor de kleur naar wens aanpassen.


17

6.2 Zelf een navigatieknop maken. Een navigatieknop heeft meestal 2 verschijningsvormen. De knop zoals je deze normaal gesproken ziet heet MouseOff state van de knop. Ga je er met de muis over dan verandert de knop in de MouseOver state.

We gaan nu een navigatieknop maken met een MouseOver en MouseOff state. MouseOver en MouseOff wordt veel gebruikt, bijvoorbeeld bij een pop-up fot die verschijnt als je met de muis over een thumbnail foto gaat. Stap 1. Maak een rechthoek en zet daarin de tekst Test knop. Selecteer nu de knop en de tekst door eerst de rechthoek te selecteren, shift in te drukken en vervolgens de tekst te selecteren. Als tekst en rechthoek zijn geselecteerd zie je 2 puntjes:

Klik op de rechtermuis en selecteer “Groeperen”. Je hebt nu een groep gemaakt. In de lagengalerie is dit ook te zien:

Je kunt ook selecteren door met het selectiegereedschap buiten de te selecteren objecten te klikken en vervolgens de selectie rechthoek om deze objecten te trekken. Vervolgens kun je weer groeperen.


18

Selectie rechthoek om de te selecteren objecten. Let op de twee puntjes. Dit geeft aan dat beide objecten zijn geselecteerd. Maak nog een knop. Nu echter met een iets andere kleur rechthoek en tekst. Groepeer ook hier weer.

De bovenste knop moet nu worden voorzien van een link. Selecteer de knop en klik op de rechtermuis. Selecteer “Webeigenschappen”. Selecteer: “Link naar” en maak een pagina keuze.

Selecteer de onderste knop. Je ziet nu in de lagengalerie ook dat deze knop is geselecteerd. Je ziet ook dat de groep nog in de MouseOff laag staat.

Selecteer deze laag in de galerie en sleep deze naar de MouseOver laag.

Zet nu de onderste knop over de bovenste knop. Klik op het oogje bij de MouseOver laag en registreer wat er gebeurt.


19

Klik op de preview knop

en ga met je cursor over de knop. Kijk wat er gebeurt.

7: Foto’s en afbeeldingen Elke website heeft foto’s en andere afbeeldingen. Een element is een foto of een afbeelding als het de existentie .jpg (voor foto’s) of .png (voor overige afbeeldingen) heeft. Magix heeft vele mogelijkheden voor het bewerken en toepassen van foto’s en afbeeldingen. We gaan de belangrijkste bepreken.

7.1 De bitmap-galerie Ga naar de ontwerp galerie en open onderstaande de website Onroerend goed:

Open nu de bitmap galerij door er op te kikken.

Alle afbeeldingen van een website worden altijd in de bitmap geplaatst. Vliegende start met Magix webdesigner en Eduwebsupport

20

7.2 Nieuwe afbeeldingen plaatsen. Het plaatsen van een nieuwe afbeelding kan op 2 manieren: 1: Via menu bestand>Importeren

2: Door te slepen vanuit een map of het bureaublad. Klik op de foto of afbeelding, sleep deze naar de pagina en laat los. De afbeelding staat nu ergens in de pagina, maar is tevens in de bitmap-galerie geplaatst!

7.3 Down sampling De grootte van een foto uit je digitale fototoestel of smart phone heeft een formaat in pixels. In het voorbeeld hebben we een foto van 4272x2848 pixels. Als ik deze foto vanuit de verkenner naar een pagina sleep gebeurt het volgende: De foto wordt geplaatst in de pagina en tegelijkertijd in de bitmap.

In de bitmap-galerie zie je dat de oorspronkelijke 4272x2848 pixels zijn gereduceerd tot 1920 x 1280px. Alle afbeeldingen groter dan 1920 x1280px worden door Magix tot deze grootte gereduceerd. Je ziet ook dat dat de foto 2.5 mega pixel groot is. De grootte van afbeeldingen op internetpagina’s moet zo klein mogelijk zijn omdat anders de laadtijd van de pagina te groot is en de webbestanden te veel ruimte in nemen. 2.5 MP is veel te groot en dat moeten we reduceren. Selecteer de foto en klik op de rechter muisknop. Klik op “Optimaliseer foto”.


21

Je ziet nu het volgende dialoogvenster. Klik op “Optimaliseren”.

In de bitmap galerie is er nu een kopie van deze foto bijgekomen:

Je ziet ook dat dezelfde foto nu slechts 500x333 pixels heeft en een totaal van 0.2mp. Het volgende is gebeurd: Magix heeft gezien dat het fysieke formaat van de foto 500x333 pixels is. Het fysieke formaat is zoals je de foto op je scherm ziet.

Alle pixels die je niet ziet, heeft Magix verwijderd. Dit optimalisatie proces heet “down sampling”. Omdat een ‘gedown-samplede’ foto maar weinig pixels bevat kun je deze foto niet meer opschalen Vliegende start met Magix webdesigner en Eduwebsupport

22

zonder kwaliteitsverlies. Gelukkig is dat geen probleem. De originele foto staat nog steeds in de galerie en deze kun je steeds opnieuw gebruiken!

7.4 Foto’s bewerken Selecteer de foto en klik op het icoontje met het fototoestel.

Naast de werkbalk die je hier boven ziet wordt er ook een nieuwe werkbalk geplaatst”

Deze werkbalk heeft allerlei functies om een foto te manipuleren. Probeer ze maar.

8: Layer en pop up We gaan verder met de foto die al op je pagina staat. Verklein de foto door de handles naar binnen te slepen. Je hebt nu een thumbnail foto. Ga naar de pagina en lagengalerie en klik op “nieuwe laag”. Er wordt nu een laag 3 aangemaakt.

Selecteer de foto en klik op je rechter muis. Selecteer “Webeigenschappen” in het menu. Klik op de tab “MouseOver”.

Selecteer “Toon pop-up laag” en vervolgens laag 3. Sleep de originele foto van de bitmap galerie naar de pagina. Zorg er voor dat deze in laag 3 wordt geplaatst. (Sleep desnoods van de laag waar deze zich bevindt naar laag 3) Vliegende start met Magix webdesigner en Eduwebsupport

23

Klik op het linker oog in de werkbalk. De websitepagina wordt nu in de browser geopend. Je ziet de kleine foto. Ga er met je muis over heen. De grote foto wordt getoond.

9: Nieuwe pagina toevoegen. Klik op de blauwe +. Er wordt nu een nieuwe lege pagina aan de bestaande pagina toegevoegd. Je kunt dit ook zien in de lagengalerie.

Maak een rechthoekig vlak en plaats deze helemaal boven aan. Sleep een foto uit de bitmap-galerie naar deze nieuwe pagina. Ga terug naar de eerste pagina en selecteer het Tekst gereedschap. Maak een tekstbox en plaats de volgende tekst: “Dit is een test voor een interne link”. Selecteer het woord “Link”.

Klik op de ketting in de werkbalk. Ver verschijnt nu een pop-up.

Selecteer “Link naar” en selecteer vervolgens “pagina 2”.

Klik op het 2e oog. Met dit 2e oog wordt de hele site in de browser geplaatst en niet alleen de actieve pagina. Vliegende start met Magix webdesigner en Eduwebsupport

24

Klik op “link”. Je gaat nu naar pagina 2.

10: Zoekmachine optimalisatie Zoekmachine optimalisatie gaat over de vindbaarheid van een webpagina. Er zijn meer dan 200 factoren die de vindbaarheid van een webpagina bepalen en een deel hiervan is verweven in de website en de pagina’s van de site. In dit deel bespreken we enkele belangrijke factoren die noodzakelijk zijn voor de vindbaarheid. Het zijn deze factoren die de zoekmachine (mede) vertellen waar een webpagina over gaat. Ga ergens op de pagina staan en klik de rechter muisknop. Selecteer “Eigenschappen website” in het menu dat verschijnt. Selecteer “Pagina”.

Dit venster heeft de volgende velden. Bestandsnaam pagina: Die naam die je hier plaatst, is de naam van het subdomein. Meestal is dit de paginanaam. Door dit in te vullen ontstaat de url van de pagina. Is de 2e pagina van je site een pagina om kaas te promoten dan ziet de url als volgt uit: http://www.mijndomein.nl/kaas Google weet nu ook dat de pagina over kaas gaat. Titel pagina: De titel van de pagina wordt de Title tag genoemd. Deze vind je terug in op de resultatenpagina van Google. Gebruik maximaal 64 tekens voor de title tag, inclusief spaties en leestekens. Paginabeschrijving: De pagina beschrijving wordt Description tag genoemd. Je hebt 155 tekens om hier relevante informatie over de pagina te geven.


25

Pagina-Keywords: Hier plaats je normaal gesproken de relevante zoekwoorden van je pagina. Omdat Google de keyword tag tegenwoordig negeert, mag je deze leeg laten. Html code body en head. Als je extra code aan je pagina wilt toevoegen dan kan dat via deze buttons. Code die vaak op deze manier wordt toegevoegd is code van Google Analytics.

Headings Als je een tekst maakt in Magix, dan is deze tekst per default een “paragraaf tekst”. Als je boven een stuk tekst een kop plaatst, dan kun je deze kop een zogenaamd H-label geven. Dit wordt ook wel een “Heading” genoemd. Headings hebben een nummer. H1 is belangrijker dan H3. Je geeft de koppen een Heading om de zoekmachine te vertellen dat er in de kop belangrijke informatie staat. De zoekmachine zal deze informatie gebruiken als onderdeel van het algoritme dat de ranking in de natuurlijke resultaten bepaald. In de zoekbalk van Magix kun je headings maken en aanpassen als de in de tekstmode staat.

De “normale tekst” in het drop down menu is de paragraaf tekst.


26

11: Eindopdracht We gaan nu je kennis testen. Voer onderstaande opdracht uit. Je hebt hiervoor 1 uur. Maak een website aan met pagina breedte 1080 pixels, en geef zowel de pasteboard als het page board een eigen kleur. De website bestaat uit minimaal 3 pagina’s en een navigatie balk. Zorg voor een naamgeving van iedere webpagina. Zorg dat er een ‘footer’ wordt meegenomen die op iedere pagina terugkomt en mee rekt met de pagina. Iedere pagina wordt voorzien van zowel tekst als grafisch materiaal (bijvoorbeeld een foto). Zorg ervoor dat minimaal één foto als thumbnail wordt weergegeven maar wordt voorzien van een MouseOver. Om een pagina te optimaliseren voor vindbaarheid binnen de zoekmachines zorg je ervoor dat voor iedere pagina een ‘Description Tag’ en een ‘Title tag’ wordt ingesteld.

12: Website publiceren 12.1 Publiceren via eigen hosting provider. Als je website gereed is wil je deze natuurlijk online zetten. Voordat je dat doet heb je eerst een domeinnaam nodig. Deze kun je aanvragen bij je hosting provider. Een hosting provider is een bedrijf waar de websites op de server wordt geplaatst. Via deze server gaat de site online. De provider voorziet je ook van inloggegevens: Het ftp-hostadres, ftp-gebruikersnaam, ftp wachtwoord en Submap. Ftp staat voor File Transfer Protocol en is een protocol om bestanden tussen computers uit te wisselen. Omdat Magix alleen met dit protocol werkt moet je zeker stellen dat jouw provider ook met ftp kan werken. Je vind de tap Publiceren door op je rechtermuis te klikken en naar webeigenschappen te gaan. Klik op de tab “publiceren”. Vul de gegevens van je provider in en klik op OK.


27

12.2 Gratis publiceren Een website laten hosten kost geld, bovendien betaal je ook nog extra voor de domeinnaam. Magix heeft een service om zonder kosten een website te publiceren. Je krijgt dan voor je website een subdomein binnen het Magix domein. Het ziet er dan als volgt uit: http://jouwnaam.magix.net Ga naar http://www.magix-online.com/nl/webhosting/aanbod-prijzen.2937.html voor hosting onder het Magix domein.

EDUwebsupport. © 2013 Alle rechten voorbehouden. Niets uit deze uitgave mag worden vermenigvuldigd en/of openbaar worden gemaakt, door middel van druk, fotokopie, internet publicaties of welke andere wijze dan ook, zonder voorafgaande schriftelijke toestemming van Eduwebsupport of de rechthebbende auteurs.


28

Vliegende start. met Magix Webdesigner Premium 8 en Eduwebsupport

Recommend Documents