iWeb Magazin - Ausgabe 1

Ausgabe 1

iWeb

MAGAZIN

- Widgets - Tipps und Tricks - iWeb Seiten

Widgets Wer zwitschert da auf iWeb-Seiten?

Das immer beliebter werdende Mini-Blogsystem Twitter nimmt mehr und mehr Einzug in alle möglichen Bereiche der digitalen Welt des Internets. Egal ob Firmen oder Privatpersonen, zwitschern „around the world“. Doch was, wenn ich mein Gezwitscher in die eigene Seite einbinden möchte?

Bewegende Bilder mit Flickr.

Flickr ist einer der führenden Bilder-Serviceanbieter. Schnell mal eben ein paar Fotos online gestellt und Freunde und Verwandte können verfolgen wo und was man gerade so erlebt. Mit dem Flickr-Widget von Roy Tanck lassen sich die zuletzt hochgeladenen Bilder automatisch als drehende Bilder-Wolke in die eigenen Seite einbinden.

Tipps und Tricks Aller Anfang ist schwer - Teil1.

Ich habe mir einen Mac zugelegt und möchte die mitgelieferten und bereits installierten Programme ausprobieren. Hier stosse ich auf das Programm iWeb, mit dem ich mir im Handumdrehen eine eigene Internetseite gestalten kann. Doch wie geht das und was muss ich berücksichtigen? - Hier gibt es Hilfe, um typische Anfängerfehler zu vermeiden und Fragen zu beantworten.

iWeb Vorlagen anpassen - Teil 1. iWeb bietet für viele Bereiche schön gestaltete Vorlagen, mit denen sich schnell und unkompliziert eine Internetseite erstellen lässt. Doch was, wenn ich das Template nach meinen Wünschen ändern und umgestallten möchte? - Schnell stösst man hier an die Grenzen des Programms, doch lässt sich mit ein paar Tricks jede Vorlage so nutzen wie man möchte.

2

Vorgestellt Zur Person Als Herausgeber dieses Magazins, sollte man den Anstand haben und sich kurz dem Leser vorstellen. Was wäre da nicht besser geeignet als ein kurzer Rückblick auf die eigene Erfahrung im Bereich der Computer- und der Internettechnik.

iWeb Seiten Vorgestellt!

Lange habe ich überlegt, ob ich die eigene Seite als erstes vorstellen sollte oder nicht.

Wie heisst es doch so schön: „Der Esel nennt sich immer zuerst!“ Letztendlich habe ich mich dann doch für die eigene Seite entschieden, da es einfacher ist, anhand der eigenen Seite ein Konzept für die künftigen Veröffentlichungen zu erstellen und einen Fragebogen über die wichtigen Punkten zu erarbeiten.

Gleichzeitig kann ich mich als Verfasser und Herausgeber dieses Magazins noch ausgiebiger vorstellen.

Verschiedenes Die Magie des fehlenden Rades: Die ersten Eindrücke zur neuen Maus von Apple. Hat Apple das Rad neu ent(er)funden?

Klein, leicht und voller Technik: Der neue iPod Nano, nur ein Facelift, oder was steckt genau hinter dem neuen Zugpferd aus Cupertino?

3

Inhalt Seite!

!

!

Thema

!

!

!

!

5!

10!

! !

! !

! !

Widgets - Wer zwitschert da auf iWeb-Seiten?

- Bewegende Bilder mit Flickr.

!

13!

30!

! ! !

! ! !

! ! !

Tipps und Tricks - Aller Anfang ist schwer.

- iWeb Vorlagen anpassen - Teil 1.

!

34!

35!

! ! !

! ! !

! ! !

Vorgestellt - Zur Person - iWeb Seite

!

41!

42!

! ! !

! ! !

! ! !

Verschiedenes - Die Magie des fehlenden Rades - Apples neue Magic Mouse - Klein, leicht und voller Technik - Apples neuer iPod Nano

4

Wer zwitschert da auf iWeb-Seiten? ! ! ! ! !

Das immer beliebter werdende Mini-Blogsystem Twitter nimmt mehr und mehr Einzug in alle möglichen Bereiche der digitalen Welt des Internets. Egal ob Firmen oder Privatpersonen, zwitschern „around the world“.

! !

Doch was, wenn ich mein Gezwitscher in die eigene Seite einbinden möchte?

! ! ! ! ! ! ! ! ! !

Twitter bietet auf seiner Seite „http://twitter.com“ die Möglichkeit mit max. 140 Zeichen pro Tweet der Welt mitzuteilen, was einem gerade am Herzen liegt oder was es neues zu berichten gibt. Gerade Firmen und Zeitschriften, ja selbst die Politik kann über dieses System kurz und knapp auf Neues aufmerksam machen.

Auf Twitter habt man die Möglichkeit als registrierter User anderen zu folgen und so automatisch alle Neuigkeiten der Personen die ich interessant finde zu erhalten.

Richtig eingesetzt bietet mir dieses Mini-Blogsystem eine kostenlose Werbeplattform auf der ich allen Interessierten neues über meine Produkte oder mein Unternehmen mitteilen kann, vorausgesetzt die Person folgt meinem Twitterprofil.

!

Twitter bietet mehrere Möglichkeiten der Integration in die eigene Internetseite an.

5

Neben der Integration über HTML-Code gibt es ein Widget für Facebook, sowie MySpace.

Doch da es hier um iWeb geht, nutzen wir den HTML-Code.

Unter der Rubrik „My Webseite“ bietet Twitter insgesamt 3 Widget-Typen für seinen Dienst an. Profil Widget, Search Widget und Faves Widget. Erstes und letzteres ist nicht für private Accounts, welche nicht öffentlich sichtbar sind.

- Das Profil Widget zeigt die eigenen Tweets, und zwar die zuletzt erstellten.

- Das Search Widget gibt vordefinierte Suchbegriffe aus, welche ständig erneuert werden. Ideal für einen Newsticker zu einem bestimmten Thema.

- Das Faves Widegt zeigt alle als Favorit gesetzten Tweets.

Wir beschäftigen uns jedoch mit dem eigenen Gezwitscher und nutzen das Profil Widget.

Ist man in seinem Profil eingeloggt, übernimmt die Seite automatisch den Usernamen und setzt diesen ein. Möchte ich die Tweets eines Stars in meine (Fan)Seite einbauen, dann kann ich hier den Profilnamen der Person einsetzen, vorausgesetzt es handelt sich um einen öffentlichen Account.

Weiter Einstellungen nimmt man in den Unterpunkten vor: - Preferences: Generelle Einstellungen zum Erscheinungsbild meines Widgets - Appearance: Farbeinstellungen meines Widgets - Dimensions: Grösseneinstellungen meines Widgets

6

Preferences:

Appearance:

Dimensons:

7

Nach Änderungen der Einstellungen kann die Vorschau des Widgets über den Button „Test settings“ aktualisiert werden.

Wenn das Widget das gewünschte Aussehen erlangt hat, dann gelangt man über den Button „Finish & Grab Code“ auf die Seite, auf der der HTML-Code für das Widget zur Verfügung gestellt wird.

Nun brauche ich nur noch den Code für das Widget zu kopieren und in iWeb in ein HTMLWidget einzufügen. Dieses geht natürlich erst ab iWeb 2.x und später, da iWeb erst seid den letzten Versionen HTML-Bausteine unterstützt.

8

Zum Schluss positioniert man das Widget noch an der richtigen Stelle auf der gewünschten Seite und veröffentlicht die Änderungen.

Ab sofort erscheinen automatisch die letzten Tweets meines Twitter Accounts beim Aufruf der Internetseite, in der man das Widget integriert hat.

Zu berücksichtigen ist bei diesem System natürlich, die ganze Welt hat Zugriff auf meine Tweets und auf meine im Profil freigegebenen Daten. Also genau überlegen was man über sich veröffentlicht, die intimsten Gedanken gehören nicht unbedingt auf Twitter.

9

Bewegende Bilder mit Flickr. ! ! ! ! ! !

Flickr ist einer der führenden Bilder-Serviceanbieter. Schnell mal eben ein paar Fotos online gestellt und Freunde und Verwandte können verfolgen wo und was man gerade so erlebt. Mit dem Flickr-Widget von Roy Tanck lassen sich die zuletzt hochgeladenen Bilder automatisch als drehende Bilder-Wolke in die eigenen Seite einbinden.

! ! ! ! ! ! ! ! !

!

