Einfache Schritte, um die Website mobilfreundlich zu machen (Responsive Design)?

Endlich habe ich meine Website: steakovercooked.com mobil benutzerfreundlich gemacht und somit sind alle Webseiten auf allen meinen 6 Domains bisher für benutzerfreundlich für Mobilgeräte qualifiziert.

Die Benutzerfreundlichkeit für Mobilgeräte ist jetzt ein Faktor für das Ranking, z. B. neigen Google-Suchmaschinen dazu, die Websites zu bewerben, die den Test für Benutzerfreundlichkeit für Mobilgeräte bestehen .

mobilfreundlich

Hier sind die Schritte, um Mobilgeräte benutzerfreundlich zu gestalten, auch bekannt als Responsive CSS Design.

Bereinigen Sie Inline-CSS in den HTML-Tags

Inline-CSS in den HTML-Tags sind schlecht, da sie z. B. Präsentation und HTML vermischen,

Der Stil wird direkt im HTML-Div-Tag definiert, was nicht über externe Stylesheets geändert werden kann.

Verwenden Sie keine Pixel mit festgelegter/fester Breite

Wenn Sie etwas wie zB width:900px definieren, ist es wahrscheinlich nicht mobilfreundlich. Sie können dies durch einen Prozentsatz ersetzen, z. B. 30 %. Kleinere Pixel sind weniger wahrscheinlich ein Problem, z. B. sind Symbole in kleinen Bildschirmauflösungen in Ordnung. Stellen Sie sich vor, die kleinste Bildschirmbreite beträgt (ungefähr) 300 Pixel, Sie möchten also nicht, dass eines Ihrer HTML-Elemente breiter ist.

Fügen Sie Folgendes in das Head-Tag ein

Bilder/Tabellen sind die schlimmsten

Tabellen sind am schlechtesten für Responsive Design, daher müssen Sie sie möglicherweise durch einfache div-Elemente ersetzen. Bilder sollten mit dem folgenden Max-Breite-Stil angegeben werden, z

Das ist es, keine komplexen Sachen! Bitte beachten Sie, dass eine mobile benutzerfreundliche Seite nicht dasselbe ist wie AMP (Accelerated Mobile Pages).