STARTEN MET WIX A. Registratieprocedure voor een nieuwe gebruiker 1. Start je browser en ga naar www.wix.com 2. Klik op START NOW Het ‘Sign in’ venstertje verschijnt (Email) Typ het emailadres dat je wil gebruiken als gebruikersnaam Selecteer I’m a new user (Password) Geef een wachtwoord in Laat het vinkje bij Remember me maar aanstaan… 3. Klik op GO Het ‘Sign in’ venster verschijnt een tweede keer (Typ your email again) Typ je emailadres opnieuw ter bevestiging (Typ your password again) Typ je wachtwoord opnieuw ter bevestiging 4. Klik op SIGN UP je gaat naar http://www.wix.com/new/account
B. Een template selecteren Wix noemt dit Post registration : je bent al als nieuwe gebruiker geregistreerd, maar het is natuurlijk de bedoeling dat je ook iets doet, met name, een website maken! Op deze pagina vind je achter het woord SELECT de verschillende websitegroepen (Business en Services, Music, Entertainment...enz…) Klik je een groep aan, dan verschijnen de beschikbare subgroepen ernaast in een keuzelijst. Omdat ik een nieuwe website wil maken voor onze fotostudio kies ik Photography & Pro Photographer (u kan natuurlijk kiezen wat je wil) 5. Klik op GO de templates verschijnen. De bedoeling is dat je ze aandachtig bekijkt op zoek naar een ontwerp dat je qua stijl, kleurenpalet, fonts , grafische elementen, layout enz… enz… bevalt. Je kan telkens EDIT aanklikken om alle pagina’s van het sjabloon te bestuderen. Uiteindelijk maak je een keuze. Dit is onze keuze : (zie volgende bladzijde)
C. Van start gaan Hoewel het heel gemakkelijk is om de bouwstenen van een WIX-website te wijzigen, en gezien we vertrekken van een stijlvol ontwerp, en dat dus niet moeten bedenken, zouden we er meteen kunnen ‘invliegen’. In het wilde weg beginnen is zelden een goed idee… Bekijk welk eigen materiaal je wil plaatsen, welke teksten (misschien moet je nog beginnen schrijven!), je hebt waarschijnlijk foto’s nodig (misschien moet je die nog beginnen zoeken en als je ze gevonden hebt, moet je ze waarschijnlijk nog bijsnijden zodat ze passen in het ontwerp). In ons voorbeeld vertrekken we van dit scenario: er bestaat een oude, eenvoudige website, volledig in HTML geschreven, en we willen wel eens zien of die in een WIXjasje past… De inhoud is dus in dit geval grotendeels gekend en beschikbaar. Je vindt die op dit webadres: www.fotostudio57.be We gaan dus een en ander overbrengen. Als het op wat lijkt is het mogelijk dat we dit verderontwikkelen en uitbouwen. Als het niet voldoet zullen we dit proefproject stoppen. Misschien doen we het dan nog eens over met een andere template, of misschien ontdekken we dat Wix niet de ideale omgeving is voor ons project, en dan zullen we uitkijken naar een andere omgeving. Alles is dus op dit moment nog open. We klikken dus op EDIT THIS SITE om van start te gaan!
D. Eerste aanpassing(en) We beginnen op de startpagina. We klikken de titel aan en wijzigen die. We slaan de website voor de eerste keer op (dus SAVE rechts boven!) Dit is het moment dat Wix vraagt om je website te benoemen. Het eerste deel van de naam van de website wordt bepaald door de gebruikersnaam… je kan dat dus ‘sturen’ door een specifiek mailadres als gebruikersnaam op te geven. Het tweede deel (in principe een toepasselijke naam voor de startpagina kan je vrij kiezen)
Klik op Save Now om op te slaan. Je krijgt een bevestiging dat de site is opgeslagen maar nog niet ‘live’ is. In deze fase heeft dat trouwens weinig zin, dus onze volgende aanpassingen zullen we ook alleen nog maar opslaan…
E. Doelstellingen // eerste structureel ontwerp De ‘doelstellingen’ van deze website zijn: 1. Fotostudio verhuren (hoofddoel) startpagina 2. Klanten warm maken voor het huren van een fotostudio 3. Professionele indruk maken op de klanten foto’s / video’s 4. Infrastructuur presenteren infrastructuur 5. Wegbeschrijving naar de studio geven contactpagina 6. Huurprijzen en diensten bekendmaken prijzen & voorwaarden 7. Richtlijnen en voorwaarden bekendmaken prijzen en voorwaarden 8. Agenda tonen (wanneer nog vrij, wanneer bezet?) boeken/ agenda (link naar contactformulier) 9. Contactformulier om de studio te boeken contactformulier
10. Andere contactgegevens tonen contactpagina Dit is wat we in eerste instantie kunnen bedenken. We gaan er van uit dat dit nog zal wijzigen, maar het zit zeker al in de goede richting. Als we kijken naar het beschikbare materiaal op de oude website, en we toetsen dit af aan onze ‘doelstellingen’ dan zien we een aantal mogelijke pagina’s : die hebben we achter onze doelstellingen gezet met een
F. STARTPAGINA
Het is zeker geen slecht idee om pagina per pagina te werken, en om met de startpagina te beginnen. Wat hebben we gedaan met de oorspronkelijke pagina? 1. Hoofd van de pagina (header – die je ze op alle pagina’s) a) De oorspronkelijke titel hebben we vervangen door onze titel (Huur een fotostudio) : je klikt de titel aan, het contextmenu verschijnt, je kiest edit text en je gaat in bewerkingsmode : het tekstvak wordt een (kleine) teksteditor en je kan o.a. andere tekst invoegen, font – kleur – grootte wijzigen. Klik je buiten het vak, dan verlaat je de bewerkingsmode. Klik je een textvak aan, dan kan je het met de handles verplaatsen, of de vorm er van wijzigen (zoals tekstvakken in andere programma’s vb MS-Word) b) Het titeltekstvak hebben we gekopieerd : ctrl-C om te kopiëren, ctrl-V om een kopie op een andere plaats te plakken. Dit nieuwe vak kunnen we wijzigen op
dezelfde manier als het vorige. Je kan ook kopiëren en plakken via de icoontjes rechts onderaan in het contextmenu. (zie hieronder)
c)
In de navigatie hebben we de naam van de startpagina (Home) verandert in Start : je kan de navigatie aanklikken (ook dit is een component)
We kiezen Rename Pages om de eerste paginanaam te wijzigen. Op de volgende pagina zie je welk venster verschijnt : links zie je de pagina’s zoals die op het moment georganiseerd staan. De pagina Start staat links in ’t grijs, de informatie die rechts staat heeft daar dus betrekking op. Wil je de paginanaam (Page Name) en het pagina-adres (Page Address) veranderen, dan moet je ze gewoon overtypen met een nieuwe naam. (Oorspronkelijk stond hier resp. Home en home, we hebben het vervangen door Start en start) – Vergeet niet onderaan in het venster op DONE te klikken, om de wijzigingen te bevestigen. Merk ook dat je de positie van de pagina’s kan wijzigen via het linker deel van het venster : als je op een blokje voor een paginanaam gaat staan, dan kan je die pagina verslepen naar een andere positie! Zoals je ziet aan de pagina Contact, kan je een pagina ook als sub-pagina plaatsen.
2. Pagina zelf (tussen hoofd- en voetgedeelte) a) Oorspronkelijk stond hier enkel een beeldvullende slide-show component met 4 foto’s. We vervangen de foto’s nog niet (we zijn nog aan ’t nadenken over welke foto’s we hier precies willen). Wat we wel al weten is dat we de introductietekst van de oude website hier willen plaatsen. We hebben dus eerst de slide-show component ‘versmald’ om plaats te maken voor een tekstvak voor de introductietekst : alweer gewoon component aanklikken en met een handle horizontaal verslepen tot we de gewenste breedte krijgen. b) Een extra tekstvak voor de introductietekst halen we in de toolbox links : we klikken de “+” aan (zo beginnen we altijd als we iets willen toevoegen) – we klikken vervolgens op Text en dan verschijnen de tekstcomponenten. We klikken Paragraph aan : dat levert een tekstvak. Een nieuwe
component wordt steeds in het midden van het scherm geplaatst. We verslepen het tekstvak naar de juiste positie, en we gebruiken de handles om het tekstvak het juiste formaat te geven. Vervolgens voegen we de introductietekst in en maken we de tekst op tot we er tevreden van zijn (lettertype, lettergrootte, eventueel kleur aanpassen, schikking enz…) 3. Voet van de pagina (footer – verschijnt eveneens op alle pagina’s) Voorlopig wijzigen we alleen nog maar de copyright melding links onderaan in. Per slot van rekening is het nu ‘onze’ website! We slaan ons project op (SAVE links bovenaan) – Aan publiceren zijn we nog niet toe.