WebSite X5Help Center

 
Michel N.
Michel N.
User

Einbindung .svg-Format  de

Author: Michel N.
Visited 2180, Followers 1, Shared 0  

Hallo,

bei der Arbeit an meiner ersten Webpage in Website X5 hatte ich bezüglich Feinschliff versucht, die Darstellung des Betreiber-Logos im Header auf Mobilgeräten zu optimieren. Wie es im zeitgemäßen Webdesign üblich ist, wollte ich die Darstellungsoptimierung über die Integration einer vektorbasierten Logografik, sprich in Form einer SVG-Datei vornehmen. Zu meinem Erstaunen musste ich aber feststellen, dass man das SVG-Format (vor allem zur Darstellungsoptimierung von kleinen Logos im Mobilbereich) in diesem Fall nicht nutzen kann. Ich bin der Meinung, dass Incomedia hier unbedingt nachbessern sollte und ich hoffe, dass diese Funktion nicht erst mit der Version 15 kommt, sondern zeitnah mit einem der nächsten Updates bereits Einzug in die Version 14 hält.

Als ich mich zum Kauf der Professional-Variante von Website X5 entschieden hatte, bin ich davon ausgegangen, dass solche Standards bereits Bestandteil des Programms wären.   

Posted on the
4 ANSWERS - 2 USEFUL
Andreas S.
Andreas S.
Moderator
Best User of the month DE

So ein Standard ist das nicht und ich bin mir zu 90% sicher dass es sicherlich schon bedacht wurde diese Art einzufügen. In der V14 glaube ich nicht, dass es ncoch eingefügt wird. Man muss aber bedenken dass die .svg files riesig groß sind und eigentlich nicht geeignet für mobiles Webdesign. Letztens habe ich irgendwo eine normale Grafik in .svg gespeichert und dabei 8MB rausbekommen. In JPG waren es nur 300kb !

Read more
Posted on the from Andreas S.
Michel N.
Michel N.
User
Author

Okay, laut meiner professionellen Coder-Kollegen ist die Zuhilfenahme von SVG-Dateien für Icons und Logos seit mindestens 3 Jahren empfohlener Standard zur Optimierung der Darstellungsqualität. Soviel ich weiß, wird diese Methode vor allem in der App-Programmierung schon seit längerem benutzt, um nicht ständig mehrere Versionen ein und des selben Icons hinterlegen zu müssen, um möglichst viele Auflösungen abdecken zu können. Aber schön zu lesen, dass eine große Chance besteht, das SVG-Format spätestens in der 15er-Version endlich nutzen zu können!

Was die Größe von SVG-Dateien betrifft: Das Exportieren von SVGs ist immer so eine Sache und eine kleine Wissenschaft für sich. Jedes professionelle Vektor-Grafik-Programm (CorelDRAW, Affinity Designer, Adobe Illustrator) hat da so seine individuellen Eigenheiten und man muss bei den Export-Vorlagen einiges beachten, um die Dateigrößen minimal zu halten. Wahrscheinlich wurde in Deinem Fall der SVG von 8MB so einiges mit exportiert, was eigentlich garnicht wirklich in der finalen SVG beinhaltet sein sollte. Auch sind die Einstellungen im SVG-Export-Fenster meist vielseitig und man muss darauf achten, was man abhakt und was man für Werte einstellt. Bezüglich des Icon-Handlings sind SVGs aufgrund ihrer vektorbasierten Grundlage jedenfalls kaum zu schlagen und ich gehe davon aus, dass Du beim Export in das SVG-Format falsche Einstellungen gewählt hast oder die Vorlage nicht korrekt war. Ich habe bei meinen Icons in der SVG-Version jedenfalls eine durchschnittliche Dateigröße von ca. 6 KB.    

Read more
Posted on the from Michel N.
Andreas S.
Andreas S.
Moderator
Best User of the month DE

Das kann schon sein, dass die Profiprogrammierer das Format verwenden, aber für den Ottonormalverbraucher (der nicht mal diese Datei anzeigen kann ohne ein spezielles teueres Programm zu besitzen) ist es nicht bearbeitbar. Jedenfalls nach meinen 10 Jahre Erfahrung in Webdesign habe ich das svg Format eigentlich nie verwendet. Ich habe es nur vom Internet genommen wenn es nur in diesem format zur Verfügung gestellt wurde und mir das relevante rausgeholt und in png oder jpg abgespeichert.  Deshalb habe ich da eben schlechte Erfahrungen gemacht mit der größe der Dateien und Einstellungen habe ich da nicht so beachtet.

Deine 6 KB Datei ist die vielleicht nur 30x30px groß und nur 2 färbig?

Aber es wurde ja als IDEE hier reingestellt und wird von den Entwicklern gelesen und wenn es programmtechnisch möglich ist wird es (erst) in der V15 realisiert.

Read more
Posted on the from Andreas S.
Michel N.
Michel N.
User
Author

Na ja, vielleicht muss das mit den SVGs auch noch etwas wachsen, da diese Dateien aber eben vektorbasiert sind, ist das schon eher eine progressive Technologie. Was die optimale Dateigröße bei korrekt exportierten SVGs angeht:

Die sind datenmäßig so klein, da sie auf Vektorgrafiken basieren – also auf vorwiegend mathematisch beschriebenen Kurvenobjekten. Egal welche Pixelmaße so eine Grafik auch hat, sie wird, wie bei meinem Beispiel, immer 6 KB an Datenmenge in Anspruch nehmen. Sei diese Grafik nun 30x30 pxl oder 130x130 pxl groß. Und was auch toll an dieser Vektorgrafiksache ist…diese Grafiken sind verlustfrei skalierbar! Man hat also eine einzige Ausgangsgrafik und extrapoliert daraus alle weiteren Objekte ohne die nachteiligen Unschärfeeffekte, die man mit Pixel basierenden Grafiken wie JPEG oder PNG zum Beispiel hat…

Auf Grundlage der Anwendung von SVG-Grafiken (vor allem bezüglich Icons oder auch Logos) kann man also schon eine enorme Steigerung der Darstellungsqualität erreichen und die Qualitätssicherung bei den anzuzeigenden Grafiken viel einfacher handhaben.  

Read more
Posted on the from Michel N.