Bernhard
Bernhard » Bilder und so » Webseiten »   Impressum
Bilder und so
Hochzeitsdrachen
Herzklopfen
Doppeldecker
A400M Erstflug
Webseiten
Hubschrauber Bilder
Harrys CH-53
Stabio 2005
Drachen
Double Parasled
Indische Fahne
Sauls Drachen
Bow Kite
Pterosaurier
Superfliege
15m Octopus
Windbogen
Feuersalamander
Bauplan: Starflake
Bauplan: Seabird
Bauplan: Seven-Sisters

Sprache/Language

Homepages und Blogs

Seit 1994 habe ich eine Homepage im Internet. Diese allererste Homepage habe ich damals zusammen mit Robert aufgebaut. Mittlerweile betreibe ich verschiedenste Homepages und Blogs, und immer wieder auf anderen Grundlagen.

Die erste Drachenhomepage

Es gab mal Zeiten, da hat man die Homepages noch mit einem einfachen Texteditor erstellt. Grundlage waren einfache HTML (Hyper Text Markup Language) Befehle, mit denen man die Seiten erstellt hat.

Meine erste Homepage habe ich 1994 erstellt. Robert und ich wollten irgendwie Informationen zu unseren Drachen im Internet bereitstellen. So entstand die allererste Seite. Da wir selber noch keinen Server im Internet hatten, wurden die Seiten freundlicherweise von Sven Hapke auf dem Webserver der Uni Bremen gehostet.

Robert und ich haben auf diesen Seiten Bilder unserer Drachen und Hintergrundinformationen bereitgestellt. Für mich ist dies mittlerweile die einzige Möglichkeit festzustellen, wann und in welcher Reihenfolge ich meine verschiedenen Drachen gebaut habe.

Das erste CMS

2005 hat sich unsere Familie zusammengesetzt und überlegt, ob wir eine Homepage brauchen und wie denn dann die Internet-Adresse aussehen sollte. Am Ende haben wir uns dann auf malle-land.de geeinigt. Mein Favorit war eigentlich mallefix.de, aber unsere aktuelle Adresse ist bestimmt universeller und einprägsamer.

Ein Anlaß für die Homepage war auch die immer wiederkehrende Nachfrage der verschiedenen Verwandten und Großeltern nach Geschenkwünschen unserer Kinder zu den diversen Feiertagen. Und wie es halt so passiert, wenn man Wunschlisten an eine große Anzahl von Verwandten verteilt, haben wir im Laufe der Jahre auch immer mal wieder doppelte Geschenke bekommen. So entstand bei mir die Idee einer Online-Wunschliste. Und damit man Geschenke darauf auch markieren und dann von der Liste nehmen kann, habe ich das Ganze als "Wunsch-Shop" aufgesetzt. Inspiriert von Amazon konnte man sich bei uns auf der Homepage die Wunschlisten unserer Familie anschauen, Wünsche reservieren und damit von der Liste streichen. Dazu habe ich die Software oscommerce hier in unsere Homepage eingebaut. Die Wunschlisten habe ich allerdings mittlerweile wieder abgeschaltet - die Verwirrung unter den Verwandten und Freunden war wohl doch zu groß.

Die Webseite "Malle-land.de" an sich läuft mit Typo3, einem sehr gut strukturierten und erweiterbaren CMS (Content Managament System). Die Seiten von malle-land.de sind in zwei größere Bereiche eingeteilt. Zum einen natürlich die einzelnen Internetseiten zu unseren Familienmitgliedern, und zum anderen ein spezieller Bereich für meine Hobbies (Drachen und Hubschrauber). Auch grafisch sind die Seiten anders aufgebaut. Bei den Familienseiten gibt es im Header Bilder des entsprechenden Familienmitgliedes, während ich für meine Bereiche jeweils eigene Banner implementiert habe. Seit kurzem experimentiere ich auch mit Javascript, sodass es im Banner auch noch wechselnde Bilder gibt.

Dann habe ich einen News-Bereich definiert. Es gibt für fast jeden Artikel eine eigene Ankündigung als "Teaser" mit zwei bis drei Zeilen Text und einem kleinen Bildchen. So kann man sich am schnellsten einen Überblick verschaffen, wo es welche Änderungen gegeben hat. 

Da Typo3 sehr mächtig und umfangreich ist, konnte ich dieses Mal zum ersten Mal mit verschiedenen Sprachen arbeiten. Die erste Installation war relativ verzwickt und aufwendig, aber wenn es einmal eingerichtet ist, klappt das relativ einfach. Für viele Seiten gibt es eine englische Übersetzung und bei manchen sogar eine französische.