Flickr bietet auf seiner Seite „http://flickr.com“ einen kostenlosen Onlineservice für Bilder, der von jedem registrierten User genutzt werden kann, solange ein Computer oder ein Mobiltelefon mit den entsprechenden Voraussetzungen zu Hand ist. iPhoto bietet seit geraumer Zeit ebenfalls die Möglichkeit, Bilder aus der Bibliothek hochzuladen und zu synchronisieren. Die auf Flickr veröffentlichten Bilder können entweder für die Öffentlichkeit freigegeben werden, oder der Dienst lässt sich privat nutzen um zum Beispiel überall Zugriff auf seine Fotos zu haben, Internetverbindung vorausgesetzt. Hier ist die kostenlose Variante jedoch eingeschränkt.!

! ! !

Und die maximale Grösse ist auf 1024 x ... px begrenzt. Das heisst, ich habe keine Möglichkeit die Original-Fotos als Sicherung abzuspeichern, es sei denn man gibt 24,95 USD pro Jahr aus, dann sind die Möglichkeiten erweitert.

! ! ! !

Um das Fotowidget von Roy Tanck nutzen zu können benötigt man als erstes einen Flickr Account, sowie hochgeladene Fotos. Flickr bietet einen RSS-Feeds zu jedem Flickr Account an. Dieser wird hinterher für den Code-Generator auf der Entwicklerseite: http://www.roytanck.com/get-my-flickr-widget/ genötigt.

! !

Als erstes loggt man sich in seinem Flickr-Account ein und klickt auf der Startseite auf „Ihr Fotostream“.

10

Hier findet man am unteren Ende der Seite die RSS-Feeds.

Über einen Rechtsklick auf den RSS-Feed „Letzte“ kopiert man den Link und wechselt dann auf die Seite des Code-Generators.

11

In der Zeile „Feed URL“ trägt man den zuvor kopierten Link ein, ändert die Größe der Bilderwolke und gibt entweder die Hintergrundfarbe an, oder setzt einen Haken bei „Use background transparenzy“ um einen transparenten Hintergrund zu bekommen. Die Option sollte man generell wählen, damit sich das Widget überall auf der gewünschten Internetseite einsetzen lässt. Über den Button „Generate code snippet“ wird eine Voransicht und der benötigte Code für den HTML-Baustein in iWeb erstellt.

Den Code kopieren, in ein HTML-Widget auf der iWeb-Seite einbinden, Widget auf der Seite ausrichten und Änderungen des iWeb Projektes veröffentlichen.

Ab sofort werden immer die aktuellsten Flickr Fotos auf der besuchten Internetseite angezeigt und beim Klick auf eines der Fotos, dieses auf der Flickr-Seite angezeigt.

12

Aller Anfang ist schwer - Teil 1. ! ! ! ! ! ! ! ! !

Ich habe mir einen Mac zugelegt und möchte die mitgelieferten und bereits installierten Programme ausprobieren. Hier stosse ich auf das Programm iWeb, mit dem ich mir im Handumdrehen eine eigene Internetseite gestalten kann. Doch wie geht das und was muss ich berücksichtigen? - Hier gibt es Hilfe, um typische Anfängerfehler zu vermeiden und Antworten auf die häufigsten Fragen zu bekommen.

! ! !

Vorab die wichtigsten Punkte die jeder beim Gestalten einer Internetseite berücksichtigen sollte: - Dateigrössen: Egal ob Bilder-, Filme- oder Audiodateien, je grösser die Dateien sind, die auf meiner Seite veröffentlicht werden, umso länger braucht die Seite zum Laden.

- Umlaute: Auch wenn es mittlerweile Domains mit Umlauten gibt, so kommt es doch immer wieder zu Problemen mit Umlauten in Internetseiten (möglichst vermeiden).

- Textstile: Bei den gewählten Schriftarten einer Internetseite sollte am besten mit websicheren Schriften gearbeitet werden, damit die Seiten auf allen Computern und Betriebssystemen nahezu gleich dargestellt werden.

- Layout: Beim Layout einer Homepage sollten alle Seiten auf dem gleichen Stil aufbauen, sonst wirkt die Seite unprofessionell. Nicht zuviel auf die Seiten bringen, denn Seiten die überlagert wirken werden schnell uninteressant. Weniger ist oft mehr.

- Suchmaschinen: Wer Wert auf Suchmaschinentauglichkeit legt, sollte möglichst viel Text auf seinen Seiten haben, in dem Suchbegriffe auftauchen. Metatags und Titel der Seite sind ebenfalls ein weiteres Kriterium für das Ranking bei Suchmaschinen.

! ! ! ! ! !

Viele Infos für den Start, doch in jeder Ausgabe wird auf die einzelnen Punkte näher eingegangen und Stück für Stück erläutert. Aber nicht nur das Allgemeinwissen zur Gestaltung von Internetseiten wird hier besprochen, auch der Umgang mit iWeb und dessen Funktionen soll vertieft werden. Auch beim Arbeiten mit iWeb können einige grundlegenden Fehler gegangen werden, welche jedoch mit dem nötigen Wissen verhindert werden können.

13

Mein Start mit der ersten Internetseite Wie bei jeder gestalterischen Arbeit sollte man sich im Vorfeld überlegen, was möchte man auf seiner Seite veröffentlichen und wie soll die Seite aufgebaut sein. Mit iWeb, sowie mit anderen Programmen habt man a) die Möglichkeit auf fertige Vorlagen zurückzugreifen oder b) man gestaltet sein Seitenlayout selber. Für den absoluten Neuling ist a) am Anfang sicherlich die einfachste Variante, für Fortgeschrittene ist b) die Individualität der Seite sicherlich das was jeder gerne möchte. Die eigene Homepage spiegelt oft die Vorlieben des Gestalters wieder. Der eine mag es verspielt der andere wiederum stylisch oder edel. Jeder sollte sich überlegen was ihm gefällt und was er darstellen möchte. Beispiele gibt es zu genüge im Netz um sich Anregungen zu holen.

Eins sollte man auf jeden Fall berücksichtigen, eine Homepage sollte klar strukturiert und einheitlich aufgebaut sein. Also, Layout auf allen Seiten der Homepage beibehalten, sonst verliert der Betrachter schnell die Lust auf der Homepage zu verweilen. Auf Werbung verzichten, denn mit dieser wird man in der Regel schon genug überhäuft.

Ein weiterer, wichtiger Punkt ist, alle dargestellten Daten, egal ob Bilder, Videos, Musik, ja sogar Personen dürfen nicht ohne Zustimmung dieser, bzw. der Rechteinhaber benutzt werden. Also, Zustimmung immer schriftlich einholen, sonst kann es teuer werden!

Ebenso sollte jede Internetseite ein Impressum aufweisen, für Firmen ein absolutes Muss, für Privatleute bin ich mir nicht sicher. Wenn eins vorhanden ist kann sich auch keiner beklagen. Wichtig auf jeden Fall einen Haftungsausschluss für externe Links einbauen.

Hierzu gibt es aber genügend Seiten mit Informationen und Beispielen im Netz.

Nachdem mir klar geworden ist was ich möchte, geht es nun an die Vorbereitungen.

Daten, Bilder, Videos usw. müssen fürs Internet aufbereitet werden. Eins der wichtigsten Dinge beim Gestalten einer Homepage ist die Datengröße. Je grösser die Datei, um so länger benötigt die Seite beim Aufbau und wird für den Betrachter früher oder später uninteressant. Auch wenn ich mit iWeb arbeite, das es mir leicht macht, da das Programm beim Veröffentlichen die Bilder automatisch herunter rechnet, so kann ich mit einem Grafikprogramm und ein bisschen Handarbeit noch einiges an Geschwindigkeit herausholen. Fürs erste betrachten reichen kleine und von der Qualität reduzierte Bilder.

Mein Start mit iWeb Als erstes sollten wir uns einmal die Arbeitsweise von iWeb anschauen, um das Programm und dessen Vorgehensweise besser zu verstehen. iWeb erstellt beim ersten Start automatisch eine Containerdatei mit dem Namen Domain.

Containerdatei, da iWeb alle Daten in dieser Datei ablegt und speichert. Das Programm erstellt die einzelnen Seiten anhand von XML-Vorlagedateien, die in den WebthemePaketen hinterlegt sind, welche im Innersten von iWeb schlummern. Wenn man mit einer Vorlage eine Seite gestaltet hat und diese sichert oder veröffentlicht, dann legt iWeb eine geänderte XML-Vorlagedatei in der Domaindatei an und nutzt diese bei jedem weiteren bearbeiten der gestalteten Seite.

Nach dem Gestalten kommt das Veröffentlichen. Hier bietet mir iWeb drei Möglichkeiten der Veröffentlichung.

14

- MobileMe - FTP Server - Lokaler Ordner MobileMe ist ein kostenpflichtiger Dienst von Apple, mit dem Daten online verwaltet werden können und wo die Homepage veröffentlicht werden kann. Die Verwaltung ist Apple like, doch birgt dieser Dienst auch seine Macken. Wer einfaches Handling und Funktionen wie Besucherzähler, die Suche in Blogvorlagen und die KommentarMöglichkeit nutzen möchte, der ist hier richtig. Wer jedoch Wert auf schnelle Server und damit schnellen Seitenaufbau legt, der sollte sich nach einem anderen Anbieter umschauen. Viele Funktionen sind durch Zusätze und freie Anbieter ohne Probleme zu ersetzen.

