Skip to content

Responsive Design

Ein kleines Softwareupdate zieht manchmal ganz unerwartete Änderungen nach sich. Mein Webhoster empfahl dieser Tage dringend, von PHP 5.2 auf PHP 5.5 umzusteigen. Leider produzierte anschließend dieses Blog haufenweise Fehlermeldungen. Glücklicherweise hatten sich die Serendipity-Entwickler schon längst darum gekümmert und eine neue Version zur Verfügung gestellt. Bei der Gelegenheit entdeckte ich, dass es für Serendipity nun auch eine Layoutvorlage gibt, die den Anforderungen des sogenannten Responsive Designs entspricht. Das heißt, dass sich das Layout dynamisch an die Größe des Ausgabegerätes anpasst – bis hin zum Weglassen unpassend großer Designelemente wie zum Beispiel der Kopfgrafik.
Ein ganz großes Dankeschön daher an dieser Stelle an das Developer-Team rund um Garvin Hicking und ganz besonders an Matthias Mees und Veit Lehmann für die Styles-Template „2k11“!

Wie man Google Maps ganz einfach in ein Blog einbinden kann

Um Kartenausschnitte aus Google Maps in ein Blog einzubinden, gibt es drei Möglichkeiten, die bisher mehr oder weniger problematisch waren.

Am einfachsten und dümmsten ist das Anfertigen und Hochladen von Bildschirmkopien, was in der Vergangenheit bereits zu Abmahnungen in vierstelliger Höhe geführt hat, weil der feine Unterschied zwischen einer kopierten Grafikdatei und eingebundenen Serverdaten nicht beachtet wurde.

Die zweite Möglichkeit, zu der Google selbst einlädt, ist das Einbinden eines HTML-Code-Schnipsels, der – vereinfacht ausgedrückt – ein Fenster (Iframe) auf das Google-Maps-Angebot öffnet. Diese Methode ist jedoch auf nichtgewerbsmäßige Webauftritte beschränkt. Es gibt daher ein Problem, sobald der eigene Webauftritt durch Werbung unterstützt wird. Unabhängig davon, ob die Werbeeinnahmen aufs eigene Konto gehen oder in die Taschen eine "Gratis"-Hosters fließen, können solche Seiten als gewerbliche Webauftritte zählen.

Für all jene Webschaffenden, die nicht über vollkommen einnahmenfreie Seiten verfügen, hat Google eine Programmierschnittstelle entwickelt, das sogenannte Google Maps API. Dieses wird nicht nur für rechtlich unbedenklich gehalten (auch von mindestens einem Juristen) und ist deutlich vielseitiger in den Gestaltungs- und Interaktionsmöglichkeiten, sondern hier wird auch jedem Webmaster ein eindeutiger Schlüssel zugeordnet, sodass Google die volle Kontrolle über die Auslieferung oder Nichtauslieferung der Karteninhalte behält und bei zu intensiver Nutzung Ausgleichszahlungen aushandeln oder aber gezielt Inhalte sperren kann. Diese dritte Lösung wäre perfekt für Blogs geeignet, eröffnet aber wiederum das Problem, dass Javascriptcode sowohl in den unsichtbaren Kopf- als auch in den Inhaltsbereich der Seite eingefügt werden muss. Wer mit einer fertigen Blogsoftware arbeitet, möchte aber wahrscheinlich nur ungern Googles Javascriptdateien in die Vorlagendateien einbinden, damit nicht bei jedem Seitenaufruf erst einmal haufenweise fremder Code durch die Gegend geschoben werden muss, der zudem nur dann wirklich benötigt wird, wenn auf der jeweiligen Blogseite tatsächlich auch ein Kartenausschnitt dargestellt wird.

Für die von mir verwendete Blogsoftware (Serendipity) gibt es zwar ein fertiges Google-API-Plugin von Zoran Kovacevic, das erlaubt jedoch nur die Darstellung eines für alle Seiten gleichen Kartenausschnitts in der Seitenleiste. Das ist nett für Blogs, die sich mit einem geografisch eng begrenzten Gebiet befassen, ich fand es jedoch für meine Zwecke ungeeignet.

