Neu Hilfe bei der Seitengeschwindigkeit

blackes

Sehr aktives Mitglied
4. Februar 2018
120
81
Page speed insight.PNG

Ich bräuchte mal Hilfe bei meiner Seite. Ich habe irgendwie ein Problem mit dem Vorladen von Schriften.
Wir benutzen den KM Speed Optimizer und kommen trotzdem nicht auf einen guten Wert im Mobile Bereich. Eine 52 ist nicht wirklich wünschenswert.
Jedesmal wird mir hier ein Wert von 3540 ms. ausgegeben. Kann mir dabei vielleicht jemand weiter helfen? Es handelt sich bei der Seite um https://kingsize-autopflege.de.

Ich sage schonmal im voraus Danke und hoffe irgendjemand kann uns behilflich sein.
 

cody

Aktives Mitglied
17. Juni 2020
25
5
Krakau
Öffnen Sie die Datei "Templates / Evo / Themes / Base / Less / Slick.less" und füge "font-display: swap;"

CSS: 
/* Icons */
@font-face{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('../fonts/slick.eot');
    src: url('../fonts/slick.eot?#iefix') format('embedded-opentype'), url('../fonts/slick.woff') format('woff'), url('../fonts/slick.ttf') format('truetype'), url('../fonts/slick.svg#slick') format('svg');
}

Sie können auch den obigen Code entfernen und einen Link zum Header hinzufügen (templates/Evo/layout/header.tpl)

HTML: 
<link rel="preload" as="font" href="{$currentTemplateDir}themes/base/fonts/slick.woff" type="font/woff2" crossorigin="anonymous">
 
Zuletzt bearbeitet:

cody

Aktives Mitglied
17. Juni 2020
25
5
Krakau
Hi, Besser die Datei "slick.less" bearbeiten. Nach der Änderung müssen Sie das CSS im "EVO Theme Editor" kompilieren.
Besser noch, ersetzen Sie die Schriftart durch SVG.
 

golvreven

Gut bekanntes Mitglied
1. Oktober 2020
223
18
Zitat von Michał Rzeszutek:
Hi, Besser die Datei "slick.less" bearbeiten. Nach der Änderung müssen Sie das CSS im "EVO Theme Editor" kompilieren.
Besser noch, ersetzen Sie die Schriftart durch SVG.
Klicke in dieses Feld, um es in vollständiger Größe anzuzeigen.

Hallo,

wir verwenden das EVO Theme nicht, aber sicherlich lässt sich der Tipp übertragen. Was bedeutet es, wenn das CSS nach der Änderung der slick.less kompiliert werden muss?

Was heißt SVG? Sollen wir eine SVG-Schriftart verwenden?

Viele Grüße
g.
 

cody

Aktives Mitglied
17. Juni 2020
25
5
Krakau
Es ist eigentlich sehr einfach. Dies kann auf viele Arten erfolgen. Nachfolgend finden Sie 3 verschiedene Möglichkeiten.
SVG ist das Format oder der Standard für Vektordateien. Es gibt verschiedene Ansätze für das Thema Schriftarten mit Symbolen und SVG. Im Fall von SlickCarousel würde ich die Schriftart persönlich ersetzen.

CSS: 
<button class="slick-next slick-arrow" aria-label="Next" type="button" style="">
    <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
        <path d="m9.29289322 7.20710678c-.39052429-.39052429-.39052429-1.02368927 0-1.41421356s1.02368928-.39052429 1.41421358 0l5.5 5.49999998c.3905243.3905243.3905243 1.0236893 0 1.4142136l-5.5 5.5c-.3905243.3905243-1.02368929.3905243-1.41421358 0s-.39052429-1.0236893 0-1.4142136l4.79289318-4.7928932z"></path>
    </svg>
</button>


.slick-prev {
    background-image: url(../images/icons/icon32x32-arrow-left.svg);
    &:before {
        content: '';
    }
}

