MAGAZINiWeb

Ausgabe 2

- Widgets- Tipps und Tricks

- iWeb Seiten

- Apple Talk

Nützliche Seiten und iWeb-Hilfen

http://www.iweb-forum.deDie deutsche Nummer 1 unter den Hilfeforen zu iWeb. Hier findet ihr fast alles rund um iWeb, und bei neuen Themen wird, oft schnell nach Lösungen gesucht. Für iWebʻler ein absolutes Muss. Aktive Hilfe von Mitgliedern ist erwünscht, so kann jeder vom Anderen lernen.

2

http://iwebfaq.orgMehrsprachige Seite mit Tipps und Tricks zu iWeb. Grosse Link-Sammlung zu diversen Themen rund um iWeb. Ebenso wie ich Einzelkämpfer mit dem Anliegen anderen zu helfen.

http://www.iweb-hilfe.deSeite mit einer kleinen Auswahl an kostenlosen Tipps zu iWeb. Es lohnt auf jeden Fall, sich nützliche Infosʻs zu holen.

http://blog.schoenwandt.infoDer eigene Blog mit dem Hauptaugenmerk auf iWeb und die Internetgestaltung. Die Seite wird ständig mit neuen Tipps und Tricks zu den verschiedensten Techniken erweitert.

Ihr kennt weitere lehrreiche Seiten? - Schickt mir eine Mail, für neues bin ich immer offen!

3

Neues Layout und mehr

Layout:

Wie habe ich doch so schön in der ersten Ausgabe dieses Magazins geschrieben, „Aller Anfang ist schwer!“. Das gilt natürlich ebenso für mich und deshalb werde ich in dieser und in den nächsten Ausgaben am Layout des Magazins arbeiten. Ich werde herum probieren, bis mir das Resultat gefällt und dieses dann beibehalten. Sicherlich wird mit der Zeit das Eine oder Andere hinzukommen. Dieses wird jedoch die Zeit bringen und ich werde bestimmt noch interessante Themen finden, über die es sich lohnt zu schreiben.

Leserbriefe:

Wie in jedem anderen Magazin möchte ich in diesem ebenfalls eine Leserecke einrichten. hier sind eure Meinungen zu Artikeln oder sonstigen Dingen zum Magazin erwünscht.

Unter der Email Adresse

magazin@schoenwandt.info

könnt ihr ab sofort euer Meinung äussern und mitteilen welche Themen euch noch interessieren würden.

Themenvielfalt:

Was interessiert den Leser?

Das ist eine der wichtigsten Fragen die mich beschäftigen. Da ich in diesem Magazin für jeden etwas anbieten möchte, um es so interessant wie möglich zu gestalten, würde ich mich über Feedback freuen. Hauptthema ist, und wird iWeb bleiben doch auch Themen um iWeb und Apple herum sollen Platz finden und ein fester Bestandteil dieses Magazins werden. Also ran an die Tastatur und Wünsche äussern.

Autor gesucht:

Interesse am Schreiben?

Ich suche noch jemanden der ebenso wie ich Spass am schreiben hat und interessierter iWeb Nutzer ist. Hintergrundwissen zu iWeb, sowie allgemeine Techniken zum Internet wären von Vorteil. Bei Interesse einfach kurz eine Mail an dietmar@schoenwandt.infomit Beschreibung der Person, und vielleicht steht schon in der nächsten Ausgabe der erste eigene Artikel.

So, nun erst einmal genug und viel Spaß mit der zweiten Ausgabe des iWeb Magazins.

Euer

Didi

Herausgeber:Dietmar SchönwandtHalfesweg 3542651 Solingen

Mail:dietmar@schoenwandt.info

Internet:http://www.schoenwandt.infohttp://blog.schoenwandt.info

Leserbriefe:magazin@schoenwandt.info

Alle Magazine:

http://issuu.com/iwebmagazin

Neues zum Blog:

http://twitter.com/DidisBlog

WidgetsFlashanimationen in iWeb einbindenFlash ist zu einem festen Bestandteil von vielen Internetseiten geworden. Auf fast allen professionellen Seiten findet man bewegte Animationen, die das Erscheinungsbild der Seiten auffrischen. Gerade bei der Werbung auf Internetseiten wird diese Technik oft angewandt. Aber wie binde ich Flash-animationen richtig ein? In Verbindung mit einem kostenlosen Java-Script lassen sich Flash-Animationen sogar mit transparentem Hintergrund in die Seite einbinden, Wies geht? - Hier ist die Lösung

4

Google Analytics mit iWeb nutzenWer eine Webseite betreibt, ist natürlich auch neugierig, wie viele Besucher waren auf meiner Webseite, welche Seiten werden am meisten besucht und auch woher kommt der Besucher. Bei den so genannten Tracking Tools gibt es eine Vielzahl von Anbietern. Einer der bekann-testen kostenlosen Anbieter dürfte Google sein. Mit Annalytics bietet mir Google eine umfangreiche Auswertung der Besucher auf der eigenen Homepage an. Wie es geht, hier ist die Lösung.

HTML-Widget das unbekannte WeseniWeb bietet seit der Versionsnummer 2.x diverse Widgets zur Integration von externen Inhalten in die eigene Webseite. Das HTML-Widget ist eines davon. Doch was ist möglich und wie setze ich das Widget richtig ein?In diesem Artikel gehe ich näher auf die Möglichkeiten und Grenzen dieses Tools aus iWeb ein. Tipps und Tricks zum Widget und dessen Arbeitsweise.

Tipps und Tricks

Aller Anfang ist schwer - Teil 2 Im zweiten Teil der Serie „Aller Anfang ist schwer“ geht es wieder um iWeb und die Verwendung von dessen Vorlagen. In diesem Zusammen-hang werden wieder die Möglichkeiten der Anpassung der einzelnen Bestandteile erläutert und einige grundlegende Funktionen von iWeb erklärt. Als nächste Seiten nehmen wir uns die „Über mich“ und die „Fotos“ Vorlage zur Brust und werden diese Stück für Stück erklären und die Techniken der Seiten-Vorlagen erörtern.

ab Seite 6

ab Seite 9

ab Seite 12

ab Seite 13

5

Tipps und Tricks

iWeb Vorlagen anpassen - Teil 2. Als nächstes nehmen wir uns die Anpassung der iWeb eigenen Navigationsleiste zum Thema und zeigen die Möglichkeiten und die Techniken, welche hinter der in den Vorlagen verankerten Navigation von iWeb steckt. Farbe, Grösse und Schriftart der Navigationsleiste lassen sich in den Seitenvorlagen anpassen und so auf den eigenen Geschmack umändern.

iWeb SeitenVorgestellt!Die nächste Seite, welche ich vorstellen möchten, ist die Seite einer Pfadfindergruppe aus Sigmaringen. Die mit iWeb gestaltete Seite ist klar, übersichtlich und mit Liebe zum Detail gestaltet. Unter anderem kommen die Blogfunktion, sowie Fotoalben zum Einsatz.

Apple TalkDie Magie des fehlenden Rades - Erfahrungen aufgefrischtIn der letzten Ausgabe habe ich kurz meine Eindrücke zur neuen Magic Mouse von Apple veröffentlicht. Hier kommt der Nachtrag zum Bericht, wie schlägt sich die Mouse im täglich Einsatz.

ab Seite 16

ab Seite 19

Fundstück des MonatsInteressantes und Lustiges rund um Apple und dessen Produkte. In dieser Ausgabe das iPhone, was ein Nano war.

Fehler im iLife und iWork PaketSeit kurzem häufen sich im iWeb-Forum und in anderen einschlägigen Foren die Meldungen über Programme aus dem Hause Apple die sich entweder nicht öffnen lassen, oder abstürzen. Ist selten, doch kommt auch auf Macʻs vereinzelt vor. Hier ist die Lösung, wie man in diesem Fall vorgeht.

ab Seite 25

iPod Nano - kurzer Nachbericht zum kleinen AlleskönnerWas leistet die Video-Kamera im neuen iPod Nano. Top oder Flop?

wieder gefragt, wie es dieLeute geschafft haben, solche Dinge sogar mit transparentem Hintergrund in ihrer Seite einzu-binden. Wie immer kam mir der Zufall, sowie intensive Nachfor-schungen zur Hilfe. Wenn der Nachwuchs vor einem steht und fragt: „Wie geht das?“, dann ist es nicht immer so einfach eine Antwort zu finden und letztendlich versucht man dann doch zu helfen. Bei dem speziellen Fall, ging es um einen Charakter auf einer der Blizzard Seiten zum Spiel World of Warcraft. Im Quelltext der Seite fand ich dann auch den Schlüssel zum Glück. Das Java-Script „swfobject.js“ hat hier eine tragende Rolle. Schnell mal gegooglet und siehe da, dass Script wird nebst Code-Generator kostenlos auf der Google Seite angeboten. Unter der Adresse

