Se você está acessando o WPBeginner hoje, pode ter notado que temos um novo design de site. Considerando que nosso último design era de 2012, muitos de vocês diriam que já era hora de darmos uma renovada no WPBeginner. Eu queria compartilhar com vocês algumas percepções do nosso processo de redesenho, o que aprendemos, por que demorou tanto e, o mais importante, o que há de novo no novo design.
Um Pouco de Contexto
Comecei o WPBeginner em 2009. Nos primeiros 3 anos, o WPBeginner passou por 4 redesenhos. Isso consome muitos recursos que poderiam ter sido melhor gastos em nossa missão principal:
Ajudar pequenas empresas a crescer e competir com os grandes através de nossas ferramentas, equipe e treinamento.
Após o WPBv4, fiz questão de focar em nossa missão principal e os resultados são surpreendentes.
Nos últimos quatro anos:
- Criamos mais de mil tutoriais gratuitos de WordPress no blog do WPBeginner.
- Adicionamos mais de 500 novos tutoriais em vídeo em nosso Canal do YouTube.
- Adicionamos mais de 100 termos em nosso Glossário do WordPress.
- Lançamos o OptinMonster – uma ferramenta que converte visitantes de sites que estão saindo em assinantes. Nossos formulários de opt-in são vistos vários bilhões de vezes por mês.
- Lançamos o Envira Gallery, a solução de galeria WordPress mais poderosa, para ajudar nossos usuários a criar facilmente galerias de fotos e vídeos sem desacelerar seus sites.
- Lançamos o Soliloquy, um plugin de slider responsivo para WordPress fácil de usar que tem o desempenho e a experiência do usuário como sua prioridade número 1.
- Lançamos o WPForms, o plugin de formulário para WordPress mais amigável para iniciantes, baseado em seus comentários e sugestões.
- No início deste ano, adquirimos o Yoast Analytics e o renomeamos para MonsterInsights. Estamos no processo de reescrever todo o plugin para tornar o Google Analytics fácil para iniciantes.
Coletivamente, nossos plugins foram baixados mais de 13 milhões de vezes e estão sendo ativamente usados em mais de 2 milhões de sites.
Embora todas essas sejam grandes conquistas, temos um novo conjunto de desafios que precisam ser abordados se quisermos continuar a melhorar e servir nossa missão.
Isso me leva ao WPBeginner v5.
Design com Dados
Nos últimos anos, o uso de dispositivos móveis aumentou significativamente para a maioria dos sites. É por isso que sempre recomendamos que todos escolham um tema responsivo para WordPress compatível com dispositivos móveis ao iniciar um blog.
Isso foi um pouco irônico porque nosso próprio site não era responsivo. Recebemos muitas críticas nas redes sociais de outros designers e desenvolvedores de WordPress da comunidade.
Ocasionalmente, recebíamos comentários de leitores perguntando por que o WPBeginner não era responsivo.
Embora eu entenda a importância do design responsivo, é ainda mais importante que você tome decisões baseadas em dados ao priorizar tarefas em seu negócio.
Em 2012, quando lançamos o design do WPBv4, **menos de 2%** de nosso público estava em dispositivos móveis.
Hoje, em 2016, esse número aumentou para cerca de 7%.
Isso ainda é muito baixo em comparação com meus outros sites como o List25, onde mais de 50% dos usuários estão em dispositivos móveis.
Mas faz sentido porque a maioria das pessoas não instala plugins em seus sites WordPress via dispositivo móvel. A maioria das pessoas não faz alterações de código no celular. A maioria das pessoas não tenta corrigir erros comuns do WordPress no celular.
É por isso que tornar o WPBeginner responsivo não era nossa prioridade máxima. No entanto, assim que o uso de dispositivos móveis ultrapassou 5%, começamos a planejar a reformulação que também abordou outros desafios.