Typo3 hat den Vorteil, dass die jeweiligen Internetseiten nicht statisch irgendwo abgelegt sind, sondern immer wieder dynamisch zusammengesetzt werden. Am einfachsten kann man das vielleicht am Beispiel des Menüs auf der linken Seite erläutern. Wenn ich eine Seite nicht mehr öffentlich zugänglich haben möchte, dann reicht es einfach im Administrationsteil von Typo3 diese Seite oder eben den Menüeintrag als "hidden" zu markieren. Typo3 sorgt dann dafür, dass nicht nur der Menüeintrag verschwindet, sondern auch alle anderen Links, die ich irgendwo auf diese Seite gesetzt habe, nicht mehr aktiv sind.

Ab sofort wird gebloggt

2007/2008 haben wir mit den ersten Planungen für unser eigenes Haus begonnen. Beim Stöbern im Internet sind wir auf eine Reihe von Hausbautagebüchern gestossen. Und so stand auch bald für uns fest, dass wir auch über den Bau unseres Hauses Tagebuch führen wollten. Mittlerweile sind Homepages ja eigentlich schon wieder völlig out - heutzutage bloggt man.

Ein Blog bietet sich an, wenn man sehr häufig kleiner Beiträge oder Geschichten im Internet möglichst ohne großen Verwaltungsaufwand veröffentlichen möchte. Unser Hausbautagebuch läuft auf der Basis von Wordpress, damals und heute eine der am weitesten verbreiteten kostenlosen Blogging-Software. Auch dieses System habe ich an der einen oder anderen Stelle an unsere Bedürfnisse angepasst. Nachdem der Hausbau spätestens 2009 abgeschlossen ist, tut sich allerdings nicht mehr sehr viel auf dieser Internetseite. Wenn ich Zeit finde, werde ich vielleicht mal über den Gartenbau berichten.

Jetzt wird es professionell

Anja hat sich 2011 selbständig gemacht und bietet Watsu Sessions an. Für diesen Zweck brauchen ihre Partnerin und sie natürlich auch einen Internetauftritt. Zu diesem Zweck habe ich 2012 die Seite Watsu-Wellness.de eingerichtet.

Auch Watsu-Wellness.de läuft mit Typo3. Natürlich wurde der Aufbau an Anjas und Karins Wünsche angepasst, aber an der Verwaltung der Seiten hat sich im Prinzip nichts geändert. Zum ersten Mal habe ich jetzt aber zwei Frontend-User mit speziellen Rechten eingerichtet, sodass Karin und Anja ihre Seiten im Prinzip auch selber verwalten, gestalten, ändern und/oder erweitern könnten.

Auch für meinen Beruf habe ich mittlerweile eine eigene Internetseite eingerichtet. Hier können sich potentielle Auftraggeber in drei Sprachen über mich informieren. Von Lebenslauf, über Fähigkeiten, beruflicher Praxis und Hobbies habe ich die verschiedenen Informationen aufgeführt. Dazu jeweils andere Banner und ein farblich passendes Navigationsmenü auf der linken Seite.

Meine berufliche Tätigkeit war auch die Chance, eine weitere nützliche Fähigkeit von Typo3 (letztendlich erfolgreich) zu testen. Man kann mit Typo3 verschiedene Webadressen gemeinsam verwalten. Das Typo3, mit dem ich malle-land verwalte, verarbeitet auch alle Anfragen an Watsu-wellness.de. 

Gleiche Konfiguration bei meinen beruflichen Adressen: bernhard-malle.de und twincopter.de laufen in der gleichen Typo3-Installation. Insofern hat sich der Einstieg mit dem sehr mächtigen Typo3 auf jeden Fall gelohnt - auch wenn wir am Anfang doch nur eine kleine Familienhomepage machen wollten.

...und jetzt auch noch Facebook

Im Oktober hatte ich eine wunderbare Watsu-Session bei Anja genossen. Und während ich da so warte, mache ich schnell mal einen Eintrag über den Ort (Bad Dietzenbach) und Watsu-Wellness auf Facebook. Und da ich dieses Geschäft als allererster angelegt habe, bekomme ich von Facebook das Angebot, für dieses Geschäft eine eigene Seite in FB anzulegen.


Das geht ja einfach! Schnell noch alle Bekannten und potentiell Interessierten auf Facebook einladen und schwupp haben wir schon 24 Like's. Das ging ja richtig schnell.

Javascript