http://code.google.com/p/swfobject/

findet man alles, was man zu seinem Glück braucht. Natürlich habe ich hierzu auch ein Demo, welches unter der Adresse

http://www.schoenwandt.info/test/flash.html

betrachtet werden kann. Im Anschluss folgt die dazu gehörige Anleitung.

6

Flashanimationen in iWeb einbinden

kostenlos, lassen sich schöne Dinge für die eigene Internetpräsenz erstellen. Doch der Glanz kann auch trügen. Internetseiten die komplett auf Flash basieren gelten nicht unbedingt als Suchmaschinen freundlich. Deshalb ist es sinnvoller Flashinhalte, also Animationen in der Seite zu integrieren. Hier gibt es die unterschiedlichsten Möglichkeiten der Integration von Flashanimationen. In der Vergan-genheit habe ich mich immer

Wer träumt nicht von ansprechend animierten Internetseiten. Je schicker und aufwendiger die Animationen, um so professioneller der Eindruck. Mit Flash lässt sich fast alles realisieren, damit Internetseiten zum Hingucker werden. Wäre da nicht der hohe Anschaffungspreis von 831,81 Euro für die Vollversion und die Komplexität des Programms von Adobe. Hier gibt es im Internet jedoch auch einige Dienste, welche den Geldbeutel schonen. Teils

Der Download

Auf der zuvor genannten Seite von Google findet man das Zip-Paket mit

dem Script, sowie dem Code-Generator für den benötigten HTML-Code. Hier empfehle ich den Generator im HTML-Format, da Adobe Air nicht auf jedem Rechner installiert ist. Nach dem Download und dem Entpacken der Archive, habe ich eine „index.html“, welche den Code-Generator darstellt und ein Verzeichnis „swfobject“, mit einigen Dateien. Hier runter befindet sich die wichtigste Datei, unser benötigtes Java-Script „swfobject.js“. Dieses Script und meine Flash-Animation (SWF-Datei) lade ich auf meinen Server. Die Adresse benötige ich

dann später beim Erzeugen desHTML-Codes. Der Code-Generator bietet mir viele Einstellungsmöglichkeiten, welche ich bisher noch nicht bis ins Detail ergründet habe. Dieses ist für das einfache Einbinden einer Flash-animation auch nicht nötig. Der Vorteil bei dieser Form des Einbindens ist, dass der Film nicht erst komplett geladen wird bevor er startet, sondern der Film läuft nach kurzem Laden des Anfangs und wird dann wie beim Streamen eines Filmes abgespielt und im Hintergrund nachgeladen.

Anleitung

7

Der Code-GeneratorDer Code-Generator gliedert sich in 3 Bereiche.

- SWFObject Configuration- SWF Definition- HTML Definition

Die in diesen Bereichen eingestellten Werte werden zum Generieren des Codes herangezogen. Nachfolgend gehe ich die einzelnen Punkte systematisch durch, damit jeder in der Lage ist, seinen eigenen Code zu erstellen.

