H1 H2 usw. in Stylesheet definieren + SEO-Vorteile behalten?

Beitrag von **Clemens_1** » 27.04.2006, 17:27

Hallo!

Gerade erstelle ich eine neue Site und möchte beim Stylesheet Fehler der Vergangenheit vermeiden. (Ich arbeite in GoLive CS-2)
Google bewertet Text, der in h1, h2... Tags gesetzt ist als wichtiger, als den Rest. Gleiches gilt für die Auszeichnung <strong>.
Um in meinem Website-Layout nun aber nicht auf die Vorgaben des Browsers angewiesen zu sein, der h1 immer in einer unverschämten Größe anzeigt, die alles erschlägt, will ich allen h1-Überschriften Schriftgröße Farbe und Zeilenabstand etc. per Stylesheet zuweisen. (Bitte jetzt keine Diskussion über die "wahre Lehre", nachdem man dem User die Anzeige nicht vorschreiben soll.)

Ich bezweifle, dass Suchmaschinen h1-Tags auswerten, die in div-Elementen vorkommen:
<div class="h1">....

Wie kann ich die h1-Auszeichnung so verwenden, dass die Suchmaschinen diese zur Kenntnis nehmen aber andererseits doch die Vorgaben, wie die Schrift angezeigt wird, im separaten Stylesheet stehen?

von **Anzeige von ABAKUS** »

SEO Consulting bei ABAKUS Internet Marketing
Erfahrung seit 2002

persönliche Betreuung
individuelle Beratung
kompetente Umsetzung

Jetzt anfragen: 0511 / 300325-0.

Beitrag von **[btk]tobi** » 27.04.2006, 17:35

In der CSS-Datei einfach sagen wie ein h1 aussehen soll.

Code: Alles auswählen

h1 &#123;
color&#58;#006699;
font-size&#58;16px;
&#125;

Beitrag von **tingeltangeltill** » 27.04.2006, 17:36

wenn du class="h1" machst, dann hat das ja nichts mehr mit dem ursprünglichen h1 als html-tag zu tun, sondern ist eine klasse in css.

das hier ist eine klasse (zu erkennen an dem punkt vor dem h1):

Code: Alles auswählen

.h1 &#123;
  font-size&#58; 1.5em;
&#125;

und das hier ein normaler html tag/selektor (wird ohne punkt geschrieben):

Code: Alles auswählen

h1 &#123;
  font-size&#58; 1.5em;
&#125;

die beiden deklarationen sagen etwas anderes aus. wenn du es nach der zweiten variante machst, dann kannst du einfach <h1>überschrift<h1> in deine html-datei schreiben und schon wird es nach deiner css-derklaration gestaltet.

das ist nicht böse gemeint, aber du solltest dich nochmal mit den basics von css auseinander setzen

gruss till

Beitrag von **haha** » 27.04.2006, 18:37

Clemens_1 hat geschrieben:Um in meinem Website-Layout nun aber nicht auf die Vorgaben des Browsers angewiesen zu sein, der h1 immer in einer unverschämten Größe anzeigt, die alles erschlägt, will ich allen h1-Überschriften Schriftgröße Farbe und Zeilenabstand etc. per Stylesheet zuweisen. (Bitte jetzt keine Diskussion über die "wahre Lehre", nachdem man dem User die Anzeige nicht vorschreiben soll.)

Da hast Du etwas völlig falsch verstanden, falscher geht's schon bald nicht mehr. Niemand hat grundsätzlich etwas dagegen, wenn Du Größe, Farbe oder sonstwas von <h1> & Co. Deinem Bedarf nach zurechtbiegst. Dafür ist CSS erfunden worden und "Wahre-Lehre-Webseiten" wie https://csszengarden.com oder https://stylegala.com machen exzessiv Gebrauch davon.
Möchtest Du wirklich erzählen, jemand hätte von Dir verlangt, Webseiten ohne jegliches Design zu erstellen? Das ist absurd.

Was man jedoch seinen Lesern soweit es geht nicht vorschreiben sollte, ist (unter anderem) eine feste Schriftgröße. CSS kennt zwei Sorten Maßeinheiten, absolute (wie Pixel oder Zentimeter) und relative (wie Prozent oder em). Die "wahre Lehre" bevorzugt relative Maßeinheiten, weil die sich auf die vom Leser eingestellte Basisschriftgröße bezieht und somit sicherstellt, dass der Leser den Kram auch bequem lesen kann. Die Größe des Haupttextes bleibt unverändert (100% oder 1em), der Rest wird drumrum gebaut (zum Beispiel <h1>: 110% oder 1,1em, kann aber auch 100% sein oder gar kleiner).
Wer sich halbwegs mit HTML und CSS auskennt, hat auch keine großartigen Probleme mit flüssigem Layout, also einem Layout, das bei einer mehr oder minder großen Bandbreite von Schriftgrößen nicht auseinander fällt.

Alle anderen greifen zur Einheit Pixel und erfreuen unter anderem Besitzer von guten Flachbildschirmen mit 1 Millimeter großem Fliegendreck und geistreichen Kommentaren à la "Wieso, auf bei mir sieht das toll aus!" oder "Das ist ja auch für 800x600 optimiert, dann musst Du halt die Auflösung ändern." :>