FTP Server ist die seit iWeb 3.x eingebaute Funktion, das Projekt beim Veröffentlichen direkt via FTP-Zugang auf den Server eines freien Anbieters hochzuladen und die Seite somit im Internet sichtbar zu machen. Hier habe ich jedoch keine Möglichkeit nachträgliche Änderungen an der Seite vorzunehmen. Da man jedoch bei manchen Funktionen darauf angewiesen ist, kommt diese Option bei mir so gut wie nie zum Einsatz.

Lokaler Ordner ist die Option sein Projekt auf der Festplatte zu veröffentlichen und abzuspeichern. Diese Funktion kann man auch nutzen, um sich die gestaltete Seite vorab lokal anzuschauen, ohne die Seite im Internet zu veröffentlichen. Weiter hat man so die Möglichkeit im Nachhinein Änderungen am Projekt vorzunehmen.

Egal welche Art der Veröffentlichung man wählt, eines macht iWeb immer, es legt einen Projektordner an, in dem die Seiten veröffentlicht werden. Da iWeb es ermöglicht mehrere Homepage-Projekte zu verwalten, muss das Programm beim Veröffentlichen diese auch unterscheiden. Apple schlägt in seinen Einführungen zum Programm vor, man solle sein Projekt nach seiner Domain benennen. Doch hier liegt schon der Teufel im Detail, oder hier wird der erste Fehler begangen. Betrachten wir das vorher gelernte, so wird nach dem Veröffentlichen der Seite auf dem Server folgendes sichtbar: Ich benenne mein Projekt www.meineseite.de . Wenn ich das Projekt veröffentliche, erscheint online in der Browser-Adresszeile http://www.meineseite.de/www.meineseite.de/seite.html Da dieses wohl von niemandem gewollt wird, muss man sich entweder einen Projektnamen überlegen der passt, oder das Projekt in einem lokalen Ordner veröffentlichen und nur den Ordnerinhalt via FTP-Client ins Stammverzeichnis des Servers laden. Wie dieses heisst erfährt man bei seinem Anbieter. Vom arbeiten ist ein FTP-Client nichts anderes als der Finder unter Mac OS X. Ich kann Verzeichnisse anlegen, umbenennen, löschen usw.. Daten werden vom einen Verzeichnis in das Andere kopiert (hochgeladen).

HINWEIS: Einige beschriebene Dinge sind spezifisch für iWeb 3.x und sind mit iWeb 1.x 2.x nicht nachvollziehbar!

15

Beim ersten Start von iWeb erscheint die Themenauswahl für das Homepage-Projekt.

Hier wählt man seine favorisiertes Theme und die gewünschte Seiten-Vorlage aus der Themenvorlage. Jedes Theme bietet insgesamt acht Seitenvorlagen für die unterschiedlichsten Dinge.

- Willkommen: Diese Vorlage eignet sich als Startseite des Projektes.

- Über mich: Vorlage für eine Profilseite über die eigene, oder eine andere Person.

- Fotos: Vorlage für eine Fotoseite mit Diashow-Funktionen.

- Meine Alben: Vorlage zum integrieren von Foto- oder Filmseiten.

- Film: Vorlage zum veröffentlichen eigener Filme.

- Blog: Vorlage zum erstellen eines Blogs oder einer Newsseite.

16

- Podcast: Blogvorlage zum Veröffentlichen von Videos oder Audiotiteln.

- Leer: Eine leere Vorlage zum freien kreieren einer Seite.

HINWEIS Die oberste Seite im Seitenmenü wird nach dem Veröffentlichen automatisch als Startseite geöffnet!

Das Theme ist ausgewählt und die erste Seite aus einer Vorlage erstellt. Nun sollte man als erstes das Projekt umbenennen, ist jedoch keine Pflicht, da es zu jedem Zeitpunkt geändert werden kann.

Zum Ändern verwende ich einen Rechtsklick auf den Projektnamen und wähle die Option Umbenennen aus dem Kontextmenü, oder nutze einen Doppelklick auf den Projektnamen. Nach beiden Aktionen kann der Name direkt geändert werden.

Wir erinnern uns, wer den direkten Upload aus iWeb nutzen möchte, sollte hier überlegen, wie er das Projekt nennt, da dieses hinterher in der Adressleiste des Browsers angezeigt wird.

Das Gleiche lässt sich mit den Seitennamen durchführen. Wem der Seitenname Willkommen nicht gefällt, kann diesen ebenfalls umbenennen, doch auch hier erinnern wir uns, möglichst keine Umlaute verwenden.

17

Sind die ersten Hürden genommen, so geht es an das bearbeiten der ersten Seite. Hier stösst man schnell auf die Einfachheit von iWeb. Jede Seitenvorlage, bis auf die leere Seite, bietet so genannte Platzhalter für Text, Bilder, Videos oder Musik. Die Dateien können einfach per Drag and Drop in die Platzhalter gezogen werden. Platzhalter, egal welcher Art, erkennt man schnell, wenn man mit dem Mauszeiger auf einem dieser verweilt, erscheint ein Infotext, wie unten dargestellt.

Die Willkommen-Seite bietet insgesamt vier Platzhalter.

18

Ăœberschrift der Seite

Diese erscheint dann nach dem VerĂśffentlichen im Browser als Titel der Seite.

Mediendatei Wurde bereits gezeigt, hier kann aber ebenso ein Video integriert werden.

Titel der Webseite?

Hier stiftet iWeb Verwirrung. Allgemein ist der Titel das, was im Browser als Titel angezeigt wird und im Quelltext als <title> definiert ist.

Dieses heisst in iWeb jedoch Ă&#x153;berschrift.

19

Haupttext

Hier handelt es sich um ein normales Textfeld in dem alles Mögliche beschrieben werden kann. Daran denken, je mehr Text um so besser für die Suchmaschinentauglichkeit!

In dieser und in den kommenden Ausgaben wird jeweils eine Seitenvorlage erläutert und in diesem Zusammenhang die Möglichkeiten der Anpassung der einzelnen Komponenten erläutert. Als erstes widmen wir uns jedoch dem allgemeinen Aufbau der Seiten.

Um zu den allgemeinen Einstellungen zu gelangen öffnet man mit einem Mausklick das Informationsmenü. Dieses ist für die meisten Einstellungen in iWeb die Schaltzentrale für viel Möglichkeiten der Anpassung von Seitenelementen.

In den Seiteneinstellungen kann ich verschiedene Dinge einstellen. Den Seitennamen ändern, über den Haken „Ins Navigationsmenü aufnehmen“ kann ich festlegen, ob die Seite in meiner Menüleiste angezeigt wird oder nicht. So kann ich steuern, ob eine Seite als Hauptseite im Menü aufgeführt wird oder als Unterseite in meinem Projekt eingebaut werden kann. Dieses funktioniert durch manuelle Verlinkung auf meiner Seite, wodurch

20

ich die volle Kontrolle habe was angezeigt wird oder nicht. Wenn auf meiner Seite das automatische erstellte Navigationsmenü von iWeb angezeigt werden soll, dann setze ich den Haken „Navigationsmenü anzeigen“. Sollte ich vorhaben eine eigene Navigation zu erstellen, dann deaktiviere ich diese Option.

21

Das Seitenlayout in iWeb ist in vier Hauptbereiche eingeteilt. Navigationsleiste, die ohne weiteres nicht geändert werden kann, die Kopfzeile, den Seitenbereich und die Fußzeile.

All diese Bereiche können im Layoutbereich eingestellt und angepasst werden.

Bei unseren iWeb-Seiten haben wir zwei Bereiche. Den Browserbereich und meine Seite. Grob genommen ist meine Seite ein Blatt, das auf einem Tisch liegt. Also ist mein Browserhintergrund meine unterste Instanz. Der Browserhintergrund bietet mir nur eine begrenzte Möglichkeit der Anpassung. Entweder setze ich hier eine Farbe oder füge ein Bild ein. Dieses kann ich in Originalgrösse darstellen lassen oder setze die Einstellungen auf gekachelt. Bei dieser Option wird das Bild automatisch, seitlich und nach unten angesetzt.

Seit iWeb 3.x kann man hier sogar animierte Bilder (Gif) einfügen, die dann für Leben auf meiner Seite sorgen.

Meine Empfehlung gibt es hierfür jedoch nicht!

