Beiträge von Shalin

Okay, SVG, muss ich dann die Grafiken selbst erstellen oder wie geht das?

Und wie gehe ich das Ganze jetzt genau an?

Würdest du mich anleiten, damit ich es dann machen kann?

Ich glaube ich habe nicht viele FA Symbole, also macht JS Sinn?

Und was ist ein Bundler?

Was sind denn die Vor- und Nachteile und was ist am einfachsten für mich als Laie umzusetzen?

Was meinst du, was ich davon nehmen willst?

Ich weiß nicht mal, wo FA überall eingesetzt wird. Nur vorne auf der Startseite.

Zitat von Syntafin

Das letzte Problem wirst du nur lösen können indem du von der Webfont für FontAwesome auf die SVG oder JS Variante zurückgreifst.

Ich habe das ja nicht erstellt und weiß nicht, was er da gemacht hat.

Wie stelle ich das denn an? Könnt ihr mir dabei helfen?

Sie siehts am Desktop aus grad, SEO Score ist 20 Punkte gestiegen

Schade.

Ich habe jetzt 2 Stunden optimiert und die Werte weit hoch bekommen.

Jetzt habe ich ein Problem, was ich nicht gelöst bekomme, was mach ich da?

Ah cool, wie gehe ich das denn an, kann ich das überhaupt alleine?

Okay, dann lasse ich es so, vielen lieben Dank!

Wie sind denn aktuell die Werte jetzt bei Google Page Speed, was muss ich noch verbessern, was gravierend ist?

Also mit rein, oder nicht? Und wenn ja, an welcher Stelle?

Cool, vielen lieben Dank, ich habs ausgetauscht

Total lieb!

Was ist in der ersten Schrift mit der Größenangabe:

/*font-weight: 200;*/;

Muss die auch mit rein?

Und woran sehe ich jetzt, ob die Änderung was gebracht hat?

Hey, oh das ist aber lieb von euch, dass ihr mir helft.

Also in der CSS steht ganz am Anfang der Abschnitt mit den Schriften und die liegen in dem Ordner, ich mach nen Screenshot

@font-face {
    font-family: "amaticscrgl";
    src: url(AmaticSC-Regular.ttf) format("truetype");
    /*font-weight: 200;*/;
}

@font-face {

    font-family: "amaticscbold";

    src: url(AmaticSC-Bold.ttf) format("truetype");
}

@font-face {

    font-family: "AbhayaLibrem";

    src: url(AbhayaLibre-Medium.ttf) format("truetype");
}

@font-face {

    font-family: "Montserrat-Regular";

    src: url(Montserrat-Regular.ttf) format("truetype");
}

@font-face {

    font-family: "Montserrat-light";

    src: url(Montserrat-Light.ttf) format("truetype");
}

@font-face {

    font-family: "Montserratalternate";

    src: url(MontserratAlternates-Regular.ttf) format("truetype");
}

@font-face {

    font-family: "georgia";

    src: url(Georgia.ttf) format("truetype");
}

@font-face {

    font-family: "RougeScript";

    src: url(RougeScript-Regular.ttf) format("truetype");
}

html,

 body {
    height: 100%;
    font-family: "Open Sans", sans-serif;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
}

h1,

 h2,

 h3,

 h4,

 h5,

 h6 {
    margin: 0;
    color: rgb(24,45,60);
/*#182d3c; */
    font-weight: 600;
  /* font-family: "amaticscbold";*/
    font-family: "amaticscrgl";
}

h1 {
    font-size: 50px;
}

h2 {
    font-size: 38px;
}

h3 {
    font-size: 44px;
}