Beitrag von **Clemens_1** » 28.04.2006, 11:50

@ tobi und tingetangeltill
Herzlichen Dank für die Tipps. Es funzt prima. Habe zugleich ein anderes Problemchen mit erschlagen können.
Übrigens: So scheinbar primitive Sachen finde ich kaum im Web, auch nicht bei Selfhtml usw. Die "großen" CSS-Themen usw. da gibt es zig Quellen. Ist schon witzig.

@ haha!
Ich habe durchaus da nix falsch verstanden. Meine bisherige Site hat ein starres Layout. Und nun will ich Redesignen und beschäftige mich erneut mit grundlegenden Fragen zur Gestaltung. Dabei nehme ich durchaus das recht in Anspruch, eine eigene Meinung zu vertreten.
Ich fand heraus, dass em-Zwischengrößen sowie die so hochgehalten Skalierbarkeit durch die Funktion "Schrift vergrößern" im Browser (IE oder Firefox) oft dazu führt, dass der text sogar schwere lesbar wird. Er wird nämlich immer dann typografisch verhunzt, wenn die Zeichenhöhe geradzahlig ist. Dann verkürzt der Browser künstlich die Oberlängen, bzw. vergrößert die Höhe der Gemeinen. Beim Lesevorgang orientiert sich das Auge aber an den Wortabständen und Großbuchstaben. Letztere werden bei "verhunzter" Schrift aber schwerer erkannt, der Lesevorgnag also erschwert. Verhindern kann man das nur durch die Verwendung fester Pixelgrößen.
Übrigens: Firefox gestattet die Schriftgrößenänderung durch den User auch bei Schrift, die per CSS in Pixel fixiert ist und Opera (mein Favorit) skaliert gleich die gesamte Seite samt Grafik usw. Bloß der Schrott-IE kann das nicht.

Weiteres Argument: Von Notebooks mit kleinem Bildschirm bei extrem hoher Auflösung abgesehen haben alle TFT-Monis heutzutage etwa 0,25 bis 0,27mm Pixelabstand. Und es gibt kaum noch User, die unter 1024 x 768 Auflösung arbeiten.
Also wird eine in Pixel fest gesetzte Schrift überal ungefähr gleich angezeigt. Also neige ich dazu, diesen Vorteil zu nutzen. Wer noch mit 800 x 600 unterwegs ist, hat eben Pech gehabt und muss scrollen.

Noch ein Punkt: Die Barrierefreiheit! Toll, wer sich den Aufwand leisten kann. Ich bin froh, wenn meine Site mit den meisten Browsern gut betrachtet werden kann. CSS verwende ich u.a. auch deshalb, damit ein Screenreader besser funktionieren kann.
Wer die Schrift vergrößern will, soll sich einen anständigen Browser zulegen, der skalieren kann. Wer Farbfernsehen will, kann das ja auch nicht mit einer Schwarzweiß-Kiste. Wer nicht auf DVB umsteigt, sieht bald gar nix mehr. Und wer HDTV sehen will, muss wieder was Neues investieren.
Pech gehabt: Wer nicht mit der Zeit geht, geht... ...mit der Zeit.

Beitrag von **Graccem** » 28.04.2006, 13:16

Clemens_1 hat geschrieben:@ tobi und tingetangeltill
Herzlichen Dank für die Tipps. Es funzt prima. Habe zugleich ein anderes Problemchen mit erschlagen können.
Übrigens: So scheinbar primitive Sachen finde ich kaum im Web, auch nicht bei Selfhtml usw. Die "großen" CSS-Themen usw. da gibt es zig Quellen. Ist schon witzig.

Findet man doch. Dort wird es sogar ausformuliert...
https://de.selfhtml.org/css/intro.htm#f ... enschaften

Also wird eine in Pixel fest gesetzte Schrift überal ungefähr gleich angezeigt. Also neige ich dazu, diesen Vorteil zu nutzen. Wer noch mit 800 x 600 unterwegs ist, hat eben Pech gehabt und muss scrollen.

Leider sind aber nicht alle Augen gleich

Beitrag von **haha** » 28.04.2006, 16:47

Clemens_1 hat geschrieben:So scheinbar primitive Sachen finde ich kaum im Web, auch nicht bei Selfhtml usw.