Der Seitenhintergrund ist da schon etwas flexibler in der Anpassung. Das Programm bietet mir dafür einige Möglichkeiten. Angefangen von „Ohne“, hierdurch ist die Seite komplett transparent, gefolgt von „Farbe“, hier kann ich eine einfarbige Füllung der Seite erstellen, wobei ich diese wiederum in den Farbeinstellungen mit 0% - 100% Transparenz versehen kann. Weiter geht es mit „Verlauf“, diese Option ermöglicht mir einen Farbverlauf von zwei Farben. Bei diesem kann ich den Winkel des Verlaufs verändern, also schräg, oder von oben nach unten und von rechts nach links. Wie vorher, können die Farben ebenfalls transparent gesetzt werden, wodurch man Möglichkeiten ohne Ende hat.

Die nächste Option „Bild“, ermöglicht es mir wie schon beim Browserhintergrund ein Bild festzulegen. Diesmal jedoch keine animierten Bilder, dafür habe ich aber noch mehr Möglichkeiten das Bild anzupassen. Meiner Meinung nach würden die Funktionen „Gekachelt“ und „Originalgröße“ alles sinnvoll abdecken. Gekachelt für Muster und einfarbige Bilder, Originalgröße für Bilder in der Größe der Seite. Hier gilt jedoch jeder nach seiner Fasson. Die letzte Option „Gefärbtes Bild“ hat die gleichen Einstellmöglichkeiten wie zuvor, jedoch kann ich das eingesetzte Bild durch eine von mir vorgegebene Farbe einfärben. Der eigenen Kreativität sind hier keine Grenzen gesetzt. Was ich letztlich daraus mache, bleibt mir überlassen.

22

Die Anordnung von iWeb-Seiten im Browser ist generell mittig und kann auch nicht ohne Umstände geändert werden. Meiner Meinung nach ist diese Ausrichtung vom Optischen her die Beste, da die Seite sich automatisch zentriert, wenn das Browserfenster breiter ist als die Seite.

Zu den Größeneinstellungen des Seitenlayouts - Abstand oben und unten: Hier stelle ich den oberen und unteren Anstand der Seite im Browserfenster ein. Optisch sieht es besser aus, wenn die Seite nicht direkt am oberen Browserfenster anschlägt und zwischen Browserfenster und Seitenanfang ein kleiner Bereich sichtbar ist, in dem der Browserhintergrund zum Vorschein kommt. Ein Wert zwischen 10 und 20 px sollten ausreichen. Dass ist jedoch eine Entscheidung die jeder für sich selber treffen muss. Ich sage immer, einfach testen, was einem am besten gefällt. iWeb zeigt mir die Änderungen in Echtzeit an, wodurch ich die Seite nicht erst veröffentlichen muss um diese zu testen.

- Breite des Inhalts: Gemeint ist die Seitenbreite für meinen Inhalt der Homepage. Da Monitore in der heutigen Zeit über Auflösungen jenseits der 1000 Pixel verfügen kann man getrost höhere Breiten für die Homepage einstellen. Bei einigen Vorlagen in iWeb ist dieses jedoch nicht ohne weiteres möglich, da die verwendeten Hintergrundgrafiken oft genau auf die Seitenbreit angepasst sind. Einige Grafiken kann ich löschen andere wiederum sind fest in der Vorlage verankert. Doch auch diese lassen sich ändern. Im nächsten Artikel gehe ich näher hierauf ein.

- Höhe des Inhalts: Mit diesem Wert definiert man die Höhe des Seitenbereichs. Die Gesamte Höhe der Seite ergibt sich aus der Summe der einzelnen Bereiche, sowie der Navigationsleiste. Die Vorgabenwerte für die Navigationsleiste sind in den Vorlagedateien fest verankert und lassen, bis auf die Breite, keine weiteren Änderungen zu. Doch auch hier kann man mit ein paar Tricks die Navigationsleiste auf die eigenen Wünsche anpassen. Die Höhe des Seiteninhalts kann ich zwar einstellen, diese erhöht sich jedoch dynamisch durch den Inhalt in diesem Bereich. Habe ich beispielsweise einen Textblock im Seitenbereich und dieser wird durch Texteingabe oder durch verschieben auf der Seite grösser als die Höhe des Inhalts, so ändert iWeb automatisch die Höhe und schieb alles unterhalb des Seitenbereichs nach unten.

- Höhe der Kopfzeile: Die Kopfzeile ist der obere Bereich meiner Seite. Je nach Vorlage liegt die Navigationsleiste oberhalb oder unterhalb dieses Bereichs. Die Kopfzeile eignet sich am besten für Banner oder ein eigenes Navigationsmenü. Die Höhe würde ich Abhängig vom Inhalt des Bereichs wählen. Stellt man die Höhe auf 0 px, so verschwindet die Kopfzeile. Jedoch nur, wenn der Inhalt vorher gelöscht wurde.

- Höhe der Fußzeile: Hier gilt eigentlich das Gleiche wie für die Kopfzeile, wobei in der Fußzeile eher Dinge wie Links zum Impressum, Mail, usw. angesiedelt sind. Doch was ich letztendlich in die Fußzeile bringe, bleibt in meinem Ermessen. Das ist das schöne an der eigenen Seite, niemand gibt Anweisungen und man kann sich selbst verwirklichen.

23

Doch nun zur unserer ersten Vorlage. Hier gehe ich der Reihe nach vor, so wie iWeb sie in der Auswahl aufführt. Die Willkommen Seite soll als Startseite für die Einleitung auf meine Seite dienen. Eine kurze und inhaltlich aussagekräftige Beschreibung, sowie das Layout meiner Seite entscheidet, ob der Betrachter weiter auf meiner Seite verweilt oder das Weite sucht.

Die Willkommen Seite bietet mir mehrere Objekte, auf die wir nun näher eingehen wollen.

Angefangen mit der Überschriftszeile.

Die Überschriftszeile ist ein Textfeld, welches nach dem Veröffentlichen automatisch den Titel meiner Seite ergibt. Textfelder in iWeb können mannigfaltig umgestaltet werden.

Textfarbe

Textausrichtung im Textfeld Hintergrundfarbe für das Textfeld Der Abstand zwischen den einzelnen Textzeilen

Der Abstand vor und nach einem Zeilenumbruch

24

Der Abstand zwischen den einzelnen Zeichen

Der obere, untere und seitliche Abstand zwischen Text und TextfeldRahmen

Die meisten Funktionen kennt man aus der Textverarbeitung und müssen hier nicht weiter erklärt werden. Am meisten lernt man sowieso beim Probieren der einzelnen Funktionen.

Um die Textfarbe zu ändern, habe ich zwei Möglichkeiten. Wenn der gesamte Text farblich verändert werden soll brauche ich nur das Textfeld auswählen. Um bei einzelne Wörtern die Farbe zu tauschen, markiere ich den Text und klicke dann einmal auf das Farbfeld im Textmenü. Sollte die Farbpalette noch nicht geöffnet sein wird diese automatisch geladen.

FarbauswahlWerkzeug. Lupe anklicken und Farbe wählen

Auswahl der verschiedenen Farbmodi Gewählte Farbe

Farbauswahl

Deckkraft der gewählten Farbe Farbfelder für eigene Farben

Die Farbpalette in iWeb bietet viele Möglichkeiten, welche nicht auf Anhieb ersichtlich sind. Die wichtigsten sind Das Farbauswahl-Werkzeug (Lupe), die Deckkraft, und die Farbfelder für eigene Farben.

- Farbauswahl-Werkzeug: Man kennt die Pipette aus den Grafikprogrammen, mit denen man eine Farbe aus einem Bild aufnehmen kann, um dieses dann zu verwenden. iWeb bietet genau diese Funktion, nur ist sie hier hinter der Lupe versteckt. Die Lupe einmal angeklickt verwandelt sich diese zum Auswahlwerkzeug, mit dem man die Farbe auswählen kann.

- Farbfelder für eigene Farben: Die Funktion ist hilfreich, wenn ich mit Sonderfarben arbeite, die ich öfters benötige. Um die Farben in der Leiste abzulegen gehe ich folgendermaßen vor. Farbe wählen, diese erscheint dann im oberen Farbfeld. Mit der Maus auf das Farbfeld gehen und mit gedrückter Maustaste die Farbe in eines der leeren Felder ziehen.

25

- Die Deckkraft: Die Deckkraft ermöglicht mir, egal ob Schrift oder sonstiges Element, die Farbe auf transparent zu setzen. Je geringer die Prozentzahl, desto transparenter die Farbe. Hier kann man gerade bei Feldern erstaunliche Effekte erzielen. Doch auch hier gilt: „Probieren geht über studieren!“

Wer auf websicher Farben setzen möchte, findet unter der Rubrik „Farbpaletten“ eine Auswahl von genau diesen Farben.

