Van website naar e-zine Composer template
Inleiding In dit document wordt beschreven hoe u te werk zou kunnen gaan om van een bestaande website een template te maken voor een digitale nieuwsbrief. Bij het maken van dit template zal alleen gebruikt worden gemaakt van Microsoft Kladblok (Notepad), Microsoft Paint en de e-zine Composer. Dit proces kan dus op iedere Microsoft Windows PC, vanaf versie XP, uitgevoerd worden. N.B.: De screenshots die gebruikt worden in dit document zijn gemaakt in Microsoft Windows Vista en Internet Explorer 7.0. 2 P a g i n a
Stap 1 Analyse van de website Hieronder ziet u een voorbeeld van een website die we zullen omzetten naar een template in de e- Zine Composer. Het gaat hier om de KVSA Webservices website, www.kvsawebservices.nl. Op het eerste gezicht lijkt dit al een prima opmaak voor een elektronische nieuwsbrief, maar over het algemeen zijn websites breder dan wat prettig is voor een e-mail. Voor nieuwsbrieven is het niet aan te raden breder te gaan dan 600-700 pixels. Het bovenstaande voorbeeld is in totaal al 800 pixels breed, wat dus betekent dat de opmaak van de website niet 1-op-1 overgenomen zal worden voor het template. Bekijken hoe breed een afbeelding is kan vrij simpel door met de rechtermuisknop op de afbeelding te klikken en vervolgens te kiezen voor Eigenschappen of Properties. De grootte in pixels wordt daar aangegeven. De bovenbalk in bovenstaand voorbeeld is 798x100 pixels groot. Op zichzelf al iets te breed voor een nieuwsbrief, maar we zullen toch deze afbeelding gaan gebruiken voor het template. 3 P a g i n a
De eerste stap voor het analyseren van een website ten behoeve van een template, is bekijken in hoeveel bruikbare delen de website opgesplitst kan worden. In de afbeelding hieronder staat de verdeling die het makkelijkst is om te maken, ook zijn de verschillende onderdelen genummerd ter referentie. Zoals u kunt zien is de website opgebouwd uit 9 delen. Wij zullen niet alle delen gaan gebruiken, omdat we niet alle onderdelen willen gebruiken in de nieuwsbrief. Voor het template, waarin we voornamelijk nieuws willen gaan versturen, willen we een layout die soortgelijk is aan die van de website. Dat wil zeggen dat we een bovenbalk met het logo gebruiken, waaronder 2 kolommen komen, namelijk een brede linkerkolom voor de nieuwsberichten en een smallere rechterkolom met extra opmerkingen. Zoals op de volgende pagina in het template ontwerp te zien is, is deel 1 de bovenbalk geworden. Het ontwerp van deel 6 zal gebruikt worden om nieuwsitems te maken. Deel 9 vormt de basis voor de rechterbalk. 4 P a g i n a
5 P a g i n a
Stap 2 Het opslaan van de te gebruiken afbeeldingen Nu u voor uzelf een duidelijk beeld heeft gevormd van het te maken ontwerp is het tijd om daarmee te beginnen. In eerste instantie is het raadzaam de afbeeldingen die u wilt gaan gebruiken op te slaan en te plaatsen binnen de e-zine Composer. Volgens bovenstaand voorbeeld zullen we deel 1 opslaan als afbeelding. Opslaan van afbeeldingen Het opslaan van afbeeldingen vanuit een browser als Internet Explorer is vrij eenvoudig. Doorgaans kunt u dit doen door met de rechtermuisknop op de afbeelding te klikken en vervolgens te kiezen voor Afbeelding opslaan als.... De balk op de KVSA Webservices website echter wordt als achtergrond van een tabel gebruikt. U kunt deze opslaan door rechts te klikken op de afbeelding en te kiezen voor Achtergrond opslaan als.... Wat als u een gedeelte van een afbeelding wilt? Mocht u maar een gedeelte van een afbeelding willen gebruiken, of juist één afbeelding maken van wat er op de website veel meer zijn, kunt u de volgende stappen volgen. Allereerst maken we een afbeelding van de totale website (als u deze al niet heeft). Om dit te doen volgt u de volgende stappen: Open de website in uw browser Zorg ervoor dat alle later te gebruiken afbeeldingen zichtbaar zijn (als dat niet mogelijk is moet u per deel van de website deze stappen herhalen) Druk op uw toetsenbord de toets Print Screen in Open het programma Paint (standaard te vinden via Start -> Alle programma s -> Bureau Accesoires -> Paint) In Paint gaat u naar het menu Bewerken en kiest u voor Plakken U heeft nu een volledige schermafdruk van uw website in paint Sla dit voorbeeld op (als JPEG) voor later gebruik ( Bestand -> Opslaan als ) Vervolgens gaan we deze afbeelding gebruiken om de afbeeldingen die we willen hebben apart op te slaan. Hiervoor volgt u de volgende stappen per afbeelding: Open het programma Paint (standaard te vinden via Start -> Alle programma s -> Bureau Accesoires -> Paint) Open de afbeelding die u wilt gebruiken als bron (die in het vorige stappenplan is opgeslagen) Zorg ervoor dat het Selectie icoontje in uw linkerbalk geselecteerd staat. U kunt met deze optie een gedeelte van de afbeelding selecteren om te bewerken. Selecteer nu het gebied dat u apart wilt opslaan als afbeelding. Als u het gebied heeft geselecteerd gaat u naar het menu Bewerken en kiest u voor Kopiëren. 6 P a g i n a
Vervolgens gaat u naar Bestand en kiest u voor Nieuw. Als u gevraagd wordt of u de huidige afbeelding op wilt slaan kiest u voor Nee. Aangezien deze afbeelding al opgeslagen is op uw PC. In het nieuwe bestand gaat u naar het menu Bewerken en kiest u voor Plakken Als u vervolgens via Bestand -> Opslaan als het bestand als JPEG opslaat heeft u een losse afbeelding van een gedeelte van het origineel opgeslagen. Herhaal bovenstaande stappen voor alle delen van de website die u wilt opslaan als afbeelding. Als u alle afbeeldingen heeft die u wilt, dan plaats u deze in de bestandsbibliotheek van de e-zine Composer. 7 P a g i n a
Stap 3 Het maken van het template Nu alle afbeeldingen zijn opgeslagen kunnen we het template realiseren in de e-zine Composer. Zoals eerder gezegd gaan we het nieuwe ontwerp opmaken uit 3 delen, namelijk een bovenbalk met daaronder een linker en een rechterbalk. Deze is het makkelijkst te realiseren door een tabel te maken die er zo uit ziet. Bij het maken van het template maakt u dus een tabel die twee rijen bevat en twee kolommen. Zie onderstaande afbeelding. Vervolgens voegen we de twee bovenste cellen samen tot één cel. Om dit te doen selecteert u beide cellen, klikt u met de rechtermuisknop in een van de geselecteerde cellen en kiest u voor Cellen samenvoegen. In onderstaande afbeelding ziet u het resultaat: 8 P a g i n a
We hebben nu dus een tabel met één cel op de eerste rij en twee cellen op de tweede rij. Vervolgens gaan we de te gebruiken afbeeldingen invoegen. Zorg ervoor dat de cursor in de bovenste cel staat, klik op de knop Afbeelding invoegen het volgende resultaat moeten hebben: en selecteer de afbeelding voor de bovenste cel. U zou nu Herhaal deze stappen voor eventuele andere afbeeldingen en dit is het resultaat: Om de uitlijning te realiseren die u hierboven ziet, klikt u per cel met uw rechtermuisknop en kiest u voor Eigenschappen cel. Hier kunt u de horizontale en verticale uitlijning aangeven per cel. Als u vervolgens van de rechtercel aangeeft hoe breed deze moet zijn (ook weer via Eigenschappen cel ) en u de tekst opgeeft in de opmaak die u wilt heeft u een template die er als volgt uit zou kunnen zien: 9 P a g i n a
Het template is nu klaar voor gebruik. 10 P a g i n a