Layout mit Blöcken in unterschiedl. Sichtbarkeiten aber Duplicate Content

Hallo zusammen,

in einem Shoppingwelten-Layout haben wir zwei Blöcke für den Header angelegt, um zwischen Desktop und Mobile unterscheiden zu können. Darin befindet sich jeweils das passende Bild + H1 und etwas <p>-Text als Unterschrift (was auf dem Bild platziert wird).

Das Problem: Beide Blöcke werden beim Seitenaufruf vollständig geladen, wodurch im ausgegebenen Code sowohl die H1 als auch der Absatztext doppelt vorhanden sind. Das ist aus SEO-Sicht natürlich ungünstig.

Gibt es eine Möglichkeit, das zu umgehen?
Zum Beispiel, dass nur jeweils der passende Block (Desktop oder Mobile) wirklich ausgegeben wird? Oder gibt es einen eleganteren Ansatz, um den gleichen Text auf unterschiedlichen Bildern für Desktop/Mobile zu nutzen?

Danke für jeden Hinweis!

Der Ansatz nett sich CSS und srcset.