.slick-prev {
    &:before {
        content: url("data:image/svg+xml; utf8, <svg height='16' viewBox='0 0 16 16' width='16' xmlns='http://www.w3.org/2000/svg'><path d='m10.2928932 8-4.64644659-4.64644661c-.19526215-.19526215-.19526215-.51184463 0-.70710678s.51184463-.19526215.70710678 0l5.00000001 5c.1952621.19526215.1952621.51184463 0 .70710678l-5.00000001 5.00000001c-.19526215.1952621-.51184463.1952621-.70710678 0-.19526215-.1952622-.19526215-.5118446 0-.7071068z'/></svg>");
    }
}
 

golvreven

Gut bekanntes Mitglied
1. Oktober 2020
223
18
Ok, danke für die Anleitung, aber was sind die Vorteile einer SVG-Schriftart gegenüber einer selbst gehosteten Google Font?
 

cody

Aktives Mitglied
17. Juni 2020
25
5
Krakau
SVG-Schriftarten werden hauptsächlich in Symbolen verwendet. Derzeit ist SVG Sprite in diesem Fall die bessere Lösung. Es gibt keine Schriftarten mit Symbolen in Google-Schriftarten. "Icon font" ist eine etwas andere Kategorie. Normalerweise ist jede Schriftart eine Vektorschrift, für Symbole wird jedoch normalerweise das SVG- oder woff2-Format verwendet

SVG Sprites: https://css-tricks.com/svg-sprites-use-better-icon-fonts/
 