Selektierung anhand des Elementtyps ist eine grundlegende Angelegenheit, die wird in SelfHTML (1. Eintrag bei Google unter "css") erklärt, in der Wikipedia (2. Eintrag bei Google unter "css") und im CSS-Dokument selbst (bei Google nur über längere Umwege, vermutlich weil's auf Englisch ist).

Ich habe durchaus da nix falsch verstanden.

Wenn Du in einem Atemzug behauptest, Du möchtest die Schriftgröße von Überschriften selbst bestimmen, deshalb nicht <h1> verwenden und außerdem keine Diskussion darüber, dass man "dem User die Anzeige nicht vorschreiben soll", dann hast Du etwas falsch verstanden - oder Dich missverständlich ausgedrückt. Es hat niemand etwas grundsätzlich dagegen, dass Schriftgrößen variiert werden.

Dabei nehme ich durchaus das recht in Anspruch, eine eigene Meinung zu vertreten.

Um Himmels Willen, habe ich jetzt eine Klage am Hals?

Weiteres Argument: Von Notebooks mit kleinem Bildschirm bei extrem hoher Auflösung abgesehen haben alle TFT-Monis heutzutage etwa 0,25 bis 0,27mm Pixelabstand. Und es gibt kaum noch User, die unter 1024 x 768 Auflösung arbeiten.

Hach, die lieben Auflösungsstatistiken - "nie waren sie so falsch wie heute." Woher Du davon abgesehen diese Erkenntnis hast, möge besser Dein Geheimnis bleiben; nicht, dass am Ende rauskommt, dass Du einer von denen bist, die nur Leute mit grüner Krawatte in ihre gute Stube lassen und dann erklären "Grüne Krawatten beherrschen die Welt, es gibt nichts anderes im Universum!" ;>

Also wird eine in Pixel fest gesetzte Schrift überal ungefähr gleich angezeigt.

Eben, das ist das Problem.

Beitrag von **alph** » 29.05.2006, 10:37

Hallo an alle!

ich hätte da noch eine frage zum verändern von schriftgrößen bei h1, h2 usw tags in der css-datei:

ich spiele auch mit dem gedanken meinen h1 und h2 tags in der css-datei eine kleinere schriftgröße zu verpassen. aber wäre es vielleicht möglich, dass google solche definitionen nicht sonnderlich begrüßt?

ich meine, wenn jemand eine kleinere schrift haben möchte, der kann ja auch h4, h5 oder gar h6 tags nehmen. und wenn er z.b. h1 nimmt und seine größe in der css-datei bestimmt, dann ist es ja klar, dass es ihm dabei nur um die "manipulation" (vieleicht zu hart ausgedrückt

) der suchergebnisse geht.

es wäre doch theoretisch möglich, dass google die css-dateien automatisch nach solchen definitionen prüft. oder liege ich da ganz falsch?

Was denkt ihr dazu?

gruß
alph

Beitrag von **haha** » 29.05.2006, 11:41

alph hat geschrieben:ich spiele auch mit dem gedanken meinen h1 und h2 tags in der css-datei eine kleinere schriftgröße zu verpassen. aber wäre es vielleicht möglich, dass google solche definitionen nicht sonnderlich begrüßt?

Die Schriftgröße dürfte Google, wie alle anderen visuellen Formatierungen, prinzipiell schnurzpiepegal sein. Ausnahme: Massen von in Hintergrundfarbe gehaltenen, in Mikroschrift gesetzten oder anderweitig ausgeblendeten Wörtern.

ich meine, wenn jemand eine kleinere schrift haben möchte, der kann ja auch h4, h5 oder gar h6 tags nehmen.

Nein. h1 bis h6 sind nicht dazu gedacht, Schriftgrößen festzulegen. Sie bestimmen die Struktur des Inhalts, nicht mehr, nicht weniger. h1 sind die wichtigsten Überschriften, h2 bis h6 dem nachgeordnete Überschriften. Vielleicht möchtest Du nochmal in die Definition von h1 bis h6 schauen.

Wer h1 bis h6 zum Festlegen der Schriftgröße benutzt, hat damit nur bewiesen, dass er entweder keine Ahnung oder das System nicht verstanden hat. Wer h1 nur benutzt, weil er meint, damit bei Google besser zu landen, steht allerdings auch nicht allzu viel besser da.

und wenn er z.b. h1 nimmt und seine größe in der css-datei bestimmt, dann ist es ja klar, dass es ihm dabei nur um die "manipulation" (vieleicht zu hart ausgedrückt :D ) der suchergebnisse geht.

Nein. Wer die Überschriften logisch, d.h. den Inhalten entsprechend abstuft, die Hauptüberschriften mit h1 setzt (kann man durchaus auch mehrere pro Datei haben), Unterabschnitte von h1 mit h2 einleitet, von h2 mit h3 usw, der macht es genau so, wie es gedacht ist.

Oder fängst Du mit der Zahl 5 an zu zählen, weil die 1 so spiddelig aussieht?

Beitrag von **alph** » 29.05.2006, 11:55

@haha

danke für deine antwort! hat mir sehr weitergeholfen!

ich bin ja kein profi! deswegen war das nur ein Gedanke

Man macht sich ja sorgen um seine seiten

gruß
alph

Beitrag von **haha** » 29.05.2006, 12:06

alph hat geschrieben:ich bin ja kein profi! deswegen war das nur ein Gedanke

Man macht sich ja sorgen um seine seiten

Wie es von Google immer wieder geschrieben wird: Man muss kein Profi sein. Mach Dir keine Sorgen um Deine Seiten, mach Dir Gedanken um gute Inhalte ;) Bei der technisch angemessenen Umsetzung halte Dich an die W3C-Dokumente zu HTML und CSS; da stecken konkrete Aussagen drin, die auch von allen Suchmaschinen akzeptiert werden.