Um aus dieser Zwickmühle zu entkommen, kann man nun die Möglichkeiten, die Google mit der Nutzung des API anbietet, mit der Einfachheit, die das Iframe-Codeschnipsel der bekannten Google-Maps-Seite bietet, kombinieren. Man benötigt dazu nur eine einzige zusätzliche Datei im Startverzeichnis des Blogs, die den ganzen API-Code enthält.

Der folgende Code könnte beispielsweise unter dem Namen "map.php" auf dem Webserver des Blogs abgelegt werden:

<head>
<script
 src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=LANGEKRYPTISCHEZEICHENFOLGE"
 type="text/javascript">
</script>
<script
 type="text/javascript">
 function initialize() {
 if (GBrowserIsCompatible()) {
  var map = new GMap2(document.getElementById("karte"));
  map.setCenter(new GLatLng(<?php echo $_GET['ll']; ?>), <?php echo $_GET['z']; ?>);
  map.setMapType(G_NORMAL_MAP);
  map.addControl(new GSmallZoomControl());
  }
 }
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="karte" style="width: 100%; height: 100%"></div>
</body>


Im Blogeintrag selbst ist dann nur noch folgende Codezeile einzufügen:

<iframe width="400" height="300" src="map.php?ll=51.472973,7.472579&z=24"></iframe>

Die Koordinaten (ll=51.472973,7.472579) und den Zoomfaktor (z=24) kann man einfach aus Google Maps übernehmen. In diesem Fall sollten die Pinguine des Dortmunder Zoos erkennbar sein:



Hier zum Vergleich der entsprechende Ausschnitt bei Google Maps

Jetzt sollte man noch dafür sorgen, dass nicht jeder die Datei map.php in seinem eigenen Webauftritt einbinden kann. Auch dafür gibt es eine einfache Lösung – aber das ist eine andere Geschichte.

Wegen der unklaren und in meinen Augen widersprüchlichen Angaben zur Zulässigkeit von Luftbildern in der Anfangsdarstellung der Karten empfehle ich momentan, das Aktivieren der Satelliten- oder Hybriddarstellung dem Nutzer der Seite zu überlassen. Der Spiegel hat zwar am 29. Februar 2008 eine Aussage von Google-Sprecher Kay Oberbeck dazu veröffentlicht, ob die im Ernstfall rechtlichen Bestand hätte, weiß ich jedoch nicht zu sagen. Auf die Frage "Wer darf Karten und Luftbilder von Google Maps per API eingebettet zeigen?" erhielt Spiegel-Redakteur Konrad Lischka jedenfalls die eigentlich positive Antwort: "Die kostenfreie Google Maps API darf auf Seiten angezeigt werden, welche für jedermann frei zugänglich sind, unabhängig davon ob es sich dabei um gewerbliche oder nicht-gewerbliche Seiten handelt. Ansonsten wird eine kostenpflichtige Google Maps Enterprise Lizenz benötigt." Auch von der Firma GeoContent gibt es laut einem Kommentar in Robert Basics Blog inzwischen grünes Licht für die API-Verwendung.

Neue Blogsoftware: Serendipity

Herzlich willkommen - seit heute gibt es hier nun auch ein "richtiges" Blog. Wer auf dieser Site regelmäßig mitliest, kennt bereits Martins Forum, das ja im Grunde immer schon mehr Blog als Forum war. Eigentlich wollte ich es nur etwas aufpolieren, weil es schon fast alles kann, was ich von einer Blogsoftware erwarte, doch dann siegte die Faulheit.
Für die Programmierarbeit auf der Grundlage des "kleinen Forums" hätte ich eine zwei- bis dreistellige Stundenzahl benötigt - Serendipity dagegen war nach dem Upload in weniger als zehn Minuten installiert und gefällt mir bisher ausgezeichnet.
Innerhalb der nächsten Wochen oder Monate soll dieses Blog das alte Forum ablösen, wenn es sich bewährt.

Auf keinen Fall möchte ich vergessen, mich für die Forensoftware, die mir soviele Jahre gute Dienste geleistet hat, bei Alex zu bedanken, der sein wundervolles Programm zur Verfügung gestellt hat!