nicht angemeldet
Titel "versteckt" angeben
0 Suchmaschinenoptimierung
0 
xwolf
0 
Gunnar Bittersmann
0 0
Titel "versteckt" angeben
Hallo,
Ich habe das Logo und den Titel meiner HP in einer Hintergrundgrafik die in einem div definiert wurde, da es sich durch die besondere Schriftart nicht durch reinen Text darstellen lässt:
<div id="logo">
<p>Zusätzlicher Text</p>
</div>
Nun könnte man doch ein h1 und h2 davor einfügen und es mit CSS unsichtbar machen:
In der CSS-Datei:
.titel { display: none; }
In der HTML-Datei:
<div id="logo">
<h1 class="titel">Der Seitenttitel</h1>
<h2 class="titel">Willkommen auf example.org</h2>
<p>Zusätzlicher Text</p>
</div>
Meiner Meinung nach würden so Suchmaschine die Seite besser indizieren, da sie CSS nicht interpretieren und Browser die dank @import ausgeschlossen wurden (z.B. Netscape 4) würden die Seite mit Titel darstellen.
Nun meine Frage: Würde irgendetwas dagegen sprechen?
Vielen Dank,
entix
-
Hi!
Nun meine Frage: Würde irgendetwas dagegen sprechen?
Ja - die Suchmaschinen sind nciht ganz blöd - und mit Barrierefreiheit hat aus nur marginal zu tun.
Gruß aus Iserlohn
Martin
-
Hi,
Ja - die Suchmaschinen sind nciht ganz blöd - und mit Barrierefreiheit hat aus nur marginal zu tun.
Und was muss man tun damit es Suchmaschinen gefällt?
-
Hallo Martin,
Ja - die Suchmaschinen sind nciht ganz blöd
Wenn es danach ginge, dann wäre "display:none" gänzlich unbrauchbar. Es könnten keine versteckten Inhalte per :hover eingeblendet werden, es könnte kein Text, der nur in einem Ausdruck erscheinen soll, in der Screen-Darstellung ausgeblendet werden, etc.
(mißbrauchen sollte man es natürlich nicht)und mit Barrierefreiheit hat aus nur marginal zu tun.
Es hat sogar sehr viel damit zu tun: Nicht graphischen Systemen, wozu nicht nur Suchmaschinen zählen, wird ein alternativer Inhalt angeboten, da sie an die in der Graphik versteckten Informationen nicht herankommen.
Daß entix' derzeitige Methode allerdings ungeeignet ist, steht auf einem anderen Blatt, siehe dazu den Rest dieses Threads)
Viele Grüße
Carsten
-
-
Hi,
Ich habe das Logo und den Titel meiner HP in einer Hintergrundgrafik die in einem div definiert wurde, da es sich durch die besondere Schriftart nicht durch reinen Text darstellen lässt:
<div id="logo">
<p>Zusätzlicher Text</p>
</div>Nun könnte man doch ein h1 und h2 davor einfügen und es mit CSS unsichtbar machen:
In der CSS-Datei:
.titel { display: none; }In der HTML-Datei:
<div id="logo">
<h1 class="titel">Der Seitenttitel</h1>
<h2 class="titel">Willkommen auf example.org</h2>
<p>Zusätzlicher Text</p>
</div>Meiner Meinung nach würden so Suchmaschine die Seite besser indizieren, da sie CSS nicht interpretieren und Browser die dank @import ausgeschlossen wurden (z.B. Netscape 4) würden die Seite mit Titel darstellen.
Nun meine Frage: Würde irgendetwas dagegen sprechen?
Nein, im Gegenteil ist das gängige Praxis um Screenreader zu helfen,
bei denen Grafiken nicht angezeigt/vorgelesen werden; Dann ist es auch eine technik zur Förderung der Barrierefreiheit der Seite.Allerdings solltest du es besser so im CSS und HTML machen:
In der CSS-Datei:
#logo h1, #logo h2 { position: absolute; left: -999em; width: 20em; }
In der HTML-Datei:
<div id="logo">
<h1>Der Seitenttitel</h1>
<h2>Willkommen auf example.org</h2>
<p>Zusätzlicher Text</p>
</div>Die CSS bewirkt, daß der Text verschoben wird in den für grafische Ausgabe unsichtbaren Bereich.
Dies ist deswegen besser als ein display:none, da display:none von CSS-fähigen Browser, die lediglich keine Grafiken anzeigen (sollen) und stattdessen die Seite linearisiert zeigen, auch nicht angezeigt werden würden.
Ciao,
Wolfgang-
Hallo Wolfgang,
Die CSS bewirkt, daß der Text verschoben wird in den für grafische Ausgabe unsichtbaren Bereich.
Damit ergibt sich aber ein weiteres Problem: Wenn in grafischen, CSS-fähigen Browsern Bilder deaktiviert sind, so bekommen diese auch nichts von dem Inhalt mit.
https://forum.selfhtml.org/?t=113208&m=718074
Viele Grüße
Carsten-
Hi,
Damit ergibt sich aber ein weiteres Problem: Wenn in grafischen, CSS-fähigen Browsern Bilder deaktiviert sind, so bekommen diese auch nichts von dem Inhalt mit.
Stimmt.
Die beste Lösung wäre indes -sofern er unbedingt auf ein Inhaltstragendes Hintergrundbild besteht, ein Blindgif zu verwenden, welches dann den ALT-Tag beherbergt:
<div id="logo">
<img src="blind.gif" width="1" height="1" alt="Willkommen ..." />
...</div>
blind.gif natürlich ein transparentes Bild.
Aber wie gesagt: Nur für den Fall, dass es wirkich so sein soll, wie
im Anfangsthread gesagt.Ciao,
Wolfgang-
Die beste Lösung wäre indes -sofern er unbedingt auf ein Inhaltstragendes Hintergrundbild besteht
Nein, xwolf. Die beste Lösung ist Inhalt nicht in den Hintergrund zu drängen.
<div id="logo">
<img src="blind.gif" width="1" height="1" alt="Willkommen ..." />Auch hier: Nein. IE reserviert für den Alternativtext nur 1 × 1 Pixel. Da dürfte nicht alles reinpassen.
Wenn immer als „Lösung“ Blindgif“ herauskommt, empfielt sich nochmaliges Überdenken des Problems.
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
Hi,
Die beste Lösung wäre indes -sofern er unbedingt auf ein Inhaltstragendes Hintergrundbild besteht
Nein, xwolf. Die beste Lösung ist Inhalt nicht in den Hintergrund zu drängen.Das ist doch klar. Deswegen meine Einrückung.
Aber nur kein Dogmatismus auch aus guten Gründen.
Vielleicht gibt es ja doch mal gute Gründe es zu tun. Jeder soll halt wie er mag tun, muss aber dann auch damit leben.<div id="logo">
<img src="blind.gif" width="1" height="1" alt="Willkommen ..." />Auch hier: Nein. IE reserviert für den Alternativtext nur 1 × 1 Pixel. Da dürfte nicht alles reinpassen.
Du hast recht, aber der IE ist ja auch kein Browser der Bilder abschaltet, oder hab ich da was übersehen?
Und die Screenreader die auf den IE aufsetzen ignorieren doch dann die width/height-Angaben.Wenn immer als „Lösung“ Blindgif“ herauskommt, empfielt sich nochmaliges Überdenken des Problems.
Ja.
Aber mitunter gibt es Fälle, wo eine Website erstmal nur wenig angepasst werden soll, bevor dann irgendwann der große Wurf kommt.
Auch darf man nicht den fehler machen, die jeweiligen Codeblöcke getrennt zu sehen und zu werten.
So wurde bei mir mal von einer Testerin ein Codebereich mit Zusatznavigationen negativ bewertet, weil dieser ebenfalls aus grafischen Elementen bestand die bei einem Nichtgrafik-Browser unsichtbar waren.
Die Wertung war aber falsch, weil ich gerade für die Nichtgrafik-Browser einen anderen Bereich gebaut hab, der für diese sichtbar ist, der aber im Code woanders war.
In anderen Worten: Nur nach Strichliste zu gehen ohne den Gesamtkontext zu betrachten, kann falsch sein.Grundsätzlich sind wir aber sicher einer Meinung, daß wichtige Inhalte im Hintergrund nichts zu suchen haben.
Ciao,
Wolfgang-
Du hast recht, aber der IE ist ja auch kein Browser der Bilder abschaltet, oder hab ich da was übersehen?
xwolf,
Nicht der Browser, sondern dessen Nutzer schaltet Bildanzeige evtl. ab.Kann natürlich sein, dass wer so blöd[tm] ist, den IE zu nutzen, auch nicht weiß, dass man die Bildanzeige abschalten kann. ;-)
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
-
-
-
-
-
-
entix,
Was spricht gegen
<h1><img src="http://example.org/logo" alt="Willkommen auf example.org" /></h1>Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
Was spricht gegen
<h1><img src="http://example.org/logo" alt="Willkommen auf example.org" /></h1>Oder, weil IE die Formatierungen (hier als Überschrift) nicht auf Alternativtext anwendet:
<h1><object="http://example.org/logo"><span id="title">Der Seitenttitel</span><br /><span id="subtitle">Willkommen auf example.org</span></object></h1>Dann lassen sich auch für die Anzeige ohne Bilder Titel und Untertitel getrennt formatieren.
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)-
<h1><object=…^^
Muss<h1><object data=…heißen.Vollständig in https://forum.selfhtml.org/?t=113268&m=718889
Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
-
-
-
Hallo,
Nun meine Frage: Würde irgendetwas dagegen sprechen?
Es spricht dagegen, daß Dein Seitentitel mit Deiner jetzigen Methode in den meisten Screenreadern unhörbar bleibt und in Browsern mit aktiviertem CSS aber mit deaktivierten Bildern unsichtbar bleibt.
Siehe auch https://forum.selfhtml.org/?t=113208&m=718074
Viele Grüße
Carsten -
Hallo,
welche Lösung der hier vorgeschlagenen ist denn nun die beste? Ich blicke nicht mehr durch... :-/
entix
-
entix,
Hallo,
welche Lösung der hier vorgeschlagenen ist denn nun die beste? Ich blicke nicht mehr durch... :-/
Ich denke, am besten ist es, den Text, der zu sehen sein soll, wenn die Grfik nicht zu sehen ist, auch als Alternative zur Grafik anzugeben. Alles andere wäre nicht das Markup für die bestehende Dokumentstruktur, sondern Effekthascherei für die gewünschte Darstellung.
Die Grafik erfüllt die Funktion einer Überschrift, sollte also innerhalb des h1-Elements stehen.
Die Umsetzung mit img-Element und alt-Attribut hat den Nachteil, dass der Alternativtext nicht formatiert werden kann. Geckos würden ihn in der Formatierung für das umliegende Elment h1 darstellen, IE geht seine eigenen Wege.
Formatierung des Alternativtextes (Zeilenumbruch, Titel und Untertitel unterschiedlich) ist möglich im object-Element, wo entweder das Bild oder der Inhalt des object-Elements angezeigt wird.
Das soll in XHTML 2 dann allgemein so sein, da könnte man dann schreiben:
<h1 src="http://example.org/logo"><span id="title">Der Seitenttitel</span><br /><span id="subtitle">Willkommen auf example.org</span></h1>Aber so weit sind wir noch nicht, deshalb
<h1><object data="http://example.org/logo"><span id="title">Der Seitenttitel</span><br /><span id="subtitle">Willkommen auf example.org</span></object></h1>Live long and prosper,
Gunnar--
„Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
-