h4 {
    font-size: 24px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

p {
    font-size: 18px;
    color: #182d3c;
    line-height: 1.667em;
}

.fontamaticsrglr {
    font-family: "amaticscrgl";
}

.fontabhayam {
    font-family: "AbhayaLibrem";
}

.fontgeorgia {
    font-family: "georgia";
}

.fontmonserratrgl {
    font-family: "Montserrat-Regular";
}

.fontmonserratlight {
    font-family: "Montserrat-light";
}

.fontmonserratalt {
    font-family: "Montserratalternate";
}

.fontrouge {
    font-family: "RougeScript";
}

.fontarial {
    font-family: "Georgia";
}

.font20 {
    font-size: 20px;
}

.font22 {
    font-size: 22px;
    font-weight: 400;
}

.font25 {
    font-size: 25px;
    font-weight: 400;
}

.font28 {
    font-size: 28.8px;
    font-weight: 400;
}

img {
    max-width: 100%;
}

.iconimg {
    width: 48px;
    height: 48px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    padding-top: 30px;
}

input:focus,

 select:focus,

 button:focus,

 textarea:focus {
    outline: none;
}

a {
    color: #551a8b;
    text-decoration: text-decoration-line;
    text-decoration: underline;
    font-size: 18px;
}

a:hover,

 a:focus {
    text-decoration: text-decoration-line;
    outline: none;
    font-size: 18px;
}

ul,

 ol {
    padding: 0;
    margin: 0;
    font-weight: 200;
    color: #182d3c;
    font-size: 18px;
    line-height: 2.667em;
}

li span {
    color: #fff;
}

.ulleft ,ul {
    margin-left: 40px;
    line-height: 1.667em;
}

Hallo, jetzt komme ich erst dazu, mich hierrum zu kümmern.

Kannst du mir das nochmal genauer erklären, wie ich die Schriften austausche? Und in welche sollte ich sie tauschen?

In der CSS sind die definiert.

Ich weiß gar nicht, wie ich das ganze angehen soll.

Zitat von Syntafin

Ich hoffe doch nicht auch noch für das CMS bezahlt.

Nein dafür habe ich nicht bezahlt. Gott sei Dank.

Zitat von Syntafin

Wenn man den Draw Zeitpunkt nach vorne verschiebt, da der Content schon gerendert wird bevor alles geladen ist, verbessert das den Score ungemein.

Wie geht das denn, kann ich das als Laie?

Ich glaub da muss man sich schon richtig gut auskennen.

Danke für den Tipp mit den Bildern, das gucke ich mir mal an. Das werde ich wohl hinbekommen.

Ich weiß nur nicht, welche Größe ich der Grafik auf der Startseite geben soll, also der Frau die sitzt.

Hallo Syntafin,

das hört sich alles sehr kompliziert an.

Ich habe von dem ganzen ja nicht so die Ahnung.

Aber ich werde mir jetzt was aneignen, habe mir ein HTML5 und CSS3 Buch gekauft für Anfänger, vielleicht lerne ich da ja was.

Ich habe die Homepage ja erstellen lassen, war teuer genug.

Wie ich die Schriften einbinde, weiß ich nicht, wenn ich da was ändern würde, würden sich die Werte verbessern?

Und wie mache ich das mit den Bildern mit der Größenangabe? Muss jedes Bild eine Angabe haben?

Puhhh, alles etwas viel.

Liebe Grüße,

Shalin

Zitat von Syntafin

Es kann übrigens nichts auf "HTML5" laufen das bezeichnet bei HTML nur das Sprachlevel, da HTML nur eine Auszeichnungssprache ist (sagt auch der Name: HyperText Markup Language)

Ach so, gut dass du es mir erklärst.

Da steht irgendwas von Bootstrap oder so, kann das sein?

Zitat von Syntafin

Klingt nach Nicht Mobile-Friendly, zu viele Backlinks, lange Ladezeiten, Werbung und vor allem nach CLS (Content Layout Shift)

Ja tatsächlich ist der mobile Wert unter 50 im Score.

Lange Ladezeiten gehen eigentlich, aber warum ist es mobil so viel langsamer als am Desktop PC?

Und was bedeutet Content Layout Shift?

Zitat von Syntafin

Aber wieso beim anpassen immer nur ein paar pro Tag? Wieso nicht "alles"?

Weiß nicht, ich dachte, da muss man aufpassen. Also werde ich es anpassen.

Metatags kann ich ja trotzdem schreiben, aber die Description find ich schon wichtig. Wirkt die sich auch aufs Ranking aus mit den Descriptions?

So, die Webseite wurde neu gebaut und gestern ausgetauscht. Sie läuft jetzt auf HTML5.

Ich habe mal geschaut, der SEO Score ist um 20 Punkte gefallen, das ist schon extrem, oder?

Und was mir noch aufgefallen ist, die Seiten haben keine Description und keine Keywords, das muss dann angepasst werden, oder?

Wie geht man da genau vor, jeden Tag ein paar Seiten und dann immer hochladen?

Wir versuchen es erstmal mit nem Themewechsel wenn ich wieder Zuhause bin, dann mal gucken, oder was würdest du empfehlen?

Zitat von Syntafin

Da steht was von HashThemes im Header, kein Ashe Pro oder sonst was

Wo bei Seelenschreiberei? Oder was meinst du?

Also sie sagte, ihre Homepage https://seelenschreiberei.org ist auch so gebaut worden und da funktioniert es? Ich bin ratlos, weiß nicht, was ich machen soll.