Outro desafio que enfrentamos foi a usabilidade do site. À medida que adicionamos mais conteúdo, tornou-se mais difícil para os usuários encontrarem o que procuravam. Por exemplo, tínhamos 8 artigos falando sobre como acelerar o WordPress, mas nenhuma solução abrangente passo a passo.
Analisamos as principais consultas de pesquisa digitadas no formulário de pesquisa do WPBeginner para criar tutoriais abrangentes passo a passo que agora são destacados de forma proeminente no design.

Também tornamos a busca no WPBeginner mais fácil com uma sobreposição de pesquisa em tela cheia no cabeçalho e uma barra de pesquisa adicional na barra lateral.
Daqui para frente, facilitaremos para os usuários encontrarem o que procuram, criando portais de conteúdo que aproveitam criativamente as tags do WordPress.
Novidades no WPBv5
A funcionalidade principal do site permaneceu a mesma. Aqui estão algumas mudanças notáveis no site:
Nova Página Comece Aqui
Se você é novo no WPBeginner, apreciará a nova página Comece Aqui
Design de Site Responsivo
O site WPBeginner agora é 100% responsivo, então fica ótimo em todos os dispositivos.
Optamos por manter o popular framework Genesis para construir nosso tema filho personalizado.
Guias Abrangentes
Se você olhar na barra lateral de cada página, verá uma nova seção "Preciso de ajuda com..." que destaca guias abrangentes como como acelerar o WordPress, como melhorar a segurança do WordPress, como otimizar o SEO do WordPress, e mais.
Melhor Visibilidade para Nossos Produtos
No censo do WPBeginner, uma das perguntas que fiz foi nomeie um produto que possuímos. Foi surpreendente quantas pessoas não sabiam sobre nossos produtos. No novo design, faremos um trabalho melhor em destacar os produtos que possuímos.
Isso começa com uma nova página de plugins premium para WordPress.
Também rotacionaremos os produtos em nossa barra lateral e em nossos anúncios de newsletter.
FontAwesome e Nova Fonte
Você pode notar o uso de fontes de ícones no novo designer. Chama-se FontAwesome, e sou um grande fã do trabalho de Dave Gandy.
Usamos o trabalho dele em todos os nossos produtos e somos orgulhosos apoiadores do FontAwesome.
Curiosidade: você pode adicionar o logo do WPBeginner como uma fonte se você usar FontAwesome, assim como em nossas outras propriedades.
No novo design, estamos usando a fonte Proxima Nova através do Typekit.
Novo Plugin de Compartilhamento
No passado, usávamos uma variação do plugin Floating Social Bar.
Após as mudanças do Twitter, Facebook e outros – senti que era hora de criar um novo plugin de compartilhamento para o WPBeginner.
Ele puxa com precisão a contagem do Twitter, mas mais importante, agora tem uma contagem total de compartilhamentos.

Optei por parar o comportamento flutuante e, em vez disso, os botões de compartilhamento agora são adicionados no início e no final de cada postagem. Isso ajudará a melhorar a experiência do usuário em telas menores.
Novo eBook e Formulários de Inscrição
Na parte inferior de cada postagem, você verá um novo formulário de inscrição para baixar meu kit de ferramentas WordPress. Este eBook compartilha as ferramentas exatas que usamos em nossos sites.
É diferente do blueprint do WPBeginner porque este mostra apenas o que usamos no WPBeginner.
O eBook do kit de ferramentas é mais abrangente.
Eu também substituí o formulário de inscrição na barra lateral por MonsterLinks, um processo de inscrição em 2 etapas. O formulário de inscrição na barra lateral não gerou conversões com uma taxa alta o suficiente para justificar o espaço. Portanto, agora, se você quiser se inscrever por e-mail, pode fazê-lo clicando no ícone de e-mail na barra lateral.