Doch nicht nur der Text im Textfeld lässt sich ändern, auch Das Textfeld als solches ist mit vielen Features veränderbar.

Unter dem Bereich „Grafiken“ im Informationsmenü kann die gestalterische Vielfalt von iWeb ausgespielt werden. Die einzelnen Gestaltungselemente in diesem Menü haben es in sich und so hat der Benutzer die Qual der Wahl. Auch wenn die vielen Funktionen zum spielen animieren, so gilt auch hier, einheitliches Layout! Dieses erzielt man mit gestalterischen Elementen die sich in der Seite wiederholen und kein Querbeet der Elemente!

26

Füllen: Durch diese Option lässt sich der Hintergrund des Textfeldes mit den unterschiedlichsten Dingen füllen. Einfach Farbe, Farbverlauf oder Bilder, alles Dinge die wir schon bei den Seitenoptionen kennengelernt haben.

Linieneffekte: Wenn man sein Textfeld umranden möchte, ist man hier genau richtig. Von einer einfachen bis abstrakten Umrandung, in Form von Linien oder kompletten Rahmen. Ein paar Klicks und schon ist das Textfeld verziert. So gestaltet, verschönert es meine Seite und wirkt kreativer als ein einfaches Feld. Doch auch hier nicht übertreiben, weniger ist oft mehr.

Schattenwurf: Der Schattenwurf wird auch für Text und Textfelder angeboten, doch Obacht, hier wird oft ein schwerwiegender Fehler begangen. Auch wenn Text mit Schatten toll aussieht, so wandelt iWeb diese Schrift in Bilddateien um.

HINWEIS: TEXT MIT SCHATTEN IST ALSO NICHT SUCHMASCHINENTAUGLICH, DA DER TEXT VOM CRAWLER NICHT GELESEN WERDEN KANN! Aber es gibt auch noch andere Einschränkungen. Leider gibt es immer wieder Probleme, mit Browsern, die verschiedene Webstandards nicht, oder nur teilweise unterstützen.

Deshalb gilt für jeden der eine Internetseite gestaltet, die Seite in den gängigsten Browsern testen um sicher zu gehen dass der Großteil der Besucher die Seite richtig betrachten kann. Der viel genutzte und allseits beliebte Firefox in seiner aktuellen Version hat beispielsweise den Fehler, transparente Bilder mit hinterlegtem Schatten nicht richtig darzustellen. Im Browser sieht mal das Bild als wäre es ein einfaches rechteckiges Bild mit Schatten, nur dass das Bild kein Rechteck ist. Bei solchen Grafiken sollte man den Schatten im Bildbearbeitungsprogramm mit Schatten versehen, als PNG abspeichern und dann in in iWeb einfügen.

27

Spiegelung: Spiegelungen bringen eine gewisse Eleganz auf die Webseite. Diese sind jedoch nicht auf Textfelder anwendbar und funktionieren nur mit Bildern und Grafiken.

Deckkraft: Hier lässt sich die Deckkraft auf das komplette Objekt anwenden. Wenn ich ein Textfeld mit Rahmen und Füllung über diesen Regler auf Transparenz setze, dann wird alles, selbst der Text transparent dargestellt. Auch hier gilt, ausprobieren und testen, notfalls kann ich den Effekt immer noch rückgängig machen.

Das nächste Objekt auf der Willkommen-Seite ist ein Platzhalter für Mediendateien.

Mit diesem Platzhalter kann man per „Drag and drop“ alle unterstützten Medientypen in die Seite einbinden. Wählt man den Platzhalter mit einem einfachen Klick, dann erscheint ein kleines Bearbeitungsmenü, mit dem man Änderungen vornehmen kann. Über den Schieberegler regelt man die Grösse des eingebundenen Bildes, wobei sich die Rahmengrösse jedoch nicht verändert. Möchte man die Grösse des Platzhalters ändern, kann dieses durch ziehen der Rahmenecken durchgeführt werden. Klickt man auf den Button „Maske bearbeiten“, dann verändert sich die Ansicht des Platzhalters und ich sehe die wahre Grösse des Bildes. Das Bild kann nun im Platzhalter verschoben und die Grösse der Maske verändert werden, wodurch ich letztendlich nur einen Ausschnitt meines Bildes auf der Seite zu Gesicht bekomme. Funktionen wie Rahmen,

28

Spiegelungen, Schatten und Transparenz sind in vollem Umfang auf dieses Objekt anwendbar.

Bei den letzten zwei Platzhaltern, die bereits vorgestellt wurden, handelt es sich ebenfalls um Textfelder. Diese können wie beim Überschriftsfeld beschrieben, geändert und aufgepeppt werden.

Ende Teil 1

!

29

iWeb-Vorlagen anpassen - Teil 1. ! ! ! ! ! ! ! !

iWeb bietet für viele Bereiche schön gestaltete Vorlagen, mit denen sich schnell und unkompliziert eine Internetseite erstellen lassen. Doch was, wenn ich das Template nach meinen Wünschen ändern und umgestallten möchte? Schnell stößt man hier an die Grenzen des Programms, doch lässt sich mit ein paar Tricks jede Vorlage so nutzen wie man möchte.

! ! ! ! !

Um ein Theme in iWeb zu ändern gibt es zwei Möglichkeiten. Die erste und einfachste Art ein Theme zu ändern ist, eine Seite mit dem gewünschten Theme erstellen zu lassen und dann in iWeb die Seite nach seinen Wünsche zu verändern.

Nach dem umstrukturieren der Seite kann man diese nun ganz einfach als Vorlage für weitere Seiten nutzen.

! ! ! ! ! ! ! ! ! ! ! ! ! ! ! !

Durch einen Rechtsklick auf den Seitennamen im Seitenmenü kann man die Seite duplizieren lassen und hat so ein hundertprozentiges Abbild der ersten Seite. iWeb übernimmt sämtliche Einstellungen, sowie Verlinkungen von der Vorlagenseite.

Wenn man sich nun als erstes eine Vorlagenseite mit einem Grundgerüst erstellt, so kann man diese als Vorlage für weitere Seiten verwenden. Möchte man jedoch eine andere Seitenart nutzen (Blog, Fotoseite, usw.), so muss hierfür eine Seite aus der original Vorlage erstellt werden. Danach kann die neue Seite mit ein paar Handgriffen auf das neue Layout umgestellt werden. Doch auch hier ist die Vorgehensweise wieder sehr einfach. Ich gehe auf meine bereits umgestaltete Seite und wähle hier alle Elemente die ich auf der neuen Seite verwenden möchte. Hierzu halte ich die Command/Apfel-Taste [cmd] gedrückt und klicke nun auf jedes erwünschte Element und wähle dann mit einem Rechtsklick kopieren. Wenn man nun auf der neuen Seite mit einem Rechtsklick einfügen aus den Kontextmenü wählt, setzt iWeb die kopierten Elemente genau an die Positionen, wo sie auf der alten Seite saßen. Einfaches und schnelles Arbeiten, wie man es von Apple gewohnt ist.

30

Nun kann es jedoch vorkommen, dass das gewählte Theme nicht ohne weiteres geändert werden kann. Dieses ist der Fall, wenn iWeb keinen Zugriff auf die verwendeten Hintergrundbilder zulässt. Doch was, wenn mir gerade dieses Template so gut gefällt, oder ich ein Theme einfach nur in der Breite verändern möchte um es zu verwenden?

Hier kann man in das jeweilige Theme eingreifen und es nach seinen eigenen Wünschen verändern. Hierfür sind jedoch einige Kenntnisse zu iWeb nötig, um dieses umsetzen zu können.

Speicherorte iWeb erstellt seine Seiten anhand von Vorlagen. Diese Vorlagen sind im innersten von iWeb abgelegt, auf die man jedoch vollen Zugriff hat. Somit auch auf alle Dateien, aus denen die Vorlagen bestehen. Hier nun der erste Punkt, wie komme ich an die Vorlagen?

Als erstes wechsle ich in den Programmordner, wo meine iWeb-Programmdatei liegt.

Dann lasse ich mir mit einem Rechtsklick den Paketinhalt anzeigen!

Im iWeb Paket befinden sich einige Ordner, doch für uns ist nur der Speicherort der Vorlagedateien interessant.

31

Speicherort Vorlagendatei: Benutzer - Programme - iWeb - Contents - Recourses - Themes

Die Vorlagen haben die Endung ".webtheme" und liegen in dem Ordner Themes.

Vorsicht - nichts im oder aus dem iWeb-Paket verschieben sondern nur kopieren!

Um ein Theme zu ändern, sollte man als erstes eine Kopie der Webtheme-Vorlage erstellen. Diese Kopie legt man in einen Arbeitsordner den man vorher erstellen sollte.

Wie dieser Ordner heisst und wo man diesen anlegt, bleibt jedem selbst Ăźberlassen.

