Medien spielen eine entscheidende Rolle bei der Verbesserung der visuellen Attraktivität und Effektivität Ihrer Website. Der richtige Einsatz von Bildern, Videos und anderen Medientypen kann Besucher ansprechen, Informationen effektiver vermitteln und ein dynamischeres Benutzererlebnis schaffen.
-
Jede Datei (Text, Bild, Video oder Audio), die in das System hochgeladen wird, ist öffentlich zugänglich. Es sollten keine persönlichen und/oder vertraulichen Informationen hochgeladen werden. Um die Datei vollständig zu entfernen, löschen Sie die Datei aus dem Medien-Manager.
-
Bilder, Symbole, Audioclips und Dateien: bis zu 15.000 Bilder, Audioclips und Dateien kombiniert pro Website. Zusätzliche Dateien können zu einer Fehlermeldung führen. Jede Datei sollte nicht größer als 50 MB sein.
-
Videos: bis zu 100 pro Website. Zusätzliche Dateien können zu einer Fehlermeldung führen. Jede Datei sollte nicht größer als 200 MB sein. Größere Dateien können zu einer Fehlermeldung führen oder zum Hochladen führen. Wenn zusätzliche Videos benötigt werden, können YouTube oder Vimeo mögliche Optionen sein.
-
Leerzeichen innerhalb von Dateinamen werden nicht unterstützt. Dateien mit Leerzeichen können hochgeladen werden, was jedoch zu unerwartetem Verhalten mit der Datei führen kann.
-
Dateien und ihre Namen können eine Zeit lang zwischengespeichert werden. Wenn eine Datei gelöscht wird, bleibt sie wahrscheinlich noch einige Zeit verfügbar. Dazu gehört auch der Dateiname, was bedeutet, dass der Fehler "Name existiert bereits" auftreten kann, wenn Sie versuchen, den Namen einer kürzlich gelöschten Datei zu verwenden.
-
Aufgrund des Caching wird nicht empfohlen, eine Datei mit dem gleichen Namen wie eine kürzlich gelöschte Datei hochzuladen, da die gelöschte Datei möglicherweise noch einige Zeit angezeigt wird.
-
SVG-Dateityp: SVGs sind Bilddateien, die HTML-Code enthalten, d. h. wenn Sie Ihrer Website ein SVG-Symbol hinzufügen, fügen Sie auch Codezeilen hinzu. Mehrere komplexe SVGs können Tausende von Codezeilen hinzufügen und dazu führen, dass Ihre Website langsam geladen wird. Wenn Sie mehrere SVG-Symbole auf derselben Seite verwenden müssen, empfehlen wir, einige davon in normale Bilder umzuwandeln (.png, .jpeg, usw.), um Lade- oder Funktionsprobleme zu vermeiden.
-
Dateien jeglicher Art können nicht in den Stammordner einer Domain hochgeladen werden.
-
Dateimetadaten (einschließlich EXIF-Daten) werden nicht unterstützt und beim Hochladen entfernt.
Das Seitenverhältnis ist das Verhältnis zwischen der Breite und Höhe eines Mediums und stellt den numerischen Wert seiner Form dar (in der Regel ist das Seitenverhältnis bei Bildern und Videos am wichtigsten). Die Größe des Mediums ändert nicht unbedingt das Seitenverhältnis. Zum Beispiel haben sowohl 1280x720px als auch 3840x2160px das gleiche Seitenverhältnis von 16:9.
Wenn sich das Seitenverhältnis einer Mediendatei erheblich von der Form des Abschnitts oder Elements unterscheidet, in dem sie verwendet wird, kann es den Anschein haben, dass sie abgeschnitten ist. Je nach widget oder Element kann das Ändern des Seitenverhältnisses der Datei der beste Weg sein, um das Problem zu beheben. Bei Bildern kann der eingebaute Bild-Editor verwendet werden, um das Seitenverhältnis durch Zuschneiden zu ändern. Wenn ein Video bearbeitet werden muss, muss dies mit einem externen toolerfolgen.
Hinweis
-
Die Dateigrößenbeschränkung beträgt 50 MB pro Bild.
-
Bilddateien tragen zur Limitdatei von 15.000 bei.
Die folgenden Bilddateiformate werden unterstützt:
png, jpg, jpeg, gif, svg, svg+xml, ico, x-icon, webp
Der Editor optimiert Bilder bei Bedarf und passt sie an das verwendete Gerät und die sichtbare Größe auf der Website an.
Beachten Sie, dass die Größe des hochgeladenen Bildes nie erhöht wird und nur Bilder, die auf der Website angezeigt werden, optimiert werden, die kleiner als das Original sind. Wenn Sie z. B. ein Bild mit einer Breite von 2000 px hochladen, es aber in einem Bereich verwendet wird, der nur 1920 px erfordert, wird das Bild auf 1920 px optimiert. Wenn Sie jedoch ein Bild mit einer Breite von 100 Pixeln hochladen, wird es nicht optimiert und kann verpixelt erscheinen, wenn es in einem größeren Bereich angezeigt wird.
Obwohl der Editor Bilder jeder Größe optimieren kann, wird empfohlen, Bilder nahe der maximalen Größe hochzuladen, in der sie auf der Website angezeigt werden. Wenn es sich bei dem Bild beispielsweise um eine Miniaturansicht mit einer Breite von 160 Pixeln handelt, sollten Sie in Erwägung ziehen, ein Bild mit einer maximalen Breite von etwa 200 Pixel hochzuladen.
Zusätzlich zur Optimierung werden alle Bilder auf der Website im WebP-Format bereitgestellt. Dieses Format ermöglicht kleinere Dateigrößen bei gleichbleibender Bildqualität und trägt so zu einer schnelleren Website-Leistung bei, ohne die visuelle Klarheit zu beeinträchtigen.
Hinweis
Die Bildoptimierung von E-storefunktioniert nur bei JPG- und PNG-Bildern. Wenn Sie ein TIFF-, GIF- oder anderes Bildformat hochladen, können E-store es möglicherweise nicht optimieren.
Das Seitenverhältnis ist das Verhältnis von Breite und Höhe eines Bildes Attribut und wird im Wesentlichen mit der Form des Bildes in Verbindung gebracht. Ein Seitenverhältnis von 16:9 kann ein Bild mit 16 x 9 Pixeln oder ein Bild mit 1600 x 900 Pixeln sein. Es handelt sich im Grunde um jede Bildauflösung, die das Verhältnis 16:9 hat.
Visualisierung der beiden gebräuchlichsten Seitenverhältnisse:
Die Auflösung eines Bildes bezieht sich auf die Menge an Details, die ein Bild enthält, insbesondere die Anzahl der Pixel, aus denen das Bild besteht, und ist im Wesentlichen die Detailgenauigkeit und Klarheit des Bildes.
Zwar werden die Bilder auf Ihrer Website optimiert, doch wird das Design der Bilder auf Ihrer Website nicht in der Größe verändert. Wenn Sie auf dem Desktop ein Bild mit einem Seitenverhältnis von 16:9 verwenden, wird es auf dem Desktop perfekt aussehen, da ein Desktop-Bildschirm oft sehr breit ist. Ein mobiles Gerät ist jedoch viel schmäler, so dass ein Seitenverhältnis von 16:9 manchmal klein aussieht.
Um dies auszugleichen, können Sie entweder die Funktion "Auf Gerät ausblenden" verwenden, um bestimmte Versionen für diese Geräte zu erstellen, oder Sie können die Größe des Bildes im Designbereich des widgetändern. Änderungen an der Größe sind für die meisten Elemente geräteunabhängig.
Das empfohlene Seitenverhältnis hängt davon ab, wo es verwendet wird und wie Sie es anzeigen möchten.
Wenn ein Bild im Querformat verwendet wird, könnte ein Beispiel für ein empfohlenes Verhältnis 16:9 sein, da dies darauf hindeutet, dass es breiter als hoch ist. Beim Hochformat (9:16) wäre das Gegenteil der Fall.
Für Größenempfehlungen ist es im Allgemeinen am besten, die Bildbreite gleich oder etwas größer als die optimierte Größe zu halten. Wenn das Bild z.B. in einem Bild-Widgets auf desktopverwendet wird, beträgt die empfohlene maximale Breite 1920px oder nur geringfügig größer. Größere Bilder erfordern mehr Optimierung, was sich auf die Bildqualität auswirken kann. Wenn die Optimierung deaktiviert ist, leiden größere Bilder nicht an Qualität, sondern verlangsamen die Website aufgrund ihrer Größe.
Gängige Verhältnisse und Größen
Wenn sich ein Bild über die gesamte Breite der Website erstreckt:
-
Gängige Seitenverhältnisse für desktop: 16:9, 3:4
-
Gängige Auflösungsgrößen (px) für desktop: 1600x900, 1280x720, 1280x960
Mobile Geräte haben oft das entgegengesetzte Seitenverhältnis im Vergleich zu Desktop-Geräten. Möglicherweise müssen Sie die Funktion „Auf Gerät ausblenden“ verwenden, um mobile Schieberegler korrekt anzuzeigen.
Das Seitenverhältnis und die Größe des Bildes eines widgetkönnen je nach Größe, Position und Einstellungen des widgetvariieren. Es gibt zwar allgemeine Richtlinien, aber keine festen Standards.
Galerie- widget und widget , die Galerie-Layouts anbieten
Zu diesen widget gehören unter anderem:
-
Fotogalerie
-
Produktgalerie
-
Medien-Schieberegler
-
E-Shop- Seiten-Widget
Das Seitenverhältnis der Bilder in diesen widget sollte widerspiegeln, wie Sie es anzeigen möchten.
-
Beispielsweise sollten Galerien im quadratischen Stil ein Bildformat von 1:1 haben.
-
Galerien mit Bildern im Hochformat sollten längere Höhenverhältnisse haben, wie z. B. 2:5 oder 200 Pixel mal 500 Pixel.
-
Die Bildverhältnisse sollten aus Gründen der Designkonsistenz gleich sein. Lassen Sie etwas Innenabstand im Bild, sodass der Schwebeeffekt genutzt werden kann und Ihre Bilder nicht abgeschnitten werden.
-
Allgemeine Auflösungsgrößen (px): Beliebige Auflösung, aber wenn möglich nicht größer als 1500px für die Seitengeschwindigkeit.
Alle verfügbaren Layouts sind mit festgelegten Seitenverhältnissen ausgestattet, die sich nicht ändern, obwohl die Layout-Optionen mit einheitlicher Bildgröße in den Design-Einstellungen die Möglichkeit haben, die Höhe zu ändern. Wenn die Höhe für diese Layouts geändert wird, ändern sich die Seitenverhältnisse basierend auf der Größe des widget.
Die eingestellten Seitenverhältnisse für die Mosaik-Layouts (die Optionen mit den Bildern in unterschiedlichen Größen) variieren je nach Layout und der Anzahl der Spalten, die in den Design-Einstellungen eingestellt sind.
Während das widget auf der Kategorieseite eine Vielfalt zur Auswahl bietet, hat das Bild auf der Produktseite ein Seitenverhältnis von 1:1.
So sehen Sie die verfügbaren Optionen für die widget auf der Kategorieseite:
-
Klicken Sie im Seitenbereich auf „Shop“.
-
Klicken Sie auf store Seiten.
-
Klicken Sie auf Kategorieseite (wenn auf dem store keine Kategorien eingerichtet sind, ist die Seite ausgegraut und kann nicht bearbeitet werden).
-
Klicken Sie mit der rechten Maustaste auf das widget , in dem die Kategorien angezeigt werden, und wählen Sie Design bearbeiten.
-
Klicken Sie auf Produkte.
-
Klicken Sie auf die Miniaturansicht unter Layout , um die verfügbaren Layout-Optionen anzuzeigen.
-
Um die verfügbaren Seitenverhältnisse anzuzeigen, scrollen Sie im Abschnitt Produkte nach unten zur Option Bildseitenverhältnis .
Standardmäßig überschreibt das Seitenverhältnis der meisten Elemente das Seitenverhältnis des Bildes, was dazu führt, dass Teile des Bildes abgeschnitten werden. Einige Elemente enthalten jedoch eine Einstellung, die es ermöglicht, das gesamte Bild anzuzeigen, ohne beschnitten zu werden.
|
Originalbild |
Bild in widget mit übergeordnetem Seitenverhältnis |
|---|---|
|
Das Seitenverhältnis beträgt 3:2 |
Ein mögliches Seitenverhältnis könnte beispielsweise 3:1 sein (nur der Teil des Bildes, der nicht von den weißen Kästchen verdeckt wird) |
Wenn Sie die Option Cover in den Design-Einstellungen des Elements verwenden, überschreibt das Seitenverhältnis des Elements das Seitenverhältnis des Bildes. Wenn die Seitenverhältnisse nicht übereinstimmen, werden Teile des Bildes abgeschnitten.
Darüber hinaus passen sich einige Elemente, z. B. Zeilen und Abschnitte, an die Bildschirmgröße des Geräts an. Infolgedessen ändert sich das Seitenverhältnis des Elements basierend auf der Größe des Bildschirms, auf dem die Website gerade angezeigt wird.
Eine Technik, um zu verhindern, dass das Bild abgeschnitten wird, besteht darin, die Option Full Image in den Design-Einstellungen des Elements zu verwenden. Bitte beachten Sie, dass nicht alle Elemente über diese Option verfügen.
Weitere Informationen zu Hintergründen finden Sie unter Elementhintergründe.
Die Gesamtfläche eines Bildes darf 3.145.728 Pixel nicht überschreiten. Es ist unwahrscheinlich, dass eines Ihrer Bilder über dieser Grenze liegt, aber Sie können dies schnell überprüfen, indem Sie die Pixelbreite mit der Höhe multiplizieren.
Jede Datei sollte nicht größer als 50 MB sein. Größere Dateien können zu einer Fehlermeldung führen oder zum Hochladen führen.
Das Hochladen eines Bildes, das größer als das Limit ist, kann zu den folgenden Fehlern führen:
-
Bilder können nicht hochgeladen werden.
-
Bilder werden hochgeladen, aber die Miniaturbilder in der Bildauswahl werden nicht angezeigt.
-
Bilder werden im Editor nicht geladen.
-
Bilder werden auf der Live-Website nicht geladen.
Es wird empfohlen, das SVG-Format für Logobilder zu verwenden, da SVG-Dateien nicht auf dieselbe Weise optimiert werden wie andere Bilddateien. Selbst wenn das Logo, das Sie hochladen, klein ist, verlieren Sie also nicht an Qualität.
Hinweis
SVGs sind Bilddateien, die HTML-Code enthalten. Das heißt, wenn Sie ein SVG-Symbol zu Ihrer Website hinzufügen, fügen Sie auch Codezeilen hinzu.
Größenrichtlinien
Der Bereich für die Breite des Logos, wenn es in die Kopf- oder Fußzeile eingebunden wird, liegt zwischen 250px - 400px. In der Regel spielt die Höhe keine Rolle und wird durch das Seitenverhältnis des Logos bestimmt.
Das Hochladen der größten Auflösung für Ihre Website garantiert, dass die Bilder Ihrer Website für Ihre Kunden und Interessenten hochauflösend dargestellt werden. Denken Sie jedoch daran, dass große Bilder auch einen erheblichen Einfluss auf die Geschwindigkeit Ihrer Seite haben. Da hochaufgelöste Bilder herunterskaliert werden, merken die Benutzer den Unterschied in der Auflösung normalerweise nicht. Es ist besser, Bilder hochzuladen, die so groß sind, wie sie verwendet werden sollen. Wenn Sie beispielsweise ein Bild mit einer Auflösung von 300 Pixel x 300 Pixel auf Ihrer Website haben, sollten Sie es nicht als Bild mit einer Auflösung von 4000 Pixel x 4000 Pixel hochladen.
So optimieren Sie die Bildgrößen für Ihre Website:
-
Laden Sie nur Bilder hoch, die so groß sind, wie sie verwendet werden sollen (wenn das Bild z. B. als 300 x 300 Pixel auf der Website angezeigt wird, laden Sie es nicht als Bild mit 4000 x 4000 Pixeln hoch).
-
Die maximale Bildgröße darf 3.145.728 Pixel nicht überschreiten.
-
Achten Sie auf das Seitenverhältnis, da Bilder im Format 16:9 auf dem Desktop gut aussehen, aber auf dem Handy zu klein erscheinen. In diesem Fall:
-
Verwenden Sie die Funktion "Auf Gerät ausblenden ", um für jedes Gerät bestimmte Versionen des Bildes zu erstellen.
-
Ändern Sie die Größe des Bildes (Seitenverhältnis) entsprechend - Größenänderungen sind geräteunabhängig.
-
Die Gesamtfläche eines Bildes darf 3.145.728 Pixel nicht überschreiten. Es ist unwahrscheinlich, dass eines Ihrer Bilder über dieser Grenze liegt, aber Sie können dies schnell überprüfen, indem Sie die Pixelbreite mit der Höhe multiplizieren.
Hinweis
-
Informationen und Richtlinien für Website-Icons, die im Bereich SEO & Einstellungen des Editors zu finden sind, finden Sie unter Website SEO Einstellungen.
-
Symboldateien tragen zur Limitdatei von 15.000 bei.
Der Dateityp SVG ist der einzige unterstützte Dateityp für diese Registerkarte.
-
Übliche Seitenverhältnisse: Im Allgemeinen 1:1, aber jedes Seitenverhältnis ist möglich.
-
Übliche Auflösungsgrößen (Pixel): 200x200, 80x80 oder jede beliebige Auflösung. SVGs können jede beliebige Auflösung haben.
Warnung
SVGs sind Bilddateien, die HTML-Code enthalten, d. h. wenn Sie Ihrer Website ein SVG-Symbol hinzufügen, fügen Sie auch Codezeilen hinzu. Mehrere komplexe SVGs können Tausende von Codezeilen hinzufügen und dazu führen, dass Ihre Website langsam geladen wird oder möglicherweise nicht funktioniert. Wenn Sie mehrere SVG-Symbole auf derselben Seite verwenden müssen, empfehlen wir, einige davon in normale Bilder umzuwandeln (.png, .jpeg, usw.), um Lade- oder Funktionsprobleme zu vermeiden.
Videos können in den Dateien der Website gehostet werden, indem sie in den Medienmanager hochgeladen oder direkt mit der Kamera und dem Mikrofon Ihres Computers aufgenommen werden. Darüber hinaus können Videos von YouTube, Vimeo oder Dailymotion zu bestimmten Teilen der Website hinzugefügt werden, indem das Video widget verwendet wird, oder als Hintergrund für Elemente, die Videos unterstützen. Diese externen Videos sind nur an dem Ort verfügbar, an dem sie hinzugefügt wurden, und nicht im Editor.
Hinweis
Pro Website können bis zu 100 Videos hochgeladen werden. Zusätzliche Dateien können zu einer Fehlermeldung führen. Jede Datei sollte nicht größer als 200 MB sein. Größere Dateien können zu einer Fehlermeldung führen oder zum Hochladen führen. Wenn zusätzliche Videos benötigt werden, können YouTube oder Vimeo mögliche Optionen sein.
-
Videos können Zeit und Bandbreite für das Laden in Anspruch nehmen und Benutzer von wichtigen Links oder Text auf Ihrer Seite ablenken. Setzen Sie Videos daher sparsam ein.
-
YouTube-Videos werden auf Mobilgeräten nicht unterstützt, da sie auf iOS-Geräten nicht automatisch abgespielt werden können.
-
iPhones mit aktiviertem Energiesparmodus spielen Videos auf einer Website nicht automatisch ab und zeigen stattdessen eine Wiedergabeschaltfläche.
-
Der Ton von Hintergrundvideos wird nicht wiedergegeben.
-
Wenn Sie ein Dailymotion-Video hinzufügen, das Teil einer Playlist ist, stellen Sie sicher, dass Sie nur den direkten Link zum Video hinzufügen (und den Playlist-Parameter weglassen, der ungefähr so aussieht: ?playlist=x1x2f3). Wenn die URL Ihres Videos diesen Parameter enthält, entfernen Sie ihn einfach. So wäre „https://www.dailymotion.com/video/x60ktex?playlist=x5x6f2“ zum Beispiel „https://www.dailymotion.com/video/x60ktex“.
Es kann eine Reihe von Ursachen geben, warum ein Video nicht hochgeladen wird. Hier sind einige Techniken, die Sie ausprobieren und beheben können:
-
Überprüfen Sie die Dateigröße, um sicherzustellen, dass sie unter 200 MB liegt.
-
Überprüfen Sie die aktuell hochgeladenen Videos, um sicherzustellen, dass weniger als 100 Videos vorhanden sind.
-
Versuchen Sie, ein anderes Video hochzuladen.
-
Wenn ein anderes Video hochgeladen wird, hängt es wahrscheinlich mit der Datei des Videos zusammen. Das Erstellen einer neuen Datei aus der ursprünglichen Quelle kann das Problem beheben.
-
Wenn ein anderes Video nicht hochgeladen wird, kann es sich um etwas Lokales auf Ihrem Computer handeln, z. B. Seitengeschwindigkeit oder Browser. Wenn es sich um einen lokalen Computer handelt, können folgende Techniken ausprobiert werden:
-
Browser-Cache leeren
-
Ausprobieren eines anderen Browsers
-
Versuchen Sie es mit einem anderen Netzwerk
-
Neustart des Computers
-
-
Hinweis
Audiodateien tragen zur 15.000er-Limit-Datei bei.
Audio kann in den Dateien der Website gehostet werden, indem Sie es in den Medienmanager hochladen oder direkt über das Mikrofon Ihres Computers aufnehmen. Darüber hinaus können Audiodateien von SoundCloud oder Mixcloud mithilfe der Audio- widgetzu bestimmten Teilen der Website hinzugefügt werden. Externes Audio ist nur an der Stelle verfügbar, an der es hinzugefügt wurde, und nicht im Editor.
Weitere Informationen zum Einbinden von Audio in eine Website finden Sie unter Audio- widget.
Hinweis
-
Dateien auf der Registerkarte "Dateien" des Medienmanagers tragen zur Begrenzung der Datei auf 15.000 bei.
-
Sie können keine Dateien in Ihren Stammordner hochladen.
Die Registerkarte "Datei" im Medienmanager unterstützt nahezu jeden Dateityp. Dateien, die hier hochgeladen werden, können mit der Linkauswahl verlinkt werden, aber nicht direkt in einem widgetverwendet werden. Zum Beispiel steht ein Bild, das in diesen Tab hochgeladen wurde, nicht für die Verwendung mit Bild-Widgets zur Verfügung.
Ich habe die Fehlermeldung "Name bereits in Verwendung" erhalten, aber ich habe keine Dateien mit dem Namen
Dateinamen können eine Weile zwischengespeichert bleiben. Wenn eine Datei mit demselben Namen kürzlich gelöscht wurde, wird sie wahrscheinlich immer noch zwischengespeichert, und Sie müssen einen anderen Namen verwenden.
Möglicherweise wurde eine Datei mit demselben Namen kürzlich gelöscht. Dateinamen können eine Weile zwischengespeichert bleiben. Die Datei müsste umbenannt werden.
Um eine Datei umzubenennen, öffnen Sie den Medienmanager, wählen Sie die Datei aus und klicken Sie auf Umbenennen. Wenn Sie eine Bibliothek oder Auswahl verwenden, aktivieren Sie die Option Verwalten für die Bibliothek oder Auswahl.
Dies liegt wahrscheinlich an einer vorhandenen Datei mit demselben Namen oder einer kürzlich gelöschten Datei. Dateinamen können eine Weile zwischengespeichert bleiben, daher ist das Umbenennen der Datei möglicherweise die beste Option, wenn dieses Problem auftritt.
Um eine Datei umzubenennen, öffnen Sie den Medienmanager, wählen Sie die Datei aus und klicken Sie auf Umbenennen. Wenn Sie eine Bibliothek oder Auswahl verwenden, aktivieren Sie die Option Verwalten für die Bibliothek oder Auswahl.