Os visores móveis permitem visualizar como as atividades do Adobe Target aparecem em telas de vários tamanhos.
O recurso de visualização de visor móvel é projetado para sites responsivos que são renderizados em vários dispositivos, janelas e tamanhos de tela. Sites responsivos ajustam-se e se adaptam automaticamente a qualquer tamanho de tela, incluindo desktops, laptops, tablets ou telefones celulares.
NOTE
Use visores móveis se o seu site for responsivo e os mesmos elementos na sua página de desktop forem usados na sua página móvel em uma configuração diferente. Se você tiver um site móvel separado com uma estrutura separada, como m.mysite.com, use uma atividade multipáginas.
Os visores móveis não estarão disponíveis se sobrepostos por uma oferta de redirecionamento.
Uma visor é definido pelo tamanho do retângulo preenchido por uma página da Web na sua tela. O visor é o tamanho da janela do navegador, menos as barras de rolagem e as barras de ferramentas. Os navegadores usam "pixels CSS". Em vários dispositivos, como os com telas de retina, o visor é menor que a resolução de dispositivo anunciada.
Abaixo, estão visores e resoluções para dispositivos populares. Lembre-se de usar um tamanho de visor no Target.
NOTE
Vários sites listam os tamanhos da janela de visualização de dispositivos populares. Por exemplo, consulte https://viewportsizer.com/devices/. Consulte o site do fabricante do dispositivo para obter as informações mais precisas e atualizadas.
Dispositivo
Tamanho da janela de visualização (largura x altura)
Resolução do dispositivo (largura × altura)
iPhone 12
390 x 844
1170 x 2532
iPhone 12 Mini
360 x 780
1080 x 2340
iPhone 12 Pro
390 x 844
1170 x 2532
iPhone 12 Pro Max
428 x 926
1248 x 2778
iPhone SE
214 x 379
640 x 1136
iPhone 11 Pro Max
414 x 896
1242 x 2688
iPhone 11 Xs Max
414 x 896
1242 x 2688
iPhone 11
414 x 896
828 x 1792
iPhone 11 Xr
414 x 896
828 x 1792
iPhone 11 Pro
375 x 812
1125 x 2436
iPhone 11 X
375 x 812
1125 x 2436
iPhone 11 Xs
375 x 812
1125 x 2436
iPhone X
375 x 812
1125 x 2436
iPhone 8 Plus
414 x 736
1080 x 1920
iPhone 8
375 x 667
750 x 1334
iPhone 7 Plus
414 x 736
1080 x 1920
iPhone 7
375 x 667
750 x 1334
iPhone 6s Plus
414 x 736
1080 x 1920
iPhone 6s
375 x 667
750 x 1334
iPhone 6 Plus
414 x 736
1080 x 1920
iPhone 6
375 x 667
750 x 1334
iPad Pro
1024 x 1366
2048 x 2732
iPad de terceira e quarta geração
768 x 1024
1536 x 2048
iPad Air 1 e 2
768 x 1024
1536 x 2048
iPad Mini
768 x 1024
768 x 1024
iPad Mini 2 e 3
768 x 1024
1536 x 2048
Nexus 6P
411 x 731
1440 x 2560
Nexus 5X
411 x 731
1080 x 1920
Google Pixel
411 x 731
1080 x 1920
Google Pixel XL
411 x 731
1440 x 2560
Google Pixel 2
411 x 731
1080 x 1920
Google Pixel 2 XL
411 x 823
1440 x 2880
Samsung Galaxy Note 5
480 x 853
1440 x 2560
LG G5
360w x 640
1440 x 2560
LG G4
360w x 640
1440 x 2560
LG G3
360w x 640
1440 x 2560
One Plus 3
480 x 853
1080 x 1920
Samsung Galaxy S9
360 x 740
1440 x 2960
Samsung Galaxy S9+
360 x 740
1440 x 2960
Samsung Galaxy S8
360 x 740
1440 x 2960
Samsung Galaxy S8+
360 x 740
1440 x 2960
Samsung Galaxy S7
360 x 640
1440 x 2560
Samsung Galaxy S7 Edge
360 x 640
1440 x 2560
Nexus 7 (2013)
600 x 960
1200 x 1920
Nexus 9
768 x 1024
1536 x 2048
Samsung Galaxy Tab 10
800 x 1280
800 x 1280
Chromebook Pixel
1280 x 850
2560 x 1700
Para entregar uma atividade aos visitantes em um dispositivo específico, escolha o público apropriado para esse dispositivo no diagrama de atividades. Use o Mobile Web Composer para editar a página na atividade daquele dispositivo. Para executar uma atividade em toda a sua experiência digital para garantir que ela fique boa em todos os dispositivos, não aplique o direcionamento. Em vez disso, use visores móveis para visualizar a atividade em cada tamanho de tela.
Para sites responsivos, normalmente seu site é projetado para abrir em uma visualização diferente quando acessado por um dispositivo com um tamanho de tela específico. Esses tamanhos de tela que acionam as novas exibições são conhecidas como pontos de interrupção de CSS. Os pontos de interrupção de CSS são pontos em que o conteúdo do site responde, dependendo da largura do dispositivo, para exibir o layout ideal para os visitantes… Os pontos de interrupção de CSS também são chamados de consultas de mídia.
Salve seus pontos de interrupção de CSS no Target para que você possa visualizar as suas experiências para cada exibição que definir. Cada uma dessas experiências é exibida em um visor móvel na interface do Target. Abra a exibição em cada tamanho de tela ao clicar no visor ao longo da parte superior do visor.
Se o seu site não for responsivo, use o Mobile Web Composer para exibir um site se sua atividade estiver direcionada para um dispositivo específico.
IMPORTANT
Você pode editar uma experiência nos visores móveis. No entanto, essas alterações se aplicam a todos os visores e dispositivos, não apenas ao visor em que você está trabalhando… Da mesma forma, editar uma experiência na exibição de desktop normal altera a página para todos os tamanhos de tela, não somente a exibição de desktop atual. Atualmente, o Target não aceita alterações de página específicas do visor.
Configuração do visor móvel task_B4B161499DC0470584ED922A4D20FCAB
Configure os visores móveis que você deseja disponibilizar ao criar suas experiências.
Clique em Administration > Visual Experience Composer.
Na seção Mobile viewports configuration, clique em Add.
Ou
Para alterar a configuração de um visor móvel existente, selecione o visor e clique no ícone Edit (lápis).
Digite um nome para a janela de visualização móvel.
Use um nome descritivo que seja fácil de reconhecer. O nome pode ter até 36 caracteres.
Especifique o tamanho da tela do dispositivo móvel: largura e altura.
A largura pode ser de 150 a 968 pixels. A altura pode ser de 150 a 1280 pixels.
(Opcional) Selecione o sistema operacional do dispositivo.
Opções:
Android
iOS
Windows
Symbian
BlackBerry
Se você usa o Enhanced Experience Composer e selecionar um sistema operacional, o emula aquele dispositivo quando você visualiza a página. Target Por exemplo, se houver uma aparência diferente para Android e iOS em seu site responsivo, o Target imita esse comportamento.
Clique em Save.
NOTE
Se você tentar excluir um visor móvel que está em uso, a seguinte mensagem será exibida: "Este visor está atualmente associado a uma ou várias atividades. Você precisa remover o visor dessas atividades antes de poder exclui-lo."
Criar uma experiência responsiva task_D6332438B5EE48CCA8AF199270F1CAEF
Adicione visores móveis a atividades do Target para criar atividades responsivas para telas móveis.