32

Den Paketinhalt der Vorlagendatei schaut man sich wieder mit einem Rechtsklick und über die Option „Paketinhalt anzeigen“ aus dem Kontextmenü an. Alle verwendeten Dateien aus dem Theme liegen im Ordner „Shared“. Hier kann ich nun Hintergrundbilder tauschen oder abändern. Damit diese in der iWeb-Vorlage angezeigt werden, müssen die Bilddateien den gleichen Namen wie die Ersetzten haben. iWeb-Vorlagen sind oft so aufgebaut, dass die Hintergrundbilder genau die Breite der Seite haben. Will man nun die Seitenbreite ändern, passt sich das Bild nicht an die neuen Masse an und man hat eine Lücke in seinem Layout. Also bleibt einem nichts anderes übrig als die Bilddatei auf die Seitenbreit anzupassen. Hierfür verwende ich entweder die in der Vorlage befindlichen Bilder, oder erstelle komplett neue Grafiken und designe so ein komplett neue Layout nach meinen Vorstellungen. Aber bitte immer darauf achten, dass die Bilddateien fürs Internet optimiert sind, da sonst die Seite zu lange laden würde.

Nach den Veränderungen der Vorlage muss man die Webtheme-Datei nur wieder zurück in das iWeb-Paket kopieren. Nach dem nächsten Erstellen einer neuen Seite mit meiner geänderten Vorlage, habe ich mein Layout geändert. Gegebenenfalls muss ich natürlich die Seitenbreite in diesem Fall erneut verändern. !ACHTUNG! Immer ein Sicherheitskopie der Original-Dateien erstellen um bei Problemen wieder zum alten Zustand zurück kehren zu können.

Tipp: Als Vorlage für eine helle Seite, sollte man immer eine helle Vorlage wählen, und für eine dunkle Seite natürlich eine dunkle Vorlage, damit die Schriftfarbe auch dementsprechend die richtige Farbe hat.

In der nächsten Ausgabe beschäftigen wir uns mit dem Navigationsmenü von iWeb. Wie kann ich die Grösse, Schrift oder sogar Farbe ändern.

Also, nicht die nächste Ausgabe verpassen, es lohnt sich! !

33

Vorgestellt ! ! ! ! ! ! !

Zur Person: Name:!

Dietmar Schönwandt Alter:!!

44 Jahre Beruf:!

Maschinenbautechniker in kaufmännisch- / ! ! technischer Tätigkeit Hobbys:! Digitales Gestalten, kreatives Arbeiten, ! !

Fotografieren

1986 kam ich durch meine Fortbildung zum Techniker das erste Mal mit einem Computer ähnlichen Gegenstand in Berührung. Ein in Basic programmierbarer Taschenrechner, welcher für meine schulischen Aktivitäten nötig war. Gefolgt von einem Amiga C128+ und einem Amiga 500, auf denen ich meine damaligen Programmierkenntnisse vertieft habe.

Begonnen am Computern zu arbeiten habe ich im Jahr 1988 bei meinem Berufsstart als Techniker. Zu meinem ersten Mac bin vor ca. zweieinhalb Jahren gekommen, was ich bis zum heutigen Zeitpunkt nicht bereut habe. Die erste Hompage wurde von mir vor 10 Jahren für meine jetzige Firma gestaltet, welche mittlerweile in der 5. Version vorliegt.

Diese ist komplett mit iWeb gestaltet und wurde mit etwas Nacharbeit für Suchmaschinen optimiert. Betrachtet man die damaligen und die heutigen Möglichkeiten, wird einem klar, wie schnell die Entwicklung gerade in diesem Bereich geworden ist und welche grossen Dinge man mit der heute zur Verfügung stehenden Technik bewerkstelligen kann.

Lange suchte ich im privaten Bereich nach einem Beschäftigungsfeld um mich kreativ zu betätigen. Bedingt durch meine Tochter die mit dem Fußballspielen begann, kam ich schnell dazu eine kleine Internetseite für die damals noch kleinen Mädchen zu gestalten.

Daraus wurde dann immer mehr, es folgten Spielberichte und zum Schluss Fotoalben zu den einzelnen Spielen. Zu diesem Zeitpunkt entstand meine erste eigene Internetseite, welche bis jetzt Bestand hat und immer weiter ausgebaut wird. Durch meine Arbeit mit iWeb kam ich zum iWeb-Forum, in dem ich unter anderem als Moderator tätig bin. Aus dieser Arbeit entstand dann als nächstes Projekt mein Blog in dem ich versuche möglichst interessante Dinge und Techniken zu iWeb festzuhalten und zu veröffentlichen. Meine Tochter hat die Fußballschuhe mittlerweile an den Nagel gehangen und so sucht man sich immer neue Aufgabengebiete. Durch meinen Blog und dem Zulauf auf diesen Seiten kam mir die Idee, warum kein Onlinemagazin ins Leben rufen. Möglichkeiten und Techniken gibt es zu genüge. So war das nächste Projekt geboren, das iWeb Magazin. Ob dieses ankommt und die Leute interessiert, wird sich zeigen. Über Feedback würde ich mich jedenfalls freuen und in diesem Fall wird das Projekt fortgeführt und es gibt noch viel zu berichten und dementsprechend zu lesen. !

!

!

!

!

!

!

!

!

!

!

!

!

!

Euer

!

!

!

!

!

!

!

!

!

!

!

!

!

!

Didi

34

iWeb-Seiten - Vorgestellt

! ! ! ! !

! In jeder Ausgabe des iWeb Magazins soll ! über ein bis zwei mit iWeb erstellte Seiten ! berichtet werden. Hauptaugenmerk sind die ! verwendeten Techniken die hier erläutert und ! beschrieben werden sollen. Hier kommen auch ! die Gedankengänge der Gestalter nicht zu kurz. ! Was hat er sich bei dem Layout gedacht, warum ! das Eine so und das Andere so gelöst. Ein kurzes ! Portrait der Person hinter der Seite soll dieses ! abrunden . Da hier jedoch noch kein endgültiges Schema existiert, habe ich in dieser Ausgabe meine Seite ausgewählt damit ich mir selber darüber im Klaren zu werde, wie diese Rubrik aufgebaut werden kann. Ich hoffe, dass ich genügend Interessierte finde, die bereit sind, sich und ihre Seite der Öffentlichkeit zu präsentieren. So kann jeder vom anderen lernen und es wird genug Seiten geben über die es sich zu berichten lohnt.

! ! ! ! !

Seite: ! !

Thema:! !

Techniken:! ! ! ! ! ! !

! ! ! ! ! ! ! ! ! ! ! ! ! ! ! ! ! ! ! !

Eigene Gedanken zur Seite: Bei der Gestaltung meiner privaten Homepage ging es mir eigentlich um die Darstellung meiner Vorlieben in Verbindung mit coolen Techniken im Bereich der Internetpräsentation. Da meine Familienwurzeln an der Ostsee liegen und die ganze Familie diese Region liebt, spiegelt sich genau diese Vorliebe im Thema des Layouts der Seite wieder. Bis das jetzige Layout fertig war, vergingen einige Monate. Durch ständiges Versuchen und Verbessern der Seite habe ich einiges über das Programm iWeb und dessen Möglichkeiten gelernt und genau wie jeder Anfänger beim Start der Seite Fehler begangen. Angefangen mit zu grossen Grafiken und vielen Spielereien die iWeb mit sich bringt, war anfänglich die Ladezeit der Seite zu hoch, was dann jedoch durch Finetuning ausgemerzt wurde. Eins war auf jeden Fall beim Gestalten der Seite wichtig. Das eigene Design umzusetzen und ein einheitliches und stimmiges Layout zu kreieren. Im Grossen und Ganzen ist dieses für mein Empfinden gelungen und ich als Person kann mich mit meiner Seite identifizieren. In meinen Augen eines der wichtigsten Punkte, der bei der eigenen Homepage im Vordergrund stehen sollte. Sicherlich ist es für jemanden der etwas kreiert auch wichtig, wie denken andere über mein Werk. Da Geschmäcker bekanntlich verschieden sind, wird man es niemals jedem Recht machen können und das sollte in meinen Augen auch nicht der Sinn und Zweck der eigenen Hompage sein.

http://www.schoenwandt.info Profilseite zur Privatperson, Familie, und Tätigkeiten Gestaltung mit iWeb, Bildüberarbeitung mit Photoshop, Einbindung von externen Techniken in die iWeb Seite - Dock-Menü, Menü mit Mouseover-Technik, Fotoalben, Gästebuch.

35

