Wenn ich meine Seiten mit div. Tools (zb Pagerangers und Scraming Frog SEO Spider) analysiere, bekomme ich die Meldung, das ich für eine bestimmte Anzahl von Seiten mehrere H1 Überschriften habe.
Dabei habe ich aber aus Gründen der Übersichtlichkeit für Desktop und Tabletts eine H1 Überschrift im dafür optimierten Format und die gleiche H1 nur für Smartphones.
Überprüfe ich den Frontend Quelltext, so tauchen tatsächlich zwei H1 Überschriften dort auf.
Was läuft hier falsch?
Ich habe es wie folgt umgesetzt: Innerhalb einer Seite (Knoten) habe ich zwei Artikel platziert: Einmal Überschrift Desktop und Tabletts und einmal Überschrift Smartphone. Jeder Artikel ist entsprechend in seiner Sichtbarkeit eingestellt. Siehe Screenshots.
001 - Artikel Desktop und Tablett.png
002 - Artikel Smartphone.png
Von der Inhaltselementen aus habe ich einen Artikel angelegt, der auch für Desktop und Tablett freigegeben ist. Sieht man an den Screenshots: Wählt man den Desktop Reiter, ist der Artikel schwarz, dito für Tabletts - klickt man den Smartphone Reiter an, ist der Artikel grau - soweit funktioniert die Zuordnung in der Theorie.
003 - Inhaltselement Desktop und Tablett - Desktop.png
004 - Inhaltselement Desktop und Tablett - Tablett.png
005 - Inhaltselement Desktop und Tablett - Smartphone.png
Bei dem Smartphone-Pendant ist es genau umgekehrt: Desktop und Tablett ist grau, bei Smartphone ist der Inhalt schwarz.
Aber trotzdem werden im Quelltext beide Inhalte ausgegeben - optisch sichtbar ist aber nur das Element, das für das jeweilige Device vorgesehen ist. Das ist für den Besucher ok, fürs SEO natürlich nicht.

Zitieren
Für Dinge die man mit html5 und css3 lösen kann, braucht man kein javascript.
