Pixelfans

24 Feb 2011

SVG in VML konvertieren

geschrieben von Pawel

Thomas Magnum würde sagen:

Ich weiss was Sie jetzt denken und Sie haben recht.

VML ist das diese steinzeitliche, proprietäre Vektorsprache von Microsoft, die von den Browsern nur der Internet Explorer interpretiert?

Im Gegensatz dazu ist SVG doch leistungsfähiger und wird auch vom kommenden IE9 nativ unterstützt. Zudem kann das Format direkt aus gängigen Vektorprogrammen erzeugt werden.

Wenn SVG heute auf einer großen Seite verwendet wird, dann meist mit der Javascriptbibliothek Raphaël, um für die IE eine VML-Grafik zu erzeugen. Das ist solange nötig, bis die IE-Familie sich völlig erneuert hat, was noch 2-3 Jahre dauern wird.

Jede Lösung bleibt begrenzt, da das Format Filter, Animation u.v.m. nicht unterstützt. Statische Grafiken können aber auch ohne Javascript recht einfach halbautomatisch konvertiert werden.

Konvertieren von SVG zu VML Innerhalb von Inkscape sollten alle Farbverläufe durch gut abgrenzbare Vollfarben ersetzt werden.

Die Grafik wird dann im odg-Format gespeichert, welches OpenOffice versteht. Dieses Format ist so armselig, da es keine Farbverläufe anzeigtt. Die Grafik kann jetzt mit OO Draw geöffnet und per Kopieren und Einfügen in eine OpenOffice Textdokument kopiert werden, um es als doc (Word)-Datei abzuspeichern.

Wenn diese Datei jetzt mit dem Microsoftprodukt geöffnet wird, ist die Vektorkonvertierung bereits geschehen. Ab Word 2007 kann sogar die Grafik editiert werden und bestimmte Farbverläufe wieder hinzugefügt werden.

Ich empfehle die zu erstellende html-Datei als iframe in einen switch einzubinden, wie ich es im Blog schon erläutert habe. Nur Klugscheißer optimieren die niemals valide Datei per Hand weiter.

Wie das aussieht, kann man sich bei den Alternativgrafiken von meiner Batik-Seite abschauen.

Kategorie: Ideen , Layout , SVG | Trackbacks (0) | Permalink

23 Feb 2011

Wordpress Datenbankfehler abfangen

geschrieben von carsten

Wer wordpress betreibt wird u.U. schon einmal die Meldung “Error establishing a database connection” gelesen haben. Diese Meldung kommt immer dann, wenn man entweder die Datenbankanbindung falsch konfiguriert hat oder der hostende Server gerade soviele Anfragen zu bearbeiten hat, dass die Zeit überschritten wird, die das System standardmäßig abwartet bis die Antwort des MySQL Servers kommt.

Im Falle einer falschen Konfiguration ist das Problem sicher schnell behoben. Leidet aber die Maschine kurzzeitig oder dauerhaft an einer Überlastung müssen die Nutzer immer wieder mit dieser Meldung Vorlieb nehmen, was nun wahrlich unschön ist.

Eben dieses zweite Szenario hat mich gestern den ganzen Tag über auf christianrach.de beschäftigt. Nachdem diese Sendung bei RTL lief, ging der Server schon am Ausstrahlungsabend zeitweise in die Knie und kriegte sich auch am Folgetag gestern nicht wieder ein.

Meine erste Aktion war es, eine index.html im DocumentRoot zu hinterlegen, die alle ankommenden Nutzer über die aktuelle Überlastung und unser Engagement, etwas dagegen zu tun, informiert. Die Aktion war nötig, brachte mich aber auch in die verzwicklte Lage immer wieder nachsehen zu müssen, ob der Server schon wieder so stabil läuft, dass es Sinn machen würde die Datei wieder zu entfernen.

Viel klüger ist es da, wordpress selber entscheiden zu lassen, wann es keine Puste mehr hat und entsprechend meine Abfang-Datei auszuliefern.

Wie das funktioniert, ist im Codex erklärt und brachte mich dazu einfach den gesamten Inhalt meiner index.html in eine neu anzulegende Datei namens db-error.php zu packen, die im Verzeichnis /wp-content hinterlegt wird.

Jetzt kann ich mich getrost zurücklegen und abwarten, bis der Server das nächste Mal in die Knie geht. Schön, dass es jetzt mindestens so aussieht als sei noch alles in Ordnung.

Kategorie: PHP | Trackbacks (0) | Permalink

20 Feb 2011

@media in SVG

geschrieben von Pawel

Immer mehr Seiten nutzen SVG zur Darstellung von Diagrammen. Das hat einen großen Vorteil, lassen sich doch SVG's direkt aus Datenbanken erzeugen. Das ist zwar nach meiner Meinung bisher nur ein Bruchteil, was damit machbar ist, aber ein typisches Problem wird jetzt schon deutlich: Die Ausgabe der Grafik an verschiedene Ausgabegeräte.

Hier zeigt sich ein weiterer Vorteil des Formates - @media-Regeln werden interpretiert.

Ebenso, wie bei HTML ist es dazu nötig, innerhalb des CSS z.B @media print zu formulieren. Verwirrend ist es vielleicht, das CSS in SVG nicht ganz so mächtig ist. Viele Stile lassen sich auch als Atrribute formulieren, was typischerweise die älteren Programme zur Erstellung von SVG-Grafiken nutzen. Ein fill="red" ähnelt style="fill:red". Stile überschreiben die Attribute, wie

dieses Beispiel

illustriert. Filter, Farben usw. lassen sich bequem über Styles zuweisen und damit zwischen Druckansicht und Bildschirmansicht differenzieren.

Diese Geschenkebox

zeigt, wie so etwas aussehen könnte. In Verbindung mit media-queries sind hier auch unterschiedliche Größen der Grafik in Abhängigkeit vom Endgerät vorstellbar.

Kategorie: CSS , SVG | Trackbacks (0) | Permalink