Der Aufbau: Als Vorlage meiner Seite diente das einfache weiße Theme, welches von Apple selber seit iWeb 1.x angeboten wird. Das Standard-Menü ist deaktiviert, dieses wurde von mir durch zwei eigene Menüs in der Seite ersetzt. Die ursprünglichen Maße des Layouts liegen bei 900 x 750 Pixeln, nur die Home-Seite wurde im Nachhinein durch Einbindung des RSS-Widget auf 1100 x 750 Pixel erweitert. Mit dem RSS-Widget von iWeb habe ich den RSS-Feed meines externen Blogs in Seite eingebunden, wodurch der Besucher direkt den Überblick hat, was gibt es für neue Themen im Blog. Die Grösse ist so gewählt, damit die Seite möglichst komplett im Browserfenster dargestellt wird. Um die Ladezeit zu verkürzen, setzt sich die Seite aus einem Hintergrundbild und wenigen überarbeiteten Bildern zusammen.

Das Hintergrundbild hat genau die Grösse der Seite, wobei der linke Rand Platz für das Mouseover-Menü bietet. Durch den weissen Hintergrund habe ich jedoch eine Trennung zwischen Menü und dem Seitenbereich erzielt, was das Erscheinungsbild auflockert. Das Mouseover-Menü ist eine HTML-Seite, welche als iFrame eingebunden ist.

Vorteil bei dieser Technik: Es braucht nur die eine Seite geändert werden und die Änderung erscheint automatisch auf allen Seiten.

Das Dock-Menü verleiht der Seite zusätzliche Dynamik und spiegelt die Verbundenheit zu Apple wieder.

36

Das Hintergrundbild der Home-Seite wurde von mir für die Integration des RSS-Feeds um einen seitlichen Bereich mit Farbverlauf erweitert. Natürlich fehlt hier nicht der farbliche Bezug zum bestehenden Hintergrund.

Wie im Vorfeld schon beschrieben, hatte ich die Grösse des Bildes nicht beachtet und kam auf stattliche 650 Kilobyte nur fürs Hintergrundbild. Doch auch die verwendeten Bilder auf der Startseite taten das Ihrige dazu die Ladezeit der Seite zu verlangsamen. So suchte ich nach einer Möglichkeit die verwendeten Bilder mit dem 3D-Effekt der Rahmen zu übernehmen und die Grösse drastisch zu verändern. Hierbei kam mir der Workflow des Macʻs schnell zur Hilfe. Bilder in iWeb kopiert in Photoshop eingesetzt und als PNG abgespeichert. Diese Bilder dann in iWeb ohne Änderungen eingefügt, fertig ist das Tuning. Sicherlich habe ich durch diese Vorgehensweise Einbußen in der Qualität, diese ist für die Darstellung im Internet aber immer noch ausreichend.

Beim Aufbau meiner Seite habe ich lange überlegt, was möchte ich integrieren. Nach einigem Für und Wider habe ich mich für folgendes entschieden: - Startseite: Kurz, prägnant, fordert zum stöbern auf.

- Fotoalben: Kurzübersicht mit aussagekräftigen Bildern und Titeln.

- Projekte: Projektbilder mit Link zu den einzelnen Seiten - Newsticker: Blog als Newsticker (wurde durch den externen Blog ersetzt) - Über mich: Ansammlung von mir freigegebenen Informationen über mich inkl. Familie.

- Kontakt: Kontaktinformationen / -möglichkeiten zu meiner Person.

- Privat: Geschützter Bereich - Impressum: Impressum zu der privaten Homepage.

- Gästebuch: Externes Gästebuch in einem iFrame eingebunden.

37

Startseite: Als die Startseite erstellt wurde, kam die Überlegung auf, wie begrüsse ich die Besucher meiner Seite. Die üblichen Texte, wie „Herzlich willkommen.....“ wollte ich nicht verwenden und so kam der einfache und doch alles aussagende Satz „Den Norden im Herzen, im leben in NRW“ zustande. Seien wir doch mal ehrlich, wer liesst beim ersten Besuch einer Seite den Text des Internetauftritts?

Der visuelle Eindruck des Layouts wird eher hängen bleiben als der geschrieben Text auf der Seite. Ist der erste Eindruck positiv, so wird der Besucher auch auf der Seite verweilen und weiter stöbern.

Fotoalben: Als Hobbyfotograf möchte man natürlich auch ein paar der schönsten Fotos zeigen. Ursprünglich war die Seite mit aussagekräftigen Fotos und Titeln der einzelnen Alben versehen. Die Fotoalben sind mit dem Flash-Albumexporter aus iPhoto heraus erstellt und per Link mit den einzelnen Vorschaubildern verlinkt. Nach der Entdeckung der sich drehenden Bilderwolke habe ich diese Funktion ebenfalls in der Seite integriert, um der Seite weiteres Leben einzuhauchen. Da dieses Widget auf Flash basiert, habe ich dafür Sorge getragen, dass Besucher ohne Flash über einen link zur alten Version gelangen können. Auch im Fotowidget erscheinen die Vorschaubilder mit den Titeln der Alben.

Projekte: Da mit der Zeit einige Projekte im Bereich der Seitengestaltung entstanden sind, habe ich diese auf meiner Homepage dargestellt, um zu zeigen was ich als Person in diesem Bereich bisher auf die Beine gestellt habe. Durch Wegfall der Seiten für den damaligen Fußballverein meiner Tochter haben sich diese reduziert, werden aber durch andere Projekte wie dieses Magazin aufgefrischt. Wer weiss was noch alles kommt, Platz für Neues ist jedenfalls vorhanden.

38

Newsticker: Anfänglich war der Newsticker als RSS-Feed für meine Seite gedacht. Die ersten Einträge wurden am Anfang auch über die Blogfunktion von iWeb erstellt, doch durch die fehlende Kommentarfunktion und Suchmöglichkeit auf nicht Apple-Servern schnell verworfen. Der externe Blog über Wordpress erfüllt dieses besser und lässt sich, wie auf der Startseite zu sehen ist, bequem mit dem RSS-Widget aus iWeb 3 in der eigenen Seite einbinden. Weiterer Vorteil des Wordpress-Blogs, ich bin unabhängig und kann von überall auf den Blog zugreifen und schnell mal eine Änderung vornehmen, oder einen neuen Beitrag erstellen. Selbst vom iPhone lässt sich über das entsprechende App von unterwegs Bloggen was das Zeug hält. Über mich: Wer hier die grosse Offenbarung erwartet, wird wahrscheinlich enttäuscht werden. Bis auf ein paar Fotos aus meinem Leben mit kurzen Sprüchen, gibt es hier nicht viele Infos zur Person. Anfangs dachte ich noch, nur nicht zuviel preisgeben, wer weiss wer die Seite alles besucht. Mittlerweile denke ich, so viele Informationen, wie sie bereits im Internet zu finden sind, da kommt es auf ein paar mehr oder weniger auch mehr nicht an. Letztendlich ist jeder selbst dafür verantwortlich was er online stellt oder nicht. Lieber gezielt, positive Dinge von sich preisgeben, als negativ im Internet zu erscheinen!

Später fielen mir dann noch alte Familienfotos, sowie unser Stammbaum in die Hände.

Schnell wurden auch diese Informationen verwertet, Ahnenforschung 2.0, hier war der Stammbaum das Aufwändigste. Altdeutsche Handschrift ist nicht immer so leicht zu entziffern, wobei mir meine Eltern hier tatkräftig unter die Arme gegriffen haben.

Kontakt: Zur Seite Kontakt ist eigentlich nicht all zuviel zu sagen.

Kontaktdaten über die eigene Person, mit einer kleinen Funktion, worüber der Onlinestatus von meinem iChat Profil angezeigt wird. Abhängig vom Staus wird die jeweilige Grafik angezeigt. Über einen Klick auf das Symbol wird das entsprechende Programm gestartet um Kontakt aufzunehmen. Für Leute die anzeigen möchten ob sie online sind eine feine Sache. Für mich eine nette Spielerei.

39

Privat: Diese Funktion war eigentlich dazu gedacht ein Onlinearchiv auf meinem Server anzulegen um so von überall Zugriff auf persönliche Daten zu haben. Hier haperte es aber leider an der serverbasierten Umsetzung. Trotz PHP-Unterstützung habe ich bis jetzt noch keine Anwendung gefunden die eine webbasierte Dateiverwaltung bietet, die ausreichend komfortabel in der Anwendung ist. Vielleicht werde ich in Zukunft in dieser Richtung noch etwas weiter forschen, doch im Moment liegen die Prioritäten in anderen Belangen wie diesem Magazin.

Impressum: Von Niemanden wirklich gewollt, doch vom Gesetz her eine Pflicht, das Impressum. Je nach Art und Weise der Seite sollte dieses mehr oder weniger ausführlich sein. Auch auf privaten Seiten kann man Ärger vorbeugen und ein Impressum auf seiner Seite veröffentlichen. Ist es für gewerbliche Seiten absolut ein Muss, so bewegt man sich als Privatperson eher in einer Grauzone. Wie heisst es doch so schön: „Vorsicht ist die Mutter der Porzellankiste!“ Also, wo eins vorhanden ist kann auch keiner reklamieren.