Lange habe ich mich gegen die Verwendung von zusätzlichem "Programmierschnickschnack" auf meinen Homepages gewehrt. je mehr Komponenten man verwendet, umso aufwändiger wird die Erstellung und Einrichtung der Homepage und vor allem steigt auch der Testaufwand. Nicht immer sind alle modernen Technologien auch auf allen Geräten verfügbar. Eine Weile waren Flash-Animationen sehr beliebt - aber was macht man, wenn Apple diese Technik auf seinen Geräten und Browsern nicht unterstützt?

Irgendwann wollte ich dann aber doch eine schickes, modernes Banner auf meiner Homepage. Banner sind die Bilder, die man mittlerweile auf jeder Homepage ganz oben findet. Bei malle-land.de stehet dann einfach nur der Name und links und rechts sind manchmal andere Bilder, je nach Familienmitglied. Bei meinem Bereich habe ich jetzt aber Banner, bei denen die Bilder immer wieder wechseln.


Bei meinen Hubschrauber wird zwischen drei verschiedenen Bildern hin- und her gezoomt, bei den Drachen laufen die Bilder mehr oder weniger langsam aus den verschiedenen Richtungen durch das Banner. Bei Anjas Watsu-Homepage werden drei verschiedene Schriftzüge vor der dem Wasserhintergrund langsam eingeblendet und verschwinden dann wieder langsam. Das funktioniert alles - nur so richtig konnte ich mich mit Javscript noch nicht anfreunden.

HTML5 und CSS

Mittlerweile hat sich die Internet natürlich weiterentwickelt. Manchmal habe ich den Eindruck, dass mittlerweile die Facebook-Seite wichtiger ist als eine eigene Homepage. Bei Facebook ist es halt auch superschnell eingerichtet, man hat kaum Ärger mit der Formatierung, es kostet nichts - nur mit der Datensicherheit ist das so eine Sache.

Aber auf jeden Fall ist Facebook fast überall verfügbar und vor allem auch auf den vielen "neuen" Ausgabemedien, wie Tablets und Smartphones. Diese Geräte können nicht nur Facebook auf ihrem manchmal winzigen Bildschirm darstellen, sondern auch normale Internetseiten. Und da der Bildschirm so klein ist, braucht man dafür eigentlich spezielle Webseiten.

Hier kommt HTML 5 und CSS ins Spiel. Früher hat man im Browser eine Abfrage eingebaut: "Was für ein Gerät bist Du denn?" Abhängig von der Antwort wurde der Besucher dann auf spezielle Unterseiten geleitet. Das muss aber nicht so sein. Mittlerweile kann man diese "Weichen" auch ganz elegant mit HTML programmieren und stellt einfach die Inhalte anders da, oder lässt "schmückendes Beiwerk" weg.

Das habe ich zum ersten Mal bei Anjas neuer Seite Aquamovens.de umgesetzt. Diese Seite verhält sich je nach Ausgabegerät (normaler Bildschirm - großer Tabletcomputer hochkant - großer Tabletcomputer quer - großes Smartphone - kleines Smartphone) anders und stellt die Inhalte der geänderten Auflösung angepasst dar. Es gibt auch extra Firefox-Addons, die dem Entwickler auf einer Seite alle verschiedenen Darstellungsformen zum Test ausgeben. Jetzt müssen wir nur noch die Texte für Anjas eigene Homepage erstellen und schöne Bilder aussuchen.

Für unser befreundetes Hauptgruppen S-Klasse-Tanzpaar habe ich eine Werbeseite auf Basis Wordpress erstellt. Das ist die gleiche Software wie bei unserem Hausblog, diesmal allerdings zentral (und vor allem kostenlos) gehostet bei wordpress.com. Das Aussehen der Blogs kann man innerhalb weniger Minuten durch die Verwendung verschiedener Themes sehr einfach komplett umstellen.

Mittlerweile habe ich festgestellt, dass das verwendete Template sogar "responsive" ist. Das, was ich bei meiner selbst erstellten Webseite doch relativ aufwendig programmiert habe, bringt das Template schon von Haus aus mit. Nicht schlecht! Oder unbewußt einfach das richtige Template verwendet. :-)

Aqua Movens online!

Jetzt ist endlich auch Anjas Aqua Movens Homepage online. Wir haben noch ein paar Änderungen am Layout gemacht; aber jetzt ist alles fertig und online!

Links unten ist die Seite abgebildet, die man sieht, wenn man die Homepage in einem halbwegs normalgroßen PC-Bildschirm öffnet. Wenn man die Seite aber auf einem kleineren Smartphone oder Tablet aufruft, dann erscheint Anjas Homepage leicht verändert (siehe rechts unten).