O que vem a seguir
Além das mudanças no front-end, fizemos muitas mudanças no back-end que facilitarão para a equipe do WPBeginner criar guias mais abrangentes nos próximos meses.
O site de assinatura de vídeos WPBeginner passará por uma reformulação. Atualmente, ele ainda usa o tema antigo.
Vamos transformar isso em um sistema LMS que reunirá o curso de vídeos para iniciantes e nossos mais de 500 vídeos do YouTube em um local centralizado.
O objetivo desse site seria oferecer cursos mais organizados para facilitar que os usuários aprendam WordPress rapidamente.
Quero agradecer a todos pelo apoio e feedback.
Atenciosamente,
Syed Balkhi
Fundador do WPBeginner

Vipin
Olá,
O design ficou incrível.
Na verdade, eu também queria o mesmo visual para o meu site, que também está relacionado a negócios de ofertas e cupons. Eu também configurei o framework genesis e o tema filho genesis-simple, mas não sei como você conseguiu a opção de alternância de cabeçalho e a postagem de oferta, você pode me guiar?
Obrigado
Vipin Singh
Shola
bem, eu não sabia o design antigo, mas de qualquer forma eu amo o novo design. sempre que venho a este site, sinto que o design do meu site pode ser assim. obrigado tema wpbeginner. vocês estão fazendo um ótimo trabalho. tenha um bom dia.
WPBeginner Support
Olá Shola,
Thanks for the kind words.
Admin
Atul
Este design plano fica muito bom em todos os dispositivos. Parece muito melhor agora.
Aaditya Sharma
Sou leitor regular do seu site, o novo design do site é uma boa melhoria em relação ao anterior, mas não me sinto impressionado.
Talvez a largura do site possa aumentar.
Ekesmall
Uau, estou tão feliz em ver o design responsivo porque era bastante difícil visualizar o site no celular antes, mas agora está bom.
Srivalli
Parabéns Syed, o novo layout parece muito limpo e agradável. A propósito, seu novo Plugin de Compartilhamento está disponível para outros usuários? Parece muito limpo e significativo.
Equipe Editorial
Olá Srivalli,
No the new share plugin is not public yet
Admin
Srivalli
Obrigado, espero que você o torne público em breve…:)
Businge Brian
Isso é realmente incrível. Eu gosto do novo design. Estive aqui no último dia, acordei, verifiquei meu site favorito de tutoriais do WordPress e fiquei refrescado com o que vi. Ótimos caras.
Equipe Editorial
Glad you liked it Businge
Obrigado pelas palavras gentis.
Admin
LH Louis
Adorei essa barra flutuante de compartilhamento. O Mashable tem uma ótima também!
P.S. Adoraria ter backlinks aqui...
Equipe Editorial
Obrigado.
Se você se refere a backlinks em comentários – nós removemos isso porque atraía muito spam.
Admin
Muhammad Imran
Ótimo design, parabéns equipe WB
M Imran
Equipe Editorial
Obrigado Imran
Admin
Diane
Adorei o redesign. Só por curiosidade, o que você acha do anúncio do Google sobre pop-ups e rankings? Pela primeira vez, estou com o Google nisso. Eu não estava no seu site há mais de alguns segundos antes de um pop-up aparecer me pedindo para assinar (eu já assino). Eu nem tive tempo de conferir o conteúdo e ver se gosto e já estou sendo convidado a assinar. Isso se tornou um incômodo constante online. Existe alguma maneira de você adicionar rastreamento ao opt in monster, para que se eu estiver clicando em um dos seus newsletters, o pop-up de assinatura não apareça? Agora, isso seria um diferencial.
De qualquer forma, me desviei (não pude evitar, o pop-up foi REALMENTE irritante!!) – seu site está ótimo e seu conteúdo é realmente fabuloso. Pergunte aos visitantes se eles querem assinar depois que eles tiverem tempo de ler seu conteúdo e você poderá descobrir que terá uma taxa de adesão maior...
Equipe Editorial
Olá Diane,
Obrigado pelo seu feedback.
Eu escrevi sobre as novas regras do Google Mobile Friendly para pop-ups aqui:
http://optinmonster.com/the-new-google-mobile-friendly-rules-for-popups/
Admin
Herwig
Adorei o novo design! Só uma pergunta: seu novo plugin de compartilhamento está disponível em algum lugar? Ele parece ótimo!
Equipe Editorial
Olá Herwig,
Obrigado pelas palavras gentis. O plugin de compartilhamento não está disponível no momento porque foi codificado sob medida para o WPBeginner. Podemos lançá-lo no futuro, mas ainda não está pronto para lançamento público.
Admin
Betty Johnston
...OK! excelente!.. Acompanho vocês há muito tempo… esta atualização é rápida … super UX-UI… claro… (exceto o seu logo… um pouco borrado)… Adoro as cores contrastantes… e as instruções fáceis… Concordo com você; eu não uso meu Note5 para consertar nada…. pessoalmente, eu leio tudo quando não estou no meu escritório e então aplico o que preciso do meu desktop/laptop… Estou ansioso para verificar muitas coisas onde preciso de ajuda… Obrigado e Parabéns…!!
Equipe Editorial
Thanks for the feedback Betty. We appreciate it
Admin
Salman
O site está ótimo. Melhor que a versão anterior.
Você pode fazer uma lista de todas as ferramentas e tecnologias que você usou para criar este site e publicá-las? Isso seria maravilhoso. Obrigado.
Equipe Editorial
Olá Salman,
Nós temos uma lista de tudo que usamos no WPBeginner aqui: https://www.wpbeginner.com/blueprint/
Admin
TeQuan Douglas
Olá, Syed!
Uau… O WPBeginner está realmente muito mais rápido do que sempre foi, devo dizer que adoro este novo design. Eu uso o WPBeginner pelo menos 5 vezes por dia, continuem o bom trabalho..
Equipe Editorial
Thank you TeQuan
Admin
Brin Wilson
Well done: looks fab – simple, clean and well thought out. Impressive.
Equipe Editorial
Obrigado Brin
Admin
Lisa
Muito bom – parabéns para Syed e a equipe e StudioPress!
Equipe Editorial
Thanks Lisa
Admin
Neil Forrester
Olá Syed,
Ótimo trabalho no novo design e obrigado por todos os tutoriais do WordPress. Eu consulto seu site regularmente e acredito que é um recurso inestimável.
Com os melhores cumprimentos,
Neil Forrester | pixelfire.com.au
Equipe Editorial
Obrigado Neil – agradecemos seu apoio.
Admin
Henri Lotin
Olá, no WPBeginner!
Parabéns a toda a equipe.
Reclamei meses atrás que o site não era responsivo. Agora fui atendido, e bem atendido.
Tudo de bom, de Camarões!
Equipe Editorial
Obrigado pela paciência e apoio contínuo Henri. Nós realmente agradecemos.
Admin
Izham
Eu gosto do novo design. No início, eu também achei estranho por que o WPB não tinha um design responsivo.
Depois de ler isto, agora entendo o porquê.
Ótimo trabalho WPB!
Eu me deparei com o seu blog e ele melhorou muito minha experiência com o wp.
Eu gosto da maneira que vocês explicam. As percepções deles são verdadeiras, mostrando que sua equipe realmente testou antes de escrever sobre isso. Não é como alguns blogs que apenas copiam e colam e editam apenas para ranquear no Google.
Eu vou seguir vocês.
Equipe Editorial
Obrigado, Izham.
Admin
Mike
Gostei do novo design. Embora seja verdade que, quando estou trabalhando nos meus sites, não estou no celular. Eu recebo seus e-mails no meu celular e, muitas vezes, os salvo para ler na minha cafeteria local. Isso tornará as coisas muito melhores. Boa sorte com o novo design.
Equipe Editorial
Thanks Mike – yup that was the most common use-case. People read emails via phone and then come to our site. Hopefully it will be a much better UX now
Admin
Adrienne
Finalmente! Haha, eu leio suas coisas no trem e era enlouquecedor ter que ajustar o tamanho da página.
Adrienne
Não, sério, eu amo vocês!! Continuem assim!!
Ben
Olá Syed,
Um ótimo visual novo para um ótimo recurso sobre tudo relacionado ao WordPress.
Realmente gostei do que vocês fizeram e com mensagens claras em todo o site.
Obrigado por nos informar sobre o processo e como vocês fizeram as coisas.
Pode inspirar alguns a fazerem uma renovação!
Tudo de bom
Ben
OBINNA DURU
Olá, WP Beginner, comecei recentemente a trabalhar com o WordPress CMS e achei muito fácil porque uso a maioria (se não todos) dos materiais do seu site. Eu crio sites para clientes e tenho uma empresa de hospedagem gratuita que uso. Eu navego pelo seu site, pelo menos, não menos de 8 vezes por dia, procurando soluções para resolver os problemas dos meus clientes. Eu estava navegando pelo seu site quando ele mudou repentinamente do design antigo para este novo! Eu gostei mais do antigo do que deste porque o design antigo exibia um menu de navegação em tela cheia no meu pequeno celular, tornando muito fácil navegar, mas este novo design encolhe todos os itens de navegação em um "MENU" que eu preciso clicar antes que o resto seja exibido! Eu gostaria de aproveitar esta oportunidade para perguntar: "como posso remover a responsividade de um tema WordPress e fazê-lo exibir um menu de navegação em tela cheia mesmo em smartphones? Um dos meus clientes tem pedido isso, e eu não consigo resolver esse problema. Obrigado e Deus abençoe.
OBINNA DURU
Eu uso um tema do diretório de temas do WordPress e o nome do tema é WP knowledge base. como posso remover a responsividade desse tema em particular, e de todos os temas em geral, fazendo com que ele exiba um MENU DE NAVEGAÇÃO EM TELA CHEIA mesmo em telas pequenas de celular, exatamente como era o seu design anterior. Deus abençoe.
WPBeginner Support
Olá Obinna,
Obrigado pelo feedback. A maioria dos usuários acha o menu de navegação recolhido mais fácil de usar em telas menores. É mais fácil de tocar e mais itens podem ser exibidos no menu.
Se você quiser usar um menu em tela cheia, pode começar com um tema do WordPress que não seja totalmente responsivo. Você também pode definir a largura usando CSS.
Admin
Mitch
Que ótimo ver a atualização e tudo o que ela traz.
Tenho que dizer, eu NÃO fazia ideia de que vocês eram os donos desses plugins!
Francamente, eu achava que alguém com escrúpulos menos desejáveis tinha assumido o Yoast Analytics, então é ótimo saber agora que alguém tão respeitável quanto o WPBeginner é o dono!
Scott Buehler
Parece ótimo e rápido.
Equipe Editorial
Thank you
Admin
Josalone Wordsworth
Tenho acompanhado este site discretamente nos últimos 4 anos, fico feliz que suas novas mudanças sejam práticas para o que você ensina a novatos como eu ao construir sites em WP (mobile first).
Por favor, continuem com o ótimo trabalho, você e sua equipe.
Equipe Editorial
Thanks for the kind words Josalone. We appreciate your support
Admin
Ahmad Awais
Parabéns para a equipe WPB! O novo design parece muito bom. "Na hora certa"!
Equipe Editorial
Obrigado Ahmad pelas palavras gentis.
Admin
Sidah
Está ótimo.
Talvez queira fazer o wpbeginner em uma resolução maior? Está feio no meu iPhone 6.
Atenciosamente
Equipe Editorial
O site atual não é retina porque queremos garantir que ele seja rápido em todo o mundo (mesmo em conexões mais lentas).
Admin
Dick Motta
Ansioso pelas atualizações. Quero fazer mudanças no site, mas de alguma forma me distraio. Espero poder dedicar mais tempo aprendendo os procedimentos do WP.
Equipe Editorial
Obrigado
Admin
Parvez Afshar
É bonito e criativo – tente torná-lo o mais bonito e fácil de usar. Totalmente incrível agora, parabéns.
Carlito Thomas
Adorei o novo design! Seu logo principal está um pouco borrado, no entanto.
Arief Mardianto
Eu sempre faço o que o WPB faz. Vida WPBv5
Stephen
O novo design é simples, mas poderoso.
Parabéns para você e sua equipe, Syed.
Equipe Editorial
Thanks Stephen
Admin
Ajay
Atualização executada de forma impressionante! Obrigado pelo que você está fazendo pela comunidade WP
Equipe Editorial
Obrigado Ajay
Admin
Dawn Groves
Bom trabalho, Syed. Especialmente a descrição de como você fez. Outra oferta de valor agregado com certeza.
Dawn
Equipe Editorial
Thanks Dawn
Admin
Gayle Hardy
Ótimo trabalho! Parabéns, o site está ótimo e todas as suas atualizações fazem todo o sentido. Agradeço todas as dicas, truques e instruções fáceis de seguir que você compartilhou ao longo dos anos e espero aprender mais sobre WP nos próximos anos.
Equipe Editorial
Obrigado, Gayle, pelo seu apoio contínuo.
Admin
Herb Trevathan
Bom trabalho. Eu amo o Genesis : ) Eu uso seus snippets com frequência.
Equipe Editorial
Thanks Herb – appreciate your support
Admin
Suman Gaudel
Bom ver o WPB em um design responsivo.
Equipe Editorial
Cheers
Admin
Sowmay
Onde posso conseguir seu novo Plugin de Compartilhamento Social?
WPBeginner Support
Olá, Sowmay,
É um plugin personalizado que desenvolvemos para nosso próprio uso.
Admin
Pat Fleck
I agree with Adeel. It looks like you have put a lot of thought into the re-design. Also good to see that the site is now responsive
Equipe Editorial
Thanks Pat
Admin
Dallas
Eu amo o novo visual do site. Bom trabalho! Parece que sua largura total é de cerca de 940px. Houve algum motivo específico para escolher uma largura menor?
Equipe Editorial
Porque a maioria das nossas imagens de conteúdo têm 520px de largura. Queremos ter certeza de que mantemos nosso site rápido porque muitos de nossos usuários não têm internet rápida. Usar uma largura de conteúdo maior e fazer upload de imagens de tamanho maior diminui ainda mais a velocidade do site.
Isso não é perceptível na parte ocidental do mundo, mas muitos outros países têm internet muito lenta.
Admin
Wesley Banks
Se você não se importasse tanto com os tamanhos de imagem existentes ou com velocidades de internet lentas, você teria mudado a largura? Eu sempre luto ao criar novos sites sobre qual é a melhor largura de conteúdo. Então, adoraria ouvir qualquer insight. Obrigado!
Equipe Editorial
Teria projetado em 1140 naquele ponto porque imagens maiores definitivamente ficam mais bonitas.
Doug
Bom trabalho, Syed.
Equipe Editorial
Obrigado Doug
Admin
Andre
Incrível, simplesmente incrível!
Equipe Editorial
Obrigado Andre
Admin
Teresa Maslonka
Parabéns pelo novo redesign e obrigado pelas suas mudanças atenciosas. Estou realmente animado para explorar o site!
Equipe Editorial
Obrigado Teresa pelas gentis palavras.
Admin
Sowmay
Syed, achei este design mais adorável que o anterior.
Equipe Editorial
Obrigado
Admin
Banna
O design parece bom.
Mas enquanto rolo o artigo, sinto falta da barra lateral. Parece que temos muito espaço.
Equipe Editorial
Obrigado pelo feedback Banna. Nos próximos dias, adicionaremos caixas de rolagem para incluir conteúdo relevante para alguns artigos.
Admin
Adeel Sami
Olá, Syed!
Este design é simplesmente incrível — limpo, simples e elegante!
Congrats!
Neal Umphred
Muito bom, de fato…
kharid
muito obrigado por este artigo