Nesse post iremos abordar a ferramentas para devs no plugin de AMP para WordPress. O plugin não trabalha apenas para melhorar a performance do seu site, mas possui uma séria de ferramentas para entregar um conteúdo que seguem as melhores práticas de desenvolvimento, monitorar erros e comparar páginas AMP com páginas não-AMP.
Sumário do conteúdo
- Definindo o seu perfil
- Validação com ferramentas para devs no plugin de AMP
- Integração com o Editor
- Validação sobre URLs
- Índice de Erros
- Barra de administração
- Navegação emparelhada
O que é o plugin de AMP para WordPress?
O plugin de AMP WordPress é uma ferramenta que ajuda você a criar sites WordPress com foco no usuário, compatíveis com o biblioteca AMP. Um site que prioriza a performance e a entrega do conteúdo.
E, ao contrário que muita gente pensa sites AMP não são apenas para mobile ou cria uma versão limitada do seu site. Com uma estrutura de plugins e temas compatíveis você entregará uma experiência similar de um site tradicional para mobile e desktop.
Definindo o seu perfil
Primeiramente, quando instalamos o plugin precisamos definir qual é o nosso perfil como administradores e editores do seu site, esse é um ponto importante para definir como você irá interagir com o plugin. Existem dois modos: desenvolvedores e usuários experientes e usuários não técnicos que desejam uma configuração simplificada.
Por padrão usuários com perfis de Administradores serão definidos como desenvolvedores, mas essas opções podem ser modificadas a qualquer momento.
Usuários que optarem por um perfil não técnico irão ter uma configuração simplificada e menos notificações referentes aos alertas de validação e também não usarão as ferramentas de desenvolvimento e terão uma ferramenta de validação simplificada.
Já os usuários que optarem pelo modo desenvolvedor terão as opções que abordaremos a seguir.
Validação com ferramentas para devs no plugin de AMP
Ter uma página totalmente compatível com AMP é ter confiança que o seu conteúdo está seguindo os principais recomendações para entregar uma experiência rápida e responsiva.
O plugin de AMP segue as especificações de validação do framework AMP, E no plugin serão sinalizados erros e a alertas(warnings), esse é um ponto bastante importante no processo, somente erros vão impedir da sua página ser válida.
Para os alertas o plugin irá trazer uma solução mantendo sua página válida, por exemplo, bloquear alguma tag script incluída por algum plugin, neste você precisa ter atenção se o conteúdo está sendo exibido como esperado.
Integração com o Editor
Quando você está trabalhando com o editor de conteúdo do seu WordPress, se o bloco que você incluiu não é compatível com AMP, o plugin irá detectar e adicionar um relatório com mais informações sobre o motivo do erro ou alerta como na imagem abaixo:
Essa funcionalidade é útil para você tratar os erros antes de publicar o seu conteúdo.
Validação sobre URLs
Na tela de validação de URLs onde você irá encontrar no menu lateral, na sessão de AMP, com podemos ver na imagem a baixo.
Com o tela de validação de URLs você um resumo detalhado de todos os status de validação de sua página. Incluindo o status geral, número de erros encontrados com informações detalhadas sobre o problema.
Nessa tela você irá encontrar uma tabela com as seguintes informações
- URL: O slug da URL onde o problema foi encontrado
- Markup status: O número de markup inválidos encontrados e o seu status:
- revisado
- não revisado
- Markup inválido: O tipo de markup inválido encontrado e o número vezes que o erro ocorreu
- Fonte: Componente do site(tema, plugin, core) responsável pela injeção do markup inválido.
- Uso de CSS: Percentagem de CSS usada na página (max é 75kb)
- Última checkagem: a Data da última vez que essa url foi verificada
Índice de Erros
A tela Índice de erro exibe todos os problemas de validação identificados no site, juntamente com informações resumidas sobre cada problema.
Clicando num problema específico temos o detalhamento do problema selecionado, incluindo uma lista dos URLs afetados por ele. Com uma tabela agrupando informações como:
- Status do Markup
- Contexto
- Tipo
- Ultima vez que o erro foi registrado
- Quantidade de URLs como o erro
Barra de administração
Além de toda a parte na administração do WordPress, o plugin também disponibiliza um ícone na barra de administração para os usuários que definiram o seu perfil como desenvolvedores.
Quando o usuário logado navega no front-end da sua aplicação, ele irá ver um ícone do AMP com algumas opções importantes.
Caso esteja utilizando uma versão emparelhada do plugin(Leitor e Transição) com uma versão AMP e não-AMP é possível, navegar entre as duas versões. Além disso, podemos pedir a reavalição da tela, ir para tela de configurações do plugin e por último a Navegação emparelhada recurso que iremos falar a seguir.
Navegação emparelhada
Esse recurso foi introduzido na versão 2.1 do plugin e com ela é possível comparar a versão AMP e a versão não AMP do seu site. Uma vez que, selecionamos essa opção podemos comparar lado-a-lado as duas versões, este recurso é ideal para verificar se a versão AMP está com todos os recursos principais funcionando.
Outra alternativa para utilizar esse recurso, qualquer usuário logado pode adicionar o parâmetro no URL “?amp-paired-browsing=1”, por exemplo:
http://meusite.com/?amp-paired-browsing=1Code language: JavaScript (javascript)Para conferir as novidades da versão 2.2 do plugin de AMP clique aqui. Vamos falar mais um pouco sobre as opções a parte técnica do plugin de AMP nos próximos posts, para acompanhar os posts confira a página da categoria.
Deixe um comentário