Du musst Dich einloggen oder registrieren um hier antworten zu können.
Ähnliche Themen
Titel Forum Antworten Datum
In Diskussion Brauche Hilfe bei Bestand Email Workflow JTL-Workflows - Ideen, Lob und Kritik 17
Neu Hilfe bei Workflow - falsche Steuernummer bei Amazon hinterlegt User helfen Usern - Fragen zu JTL-Wawi 0
Neu Hilfe bei CSV-Datei mit Erscheinungsdatum im Format KW/2024 User helfen Usern - Fragen zu JTL-Wawi 1
Neu Kategorisierung bei CSV-Import – Hilfe benötigt** User helfen Usern - Fragen zu JTL-Wawi 3
Kategorisierung bei CSV-Import – Hilfe benötigt** JTL-Wawi 1.8 2
Beantwortet Hilfe bei SQL Abfrage erbeten User helfen Usern - Fragen zu JTL-Wawi 3
Neu Brauche Hilfe bei einen Workflow in Sachen Versand Eigene Übersichten in der JTL-Wawi 6
Neu DRINGEND Hilfe - Google Analytics Plugin JTL-Shop - Fehler und Bugs 4
Neu Workflow Hilfe gesucht, Ersetzten eines Textes User helfen Usern - Fragen zu JTL-Wawi 4
Neu Netzdinge Auswahlassistent - brauche Hilfe Plugins für JTL-Shop 15
Hilfe gesucht für Änderung der internen Schlüsselnummern! JTL-Wawi 1.9 8
Neu Dringende Hilfe benötigt: JTL-Connector Fehler beim Shopware-Abgleich Shopware-Connector 15
Umsatzsteuer EU-Ausland nach Überschreitung 10000 Schwelle - Hilfe gesucht JTL-Wawi 1.9 15
Neu Fehler bei Update: Error "SQLSTATE[42S02]: Base table or view not found: 1146 Table 'web10_14.plugin_state_log' doesn't exist" in migration.... Installation / Updates von JTL-Shop 0
Runterladen alter Bestellung bei Aktivierung der Schnittstelle Otto.de - Anbindung (SCX) 0
Plötzlich Zahlungsziel bei Auftragseingängen JTL-Wawi 1.8 0
Update 1.9.6.1 weitere Verkaufskanäle fehler bei Abgleich JTL-Wawi 1.9 1
Neu TSE wird bei JTL-POS nicht erkannt JTL-POS - Fehler und Bugs 2
Neu JTL Shop 5.3.X - Fehlerhafte Artikellinks bei Export über Exporte-Manager JTL-Shop - Fehler und Bugs 1
Neu Feld "Verkaufskanal" bei importierten Artikeln ausgegraut JTL-Ameise - Fehler und Bugs 1
Gelöst OPC geht nicht mehr bei v5.4 Installation / Updates von JTL-Shop 3
Neu Kundengruppen Zuordnung bei Registrierung anhand Emaildomain Plugins für JTL-Shop 3
Neu Datev Konto Buchung bei Gutschein Verkauf Allgemeine Fragen zu JTL-POS 0
Neu Breadcrumb Navigation bei Kategorie-, Hersteller- und Merkmallisten verschieden JTL-Shop - Fehler und Bugs 0
Neu Fehler 500 bei Versandmeldung an Amazon über JTL-eazyAuction Amazon-Anbindung - Fehler und Bugs 1
Neu Anpassung der Rechnungsansicht bei zu langen Artikelbeschreibungen Druck-/ E-Mail-/ Exportvorlagen in JTL-Wawi 0
Neu JTL Shop 5.4 - Seite 1 verschachtelt sich bei klick auf Seite 1 JTL-Shop - Fehler und Bugs 0
Neu Keine Exportpapiere mehr bei DHL 3.0 nach UK? JTL-ShippingLabels - Fehler und Bugs 3
Neu Newsletter-Abonnenten werden bei Gastbestellung nach Anonymisierung entfernt JTL-Shop - Fehler und Bugs 0
Neu Spontane Überarbeitung der Versandbedingungen bei Ebay eBay-Anbindung - Fehler und Bugs 1
Neu JTL2Datev ist defekt bei mir seit dem Update von 30.10.2024 User helfen Usern - Fragen zu JTL-Wawi 6
Neu Wie handelt Ihr die GPSR Anforderung an Produktbilder bei Amazon ? User helfen Usern - Fragen zu JTL-Wawi 0
Neu Frage zur Rechtevergabe bei eigenen Übersichten Eigene Übersichten in der JTL-Wawi 0
JTL-SHO 5 standard, downgrade zu CFE-Version, beide gehostet bei JTL Einrichtung JTL-Shop5 4
Neu Umgang mit Chargen bei mehreren Bestellungen Arbeitsabläufe in JTL-WMS / JTL-Packtisch+ 0
Neu Shopware 6 Bestellabgleich bei vormals fehlgeschlagener Zahlung Shopware-Connector 0
Verwiesen an Support Workflow artikel_erstellt wird bei LagerUmbuchung ausgelöst. JTL-Workflows - Fehler und Bugs 1
Neu Erstattungen per Paypal bei Stornierungen wird öfter nicht ausgezahlt Arbeitsabläufe in JTL-Wawi 0
Neu Artikelgewicht bei Versand in die Schweiz JTL-ShippingLabels - Fehler und Bugs 1
Fehler bei Rechnungsdatenserverice 2.0 JTL-Wawi 1.9 2
Neu Fehler bei Coupons bei Wechsel von 4 auf 5 Betrieb / Pflege von JTL-Shop 0
Neu Abbruch / Timeout bei Bildimport Shopware-Connector 0
Online seit: bei Artikel einstellen JTL-Wawi 1.8 0
Neu Gelber Hintergrund bei Mobilgeräten Einrichtung von JTL-Shop4 0
Neu Hauptbild wird bei Wechsel der VarKombi nicht angezeigt Betrieb / Pflege von JTL-Shop 3
Neu Betrug bei JTL? User helfen Usern - Fragen zu JTL-Wawi 3
Neu Wie kann ich die Verfügbarkeiten eines Artikels bei Amazon steuern? User helfen Usern - Fragen zu JTL-Wawi 0
Neu Workflow Auftragssplit bei DHL Export Sendungen mit mehreren Paketen User helfen Usern - Fragen zu JTL-Wawi 0
Neu Zusätzliche Bearbeitungszeit wird nicht bei der Lieferzeit an Shopware 6 berücksichtigt Shopware-Connector 0
Neu noindex bei URLs mit btgsterne Allgemeine Fragen zu JTL-Shop 0

Ähnliche Themen

Top Bottom