Como adaptar uma página no bloco zero

Neste artigo, vamos explicar como e por que adaptar uma página criada em um bloco universal.

Se a página criada no bloco universal fica boa em um computador, mas o site não será exibido corretamente na tela de um celular ou tablet, porque o tamanho desses dispositivos é diferente.

Informações principais

No bloco universal, você precisa configurar adaptações para o tablet e o celular nas posições horizontal e vertical.

• Para um computador, o tamanho do bloco é 1200px.

• O tablet na posição horizontal é 960px

• O tablet na posição vertical é 640px

• O celular na posição horizontal é 480px

• O celular na posição vertical é 320px

Há uma ferramenta no bloco para isso que, ao ser ativada, mostra automaticamente o tamanho da página em que todos os elementos criados do site devem caber: texto, formas, botões, vídeos etc.

Primeiro, criamos um design para uma versão grande da tela (computador)

Depois disso, começamos a adaptar a página criada, primeiro para o tablet na posição horizontal e assim por diante. Para isso, usamos a barra de ferramentas no bloco, ajustando os tamanhos dos textos e elementos para que não ultrapassem o bloco; caso contrário, eles não ficarão visíveis nos dispositivos dos usuários do site.

Aqui estão alguns exemplos de como a página deve ficar para cada tamanho.:

Tablet na posição horizontal 960px

O tablet na posição vertical 640px

O celular na posição horizontal 480px

O celular na posição vertical 320px

Todos os blocos básicos no criador de sites se adaptam automaticamente ao tamanho de tela desejado. Leia sobre os blocos básicos nos artigos a seguir.