- SWFObject ConfigurationIm ersten Feld dieser Rubrik geben wir den Speicherort des Java-Scripts an. Hier ist die komplette Adresse auf unserem Server anzugeben (inkl. http://), wo die Datei abgelegt wurde. Beispiel:http://www.seite.de/swfobject.js

Unter „Publishing method“ hat mannun die Qual der Wahl.

- Static publishing - oder - Dynamic publishing -.

Static publishing - hat den Vorteil, dass der Flashinhalt auch angezeigt wird, wenn kein Java vom Browser unterstützt wird oder nicht aktiviert ist. Ebenso wird der alternative Content über HTML-Code angezeigt. Standardmäßig ist hier ein Downloadlink für den Flashplayer im Code integriert.

Dynamic publishing - soll den Vorteil bieten, dass der so genannte „click-to-activate“ Effekt in diversen Browsern wie Opera ab Vers. 9 und im IE 6 und 7 nicht vorhanden ist. Die Browser unterdrücken aktive Inhalte auf Webseiten und aktivieren diese erst nach einem Klick. Bei meinem Test mit dem IE 8 unter Win XP habe ich von diesem Verhalten nichts gemerkt. Für mich ist die Methode - Static publishing - die glaube ich sinnvollste Einstellung im Generator.Im Feld „Detect Flash version“

stellt man die Version des Flashplayers an, welche mindestens installiert sein sollte, damit die Animation problemlos dargestellt werden kann. Die Versionsnummer ist abhängig von der Veröffentlichung des SWF-Datei. Die aktuellste Version findet man auf der Adobe Internetseite. Welche Version ich für die SWF-Datei benötige, bekomme ich vom Produzenten der Animation, ggf. vom mir selber.„Adobe Express Install“ bietet bei der Aktivierung eine Flash Installationshilfe für das Flash-plugin an, hierzu werden aber noch weitere Scripte aus dem Donwloadpaket benötigt. Dieses würde den Einen oder Anderen jedoch überfordern und deshalb lasse ich diese Funktion aus. Wer mehr erfahren möchte, kann auf der Google Seite oder in diversen Anleitungen im Netz nachlesen wie es geht.

haben ebenfalls einen transparenten Hintergrund. Alle anderen Parameter habe ich nicht getestet, lässt sich jedoch von jedem ausprobieren. loop - legt fest, ob der Film in einer Schleife läuft oder nicht.quality - erlaubt mir die Qualität der Animation einzustellen. Ich für meinen Teil nutze den Parameter autohigh, wodurch die Qualität automatisch durch die Internet-verbindung auf die höchst mögliche Stufe eingestellt wird.allowfullscreen - stellt ein, ob ich die Möglichkeit geben möchte, den Film in Vollbild anzuschauen. Alles in allem viele Einstellmög-lichkeiten für meine Animation. Wem dieses zu kompliziert ist und wer nur eine einfache Flash-animation integrieren möchte, kommt mit den Standardwerten allemal aus.

- HTML definitionIn diesem Bereich lässt sich manuell HTML-Code definieren, der angezeigt wir, wenn kein Flash unterstützt wird. Der Generator gibt hier bereits Code mit einem Downloadlink für das Flashplugin vor. Da auf fast allen Webseiten Flash verwendet wird, wird dieser wahrscheinlich selten benötigt.

8

flexibel, was die Grösse der Animation angeht. Flash content id - stellt den Bezug zu im HTML-Code stehenden Para-metern her. Für mich sind die Parameter - play, menu, wmode, loop, quality und allowfullscreen die wichtigsten Punkte in den Einstellungen. Wer mehr erfahren möchte, liest einfach in den Anleitungen nach.play - definiert über die Parametertrue und false, ob der Film automatisch startet oder nicht. True steht für ja, false für nein! menu - gibt an, ob ein in der Animation integriertes Menü aktiviert wird oder nicht (false / true).wmode - hier kann ich nun meine Transparenz einstellen. Diese funktioniert jedoch nur, wenn die Animation einen einfarbigen Hintergrund hat. Bilder im Film funktionieren nicht, es sei denn sie

- SWF DefinitionHier kommen nun die speziellen Parameter für die Flashanimation. Um alle Möglichkeiten einstellen zu können, erweitern wir das Feld durch einen klick auf das Feld more. Wie auch schon in der vorherigen Rubrik, sind alle mit * gekennzeichneten Felder Pflichteingaben, wobei diese aber bereits mit den Standard-einstellungen gefüllt sind.

Flash (SWF) - Der wichtigste Punkt ist natürlich die Adresse meiner SWF-Datei. Wie schon beim Java-Script muss man hier die komplette Internetadresse angeben. Dimensions - gibt die Grösse der eingebundenen Flash-Animation an. Ist die Flashdatei in den Abmes-sungen grösser als die Angaben im Generator, wird die Animation auto-matisch auf der Webseite an das Fenster angepasst. Hier ist man also

9

- Generated outputÜber den Button „Generate“ wird der Code mit den vorher eingestellten Parametern erstellt und braucht nun nur noch in ein HTML-Widget in iWeb eingefügt werden. Nachdem man den Code eingefügt und mit Anwenden bestätigt hat, wird einem bereits in iWeb das Resultat angezeigt. So kann ich die Position des Widgets noch verändern um die Animation an meine Seite anzu-passen. Nun noch die Seite veröffentlichen und fertig ist die professionell wirkende Webseite!

Google Analytics mit iWeb nutzenWebseite. Von einer Vielzahl an Anbietern habe ich mir Google Analytics heraus gepickt, da dieses als kostenloser Dienst eine grosse Anzahl an Auswertungen bietet. Andere Angebote aus diesem Bereich, sind durch die Anzahl der Besucher und der Auswertung beschränkt, Analytics bietet hier das komplette Programm.

um mehr Umsatz zu fahren. Doch nicht nur im geschäftlichen Bereich ist es interessant, welche Seite schauen meine Besucher am meisten an, oder welche Such-begriffe nutzen die Leute, wie kommen sie auf meine Seite, oder woher stammen die Personen, die sich für den Inhalt meiner Seite interessieren. Hier bieten so genannte Tracking Tools Aufschluss über die Aktivitäten auf meiner

Traue keiner Statistik, die du nicht selbst gefälscht hast. Für den einen ein Graus für den anderen ein absolutes Muss. Betreibe ich eine geschäftliche Seite, oder sogar einen Shop, so interessiert mich, was gefällt den Besuchern meines Shops, oder was kann verbessert werden,

AnleitungNach dem Anmelden, mit seinem Zugangsdaten gelangt man auf die Seite zum Konto erstellen, auf der man nun den vorgegebenen Schritten von Google folgt.

Als erste Aktion Klickt man den Button „Anmelden“. Nachdem man den Button betätigt hat, gelang man auf die nächste Seite, auf der die allgemeinen Angaben für das Tracking eingestellt werden. Hierzu gehört unter anderem der Name der Domain / Webseite.

In beiden Fällen gelang man auf die Analytics Seite. Hier meldet man sich bei dem Dienst mit seinem Benutzer-namen an, um ein Konto erstellen zu können.

Um Analytics von Google nutzen zu können, benötige man einen Google-Account. Wenn man seine Home-page bereits bei Google angemeldet hat, muss man sich für Analytics ein Konto erstellen. Hat man keinen Google-Account, kann man sich hier ebenfalls kostenlos registrieren. Dazu geht man entweder direkt auf

http://www.google.de/intl/de_ALL/analytics/

oder wählt auf der Google Seite

„Unternehmensangebote“ und geht dann weiter auf „Analytics“.

Nachdem man die Domain / URL eingetragen hat, gibt man noch einen Kontonamen für den Tracker an. Dieser ist frei wählbar und sollte den Namen für die Seite beinhalten, damit ich hinterher in den Statistiken besser differen-zieren kann. Nun wählt man noch das Land in dem man lebt, damit die Zeitzone richtig eingestellt ist und in den Auswertungen die richtigen Besucherzeiten stehen.

10

Subdomain - ist ein Dienst, den viele Provider anbieten. Dieses ist eine Unterdomain meiner Hauptdomain. Eine Subdomain erkennt man am Namen in der Adressleiste des Browsers. Mein Blog läuft unter einer Subdomain, in meinem Fall

http://blog.schoenwandt.info

Hier fällt das „www“ weg und wird durch den Namen ersetzt.

Auf jeden Fall sollte man in diesem Feld die Hauptdomain angeben, da nachfolgend noch eingestellt werden kann, ob man mit Subdomains arbeitet. Für die, denen der Name Domain und Subdomain nichts sagen, eine kurze Beschreibung der beiden Begriffe.Domain - hiermit ist der Seitenname gemeint, in meinem Fall

http://www.schoenwandt.info

11

Nachdem die Einstellungen durch-geführt wurden, kommt man durch den Button „Weiter“ auf die nächste Seite, auf der man noch einmal seinen Vor- und Nachnamen, sowie das Land angeben muss, aus dem man stammt. Und wieder geht es über den Button „Weiter“ zur Nächsten Seite. Hier wird man von Google aufgefordert die Nutzungs-bedingungen zu akzeptieren und den allgemeinen Geschäftsbedingungen zuzustimmen. Wenn man dazu bereit ist, setzt man das Häkchen unter den Bedingungen und kommt mit dem Button „Neues Konto erstellen“ zur Seite Tracking-Anleitungen.

man sein iWeb-Projekt, fügt in jeder Seite einen HTML-Baustein ein, und versieht diesen mit dem Trackercode von Analytics. Nach dem Veröffentlichen der geänderten Seiten, muss man noch etwas Geduld haben, da Google die Statistik der getrackten Seiten nur ein Mal pro Tag aktualisiert.

Also, nicht verzagen und der Dinge harren die da kommen.

erst einmal speichere. So habe ich es einfacher an den Code zu kommen, wenn ich diesen im Nachhinein benötige. Über den Button „Speichern und Fertig stellen“ legt man nun sein Konto zur späteren Analyse der Webseiten an. Dieses nicht vergessen, da sonst keine Analyse möglich ist.

Code in iWeb einpflegenUm den Trackercode nutzen zu können, muss man diesen nun in alle iWeb-Seiten, die überwacht werden sollen, hinein kopieren. Hierfür öffnet

Und schon sind wir fast am Ende des Erzeugens unseres ersten Trackers für die eigene Webseite. Jetzt folgen noch die Feinheiten für den HTML-Code. Im Bild oben, sehen wir die zuvor angesprochenen Möglichkeiten der Differenzierung mit der Haupt- und Subdomain. Je nach gesetzter Einstellung verändert sich der Code im Codefenster. Wenn ich alle Einstellungen durchgeführt habe kann ich den Code im Fenster kopieren und in die Seiten einsetzen.Als Sicherung des Codes erstelle ich mir eine Textdatei, in die ich den Code für später hinein kopiere und

den Seiten-Ordnern hinterlegt und werden automatisch benannt.

Beispiel:widget0_markup.html

Je mehr Widgets ich in meiner Seite integriert habe, um so mehr Seiten legt iWeb in den Seiten-Ordnern an und nummeriert diese durch. Eingebunden werden die Seiten jedoch nicht als iFrame sondern über Java-Script und HTML-Code, wobei, bei der Verlinkung jedoch das Verhalten wie in einem Frame reagiert. Mit ein bisschen HTML-Kenntnissen lässt sich die Hürde aber schnell überwinden.

12

absurd und übertrieben. iWeb ist in meinen Augen ein Programm, was für Anfänger und Profis, alles bietet um professionelle Webseiten zu erstellen. Ich gehe sogar soweit zu behaupten, mit iWeb kann ich schneller hochwertige Internetseiten erstellen als mit anderen, teuern Programmen. Das Programm ist leicht zu erlernen und der Workflow ist durch die Einbindung in das komplette iLife Paket Apple like.

Doch wie arbeitet nun der HTML-Baustein?

Eigentlich ganz einfach! iWeb erstellt pro eingefügtem HTML-Widget eine eigene Seite. Diese Seiten sind in

iWeb bietet seit der Version 2.x die Funktion, HTML-Code als Widget in einer Seite zu integrieren. Diese oft unterschätzte Funktion macht das Programm so flexibel wie jedes Profi-Programm. Leider wird iWeb oft nachgesagt, es wäre nicht für umfangreiche Web-Projekte geeignet, doch dieses halte ich für

HTML-Widget das unbekannte Wesen

wird. Hierzu müssen wir jedoch ein bisschen in HTML eintauchen, um dieses etwas besser zu verstehen.Was ist HTML?HTML ist nichts anderes als eine Programmiersprache, mit der etwas dargestellt werden kann. Unser Browser liest die Code-zeilen aus dem Internet und setzt diese dann um. Arbeite ich nun mit so genannten Frames (Fenstern),

automatisch an diese Angaben an.Habe ich in dem HTML-Code Links integriert, so muss ich diese gegebenenfalls anpassen. Da wir hier wie bereits angesprochen mit Frames arbeiten, wird der Browser den Link auch in diesem Frame öffnen, sollten wir dieses nicht durch den „target“ Befehl anders definiert haben. In der Code-Sprache HTML kann ich über den „target“ Befehl angeben, wo mein Link angezeigt

Doch erste einmal wie benutze ich das HTML-Widget?Habe ich iWeb geöffnet, gehe ich zu der Seite, in der ich den HTML-Baustein einfügen möchte. Sollten mir die Widgets noch nicht angezeigt werden, dann öffne ich als erstes das Medien-Menü.

Im Medienmenü, welches rechts erscheint, wähle ich aus den oberen Reitern „Widgets“. Hier werden mir nun alle in iWeb integrierten Widgets angezeigt. Da wir ein HTML-Baustein nutzen möchten, ziehen wir das Widget mit gedrückter Maustaste auf unsere Seite und lassen die Maus-taste los. Hier erscheint nun der Platzhalter meines Widgets und das Fenster in dem ich den HTML-Code eingeben kann. Möchte ich den Code anwenden, betätige ich mit dem selbsterklärenden Button „Anwenden“ um das Widget zu benutzen. Bin ich mit dem Internet verbunden und der eingetragene HTML-Code ist richtig, wird mir das Ergebnis live und in Farbe angezeigt. Sind im Code Grössenangaben, z. B. für einen Flashfilm oder sonstiges, dann ist iWeb sogar so intelligent und passt die Fenstergrösse des Widgest

13

dann habe ich unterschiedliche Bereiche, die letztendlich meine Seite ergeben. Diese Frames werden über das Frameset definiert, was die Grössen der einzelnen Frames angibt. Habe ich die Navigation im einen Frame und den Darstellungsbereich in einem anderen Frame, dann muss ich natürlich sagen, wo soll was dargestellt werden. Dieses lässt sich alles über den HTML-Code steuern, würde hier aber zu weit führen, und deshalb beschäftigen wir uns nur mit dem „target“ Befehl. Doch wie sieht dieser aus und was für Möglichkeiten habe ich mit diesem?Betrachten wir uns einmal ein Beispiel zu einem Link-Befehl an.

href="http://www.schoenwandt.info/ich/index.html" target="_top"

Also, wenn ich nun einen Link in meinem Widget integriert habe, muss ich definieren, wo dieser dargestellt wird. Soll ein neues Browserfenster geöffnet werden, benutze ich target=“_blank“ und wenn ich in meinem aktuellen Browser-Fenster darstellen möchte, nutze ich target=“_top“.

Dieses Beispiel zeigt mir, wenn ich mich ein wenig mit HTML auskenne, habe ich in iWeb alle Möglichkeiten um auch Seiten mit Frames zu erstellen, auch wenn diese nicht gerade als Suchmaschinen freundlich gelten.

Hier fällt uns hinter dem eigentlichen Link der Befehl target="_top" auf. Zu diesem Befehl gibt es mehrere Parameter:_top, _self, _blank und _parent, welche unser Sprungfenster definieren.

- _top verweist auf das oberste Frame, meine Hauptseite.

- _self verweist auf das gleiche Frame in dem der Link steht.

- _blank verweist auf ein neues Browserfenster.

- _parent verweist auf das übergeordnete Frame hin.

Aller Anfang ist schwer - Teil 2einige grundlegende Funktionen von iWeb erklärt. Als nächste Seiten nehmen wir uns die „Über mich“ und die „Fotos“ Vorlage zur Brust und werden diese Stück für Stück erklären und die Techniken der Seiten-vorlagen erörtern.

Im zweiten Teil der Serie „Aller Anfang ist schwer“ geht es wieder um iWeb und die Verwendung von dessen Vorlagen. In diesem Zusammenhang werden wieder die Möglichkeiten der Anpassung der einzelnen Bestandteile erläutert und

Seitentext, bietet die „Über mich“ Vorlage ein vorgefertigtes Feld mit persönlichen Angaben zur Person. Entweder aktualisiere ich die Angaben und gebe meine Daten ein, oder ich lösche Dinge, die ich nicht angeben möchte. Bei diesem Feld handelt es sich um ein normales Textfeld. Hier kann ich nach belieben Text löschen, hinzufügen oder abändern und formatieren. Die einzelnen Funktionen hierfür haben wir bereits im ersten Teil erörtert. Also ran ans Editieren und fertig ist unsere Seite. Natürlich lassen sich hier auch eigene Dinge hinzufügen, oder komplett umgestalten. Der eigenen Kreativität sind keine Grenzen gesetzt.

14

Die „Über mich“ Vorlage bildet die Image Seite meines Web-Projektes. Möchte ich der Welt etwas über mich mitteilen, dann ist diese Vorlage genau richtig um etwas über meine Person zu erzählen. Ob und wieviel ich über meine Person preisgebe bleibt hierbei mir überlassen, doch sollte man bedenken, ist die Seite einmal veröffentlicht, dann hat jeder Mensch auf der Welt zugriff auf meine Daten. Ist man auf der Suche nach einem neuen Job, sollte man gut überlegen was man ins Netz stellt. Doch lassen sich mit einer Imageseite, auch seine positiven Eigenschaften darstellen, alles eine Frage der Gestaltung. Nun zurück zur Vorlage. Neben den aus dem ersten Teil bekannten Platzhaltern für die Überschrift, dem Titel und dem

Fotos in meiner Seite integrieren, dann ziehe ich die Fotos aus dem Medienmenü in meinen Platz-halter. Möchte ich hingegen alle Bilder aus einem iPhoto-Album einfügen, ziehe ich das Album auf den Platzhalter, fertig. iWeb holt sich alle Fotos aus der Bibliothek und fügt diese als Vorschaubild in meine Fotoseite ein.

Klickt man nun auf ein Bild in dem Platzhalter, öffnet sich das Ein-stellungsfenster für das Foto-raster. Als erstes wähle ich nun den Albumstil, hier habe ich die gleichen Rahmen zum maskieren der Bilder, wie wir sie bereits aus den vorherigen Vorlagen kennen. geöffnet sein, gehe ich wie bereits

beim HTML-Baustein vor und aktiviere dieses über die Auswahl in iWeb.

Im den oberen Reitern wähle ich nun „Fotos“. Hier werden mir alle Dateien aus meiner iPhoto Bibliothek angezeigt. Möchte ich nun einzelne

„Fotos“ heisst die nächste Vorlage mit der ich ganz einfach per Drag and Drop Fotoseiten mit integrierter Diashow erstellen kann. Die allge-meinen Platzhalter, die bei jeder Vorlage vorhanden sind, gibt es natürlich auch bei dieser. Doch die Felder Überschrift, Titel und den Seitentext brauchen wir nicht mehr erläutern. Neu ist hingegen der Platz-halter für die Fotos, welche ich ent-weder aus dem Finder oder aus dem Medienmenü in die Vorlage ziehe. Sollte das Medienmenü nicht

15

Hat man bereits Rahmen in seinem Layout der übrigen Seiten verwendet, lässt sich über diese Einstellung auch die Fotoseite bequem an den Stil der Homepage anpassen. iWeb übernimmt die Maskierung mit dem Rahmen automatisch für alle anderen Bilder. Es ist nicht möglich unterschiedliche Rahmen in einem Platzhalter zu verwenden.

Über die Einstellung „Spalten“ hat man die Möglichkeit anzugeben, wieviel Fotos nebeneinander angezeigt werden. Möglich sind von einem bis sechs Fotos. Bei dieser Funktion passt iWeb die Grösse der Vorschaubilder dementsprechend an. Über den Schieberegler „Abstand“ steuert man die Distanz zwischen den Bildern und zum Rand.„Fotos pro Seite“ ist selbstredend. Wenn ich eine höhere Stückzahl an Bildern habe, als die, die eingestellt ist, so legt iWeb automatisch weitere Seiten innerhalb des Platzhalters an und erstellt ein Navigationsmenü zu den einzelnen Seiten.

Jedes Foto hat unter sich Textzeilen, die über die Funktion „Untertitelzeilen“ gesteuert werden kann. Die Einstellung reicht von einer bis zu sieben Untertiteln. Die Text-formatierung dieser kann ganz normal über die iWeb eigenen Ein-stellungen durchgeführt werden. Schriftart, Farbe und Grösse lassen sich für jedes Bild einzeln einstellen. Möchte man jedoch alles auf einmal umstellen, dann wählt man bei gedrückter Shift- oder Cmd-Taste die zu ändernden Fotos und nimmt dann die Einstellungen vor. Hier funk-tioniert sowohl Text-Farbe, sowie Schriftart und Grösse. Doch auch wenn man den Rahmen des

Artikel passt und was ich direkt weitergeben konnte. Wenn ich einen RSS-Feed zum Fotoalbum bereitstellen möchte aktiviere ich das Häkchen „Abonnieren für Besucher zulassen“.Abonniert jemand den RSS-Feed, dann wird er automatisch informiert, wenn ein neues Foto zur Sammlung hinzukommt.Der zweite Bereich „Kommentare“ ist nur für MobileMe-Nutzer. Ebenso wie die Kommentar-Funktion in der Blog- und der Podcast-Vorlage funktioniert diese nur in Verbindung mit dem Apple-Server, MobileMe.- Kommentare zulassen aktiviert

die Kommentarfunktion für meine Fotoseite. Besucher der Seite können so Kommentare zu den einzelnen Fotos hinterlassen.

- Anhänge zulassen bietet dem Kommentarschreiber die Möglichkeit, Dateien an den Kommentar anzuhängen, der von jedem Besucher der Seite heruntergeladen werden kann.

Eine Sicherheitsabfrage beim Erstellen eines Kommentars verhindert automatisch erstellte Spamnachrichten. Die Kommentare können in iWeb, sowie in jedem Browser zu jeder Zeit entfernt werden. Die Dateianhänge werden auf der iDisk des MobileMe Accounts abgespeichert.

- Kommentaranzeige einblenden gibt vor, ob die Kommentare auf der Webseite angezeigt werden oder nicht. Wer Kommentare zulässt, will sicherlich, dass diese auch angezeigt werden. Also sollte man hier das Häkchen nicht vergessen. Über diese Option werden die Kommentare direkt unterhalb des Seiteninhaltes angezeigt und in der Seite integriert. Einige Pfiffige nutzen die Blog-Vorlage mit der Kommentarfunktion als Gästebuch. Aber wie schon aufgeführt, lässt sich dieses nur mit einem MobileMe Account bewerkstelligen.

Platzhalters auswählt lassen sich dem Rahmen, diverse Eigenschaf-ten, sowie die Textformatierung aller im Platzhalter befindlichen Fotos zuweisen. Also, alles schnell und einfach zu steuern, so wie man es von Apple gewohnt ist!Die Grösse des Platzhalters unserer Fotoseite wird automatisch durch die Anzahl der Bilder in diesem gesteu-ert. Hier treffen wir wieder auf die dynamische Anpassung der Seiten-höhe, welche iWeb automatisch vornimmt. Die Breite unseres Platzhalters ist von iWeb auf eine minimale Breite von 500 px, und einer maximalen Breite in der Grösse der Seitenbreite begrenzt. Die aufgeführten Einstellungen betreffen nun den Platzhalter direkt, weitere Anpassungen lassen sich jedoch noch im Infobereich unter „Informationen für Fotos“ vornehmen.

Betrachten wir uns die Abbildung, dann gibt es zwei Bereiche.

- Fotos gemeinsam nutzen- Kommentare

Im ersten Bereich lässt sich der Dateizugriff regeln. Möchte man seine Bilder zum Download bereit-stellen, so kann man hier justieren, in welcher Qualität, oder wie abgebildet „ohne“, also kein Download möglich. Hier war ich immer davon ausge-gangen, es seien die Qualiätseinstel-lungen der Bilder auf meiner Homepage. Im iWeb-Forum hatten wir vor kurzem jedoch die Frage wie man den Download deaktivieren kann. So habe ich wieder etwas dazu gelernt, was zufällig in diesen

- Untertitel einblenden aktiviert die im Platzhalter definierten Untertitel zu den Bildern.

- Bildschirmfüllend lässt die Diashow automatisch im Vollbild-Modus ablaufen.

- Seitenhintergrund definiert die Hintergrundfarbe meiner Diashow.

Das warʻs für diese Ausgabe, im nächsten Magazin geht es dann mit der „Meine Alben“ und „Film“ Vorlage weiter.

Also, nicht verpassen!

16

Zu guter Letzt widmen wir uns noch der iWeb eigenen Diashow.Möchte ich meine Fotos als eigenständig laufende Diashow anbieten, dann setze ich den Haken bei „Diashow aktivieren“. Ist der Haken gesetzt, kann ich in den weiteren Einstellungen die Übergänge bestimmen und das Erscheinungsbild ändern.

- Spiegelung einblenden aktiviert eine Spiegelung unter den Bildern in der Diashow.

entweder die alte Datei abändern oder eine neue Vorlagendatei kreieren. Wenn eine bestehende Vorlage abändern möchte, sollte ich auf jeden Fall eine Sicherheits-kopie dieser erstellen, damit ich immer zum Urzustand zurück kehren kann. Möchte ich eine neue Vorlage erstellen, dann kopiere ich eine Wunschvorlage und benenne diese nach meinen Vorstellungen um. Nachfolgend wird beschrieben, wie hier vorge-gangen werden muss .

Im ersten Teil haben wir gelernt, wo die Vorlagedateien von iWeb ver-steckt sind. Als nächstes nehmen wir uns die Anpassung der iWeb eigenen Navigationsleiste zum Thema und zeigen die Möglichkeiten und die Techniken, welche hinter der in den Vorlagen verankerten Navigation von iWeb steckt. Farbe, Grösse und Schriftart der Navigationsleiste lassen sich in den Seitenvorlagen anpassen und so auf den eigenen Geschmack umändern. Möchte ich eine Vorlage ändern, dann kann ich

iWeb Vorlagen anpassen - Teil 2.

AnleitungIm Code der Datei finden wir die folgenden, wichtigen Codezeilen:

<dict><key>DisplayName</key><string>Schwarz</string><key>PageDisplayNames</key><dict>

Der rote Text ist der Theme-Titel, den iWeb in der Auswahl anzeigt. Diesen ändern wir in den Namen, wie unser Theme in iWeb ange-zeigt werden soll und speichern die Änderung des Titels ab.

Als zweites ist nun die Datei "index.xml.gz" zu ändern. Hierbei handelt es sich um eine gepackte Zip-Datei, die man als

"German.lproj". In diesem Ordner befinden sich die Dateien "DisplayNames.plist" und "index.xml.gz". Als erstes öffnen wir die Datei "DisplayNames.plist" mit dem Texteditor.

Wir gehen davon aus, dass wir eine eigene Vorlage erstellen wollen. All diejenigen, die eine Vorlage ändern wollen, können diesen Teil über-springen und auf Seite 17 „Seiten-vorlagen“ weiterlesen.Als erstes muss ich dafür sorgen, dass iWeb meine Vorlage erkennt und diese in der Themenauswahl im Programm anzeigt. Hierfür sind zwei Änderungen an Dateien im Webtheme notwendig. Wir gehen davon aus, dass das Webtheme bereits kopiert und umbenannt wurde. Über einen Rechtsklick auf das Webtheme lasse ich mir den Paketinhalt anzeigen.Im Paket des Webtheme befinden sich die einzelnen Landes-Ordner, für Deutschland heißt dieser

17

erstes durch einen Doppelklick entpackt. Nun habe ich zwei Dateien, die Original "index.xml.gz" und die entpackte "index.xml".

Die Datei "index.xml.gz" lösche ich entweder, oder benenne diese um. Wenn ich auf Nummer sicher gehen möchte, ändere ich den Namen in "index.xml.gz.old", dann habe ich immer noch ein Sicherheitskopie meines Originals. Die Dateiendung ".gz" darf auf keinen Fall stehen bleiben, den iWeb nimmt als erstes immer die Datei mit der Endung ".gz"!

Die Datei "index.xml" wird nun mit dem Texteditor geöffnet, hier finden wir den folgenden Code:

Beispiel:

<bl:theme bl:version="1.0" sf:name="theme">

Den Code - version="1.0" kann man nun beispielsweise in version="Eigene" ändern, dieses wird später in der Themen-Auswahl im Dropdown-Menü angezeigt und so kann man schneller differenzieren, welches Theme ist von mir und welches ist ein Original. Dieses würde ich empfeh-len, ist aber kein absolutes Muss! Nach der vorgenommenen Änderung

müssen wir die Datei speichern und das geänderte Theme erst einmal in das iWeb-Paket kopieren. Nach dem Neustart von iWeb schauen wir nach, ob das eigene Theme in der Auswahl erscheint. Diesen Schritt würde ich testweise durchführen, um zu sehen, ob ich die Möglichkeit habe eine neue Seite anhand der eigenen Vorlage zu erstellen. Nicht verwundert sein, wenn in der Vorlagenansicht weiße Seiten angezeigt werden. Im iWeb-Paket existiert neben dem Ordner „Themes“ noch der Ordner

„thumbnails“. In diesem liegt für jede Vorlage ein Ordner mit den Vorschaubildern. Lautet der Name meines Themes „Black“, dann heisst der Odner dazu ebenfalls „Black“. Hier kann ich den Ordner des Originals duplizieren und in den Namen meines Themes umbenennen. Beim nächsten Neustart von iWeb sollte das Programm nun auch die Vorschaubilder des Themes anzeigen. Wenn nicht, beide Namen noch einmal miteinander vergleichen.

Seitenvorlagen beinhalten den Code, welcher die Grösse, Farbe, Schriftart, Ausrichtung und Mouse-over Funktionen definiert. Um das Aussehen aller Seiten gleich zu haben, ändern wir eine Vorlage, bis diese unseren Vorstellungen entspricht und setzen den Code dann in alle anderen Vorlage-seiten ein. Doch wo finden wir die Vorlageseiten, und wie sehen diese aus?Hierzu schauen wir uns wieder den Paketinhalt unseres Theme mit einem Rechtsklick an und suchen nach dem Ordner

„Shared“

Ist dieser gefunden, haben wir auch schon Zugriff auf die Seiten-Vorlagen.

die Suchfunktion und suche nach „navbar-css“ im Code der XML-Datei. Die folgenden Code-zeilen zeigen den XML-Code für die Navigationszeile in meiner Vorlage. Um die Sache zu verein-fachen, würde ich die Codezeilen kopieren und in ein leeres Dokument einfügen. Dieses wird dann um einiges übersichtlicher als in der kompletten Vorlage. Außerdem habe ich dann direkt meinen geänderten Code, welchen ich in den anderen Seiten-Vorlagen verwenden kann.

18

ändere die Originale wie mit der Datei "index.xml.gz" bereits praktiziert.Doch wie komme ich nun an den Code um die Navigationsleiste anzupassen?

Hierfür öffne ich die zu ändernde Datei mit dem Texteditor und aktiviere über das Menü

Bearbeiten - Suchen - Suchen

oder die Tastenkombination

Apfel/cmd + F

Im Ordner „Shared“ befinden sich alle relevanten Bild- und Video-dateien, sowie die acht Seitenvorlagen unseres Webthemes:

- About Me.xml.gz- Blank.xml.gz- Blog.xml.gz- Movie.xml.gz- My Albums.xml.gz- Photos.xml.gz- Podcast.xml.gz- Welcome.xml.gz.

Wie bereits zuvor, entpacke ich die Dateien durch einen Doppelklick und

Code anpassen:Der maßgebliche Codeblock sieht in etwa so aus:

<bl:navbar-css><bl:string sfa:string=".navbar {&#10;&#9;font-family: Arial, sans-serif;&#10;&#9;font-size: 1em;&#10;&#9;color: #A1A1A1;&#10;&#9;margin: 9px 0px 6px 0px;&#10;&#9;line-height: 30px;&#10;}&#10;&#10;.navbar-bg {&#10;&#9;text-align: center;&#10;}&#10;&#10;.navbar-bg ul {&#10;&#9;list-style: none;&#10;&#9;margin: 0px;&#10;&#9;padding: 0px;&#10;}&#10;&#10;&#10;li {&#10;&#9;list-style-type: none;&#10;&#9;display: inline;&#10;&#9;padding: 0px 10px 0px 10px;&#10;}&#10;&#10;&#10;li a {&#10;&#9;text-decoration: none;&#10;&#9;color: #A1A1A1;&#10;}&#10;&#10;li a:visited {&#10;&#9;text-decoration: none;&#10;&#9;color: #A1A1A1;&#10;}&#10;&#10;&#10;li a:hover&#10;{&#10;&#9;text-decoration: none;&#10; &#9;color: #eee;&#10;}&#10;&#10;&#10;li.current-page a&#10;{&#10;&#9;text-decoration: none;&#10;&#9; color: #fff;&#10;&#9;font-weight: bold;&#10;&#10;}"/></bl:navbar-css>

Wir zerpflücken die Codezeile Stück für Stück und nehmen uns die wichtigsten Bestandteile zur Brust.

1. Die Font-/Schriftart. Hier kann ich in die gewünschte Schriftart ändern, sollte aber berücksichtigen, dass ich am besten websicher Schriftarten wähle.

2. Die Fontgröße. iWeb gibt diese mit dem Faktor „1em“ an. Dies ist der Zoomfaktor 1=100%. Möchte ich die Schrift verkleinern setze ich den Wert z. B. auf „ .8em“. Den richtigen Wert würde ich anfänglich bei der ersten Vorlage ermitteln und später weiter verwenden.

3. Die Schriftfarbe. Die erste Farbangabe ist die Standardfarbe der Navigationsleiste. iWeb gibt diese im 6-stelligen Hex-Code an, welchen ich mir in allen gängigen Bildbearbeitungs-programmen anzeigen lassen kann.

4. Die Abstandsanpassung. Hier kann ich iWeb sagen, welchen Abstand der Text voneinander haben soll (Pixelangabe „margin“ ober- und unterhalb vom Text sowie „padding“ vor und hinter dem Text).

5. Die Größenanpassung. Hier kann ich die Höhe des Navigationsleistenfeldes einstellen. Natürlich kann das Feld nur im Zusammenspiel mit der Texthöhe verkleinert werden. Hat der Text eine Höhe von 20 px, kann ich die Höhe des Feldes nicht auf 15 px stellen, das funktioniert nicht.

6. Die Textausrichtung. Hier kann ich iWeb angeben ob die Ausrichtung der Navigationsleiste mittig (center), rechtsbündig (right) oder linksbündig (left) sein soll.

7. Die Textdekoration. Unterstrichen (underline) und ein Strich über dem Text (overline). Hier gibt es sicherlich noch andere Arten, doch ob diese mit iWeb funktionieren, kann ich nicht beantworten. Aber wie heisst es doch so schön: “Probieren geht über studieren!“

8. Die Codezeilen für die einzelnen Linkzustände beginnen jeweils mit „li a“. Ohne Zusatz (grüne Zeile) steht für den Standard Linktext. „li a:visited“ steht für die bereits besuchten Seiten, „li a:hover“ steht für den Mouseover Effekt, also wenn ich mit der Maus über den Link gehe. „li.current-page“ steht für die gerade aufgerufenen Seite. Warum der Code von den anderen Zeilen differiert kann ich nicht sagen, wird aber seinen Grund haben.

19

Betrachten wir uns noch einmal die Vorlage vor der Anpassung der Navigation.

Hier sehen wir, die Menüpunkte sind mittig zentriert und die Höhe des Navigationsfeld beträgt 45 px. Ich werde die Menüleiste so anpassen, dass der Text linksbündig ausgerichtet ist und die Texthöhe 2 Menüzeilen ermöglicht. Hierzu ändere ich die Schriftgrösse font-size: 1em in font-size: .8em und den oberen und unteren Abstand margin: 9px 0px 6px 0px setze ich auf margin: 1px 0px 1px 0px. Den Platz zwischen dem Text ändere ich von padding: 0px 10px 0px 10px auf padding: 0px 5px 0px 5px. Nun fehlt noch die Feldhöhe welche ich von line-height: 30px auf line-height: 20px reduzieren und die Text-Ausrichtung setze ich von text-align: center auf text-align: left. Nach der Anpassung sieht die navigationsleiste dann so aus:

Dieses Beispiel ist sicherlich überzogen, doch zeigt es auf Anhieb die Möglichkeiten der Anpassung. Wir sehen auch iWeb kocht nur mit Wasser und mit ein bisschen Mut lässt sich aus dem Programm und dessen Vorlagen noch mehr rausholen.

In der nächsten Ausgabe geht es weiter, hier werden wir dann näher auf die Gestaltung eines eigenen iWeb-Theme eingehen und das dazugehörige Hintergrundwissen vertiefen.

iWeb-Seite vorgestellt

Die nächste Seite, welche ich vorstellen möchten, ist die Seite der Royal Rangers, einer Pfad-findergruppe aus Sigmaringen. Die mit iWeb gestaltete Seite ist klar, übersichtlich und mit Liebe zum Detail gestaltet. Unter anderem kommen die Blogfunk-tion, sowie iWeb Fotoalben zum Einsatz. Daniel Rempel der Verantwortliche für die Seite ist gelernter Mediengestalter im Fachbereich Digitaldruck. Er fand die Idee sich und seine Seite vorzustellen so gut, dass er keine Mühen gescheut hat und auf den folgenden Seiten über seine Person und seine Seite berichtet. Von mir vielen Dank für die tolle Mitarbeit von Daniel.

sonstige Techniken gelernt. Daher war ich auch sehr begeistert als ich Apple, iLife und darüber iWeb kennen gelernt habe. Meine Ausbildung habe ich als Medien-gestalter im Fachbereich Digitaldruck absolviert. Vor 4 Jahren habe mich dann jedoch als Herbalife Berater Selbständig gemacht. Meine geschäftliche Seite lautet:www.gute-ernaehrung.info. Mit dem Mac kam ich also schon wärend meiner Ausbildung in Berührung. Vor 4 Jahren habe ich mir dann zur Hochzeit mein erstes Macbook gekauft und bin durch ein paar Apple Aktien auch mehr und mehr begeisterter Apple Fan geworden. Sehr begeistert von Apple bin ich von dem Gedanken, alles so einfach wie möglich zu gestalten und dabei ein zeitloses Design zu entwerfen. Persönlich habe ich keine Seite, aber ich betreute als Mitarbeiter einer Pfadfinderarbeit die Vereinsseite. Also dann, auf zur Vorstellung meiner gestalteten Seite.

20

gestalten, weil außer Ideen, ein bisschen grafische Kenntnissen es immer an fehlendem technischen Wissen gehapert hat. Ich selber habe nie HTML programmieren oder

Daniel Rempel, 31 Jahre jung und schon in Jugendzeiten immer von Grafikdesign begeistert gewesen. Dennoch kam ich erst vor 1,5 Jahren dazu meine erste Homepage zu

Zur Person

Vereinsseite www.rr63.de Bundesseite www.royal-rangers.de

Also Royal Rangers gehören wir deutschlandweit eher zu einer der größeren Pfadfindergruppe.Die Seite www.rr63.de ist jetzt ca. 1,5 Jahre online, unverändert und erst jetzt so langsam bereite ich mich zum Ende des Jahres darauf vor, einiges zu verändern. Denn durch das Verhalten der Besucher, deren

Zur Seitewaren schon sehr vielsagend, 140 Besucher, 30 Wiederkehrende und ca. 900 Seiten wurden ermittelt. Dies war für mich schon eine positive Überraschung, angesichts unserer doch sehr kleinen Zielgruppe, und der sehr seltenen Erneuerungen bzw. Updates der Seite.

Ziel der Homepage ist es, uns als Pfadfinder vorzustellen und die Seite bei unserer Öffentlichkeits-arbeit werbewirksam zu nutzen. Hier möchten wir durch unsere Bilder und Berichte zeigen, was wir als Pfadfinder spannendes erleben und als Verein leisten.

Feedback, Wünsche und Ratschläge werde ich einige Sachen optimieren. Zielgruppe: Wir sind etwa 90 Kinder im Alter von 7-17 Jahre und ca. 20 Leiter im Alter vom 18-50 Jahre. Unser Verein ist daher intern erst einmal die wichtigste Zielgruppe. Die Eltern der Kinder, Interessierte aus der Stadt und Umgebung sind hier eher zweitrangig und der kleinere Hauptaugenmerk. Da wir in über 400 Städten und verschieden Stämmen vertreten sind, besuchen auch befreundete Pfadfinder unsere Seite immer mehr. Erst durch eine neue und verbesserte Webstatistik (auch von Didi übernommen), konnte ich das Verhalten und die reale Besucherzahl in den letzen 4 Wochen ermitteln. Die hier gewonnenen Erkenntnisse

21

Startseitewieder Probleme mit der Darstellung von Schatten in Browsern gibt, habe ich mich dafür entschieden, ein Bild mit hinterlegtem Schatten einzusetzen und siehe da, alle Browser sollten es richtig darstellen können. Erzeugt habe ich die Grafik mit einer Rahmen-Vorgabe aus iWeb.Kernelement auf allen Seiten ist das Headbild.

Hier verwende ich ausschliesslich Bilder von unseren Pfadfinder-aktionen die ich selber fotografiert habe. Ein gutes Bild sagt mehr als tausend Worte oder ganze Internetseiten. So glaube ich einfach, dass alleine solch ein Bild einen guten Eindruck über uns als Pfadfinder vermittelt. Die Menüleisten bestehen aus Grafiken die auf Seiten in meinem iWeb-Projekt verlinkt sind. Ein kleiner Begrüßungstext war uns am Anfang wichtig, wird aber in Zukunft vielleicht eher aus Platzgründen auf der Startseite weggelassen.Die kleinen Vorab-Informationen auf der rechten Seite als Hinweis zu den aktuellen Aktionen und Bildern haben sich als sehr nützlich erwiesen. So kann ich den Besuchern die aktuellsten Informationen direkt zugänglich machen und erleichtere Ihnen die Navigation auf der Seite. Für alle anderen Dinge gibt es die statische Navigation über das Menü auf den Seiten. Durch das erste Erscheinungsbild und die Schnellauswahl kann ich den Besucher etwas beeinflussen. Die ersten paar Sekunden auf der Startseite beeinflussen eben sehr stark und entscheiden über den weiteren Verbleib auf der Seite.

Durch einen Freund, der zu mir sagte, er möchte beim öffnen einer Internetseite alles auf einen Blick finden, bin ich auf die Idee gekommen, die Startseite so zu gestalten, dass diese ohne scrollen im Browser dargestellt wird. Der Gedanke hat mich nie wieder losgelassen, auch wenn ich langsam

merke, dass ich doch mehr Platz auf der Startseite gebrauchen könnte. Nun ja, schauen wir mal, wie sich das in der Zukunft umsetzen lässt.Seitenaufbau:Ich habe eine leere Seite genommen und die Navigationsleiste ausge-blendet. Da es, wie schon oft im iWeb-Forum beschrieben, immer mal

Seitenelemente

Kopfgrafik

Seitengrafik

Das Design und Seitenlayout ist auf allen Seiten identisch. Die Terminseite ist verhältnismäßig einfach aufgebaut. Die einzelnen Monate wurden mit einfachem Textrahmen erstellt und ausge-richtet. Was auf einigen Seiten zusätzlich eingerichtet wurde, sind Untermenüs zu den Hauptbe-reichen. Diese befinden sich jeweils auf der linken Seite, da ich technisch keine Dropdown-Menüs erstellen kann und iWeb dieses leider nicht bietet. Hier habe ich mir einfach wieder manuell geholfen und über Textlinks auf andere Seiten verwiesen. Mittlerweile gibt es zu Dropdown-Menüs wohl schon Anleitungen im iWeb-Forum.

22

Termine

InfosHier gibt es grundsätzliche Informationen über unseren Verein und über, die Jugendarbeit unserer evangelisch-pfingstlichen Freikirche.Auch auf dieser Seite ist wieder ein Untermenü integriert über welches Unterseiten, aufgerufen werden können. Weiter gibt es Hinweise zu unserer Bundesseite. Im Laufe der Zeit kommen weitere wichtige Informationen hinzu, die ich über das Untermenü leicht in die Seite einpflegen kann.

Aufbau

Auf dieser Seite wird herausge-arbeitet wer wir als Pfadfinder sind und was uns von anderen Pfadfindern unterscheidet. Erst jetzt ist mir aufgefallen, dass es viel zu viele Informationen sind, so dass ich beim nächsten Update auch einiges einfacher gestalten und weniger Inhalt möchte. Selbst für neue Besucher die uns nicht kennen erscheint der Inhalt der Seite als viel zu viel. Da heißt es wieder: „Weniger ist mehr!“

23

Aktionenpraktizieren. Dazu habe ich die Blog-Vorlage von iWeb genommen und letzten Endes mit Inhalt gefüllt. Doch auch ohne Kenntnis von HTML empfinde ich, dass die Blog-Eigenschaften von iWeb die Seite sehr verlangsamt. Ich weiß nicht, ob es an der technischen Umsetzung von iWeb liegt.In Zukunft werde ich aber ohne die Blog-Seitenvorlage arbeiten und ganz einfach wieder wie gewohnt den Text und die Bilder verlinken und bin so freier bei der Design Gestaltung. Bei den Blog Eigenschaften gibt es zwar viele Darstellungsmöglichkeiten aber keins was mich jetzt besonders anspricht. Hinzu kommt, dass je nachdem was für eine Design-Blog-Vorlage man gewählt hat, es in dieser kaum Möglichkeiten gibt die Textart oder die Farben zu verändern. Wenn dann nur bedingt, zumindest nach meinem jetzigen Kenntnisstand.

Na ja, das Wort trifft eigentlich noch nicht so ganz den Inhalt und den Zweck der Seite, man könnte auch Berichte dazu sagen. Noch arbeite ich aber an einem besseren Begriff(wer Vorschläge hat bitte melden,

Danke). Die Seite zeigt, was wir im Verein so machen und wird gleichzeitig als Öffentlichkeitsarbeit benutzt. Hier wollen wir mehr und mehr zeigen, was wir in den einzelnen Gruppen

Mitmachen

Die Bilderseite ist die am meisten betrachtete Seite. Die Seite wurde eigentlich sehr einfach erstellt. In iPhoto die Bilder an iWeb geschickt und in iWeb eine Designvorlage ausgewählt.Auch das Design und die Größe der Alben ist veränderbar und somit eine tolle Möglichkeit die Fotos gut in eine Seite zu integrieren.

Auf diesen Seiten geht es um wohltätige Aktionen, die von der Kirchengemeinde durchgeführt werden. Warum Daniel diesen Punkt nicht aufgeführt hat, keine Ahnung. Vielleicht vergessen? Auf jeden Fall ein Bestandteil der Seite und so sollte er auch aufgeführt werden.

Bilder

Im Kontaktbereich kommt das Google Maps Widget aus iWeb zum Einsatz. Eine Technik die mir sehr gut gefällt, da der Routen-planer gleich mit integriert ist. So erspart man sich lästige Beschreibungen von Anfahrten oder billigen Zeichnung von Straßen. Besser kann man es wohl nicht anbieten. Weiter gibt es auf dieser und den Unterseiten mehrere Infos und Kontaktmöglichkeiten mit uns und unserer Aussengruppe. Alle benötigten Informationen auf einen Blick!

24

Kontakt

Login

Vom Menü Login kommt man zu einem Passwortgeschütztem Eingabebereich den iWeb in Verbindung mit MobileMe anbietet. Hier handelt es sich um eine Seite die ich für interne Zwecke einge-richtet, und durch ein Passwort geschützt habe. Leider wird diese Seite von den Mitarbeitern zu wenig benutzt. Aus diesem Grund wird sie in Zukunft aus dem Menü verschwin-den und in einen Unterbereich verschoben.

ImpressumDas Impressum war für mich ein schwieriges Thema. Da ich mich hier kaum auskenne, habe ich mich einfach auf anderen Seiten umgesehen und mir das Impres-sum zusammen geschustert. Wer mir wichtige Tipps und Anregungen darüber geben kann oder einen Fehler entdeckt, kann sich gerne bei mir melden.

Wer mir Feedback, Tipps und Anregungen geben möchte, der kann sich unter rangernews@rr63.de mit mir in Verbindung setzen.Ich hoffe ich konnte euch auch einen kleinen Einblick in meine Seite und unsere Pfadfinderarbeit geben. Ich bin schon gespannt, bald eure Seiten näher kennen zulernen.

Ganz liebe Grüße, Daniel

25

Nun darf ich die neue Magic Mouse seit ca. einem Monat nutzen und bin mit Handhabung durchaus zufrieden. Ist die erste Euphorie verklungen und der tägliche Gebrauch lässt Routine in die Nutzung einziehen, so wird man feststellen, der Kauf hat sich auf jeden Fall gelohnt. Die Verarbeitung ist absolut TOP und die Abtastoptik arbeitet zuverlässig und ohne Probleme gerade bei Holz-maserungen als Untergrund. Hier hat Apple ganze Arbeit geleistet, denn störende Mauspads gehören der Vergangenheit an. Die neuen Multitouch-Funktionen für das

man nach der Maus greift. Der Batteriezustand nach ca. 1 Monat liegt bei 63%, in meinen Augen ein absolut akzeptabler Wert. Nach dem Ableben der Batterien, stelle ich der Umwelt zu liebe sowieso auf Akkus um. Sicherlich ist hier die Kapazität zwar geringer aber dafür gibt es ja Ladegeräte. Mein persönliches Resümee: „Der Kauf hat sich gelohnt und ich bin gespannt, ob Apple die Maus mit noch mehr Funktionen wie beim Trackpad ausstattet.

Zu wünschen ist es jedenfalls!“

Zoomen und Vor-/Zurückblättern nutze ich eigentlich überhaupt nicht. Hier ist sicherlich die alte Arbeitsweise zu sehr in Fleisch und Blut übergegangen und man tut sich mit den neuen Dingen zu schwer. Das Einzige was ein bisschen störend wirken kann, ist das Phänomen, dass wenn man nach der Maus greift, und man mit dem Mauszeiger in einem scrollbaren Fenster steht, es ab und an zu einer Scrollbewegung dieses Fensters kommt. Dieses tritt jedoch nicht ständig auf und liegt mit Sicherheit auch an jedem selber, und daran, wie

Gibt es doch bald eine iPhone Nano?

Vor kurzem gab es ein Software-update für den neuen iPod Nano 5G. Apple aktualisierte auf die Version 1.02 und verbesserte hiermit vor allem die Kompatibilität mit iLife und den Import der Filme in iMovie. Nach

Interessant ist jedoch die Meldung von iTunes. Hier wird das iPhone „Dietmar Schönwandts Nano“ genannt.Nur ein Softwarefehler oder schon die ersten Anzeichen für die nächsten Produkte?Ich denke ein Bug, ebenso wie Apple nach der Veröffentlichung der neuen Produkte im Apple-Store den Mac Mini mit 2,53 MHz CPU als 2,0 MHz CPU deklarierte. Leider habe ich hiervon keinen Screenshot und Apple hat diesen Fehler bereits ausgemerzt.

der Installation der Software unterrichtete mich iTunes, dass ein neues Sprachkit für Nike und iPod zur Verfügung stehen würde. In iTunes ist mein Nano als „Dietmar Schönwandts Nano“ gelistet.

Die Magie des fehlenden Rades

Erfahrungen aufgefrischt

Bildquelle: Apple.com

26

Seit kurzem häufen sich im iWeb-Forum und in anderen einschlägigen Foren die Meldungen über Programme aus dem Hause Apple die sich entweder nicht öffnen lassen, oder abstürzen. Ist eher selten, doch es kommt auch auf Macʻs vereinzelt zu Problemen mit Programmen. Hier ist die Lösung, wie man in diesem Fall vorgeht.

Das Plugin „SFWordProcessing“ verursacht dieses Problem und ist

anscheinend für die Schriften in den Programmen des iLife und iWork Paketes zuständig. Es kommt wohl vereinzelt vor, dass Schriften wie z.B. „Hoefler“ Fehler in den Programmen verursachen. Wie gesagt vereinzelt, da ich persönlich dieses Problem nicht kenne und nur über das iWeb-Forum darauf gestossen bin. Das Problem Tritt anscheinend auch nur dann auf, wenn die Schrift vor einem Update bereits verwendet wurde und das Dokument nach dem Update

Der Lösungsvorschlag aus dem iWeb-Forum (Danke harrison) lautet wie folgt:

Fehler im iLife und iWork Paket

geöffnet wird. Die Vermutung liegt nahe, dass entweder die Schrift durch das Update geändert wird und so zum Problem führt, oder die Schrift wird nicht geändert, da diese in Dokumenten verwendet wird, und die alte Schrift ist nicht kompatibel mit dem Update. Aber wie auch immer, es gibt teilweise Abhilfe ohne die Programme neu zu installieren!

Man öffnet das Programm „Schriftsammlung“ aus dem Ordner „Programme“.Im Menü wählt man „Alle Schriften“, nun werden unter „Schrift“ alle auf dem Mac installierten Schriften angezeigt. Diese markiert man allesamt, so dass sie blau hinterlegt sind und wählt nun über einen Rechtsklick „ Schriften überprüfen“.

Dies kann einen Augenblick dauern, da sich mit der Zeit einige Schriften ansammeln. Nach der Überprüfung wird eine Liste mit den Schriften angezeigt, die entweder doppelt vorhanden sind oder halt zu Problemen führen können. Die Schriften, die rot markiert sind, da sie nicht kompatibel mit dem System bzw. mit den Programmen sind,

würde ich auf jeden Fall entfernen lassen. das Programm legt diese dann in der Papierkorb, wo sie spätestens nach dem nächsten Neustart des Systems vollständig gelöscht werden können. Benötigt man die Schrift jedoch unbedingt, dann kann diese aus dem Internet neu geladen und entweder in den Ordner „Benutzer - Library - Fonts“ oder „Macintosh HD - Library - Fonts“ abgelegt werden. Der Fehler sollte nun behoben sein und die Problem-programme sollten wieder normal starten und funktionieren. Wenn nicht, sollte man zum Test die verwendete Schrift trotzdem löschen, auch wenn diese nicht als Fehlerhaft deklariert ist. Nun das Programm

starten und schauen ob das Problem so zumindest eingekreist werden kann. Jetzt kann es sein, dass das Programm meldet, das die verwendete Schrift nicht gefunden werden konnte, aber auf jeden Fall läuft das Programm. Jetzt sollte man die Schriftartändern oder die zuvor verwen-dete Schrift neu installieren.Wenn das alles nicht hilft, wird man um eine Neuinstallation des Programmpakets nicht herum kommen. Zuvor Daten sichern und das Programm komplett entfernen.Hierzu gibt es Tools, welche Programme vollständig entfernen.

27

den iPod eingesteckt und die Auftritte der Tanzschule mit gefilmt. Das Ergebnis war für eine Augen absolut akzeptabel, betrachtet man die Lichtverhältnisse im Theater, kamen für das kleine Objektiv gute Videos zustande. Wenn man dann noch die Grösse und das Gewicht des Nanoʻs bedenkt, einfach Top.

In der letzen Ausgabe habe ich einen kurzen Bericht über den neuen iPod Nano 5G verfasst und bin auf die neuen Funktionen eingegangen. Als kleinen Nachtrag zur Videokamera, kann ich nur schreiben, klasse! Bei einer Tanzveranstaltung in unserer Stadt, war unter anderem auch die Tanzschule meiner Tochter beteiligt. Das war genau der richtige Moment für einen Test des iPods. Kurzerhand

Kurzer Nachbericht zum neuen iPod Nano

Nachsatz zum Magazin

Puh, geschafft!

Dies ist das zweite Magazin inner-halb von zwei Monaten. Alles in allem ein hartes Stück Arbeit, was jedoch auch Spaß gemacht hat. Die nächste Ausgabe erscheint so wie es aussieht erst ende Januar, da die Feiertage und der Jahreswechsel bevorsteht und die Familie und Freunde auch nicht zu kurz kommen sollen. Ausserdem habe ich mir zwei Themen vorgenommen, welche aber

von der technischen Seite erst einmal aufgearbeitet werden müssen. Doch wenn alles soweit steht, wird im nächsten Magazin wieder Interessantes dabei sein.

Ich wünsche allen eine ruhige und besinnliche Weihnachtszeit und einen tollen Übergang ins nächste Jahr.

Und nicht vergessen, immer schön Apple bleiben!

Euer

Didi

Ausgabe 2 - 12/2009