Immer wenn ich eine Responsive-Website erstelle, erstelle ich normalerweise zwei Menüs: 1 ausgeblendet und für Mobilgeräte verwendet und das andere als Hauptmenü angezeigt und dann ausgeblendet, um das Mobilmenü anzuzeigen. Wann immer es um SEO und Spinnen geht, die auf der Website navigieren, bekomme ich das Problem, dass ich doppelte Menüs habe? Was kann ich tun, um der Spinne mitzuteilen, dass dieses Menü für Handys gedacht ist und dies das Hauptmenü ist?
Der letzte Grund, warum ich 2 verschiedene Menüs habe, liegt an der Position, normalerweise befindet sich das Hauptmenü in einer Art Leiste unter dem Logo usw., aber das mobile Menü möchte ich über allem haben, also über dem Logo usw.
seo
web-crawlers
googlebot
navigation
Howdy_McGee
quelle
quelle
position:fixed
oderposition:absolute
zusätzlich die meisten Frameworks wie Bootstrap und Zurb Foundation Query Pulls haben, mit denen Elemente verschoben werden können, je nachdem, welches Gerät auf die Seite zugreift ...<nav>
Inhalt und weisen bei einem bestimmten Medienabfrage-Haltepunkt einen anderen Stil auf.<nav>
indem nur mehr Elemente in der Mobilversion angezeigt werden, damit die Navigation einfacher ist.Antworten:
Du musst dir keine Sorgen machen. Mit können Sie zwischen den
display: none;
Menüs wechseln. Suchmaschinen verstehen JS und CSS viel besser.Solange Sie nicht absichtlich versuchen, Dinge zu manipulieren, um ein besseres Ranking zu erhalten. Verwenden der Anzeige: keine; Wenn Sie große Textblöcke ausblenden, werden Sie bestraft. Wenn Sie Ihr Desktop-Menü also nur auf Mobilgeräten und in Visumversen ausblenden, besteht keine Gefahr. Schauen Sie sich diesen alten Thread von StackExchange an:
Wie schlecht ist die Verwendung von display: none in CSS?
Google ist eigentlich sehr ansprechbar und zieht es einer separaten mobilen Website vor.
Hier ist ein guter Artikel über " SEO von Responsive Design "
Sehen Sie sich auch diesen Artikel / dieses Video an:
Matt Cutts (Google) sagte, dass Sie sich keine Sorgen über die Nachteile von SEO machen müssen, wenn Sie einen Responsive-Design-Ansatz für mobile Websites verwenden.
quelle
Sie können
display: flex
einen alternativenorder: n
Wert für Unterteilungen verwenden und dann angeben , der Ihre Menüunterteilung über oder unter andere Unterteilungen verschiebt.Mit anderen Worten, Sie brauchen nicht zwei Menüs mit demselben Inhalt, wenn Sie immer das eine oder andere verstecken.
quelle
Die meisten mobilen Menüs werden über einen Knopfdruck "geöffnet" und öffnen sich im Wesentlichen in einem modalen Fenster der einen oder anderen Art. Wenn eine Website Barrierefreiheitsstandards erfüllt, müssen diese Menüs absichtlich im DOM platziert werden. Es reicht nicht aus, nur einen NAV in der Kopfzeile zu verwenden und ein anderes CSS anzuwenden, um das gewünschte Layout zu erzielen (in den meisten Fällen).
Fazit: Wenn Ihr Menü anfangs nicht sichtbar ist und den Rest des Inhalts überlagert, müssen wahrscheinlich mehrere Navigationselemente an verschiedenen Positionen im DOM platziert werden (je nach Bildschirmgröße und Wunsch wird eines ausgeblendet und das andere angezeigt) ).
quelle