SVG – Skalierbare Vektorgrafik

Screenshot - Mobil
Screenshot svg.mesuma.de

(M)ein Blog zum Thema SVG-Grafik im Browser

Mit der rasanten Entwicklung des Internets werden immer neuere Anforderungen an die Webseiten gestellt.
Durch die große Anzahl von Ausgabemedien: Handy, Smartphone, Tablet, Notebook, TV und Desktop-PC, mit verschiedenen Bildschirmauflösungen und Eigenschaften, ist eine frei skalierbare Darstellung von Fotos und Grafiken notwendig.

Bei Fotografien wird aus diesem Grunde eine hochauflösende Grafik bei Bedarf kleiner skaliert. Dabei werden allerdings mehr Bytes geladen, als benötigt werden. Gerade bei geringer Bandbreite ein Ärgernis.

Grafiken, die ohnehin als Vektor erstellt werden, können seit einiger Zeit browserübergreifend direkt auf den Webseiten eingebunden werden. Der Quellcode der SVG-Datei ist dabei oftmals kleiner als das Bild in der geringsten Auflösung.
Dies trifft allerdings nur dann zu, wenn direkt in SVG programmiert wird. Wer Inkscape oder den Adobe Illustrator zum Erstellen seiner Grafiken verwendet, genriert sehr viel nicht benötigten Overhead.

Im Blog werden einzelne Probleme, die bei der Umsetzung von Grafiken und Animationen auf Basis von SVG aufgetreten sind beschrieben. Soweit es bereits Lösungen dafür gibt, werden sind diese ausführlich beschrieben.

SVG Objekt spiegeln

Wer schon einmal ein komplexes Objekt, z.B. eine „animierbare“ Figur erstellt hat, möchte für die gespiegelte Variante nicht den ganzen Code kopieren. Hierfür habe ich eine Funktion gesucht, die meine Figur spiegelt.

Dazu sollte sich die Figur – „während“ der Spiegelung – vorzugsweise im Koordinatenursprung befinden, ansonsten muss anschließend der Versatz korrigiert werden.


<use xlink:href="#figur" transform="matrix(-1 0 0 1 0 0 )"/>
<use xlink:href="#figur" transform="scale(-1)"/>

Quellen

Hallo Welt!

Willkommen auf MeSuma.de, meiner Suchmaschine.

Nein, MeSuma soll keine Konkurrenz zu Google werden, eher eine Art „Merkzettel“ für wirklich gute Adressen im Netz.

Es ist nicht schwierig eine große Seite, die ohnehin im Google-Ranking ganz oben steht, zu finden bzw. wiederzufinden. Aber die kleinen Schätze am Rande, die bei Google durchs Raster gefallen sind oder von SEO-optimierten Seiten verdrängt wurden, sind schwer zu finden.

Wenn man doch mal versehentlich über eine solche Seite stolpert, dann tut man gut daran diese Seite in seinen Bookmarks zu speichern oder besser noch zu verlinken.

Der hohe Stellenwert von Backlinks bei der Bewertung von Seiten, kommt nämlich daher, dass ursprünglich Links gesetzt wurden, um auf zusätzliche Informationen zu verweisen oder einen interessanten Artikel zu empfehlen. Jeder Webseitenbetreiber bzw. Autor hat nur die Links gesetzt, die für seine Besucher hilfreich waren …

Diese Zeit ist lange vorbei. Heute wird Werbung geschaltet, Links werden verkauft, Spam- und HackerBots tragen auf fremden Webseiten Links und Texte in Gästebücher, Foren oder Kommentaren ein.
Es herrscht ein Wettstreit SEO-Optimierer gegen Google. Die „SEO-Optimierer“ versuchen auf Teufel komm raus Webseiten auf die ersten Ergebnisseiten bei den Suchergebnissen zu puschen.
Google tut sein Bestes sich gegen die diversen Manipulationsversuche zu behaupten. Dennoch sind immer wieder mal Seiten bei Google in den Suchergebnissen sehr weit vorn, die da nichts zu suchen haben.

Damit die kleinen aber feinen Seiten nicht in der Versenkung verschwinden, will ich diesen hier eine Plattform bieten.

Sie sind Besitzer oder Autor eines solchen „Schatzes“? dann nennen Sie mir Ihre Seite, und wenn Sie wirklich ein Schatz ist, werde ich diese hier gerne empfehlen.

Schön wäre es, wenn Sie bei der Gelegenheit begründen würden, warum Ihre Seite ein Schatz ist.