Andernfalls kann es teuer werden!

Gästebuch: Am Anfang stolz eines zu haben, mittlerweile eher mit gemischten Gefühlen betrachtet, ist das via iFrame eingebettete Gästebuch. Der Nutzen und die Frequentierung des Gästebuchs ist im Zeitalter von Web 2.0 eher verhalten. Betrachtet man die Anzahl der Besucher auf meiner Seite und die Einträge im Gästebuch, so könnte man auch durchaus darauf verzichten. Ebenso wie die Kommentarfunktion in meinem Wordpress-Blog. Hier gibt es nur selten Personen, die die Arbeit wirklich zu schätzen wissen, die hinter solch einem Projekt steht. Ein einfaches Danke für die Tipps, oder toll gemacht, weiter so. Vermutlich liegt es an der vermeintlichen Anonymität des Internets. Mal eben ein paar Infos abgreifen und schon bin ich wieder verschwunden. Ist schade, doch 8 ernst gemeinte Einträge zu 51 Spamversuchen sprechen eine klare Sprache. Und das bei mittlerweile durchschnittlichen 100 - 200 Klicks am Tag alleine im Blog.

40

Alle verwendeten Techniken auf meiner Seite, bis auf das Mouseover-Menü und die iChat-Funktion sind in meinem Blog http://blog.schoenwandt.info veröffentlicht und erklärt.

Die zwei fehlenden Techniken werde ich in der nächsten Ausgabe vorstellen und beschreiben.

Verschiedens

Die Magie des fehlenden Rades Erste Eindrücke zur neuen Magic Mouse von Apple. Hat Apple das Rad neu ent(er)funden?

Bildquelle: Apple.com

Apple hat mit seiner letzten Produktaktualisierung ein neues und innovatives Eingabegerät der Öffentlichkeit vorgestellt. Aus der Apple Mouse wurde die Magic Mouse.

Die erste für den Konsumermarkt erhältliche Maus mit Touch-Oberfläche. Multitouch statt Mausball, Wireless statt Kabel. Apple hat die bei den neuen Macʻs mitgelieferte Maus von Grund auf neu konzipiert und überarbeitet.

Als ich die Maus das erste Mal zu Gesicht bekam, war mein erster Gedanke „Wow“. Als ich die Maus dann das erste Mal live erleben durfte, habe ich mich spontan entschlossen, die muss ich haben. Elegantes Design gepaart mit sauberer Verarbeitung lassen die neue Magic Mouse schnell zum Objekt der Begierde avancieren. Der Eindruck beim ersten Benutzen der Maus, „Keine grosse Umstellung“. Hier ist es Apple gelungen die neue Technik so gut umzusetzen, dass man glauben möchte, man hätte nie etwas anders benutzt, wären da nicht die neuen Features.

Bildquelle: Apple.com

41

Multitouch-Gesten auf der Mausoberfläche. Auch wenn hier nicht alle Funktionen umgesetzt wurden, Softwareupdates machenʻs möglich und werden in der Zukunft sicherlich folgen. Nun darf ich die Maus bereits 2 Tage mein eigen nennen und komme ohne Probleme mit dem neuen Gerät klar. Eines der wohl störendsten Merkmale der Apple Mouse gehören der Vergangenheit an - Verschmutzter Mausball ade!

Weiter positiv, ist mir auf Anhieb die dynamische Scrollgeschwindigkeit, die man bereits vom iPhone kennt, aufgefallen. Selbst das Nachlaufen beim Scrollen kann über die Mauseinstellungen aktiviert werden. Besucht man öfters lange Internetseiten wie Foren oder Blogs, so ist dieses ein grosser Pluspunkt. Auch die neu entwickelte Abtastoptik der Magic Mouse lassen springende Mauszeiger der Vergangenheit angehören. Selbst Schreibtische mit Holzmaserung bereiten der neuen Maus keine Probleme mehr, wobei Glasplatten auch weiterhin nicht unterstützt werden. Die Installation ist schnell durchgeführt, nach dem Einbinden ins System funktioniert die Maus zwar, für den vollen Funktionsumfang muss jedoch ein Update von der Apple-Seite geladen werden. Dieses wird über die Softwareaktualisierung automatisch angeboten.

Was bei der neuen Magic Mouse im Gegensatz zum Vorgänger fehlt, sind die seitlichen Tasten, sowie der Mausball-Klick. Spaces muss so, entweder über die Tastatur oder über eine aktive Ecke aktiviert werden. Ebenso das Dashboard was früher über den MausballKlick aufgerufen wurde, kann nun nur noch über besagte Funktionen gestartet werden.

Wie sich die Maus beim alltäglichen Gebrauch schlägt und ob sie ihre volle Magie entfaltet, wird in der nächsten Ausgabe beschrieben.

Klein, leicht und voller Technik Der neue iPod Nano, nur ein Facelift, oder was steckt genau hinter dem neuen Zugpferd aus Cupertino?

Da mir mein iPod Video zu gross und zu unhandlich war, kam mir die Produktaktualisierung aus Cupertino gerade recht. Nimmt man den neuen iPod nano das erste Mal in die Hand, ist man überrascht, wie leicht der neue VideoKameraRadioSchrittzählerPlayer in Wirklichkeit ist. Im Aussehen unterscheidet sich das Gerät nicht stark vom Vorgängermodell, bis auf die Oberfläche, das grössere Display und die Kamera auf der Rückseite, hat sich optisch nichts verändert. Doch Apple wäre nicht Apple, wenn da nicht die inneren Werte auftrumpfen würden.

Bildquelle: Apple.com

42

Die Videokamera bietet zwar nicht die Möglichkeit Fotos zu schießen, für eine kurze Momentaufnahme ist diese jedoch bestens gewappnet. Bei einer Auflösung von 640 x 480 Pixeln bringt die Kamera erstaunliches Zustande. Eine Videokamera mit HD Videos kann der iPod natürlich nicht ersetzen, doch lassen sich mit der eingebauten Linse erstaunlich scharfe Nahaufnahmen mach, ausreichend Licht natürlich vorausgesetzt. Die insgesamt 15 Videofilter, welche über die Einstellungen ausgewählt werden können machen Lust auf mehr. Die Filter werden direkt am iPod angewendet und so müssen die Filme im Nachhinein nicht mehr bearbeitet werden. Einzig und alleine die Position der Linse ist gewöhnungsbedürftig. Hier hatte Apple wohl aus Platzmangel keine andere Möglichkeit der Positionierung. Doch lieber ungewohnt als nicht vorhanden!

Mit der Radiofunktion bietet der neue Nano nun die Möglichkeit, den Lieblingssender auch über den iPod zu hören. Voraussetzung hierfür ist ein eingesteckter Kopfhörer.

Entgegen den getroffenen Aussagen, dieses würde nur mit Apple eigenen Kopfhörern funktionieren, hat das Radio hören bei mir auch mit Kopfhörern anderer Hersteller funktioniert. Einmal einen Sender gefunden, kann man diesen als Favoriten abspeichern. Einen Sendersuchlauf bietet der iPod ebenfalls, hierfür hält man die Vor-/Rückwärtstaste gedrückt, der iPod springt dann automatisch zum nächsten Sender. Als weiteres Feature bietet der neue Nano die so genannte Live-Pause, ähnlich wie bei der Timeshift Funktion bei Videorekordern. Hier kann ich die Sendung pausieren und später wieder fortsetzen.

Diese Funktion ist jedoch auf max. 15 Minuten begrenzt und die so aufgenommene Sendung kann nicht abgespeichert werden. Wohl lassen sich Titel kennzeichnen und beim nächsten synchronisieren in iTunes kaufen, hierfür muss der Sender jedoch über das RDS Signal die benötigten Informationen bereitstellen. Ob dieses in Deutschland überhaupt unterstütz wird ist noch fraglich.

Das Pedometer oder auch Schrittzähler genannt, ermöglicht seit neustem in Verbindung mit, oder auch ohne Nike - Sport Kid seinen Trainingszustand zu überwachen und so immer auf dem Laufenden zu bleiben.

Sollte ich jemals Sonntags morgens um 8:00 Uhr das Joggen anfangen, werde ich zu diesem Feature mehr schreiben. Aber vielleicht zählt der iPod ja auch die Schreibgeschwindigkeit!

Alles in allem macht der iPod einen durchaus positiven Eindruck. Die Grösse und sein Gewicht ein absoluter Pluspunkt. Und der Rest, nun ja, Apple lässt grüßen!

43

Ausgabe 1 - 11/2009