Mobile: czy strona mieści się na telefonie? Mobile

Ikona telefonu otwiera stronę w prawdziwej szerokości telefonu. Od razu widzisz, czy coś wystaje poza krawędź albo jest za małe.

1Co to jest?

Sprawdzenie mobile otwiera bieżącą stronę w oknie o szerokości 360, 390 lub 430 pikseli i mierzy, czy treść jest szersza niż okno. Do tego tag viewport i najmniejszy rozmiar czcionki.

2Dlaczego to ważne?

Google ocenia mobilną wersję strony. Tabela wychodząca w prawo albo obraz bez max-width czynią całą stronę nieporęczną, a na komputerze tego nie widać.

3Co sprawdza TagSpion

4Jak to naprawić

• Ustaw tag viewport, ogranicz obrazy i tabele przez max-width: 100 %, tabele umieść w przewijanym kontenerze.

<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
  img, video, table { max-width: 100%; height: auto; }
  .table-wrap { overflow-x: auto; }   /* <div class="table-wrap"><table>…</table></div> */
</style>