Autor: Neil Lock

  • 4 erros de web design que você precisa evitar em 2018

    If there’s one thing you need to remember when building a website, it’s to never take good design for granted.

    As we’ve mentioned in a previous article, a site visitor’s first impression on your website can make or break you in just a matter of seconds.

    In other words, if they don’t like what they see within that timeframe, chances are they’re going to close their browser windows and direct their attention elsewhere.

    Fortunately, there are a lot of ways to prevent this from happening; one of them is to familiarize yourself with good web design practices. And the good news is you don’t need to be a professional web designer in order to do so.

    Because while it’s true that not everyone has a good eye for design, preventing bad design becomes easier once you know what to avoid.

    Dito isso, lembre-se destes 4 erros comuns de web design. Dessa forma, você terá uma preocupação a menos quando finalmente começar a construir seu site.

    Erro nº 1: Usar mais de 3 fontes

    A rule of thumb when designing websites? Try not to have too much visual elements going on within your space. Having more than 3 fonts on your site design is a surefire way to break this one rule. It’ll also overwhelm your site visitors.

    Manter as fontes do seu site em um mínimo de 3 é uma prática geral de design observada por profissionais. Além disso, aumenta o nível de legibilidade e consistência do seu site, que são fundamentais para o sucesso do tráfego do seu site.

    DON’T DO THIS:

    Don’t use more than 3 fonts and try to avoid “fancy fonts” as much as possible. These tend to make your site look unprofessional and outdated.

    DO THIS:

    Use only 2 fonts, or a maximum of 3 if you have to. Notice how the page below looks clean and sleek, all while keeping readability and consistency all throughout the design.

    Try comparing the differences between this example and the previous one. The example below with only two fonts is a website that your visitors will likely take seriously.  This previous one above with the overwhelming amount of fonts isn’t.

    Mistake #2: Failing to Use White Space

    White space is one of the most important aspects of web design. But what is it?

    Put simply, white space is literally the empty space between elements in a composition.

    In other words, it’s negative space. This pertains to anything on your website that isn’t filled with text, photos, or other design elements.

    Now, the problem arises when website owners want to fill all of the white space in, which is an absolute no-no.

    White space matters because it gives your site visitors and readers some breathing space when going through your site. Just how it was mentioned in the first design mistake to avoid, overwhelming your website with too much design elements is more than enough reason for your site visitors to leave and for your traffic to decrease significantly. It also makes for poorly executed design.

    DON’T DO THIS:

    In the example below, take a look at how the text is nearing the edges of the purple section’s margin. Notice as well how all elements leave almost zero room for white space.

    DO THIS INSTEAD:

    Give your site readers some room to breathe. If adding in long paragraphs is unavoidable, just remember to always take the rules of spacing into account—they’re pretty easy to remember anyway ?.  It will leave your page looking cool, crisp, and professional.

    Mistake #3: Designing Websites With Zero Flow in Your Site’s Content

    It’s important to pay attention as to how  information on your website is presented. Moreover, site content should generally follow a logical flow, taking the site viewer’s intuition into consideration.

    Confira os dois exemplos abaixo para entender o que queremos dizer.

    DON’T DO THIS:

    Unless you’re a graphic designer by profession, it’s probably not a good idea to experiment with the standard flow of your website’s sections.

    Below, you can see that the site’s design lacks both visual and logical flow; everything is all over the place. You don’t want your audience having a hard time navigating through your site, either. This is another surefire way to do it.

    DO THIS INSTEAD:

    Notice how the sections of the website flow depending on what actions the visitor is most likely to take.

    O design é intuitivo e tem um fluxo lógico: primeiro, a organização se apresenta e informa o público sobre o básico; como sobre o que se trata e o que faz. Segundo, adiciona números confiáveis para estabelecer credibilidade. Por fim, o site fornece ao público seus números de contato e uma lista de eventos, incentivando-o a agir.

    Mistake #4: Trying to Fit in Every Bit of Information Onto Your Website

    Adicionar blocos de texto desnecessário onde deveria haver espaço em branco pode afastar o seu público. Lembre-se de manter apenas detalhes importantes.

    Studies find that readers only visit 20% of your webpage; everyone else outside that percentage will probably just scroll through your site.

    DON’T DO THIS.

    Don’t overwhelm your visitors with inconsistent, giant walls of text, especially if it means having to sacrifice your website design’s cohesiveness and structure.

    DO THIS INSTEAD:

    Keep your copy short and concise, and take out chunks of unecessary text if you can help it. Only keep vital information that your site visitors absolutely need to know.

    Conclusion

    Website design is important, and can be a huge deciding factor in whether or not you gain site traffic.

    Lembre-se de não subestimar isso. Sempre reserve um tempo para pesquisar e consultar artigos de design para orientá-lo ao longo do caminho. Antes que você perceba, verá o tráfego do seu site subindo. ? Boa sorte!

    Design in less time!

    Check out how much faster Page Builder Sandwich let you design your web pages.

    Try Live Preview

    This week’s useful resource:

    CANVA has hundreds of resources that you can access on their website. Apart from useful and easy-to-follow design tips, they also have photo editing tools, graphs, and a wide range of useful resources you can use for your creative projects.

    Confira este incrível Guia de Cores do Canva para o seu próximo projeto de design.

    Canva Design Wiki

    Liberte sua criatividade.

    Confira o Guia de Cores do Canva

  • Versão 3.0: Repensando como um construtor de páginas deve funcionar

    version-3-0-rethinking-how-a-page-builder-should-workFaz 10 meses que lançamos o Page Builder Sandwich para o público. Agora temos cerca de 6.000 instalações ativas, e isso é uma grande conquista para nós. Também recebemos muitos feedbacks por causa disso, tanto bons quanto ruins. O consenso, no entanto, é que as pessoas adoram a facilidade de criar layouts e seus conteúdos em comparação com os outros construtores de páginas existentes.

    Uma grande parte do feedback que recebemos foram pedidos de recursos, e adicionamos muitos desses recursos nos últimos meses. Mas, conforme continuávamos fazendo isso, também começamos a mudar lentamente a interface do usuário no processo. E, consequentemente, também estávamos mudando a experiência do usuário… para pior. Chegou a um ponto, no entanto, em que precisávamos repensar a interface, porque ela simplesmente não funcionava mais de forma fluida, e os diferentes recursos também não combinavam mais com ela.

    A Interface Obsoleta

    Nas versões anteriores do PBS, queríamos que tudo estivesse no formato de botões. Por quê? Porque botões são fáceis de usar. Você apenas… clica neles. Nas versões mais antigas do inspetor (a barra lateral na imagem acima), clicar em um botão aumentava um valor, enquanto Shift+clique em um botão o diminuía. Isso parece bem simples. Mas com a adição de carrosséis, abas, mapas e outros novos elementos e recursos, todos esses botões se tornaram uma mistura de ícones diferentes com designs variados, e meio que começaram a parecer mais hieróglifos do que uma interface bacana. Isso não era um problema para usuários experientes, mas é bem intimidador de se ver se você é novo no PBS.

    Em seguida, alguns problemas começaram a aparecer no inspetor. A ideia original era tornar tudo simples e disponível dentro do inspetor. E por tudo, eu queria dizer tudo – desde transformar texto em títulos até mudar cores de fundo, cores de fonte, o que você imaginar. Em seu estado atual, no entanto, o inspetor agora contém muitas opções que fazem você usar a roda do mouse para rolar para cima e para baixo constantemente. Bem diferente do inspetor que eu esperava criar anteriormente para os usuários.

    Por último, apresentamos recentemente o mapeamento de shortcodes para seus plugins favoritos. Esse recurso exigiu que criássemos campos de texto, controles deslizantes de números, caixas de seleção e novos tipos de opções adicionais necessários para tornar sua experiência de edição de shortcodes mais agradável. Inicialmente, foi uma boa ideia e, sim, tornou a manipulação de shortcodes mais fácil para você. Mas, novamente, esse recurso se desviou da nossa interface “apenas botões”. Em retrospectiva, era realmente impossível usar apenas botões para alterar atributos de shortcodes. Agora, na versão mais recente, acabamos com 2 tipos de controles: os botões e os campos de shortcodes.

    Há mais alguns motivos que nos fizeram decidir que nossa interface não era mais eficaz (ou adequada para nossas necessidades), mas os pontos acima são os principais. Uma coisa sempre foi certa, no entanto: sabíamos que tínhamos que atualizar a interface.

    Definindo Como Um Construtor de Páginas Deveria Idealmente Funcionar

    Em vez de mergulhar de cabeça e mudar as coisas imediatamente, demos cem passos para trás para dar uma olhada em toda a experiência do construtor de páginas. Queríamos dar uma nova vida à interface. Para ser sincero, não queríamos continuar reconstruindo-a ano após ano. É exaustivo e definitivamente não traz uma ajuda significativa para a comunidade WordPress. Desta vez, decidimos fazer as coisas de forma lenta e cuidadosa. Estudamos cada canto do Page Builder Sandwich e o que o torna um bom construtor de páginas, e finalmente estruturamos toda a experiência de edição em alguns conceitos fundamentais.

    Conceito Essencial nº 1: Digitar Diretamente no seu Conteúdo para Editar as Coisas

    Um dos principais motivos para instalar um construtor de páginas é se livrar das limitações do editor de texto do backend do WordPress. Não que o editor do backend não seja bom, mas ao criar suas páginas da web, ele não mostra imediatamente como sua página ficaria para os visitantes do seu site, nem permite que você distribua seu conteúdo fora de um layout de coluna única. Você só pode ver seu texto lá e algumas imagens, mas nada dos itens mais elaborados (ex.: formulários de contato). Você pode adicionar shortcodes, sim, mas eles não aparecerão em sua forma renderizada*.

    * Existem plugins sendo feitos por terceiros para resolver isso, como o Shortcake UI, mas isso não vem ao caso.

    É aí que entram os construtores de páginas no frontend. Eles trazem a experiência de edição para fora do backend e para o frontend, com você editando seu site exatamente como seus visitantes realmente o veriam. Como Pippin diria: o que você vê é o que você obtém (WYSIWYG).

    Outra coisa boa de ser um editor frontend é que ele permite que você edite seu texto diretamente. Digitar títulos e parágrafos oferece a facilidade de usar um processador de texto comum na criação de sites. Botões e rótulos de abas também devem ser alteráveis simplesmente clicando neles e digitando.

    Essa é a área em que a maioria dos outros construtores de páginas não tem um bom desempenho. A maioria deles força você a digitar dentro de um campo de texto para editar tudo. Mais uma vez, esse não deveria ser o caso em construtores de páginas frontend reais. Digitar e editar texto diretamente tem sido um ponto forte do Page Builder Sandwich desde a versão 2, e garantimos que isso continuasse sendo mantido na versão 3.

    Conceito Essencial nº 2: Usar o Mouse para Ajustes Rápidos

    O mouse é uma ferramenta poderosa que muitas vezes é negligenciada em construtores de páginas. Na maioria das vezes, os construtores de páginas o utilizam para permitir que as pessoas arrastem coisas e as soltem em locais diferentes, ou para clicar em botões ou campos de entrada. Embora isso seja bom, há muito mais que você pode fazer com o mouse em termos de criação de páginas.

    Por um lado, há um incrível feedback visual ao usar o mouse como ferramenta na edição da página, especialmente no ajuste de propriedades visuais como margens, preenchimentos e tamanhos. Agora, ajustar seus elementos se torna uma experiência natural.

    No PBS versão 3, você poderá ajustar várias coisas usando o mouse. É possível ajustar margens/espaçamentos entre elementos individuais, os preenchimentos dentro de suas colunas, bem como os tamanhos de imagens, ícones e mapas. Também substituímos os botões que permitiam alterar valores numéricos por controles deslizantes.

    Conceito Essencial nº 3: O Texto Deve Ser Fácil de Estilizar

    Se você se afastar um pouco do monitor, notará que a maior parte do que você adiciona em suas páginas da web é conteúdo de texto. Sim, temos imagens e ícones para acompanhá-los – e ultimamente tendemos a adicionar imagens maiores em nossos sites. Mas a maior parte do conteúdo importante é em texto: títulos, listas com marcadores, parágrafos, citações, etc. Junto a isso, está a forma como estilizados nosso texto para se adequar aos nossos designs. Nós mudamos seus tamanhos e cores, ou os deixamos em negrito ou itálico. Isso é para tornar nosso conteúdo mais legível, relevante e atraente para nossos respectivos leitores.

    Como estilizamos o texto com frequência, os botões que nos permitem alterar estilos devem ser muito acessíveis. Eles não devem ficar escondidos dentro de uma caixa pop-up que precisamos abrir primeiro. A maioria dos construtores de páginas sofre dessa doença. Para que a interface do usuário seja rotulada como ‘livre de desordem’, até mesmo as opções mais usadas ficam ocultas da vista direta.

    Para resolver isso, demos uma olhada nos processadores de texto mais comumente usados. Notamos que eles geralmente têm uma linha com uma infinidade de botões perto do topo da tela usados para formatar texto e copiamos o mesmo layout para a versão 3. Agora temos uma linha com todos os botões de estilo de texto sempre presentes no topo da sua tela. Isso torna a estilização muito rápida e algo quase natural na edição de texto.

    Conceito Essencial nº 4: Opções Avançadas de Estilo Devem Ser Flexíveis, Mas Fáceis de Entender

    A conclusão final sobre um construtor de páginas é que ele deve permitir que as pessoas criem designs impressionantes facilmente. Isso significa que devemos oferecer muitas configurações e opções diferentes sem impor uma curva de aprendizado difícil. Poder ajustar margens, preenchimentos e estilizar texto é ótimo, mas isso só vai até certo ponto. Você precisará de opções muito mais elaboradas para fazer o trabalho, opções como imagens de fundo, padrões, bordas, fundos fixos e muito mais. Acumular todas essas configurações diferentes pode ser um pouco cansativo, por isso simplificamos algumas delas e as organizamos em categorias para tornar as coisas mais amigáveis na versão 3.

    Conceito Essencial nº 5: Suporte a Shortcodes

    Por último, não vamos esquecer que o nosso construtor de páginas funciona sobre o WordPress. Devemos abraçar a plataforma e seus recursos, e não restringi-los ou nos afastar deles. Um recurso enorme que o WordPress oferece são os shortcodes. Isso não significa que todo o conteúdo deva ser composto por shortcodes – isso seria uma bagunça –, mas sim que devemos ser compatíveis com eles. Muitos plugins e temas usam shortcodes, e seria uma grande perda se ignorássemos todos eles. De fato, os shortcodes oferecem aos usuários a máxima flexibilidade quando se trata de criar páginas.

    Apresentamos há algumas semanas nosso sistema de mapeamento de shortcodes e, graças a ele, mapeamos centenas de shortcodes de centenas de plugins. Priorizamos os plugins mais populares encontrados no diretório de plugins do WordPress, portanto, é provável que você os encontre em seus próprios sites. Isso só se fortaleceu na versão 3, e continuaremos aprimorando isso daqui para frente.

    Conclusão

    Pegamos todas essas propriedades essenciais acima e as incorporamos ao Page Builder Sandwich versão 3. É o melhor construtor de páginas que criamos para o WordPress até agora. É mais intuitivo e mais natural de usar, tem um desempenho mais rápido, é mais fácil de usar e mais amigável do que nunca.

    Se você tem alguma ideia sobre um recurso essencial para um construtor de páginas, conte para nós comentando abaixo.

  • #PBSUpdate: Aumento de 200% no desempenho e novos elementos

    Only a few weeks ago, we released PBS Version 4.1. This update included tweaks on the formatting bar and some text formatting updates, among others. For Version 2.0 though, while we made additional features, we decided to focus more on PBS’ overall performance.

    200% Performance Increase & A Little Help from CodeInWP

    O que motivou essa mudança foi um artigo sobre expectativas de construtores de páginas da CodeInWP. Ele trazia uma pequena lista dos seus favoritos, avaliando cada um sob critérios específicos. Embora o Page Builder Sandwich não tenha entrado na lista propriamente dita, nós também fomos mencionados brevemente no artigo:

    With Page Builder Sandwich you won’t also lose your content and will be able to continue updating the page easily via a default WordPress editor.

    Ler isso foi o que impulsionou nossa equipe a aprimorar o PBS ainda mais. E, como não fomos incluídos na lista, também ficamos curiosos ao mesmo tempo para saber quais eram nossas deficiências específicas. Um pouco mais tarde, entramos em contato com a CodeInWP para pedir uma breve avaliação do PBS, e a autora convidada Ann Taylor nos deu uma resposta muito construtiva e útil:

    “…I played around with a free version a bit. It shows a lot of promise: lots of modules, pretty intuitive UI, great WYSIWYG experience, everything is dragged around easily. However, when I had around 10 modules on the page, it became hard to continue working with it because of low editing speed…”

    Esse ótimo feedback nos motivou ainda mais a investigar a velocidade e o desempenho do PBS. Testamos muitos cenários diferentes e encontramos enormes gargalos de velocidade. A causa raiz dos problemas de desempenho foram os vários cálculos que o plugin realizava para exibir contornos, barras de ferramentas e outras indicações visuais de edição. Abaixo está um gráfico do desempenho do PBS versão 4.1 no Chrome:

    Here are the important points of the graph in a nutshell:

    • Áreas roxas altas são ruins
    • Áreas roxas largas são piores
    • Aceleramos muito as coisas e agora nosso gráfico para a versão 4.2 se parece com isto:

    If you compare the tall and wide purple areas from the two graphs, that means that we have achieved a 200% performance increase!

    4 New Elements

    O que mais gostamos nesses 4 novos elementos é que eles têm a capacidade de criar seções inteiras de páginas da web de forma rápida e eficiente, sem a necessidade de arrastar elementos um a um para a área de trabalho do PBS. Também daremos a você a oportunidade de escolher entre estilos diferentes para que tenha mais espaço para personalizar esses três novos elementos de acordo com suas necessidades de design.

    Spacer Element

    É fácil ajustar as margens dos elementos para obter o espaço necessário. O elemento espaçador pode ser usado como uma alternativa para isso. Isso é especialmente útil se você quiser que certas linhas não encolham demais em telas de dispositivos móveis.

    Featurette Element

    O elemento featurette pode ser usado para criar seções da sua página de maneira mais rápida. Essas seções podem incluir cabeçalhos hero, carrosséis de depoimentos e outros itens que você pode usar para aprimorar a funcionalidade da sua página.

    Since all of the Featurette Elements are pre-designed, all you’ll have to do is simply drag the “Featurette” button from the Elements Tab, and choose what you want to add on your workspace from there.

    Team Members Element

    O elemento de membro da equipe é perfeito para apresentar os membros da sua equipe aos visitantes do seu site. Normalmente, uma seção como essa inclui uma foto de um membro da equipe, bem como uma breve descrição na parte inferior.

    Gallery Element

    Este elemento é usado para criar galerias de fotos. Anteriormente, você tinha que arrastar elementos separados (como botões, molduras, etc.) para a área de trabalho do PBS um a um para criar uma galeria. No entanto, este novo elemento faz isso por você, tornando o processo livre de complicações.

    A Huge Thank You

    A versão 4.2 é uma das nossas atualizações mais importantes até o momento. Afinal, desempenho e funcionalidade são cruciais para qualquer ótimo plugin. Gostaríamos de agradecer à @Ann Taylor e à CodeInWP por nos darem um feedback construtivo e nos desejarem boa sorte em nossa jornada. E para todos os usuários do PBS, um enorme agradecimento da nossa parte também pelo apoio contínuo.

    Lançaremos ainda mais atualizações em breve (incluindo o prometido recurso do Google Fonts, entre outros), então fique atento a isso!

    Até lá, boa criação de sites da equipe do PBS!

  • Comemorando o Primeiro Aniversário do Page Builder Sandwich com Chave de Ouro!

    pbs-v4-ad-3 Sim, isso mesmo: o Page Builder Sandwich está comemorando seu primeiro aniversário em 14 de janeiro de 2017. Junto com nossa Promoção de Fim de Ano em andamento (30% de desconto por tempo limitado, sem necessidade de código promocional), o PBS tem algumas surpresas reservadas para você, e a equipe mal pode esperar para compartilhá-las com todos.

    Ao longo do último ano, crescemos muito graças ao apoio de amigos incríveis, algumas avaliações muito úteis e nossos novos amigos na comunidade do PBS no Slack. Não poderíamos esquecer de vocês – os próprios usuários do PBS, que nos ajudaram a alcançar este marco. E então, para comemorar, pensamos: que maneira melhor de proporcionar a vocês uma experiência ainda melhor do que o lançamento do PBS Versão 4.0? Chuva de confetes.

    Caso você tenha perdido, a versão atual, Versão 3.0, passou por grandes mudanças e melhorias. Isso inclui uma interface mais limpa, fluida e amigável, além de melhor responsividade. Para a Versão 4.0, porém, traremos novidades ainda melhores! Portanto, preparem-se, porque as coisas serão muito mais divertidas, festivas e funcionais com o próximo lançamento em janeiro.

    Recurso de Modelos de Página Inteira

    O primeiro em nossa lista de recursos principais são os novíssimos Modelos de Página Inteira. Embora o PBS seja comumente usado para criar todos os tipos de páginas diferentes, levamos em séria consideração que nossos usuários operam seus sites em diferentes nichos (e, portanto, diferentes tipos de sites). Afinal, usuários diferentes têm necessidades diferentes, seja para negócios ou empreendimentos pessoais. É por isso que decidimos abordar isso com o próximo recurso de Modelos de Página Inteira.

    pbs-v4-ag-2 Então, como funcionam esses Modelos de Página Inteira? Simples. Na Versão 4.0, lançaremos vários modelos incríveis. Eles serão divididos em categorias diferentes; cada um projetado para um nicho específico. Os modelos incluirão elementos, layouts e recursos para páginas corporativas, portfólios, sites de e-commerce ou apenas os blogs pessoais habituais (entre outros) para se adaptarem perfeitamente a qualquer site que você precise.

    Então, por exemplo, se você administra um restaurante e precisa de uma página ou site voltado (sem trocadilhos) para esse tipo de negócio, basta escolher o modelo de restaurante. E como o PBS permite uma personalização flexível, você ainda poderá estilizar tudo como desejar. E como o modelo escolhido (neste caso, o de restaurante) virá com recursos específicos projetados especialmente para um site de negócios do ramo gastronômico, ele também virá com elementos do PBS que atendem às necessidades desse tipo de site: como uma seção inteira para o cardápio, recurso de delivery, botões de redes sociais e muito mais. Agora imagine algo assim para o seu nicho específico – se você administra um escritório corporativo, um negócio pessoal ou até mesmo apenas um portfólio – não se preocupe. Com a Versão 4.0, lançaremos modelos para eles também. Sem dúvida, eles serão muito úteis em sua próxima criação de sites!

    Mais Elementos, Mais Opções

    Junto com os novos Modelos de Página Inteira, também temos várias outras novidades a caminho! Como sempre dizemos, o PBS existe porque acreditamos que criar coisas incríveis e impressionantes não precisa ser tão difícil quanto parece. Pensando nisso, convidamos você a dar uma olhada em nossos outros recursos que estão por vir, para que você possa ver por si mesmo todas as páginas e sites elegantes e maravilhosos que poderá criar com o PBS!

    Planos de Fundo Parallax

    A rolagem parallax é uma técnica usada para criar um efeito de fundo 3D exclusivo para o seu navegador. É um atrativo brilhante para qualquer site e, quando feito da maneira certa, pode definitivamente aumentar seu público. Ainda não está convencido? Confira este site incrível do FireWatch que executa o efeito parallax com perfeição.

    Planos de Fundo em Vídeo

    Planos de fundo em vídeo também são um efeito popular usado em sites, especialmente em páginas iniciais, landing pages e cabeçalhos hero. Eles são igualmente impressionantes, e há uma razão para estarem com tudo, confie em nós! E com a atualização mais recente do PBS, você também terá a chance de experimentar planos de fundo em vídeo. Vá em frente e use-os para atrair seu público e obter mais visitas ao site!

    Contagem Regressiva de Data

    Para a Versão 4.0, também lançaremos a novíssima Contagem Regressiva de Data. Ela incluirá os recursos básicos, como definir a data e a hora exatas para a contagem regressiva, além das já conhecidas opções flexíveis de personalização que temos certeza de que você vai adorar.

    Ícones Sociais

    Quer incentivar seu público a divulgar suas publicações nas redes sociais? Não se preocupe, o PBS cuida disso para você! Com os novos ícones sociais, os leitores poderão compartilhar seu site e seu conteúdo com um simples clique de botão.

    Mas temos mais novidades para você! Incluindo:

    • Capacidade de adicionar posts ao seu conteúdo
    • Barras de progresso
    • Contadores numéricos
    • Elementos para WooCommerce, Advanced Custom Fields (ACF), Contact Form 7
    • Depoimentos
    • Tabelas de preços
    • Chamada para ação (Click to action)
    • Caixas de imagem
    • Caixas de ícone
    • Busca e download gratuito de imagens
    • Capacidade de adicionar CSS personalizado
    • …e muito mais!

    Responsividade

    E, finalmente, além de todos esses recursos novos e incríveis, o PBS também terá o orgulho de oferecer uma responsividade ainda melhor.

    pbs-v4-ag-1 No passado, visualizar e editar sua página do PBS em dispositivos móveis não era exatamente uma tarefa fácil – os tamanhos de fonte não combinavam, as imagens ficavam desproporcionais – no geral, sabíamos que precisávamos trabalhar na interface móvel do PBS, e foi exatamente o que fizemos. Trabalhamos nesse recurso específico e o ajustamos para que ele não apenas fique visualmente melhor em termos de interface, mas também mais fluido e acessível. Agora você poderá visualizar e editar seu site no celular sem complicações. Seus olhos com certeza agradecerão, e seu público também.

    Mais fluido, melhor, mais incrível.

    Para concluir, agradecemos sinceramente por todo o seu apoio e lealdade ao PBS, e esperamos que você esteja tão animado quanto nós, pois estamos todos prontos para uma grande jornada!

    E então, essas próximas atualizações atendem às suas expectativas? Há mais alguma coisa que você gostaria de sugerir para a v4? Deixe-nos um comentário abaixo e veremos o que podemos fazer!

    Para ficar por dentro de mais atualizações sobre a v4 (e outras novidades incríveis), assine nossa newsletter abaixo clicando no botão ‘Subscribe’! Não se preocupe: você pode cancelar a inscrição a qualquer momento.

    Esperamos que vocês tenham tido ótimas festas de fim de ano,

    A Equipe PBS

    Boa criação de sites!

  • Como personalizar as seções pré-projetadas do Page Builder Sandwich por conta própria

    We’ve been getting quite a few inquiries the past week about Pre-Design Sections (and by extension, the PBS Templates), what they are, and how they can be accessed.

    So in this article, we’ll be teaching you how to not only access them, but also how to maximize these features of Page Builder Sandwich: By customizing them and making them your own.

    Accessing the Pre-Designed Sections

    If you aren’t familiar yet, all you have to do to access the Pre-Designed sections is to hover your mouse onto the left side of your screen, and access the Elements Inspector. This is the sidebar that lets you drag and drop elements directly onto your content area.

    Say hello to the Elements Inspector!

    Once it’s accessed, simply scroll down to the bottom and select Pre-Designed Sections. A library of the sections will pop up. Select one from the collection, drag and drop, and it’ll show up on your content area, like so:

    From here, you can move the elements within the section around, or move the entire thing and adjust its position. And there you have it! You’ve selected a Pre-Designed Section from Page Builder Sandwich.

    Now it’s time to add in your own twist: By customizing and tweaking with the elements’ settings within the selected section.

    Customizing the Pre-Designed Sections

    Each element’s setting within any one Pre-Designed section can be edited and customized according to your website’s needs and your personal taste.

    This means everything included in your selected Pre-Designed section – like text, colors, images, buttons, everything – can be edited and tinkered with by you.

    Então, por exemplo, se você não estiver satisfeito com o tom azul-esverdeado padrão e com a imagem do campo de trigo na seção Pré-Projetada padrão abaixo…

    You can adjust it. For instance, if I wanted a different background tint on the left:

    Or if you wanted to replace the image of the wheat field on the right:

    Or even change the button style, margin, padding, and font:

    …You can.

    Para comparação:

    Default PBS Pre-Designed Section

    The same Pre-Designed Section, completely tweaked and customized. Notice the different font, color scheme, button style, photo, and margin width. You can actually take this further, and let your imagination run wild.

    Here are a few more examples on how you can spice up our Pre-Designed Sections

    Default Pre-Designed Section from Sandwich

    The same Pre-Designed Section, customized

    You can do it with our Full-Page Templates, too:

    Default Template from Sandwich

    The same Template, customized

    Conclusion

    Há mais nas Seções Pré-Projetadas do Page Builder Sandwich do que você imagina.

    Tweak and customize them to make them completely your own, or even use them as a starting point for when you don’t want to design your page from the ground up.

    Lembre-se, o Page Builder Sandwich está aqui para ajudar você a criar designs em menos tempo. Fazer uso total de nossas Seções Pré-Projetadas e Modelos de Página Inteira ajudará você a fazer exatamente isso.

    Design in less time!

    Get access to Sandwich’s Pre-Designed Sections, Templates, and a whole lot more.

    Try Live Preview
  • 10 maneiras pelas quais seu site pode se destacar na geração de leads e como o PBS pode ajudar você a fazer isso

    Page Builder Sandwich helps you, well… build websites.

    Keeping your audience reeled into your page (and successfully generating leads) is a different story altogether, though.

    Don’t get us wrong. Lots of sites can achieve this without a worry, but that’s usually because they spend a significant amount of time and research doing just that.

    In contrast, some sites admittedly have a little trouble pulling it off, and more often than not, some of them don’t know where to begin. But don’t worry – Page Builder Sandwich will try to lend you a hand with that very same thing.

    Why is it Important to Generate Leads?

    One crucial thing to remember is that generating leads takes more than just buying a domain and setting a website up.

    Now, before we get too into it, take note that Page Builder Sandwich isn’t a marketing website.

    Mas, de qualquer forma, é importante saber que existe uma ciência por trás da geração de leads e, embora nós mesmos não sejamos profissionais de marketing digital, é essencial ressaltar que a conversão bem-sucedida de leads também tem a ver com a execução adequada do design e do conteúdo. É aí que nós entramos.

    “Mas como vocês podem ajudar no aspecto de marketing de tudo isso?”

    Great question! A few weeks ago we began corresponding with Straight North, a blog that specializes in digital marketing and lead conversion. They’ve given us some really tips which we hope you guys find helpful in your site-building journey.

    Now, remember that there could be lots of factors as to why your website isn’t generating the amount of leads you’d like. The first step is to identify what these factors are, and hopefully, this list can help you out with doing just that.

    TIP #1: Create Content that Stimulates Action

    According to Straight North, 84% of website conversions occur on the first visit, and only 11% convert in the second.

    Em outras palavras, as primeiras impressões importam.

    Assim como audições ruins não resultam em atores conseguindo papéis principais, a primeira visita de alguém ao seu site pode ser o seu sucesso ou a sua ruína.

    That’s why it’s you and your team’s job to try and convince people to stay glued to your page.

    Straight North suggests that posting copy and content (both text and images) is a great way to catch your visitors’ attention. Remember to always allot sufficient time to research on what makes good copy and good content, and never underestimate either.

    Aqui estão alguns sites que podem ajudar você em sua jornada para gerar leads de sucesso:

    How PBS Can Help:

    Wow your site visitors by using interactive PBS elements like the Carousel, or use Parallax Scrolling, and Video Backgrounds to catch their attention. Remember to execute their placement in a balanced way though, as to not overwhelm your audience.

    TIP #2: Intuitive Navigation

    In the realm of web development and site-building, intuitiveness in the user interface (or UI) is key.

    This means that when your visitors or users find their way around your site by intuition (i.e. easy site-navigation and straightforward instructions), they’re more likely to stay glued on your site.

    Agora, se navegar pelo seu site for uma experiência frustrante, é provável que seus visitantes não fiquem tempo suficiente para ouvir o que você tem a dizer e o que tem a oferecer a eles.

    Straight North adds that getting too “clever and creative” with navigation labels is a bad idea, and suggest that you use terms like “Contact Us” for call-to-action buttons, rather than using vague labels like “Interact!” or “Dialog.” Remember that bombarding your site with too much jargon can cause frustration to your audience as well.

    So as long as navigating through your website comes to the user as second nature, then you have one less thing to worry about when trying to convert leads.

    How PBS Can Help:

    Page Builder Sandwich’s UI is highly intuitive, and is akin to using a Word processor (like Google Docs and Microsoft Word). Check out our demo to get some inspiration on how you can apply intuitive changes to your site, too!

    OTHER PAGE BUILDERS …have too much stuff going on.

    PAGE BUILDER SANDWICH …gets straight to the point.

    TIP #3: Use Relevant, Custom Imagery

    Your images and how they’re presented also matter, and they matter a lot.

    While it may seem trivial to some, uploading boring stock images, stretched out/pixelzed photos, or badly-presented typography is a huge factor that dictates whether your visitors stay on your site, or move to a better, more credible-looking alternative.

    How PBS Can Help:

    Because it’s WordPress-run, PBS lets you post high-quality photos in your website. As long as you have the right image dimensions, you shouldn’t have a problem with posting photos.

    Additional lifehack: You can also check out Pexels.com and Unsplash.com to get awesome, high-quality stock photos!

    TIP #4: Persuasive Credibility Elements

    Skepticism is a huge conversion killer.

    That’s why more often than not, it’s always a good idea to add in elements that back up your credibility as a website (or business), like testimonials from credible sources, and logos of reputable companies or groups that you’ve worked with. So use customer testimonials, show logos of well-known customers, and include third-party mentions in your content.

    How PBS Can Help:

    Use PBS features to vouch for you. Display your customers’ testimonials in a Carousel, or use the Featurette element to showcase third-party mentions, or make use of the column element to effectively display logos of your well-known customers (like in the graphic above).

    TIP #5: Get Personal!

    Straight North says that using a lighter, casual tone makes all the difference when writing content (such as articles and bio’s) on your site. This lets your users know that you’re human too, and not just some bot trying to get a run for their money (which we hope you aren’t).

    How PBS Can Help:

    While this part is entirely up to you and your team, it wouldn’t hurt to use elements such as the Featurette, Gallery, and Image Box to liven up your bio’s as well. Adding in other PBS elements like Social Media Icons can help put a personal touch to your pages, too.

    PBS’ Industry Template makes full use of the Image Box Elements for its About Us and Feature Sections.

    TIP #6: Irresistible Calls-to-Action

    Calls-to-Action (CTA) are a crucial part of generating leads.

    You will FAIL to capture first-visit conversions unless you ASK. – Straight North

    Just asking isn’t enough, though. According to Straight North, your calls-to-action should be executed both “skillfully and persuasively”.

    The trick is to have effective Calls-to-Actions plus a good combination of smart consistent placement, offers that give off substance, time-sensitive offers (giving them offers for a set, limited time will give them a sense of urgency), and most importantly, guaranteed offers.

    You want your site to trust you. “Take away all arguments for delay, and conversions will increase”, Straight North says.

    How PBS Can Help:

    PBS’ Call-to-Action Button – as well as other elements such as the Countdown and Page Heading element – can help ease your burden regarding this task.

    Executing them correctly is up to you and your team though, so make sure to give time to research about CTA placements and other marketing tips.

    Aqui estão alguns recursos que podem ajudar a aprimorar suas CTAs:

    TIP #7: User-Friendly Forms

    Uma pessoa enviando as informações dela para você por meio de um formulário no seu site é, em última análise, o que mede uma conversão de lead bem-sucedida.

    This is why placing user-friendly contact forms on your site is of the utmost importance. They’re the ultimate “make-or-break stage of a great conversion opportunity”, says Straight North.

    A couple of PBS’ third-party plugins available for shortcode mapping

    So don’t intimidate your site visitors by overwhelming them with too many question forms, or have them exhaust too much energy, like having them type long sentences instead of choosing their answers from a drop-down list.

    Letting them know that you value their privacy is also a must. Be sure to place clean, good-looking forms on your site so as to boost credibility.

    How PBS Can Help:

    With PBS’ Shortcode Mapper feature, you can place awesome, reputable contact forms like Advanced Custom Fields (ACF) and Contact Form 7 on your site.

    TIP #8: Prominently Displayed Phone Numbers (or Contact Details)

    Contact number and social media buttons displayed prominently in PBS’ Restaurant Template

    Uma exibição consistente e de destaque dos números de telefone é fundamental se você for o tipo de empresa que oferece suporte por telefone. A Straight North acrescenta que investir em números gratuitos (0800) também pode impulsionar suas conversões.

    Se você é uma empresa de tecnologia como nós, também é uma boa ideia exibir seu endereço de e-mail (ou outras formas pelas quais seus visitantes possam entrar em contato com você) em seu site.

    How PBS Can Help:

    PBS’ Full Page Niche-Based Templates have fields that let you feature phone numbers and other contact information more prominently, so that your visitors can reach you right away.

    TIP #9: Continuous Testing

    Straight North attests to the importance of site maintenance and testing: “No matter how good your website is in converting leads, it can always be better.”

    Isso vale para qualquer site, e não apenas para um que esteja tentando converter leads. Garantir que o seu site esteja em excelente forma e que seus clientes estejam sempre satisfeitos ajudará sua empresa a ir longe.

    How PBS Can Help:

    This one is up to you, but if you’d like a tip: the PBS Team continuously tests the site and page builder for any bugs, and always work to make sure you guys are satisfied. We don’t exactly have a feature for making sure you do regular tests on your site, so this one’s entirely up to you and your team. Do it, and do it well!

    TIP #10: Mobile-Friendly Design

    Almost everyone has a cellphone or tablet; but while only 23 percent of lead conversion rates come from mobile devices, it absolutely will not do to ignore any sort of potential conversions, no matter the percentage (leads are still leads, after all).

    “Users converting from desktop view may have seen the site initially on a mobile device,” Straight North says. “Mobile conversions are (also) likely to grow as mobile Internet access continues to soar at the expense of desktops.”

    You can preview your site on mobile view directly on desktop

    How PBS Can Help:

    Page Builder Sandwich is Mobile Responsive. You can view PBS-built sites on mobile, as well as check previews of your mobile site directly through desktop while editing. This way, you won’t have to keep switching to your phone in order to check if your site looks good on mobile.

    Everything Matters in Site-Building

    At the root of it all, it’s very, very important to understand that everything on your website – down to the smallest of details – has an impact on your audience.

    The quality of your copy, images, your layout – all of it matters, and it matters a lot.

    E um dos maiores erros que as pessoas cometem ao tentar gerar leads é exatamente este: não dar o devido valor a pequenos aspectos que compõem o site (como design, texto e outros conteúdos).

    Hopefully your website garners the success it very well deserves; it’s been built with PBS, after all. ?

    Muito sucesso para você e em todos os seus empreendimentos, e obrigado, como sempre, por usar o Page Builder Sandwich!

    Boa criação de sites!

  • Onde as Coisas Ficam um Pouco Técnicas: Como Fizemos Nossa Versão de Mapeamento de Shortcodes Acontecer

    How-We-Made-Our-Version-Of-Shortcode-Mapping-Happen-2No artigo anterior, discutimos o básico sobre o mapeamento de shortcodes e como você pode ter acesso aos seus excelentes benefícios. Decidimos dividir o artigo apresentando a versão do Page Builder Sandwich para o Mapeamento de Shortcodes, já que o texto a seguir pode ficar um pouco mais técnico.

    Abaixo estão descrições mais detalhadas do funcionamento interno do nosso recurso de mapeamento de shortcodes e como fizemos para que ele funcionasse.

    Um Processo Automatizado

    Para decidir quais plugins incluir no mapeador de shortcodes, criamos um script automatizado que reúne os principais plugins no diretório de plugins do WordPress com base nos seguintes critérios:

    • Entre os 1.000 plugins populares, mais bem avaliados e atualizados, com pelo menos 4.000 instalações ativas,
    • Com pelo menos 4.000 instalações ativas,
    • Com pelo menos 20 avaliações e;
    • Com uma classificação média de pelo menos 3 estrelas

    Executamos essa consulta diariamente no diretório de plugins do WordPress. Esses filtros garantem que obtenhamos uma lista de plugins de boa qualidade que muitas pessoas usam. No momento em que isso foi escrito, esses critérios resultaram em 800 plugins. Isso é muito. Tipo, muito mesmo.

    Alguns dos plugins mais populares detectados para mapeamento de shortcodes.
    Alguns dos plugins mais populares detectados para mapeamento de shortcodes.

    Em seguida, executamos uma série de verificações automatizadas no código-fonte de cada plugin para descobrir se ele contém shortcodes e, depois, tentamos encontrar todos esses shortcodes, incluindo todos os seus atributos. Processando os dados, isso resultou em mais de 2.000 shortcodes. Uau duplo. Os shortcodes detectados são então inseridos no banco de dados de mapeamento de shortcodes para inspeção manual.

    Ao final desse processo, temos uma lista enorme de plugins e seus possíveis shortcodes. Agora é uma questão de limpar esses dados para garantir que tudo esteja correto.

    Um Processo Manual

    Esta é provavelmente a parte mais difícil de todo o sistema de mapeamento. O código dos plugins vem em diferentes formatos e tamanhos, e nem todos os shortcodes são detectados automaticamente pelos nossos scripts. Embora o WordPress Codex recomende o uso da função `shortcode_atts` para filtrar os atributos de um shortcode, isso é apenas uma recomendação e nem todo mundo faz isso. Também não há uma maneira infalível de verificar a estrutura interna de um shortcode quando um plugin está instalado.

    Para garantir que tenhamos todos os shortcodes e seus atributos corretos, criamos uma área de front-end dedicada à edição de shortcodes e atributos, construída com AngularJS e Bootstrap.

    Interface Bootstrap & AngularJS para ajustar todos os shortcodes mapeados.
    Interface Bootstrap & AngularJS para ajustar todos os shortcodes mapeados.

    Temos que analisar manualmente cada plugin, verificar a documentação de seus shortcodes e garantir que todos os dados que temos estejam corretos.

    Embora isso seja minuciosamente tedioso, há alguns lados positivos em ter um processo automatizado:

    • De acordo com nossas primeiras estatísticas, apenas cerca de 1 em cada 2 plugins possui shortcodes.
    • Metade dos shortcodes detectados não possui atributos (mas uma parte disso pode ser falsos positivos)
    • Ao selecionar apenas plugins de boa qualidade, é muito provável que eles tenham documentação de shortcodes

    Quando todos os shortcodes de um plugin tiverem sido verificados, só então o servidor começará a distribuir os mapeamentos de shortcodes desse plugin para os usuários.

    Uma Chamada de API REST

    A última peça do quebra-cabeça é o próprio plugin. O conceito aqui é simples: descobrir quais plugins estão ativos, qual tema o site está usando e quais shortcodes estão disponíveis, e então consultar o banco de dados de mapeamento de shortcodes para ver se ele possui os mapeamentos. Para isso, criamos um endpoint personalizado da WP REST API que todos os clientes consultam para obter seus mapeamentos de shortcodes mais recentes.

    O Futuro: Crowdsourcing

    Verificar manualmente cada plugin exige muito tempo e esforço. Assim que a plataforma de mapeamento de shortcodes estiver estável, planejamos abrir o mapeamento de shortcodes para todos. Isso significa que qualquer pessoa poderá ajudar a adicionar shortcodes.

    Você pode estar pensando: “por que eu ajudaria a mapear shortcodes? O que eu ganho com isso?”. Bem, algumas coisas vêm à mente sobre o motivo pelo qual as pessoas gostariam de ajudar:

    1. Se você criou um plugin e nós ainda não o identificamos devido aos critérios acima (e ele está no diretório de plugins do WordPress), você mesmo pode adicionar os mapeamentos. Seu plugin passará a ser totalmente suportado pelo PBS!
    2. Como no processo automatizado lidaremos apenas com aqueles presentes no diretório de plugins do WordPress, autores de plugins e temas premium não serão incluídos. Portanto, se você tiver um, também poderá adicionar seus mapeamentos de shortcodes para eles.
    3. E para aqueles que não criam plugins, podemos recompensar quem ajudar. Para tornar o mapeamento de shortcodes uma iniciativa atraente, podemos recompensar os colaboradores voluntários com uma licença pessoal ou um upgrade para uma licença premium do PBS!

    Inscreva-se na Nossa Newsletter

    A funcionalidade de mapeamento de shortcodes estará disponível para nossos clientes provisoriamente em 12 de agosto  15 de agosto  16 de agosto de 2016. Nem todos os shortcodes estarão mapeados até esse momento (nossa estimativa é de talvez 100 plugins), mas o mapeamento será feito continuamente e os clientes os receberão assim que novos forem disponibilizados.

    Inscreva-se na nossa newsletter para receber novidades sobre o mapeamento de shortcodes, quando o lançaremos e quando abriremos o mapeamento de shortcodes para o público!

  • ATUALIZAÇÃO DO PBS: Versão 4.1 e Usabilidade

    Após o lançamento da Versão 4.0 em janeiro passado, continuamos trabalhando no desenvolvimento do PBS, adicionando tanto correções quanto melhorias. Estamos animados para compartilhá-las com você, então aqui está o que preparamos para a atualização da Versão 4.1.

    Melhorias na Barra de Formatação

    A atualização mais recente 4.1 gira em torno da barra de formatação de texto. Além de resolver vários problemas de bugs, também aprimoramos algumas coisas na barra que devem tornar sua experiência com o PBS mais fluida e eficiente.

    Atualizações no Seletor de Cores

    Nas versões anteriores do PBS, o seletor de cores apresentava alguns problemas que causavam certo inconveniente no processo de edição, principalmente quando se tratava de editar texto e cor do texto. No entanto, para a v4.1, corrigimos o problema e fizemos novos ajustes para uma edição de texto sem complicações.

    • Mais amostras de cores para facilitar a seleção de cores
    • O seletor de cores agora exibe transparência
    • Correções de bugs relacionadas à edição da cor do texto

    Atualizações na Formatação de Texto

    Anteriormente, tínhamos alguns botões nos quais era necessário clicar repetidamente para aumentar um valor e, em seguida, segurar CTRL/CMD e clicar para diminuir. Inicialmente pensamos que isso era intuitivo, mas os usuários disseram que não era óbvio. Corrigimos essas inconsistências nesta atualização.

    • A altura da linha agora está mais fácil de acessar: arraste o controle deslizante para ajustar ao tamanho desejado ou simplesmente insira o tamanho desejado no espaço fornecido
    • O botão de tamanho da fonte foi dividido em dois botões: diminuir e aumentar para facilitar o uso
    • Aumentar/diminuir o tamanho da fonte também está mais acessível, agora com px como unidade de medida para facilitar a edição. Anteriormente, era exibida uma unidade “x” que realmente não significava nada
    • Os botões de alinhamento à esquerda/centro/à direita/justificado agora estão agrupados para reduzir a quantidade de botões exibidos
    • O botão “Limpar Formatação” agora limpa os outros estilos (como line-height), o que não fazia antes

    Melhorias na Linha Horizontal

    Anteriormente, a linha horizontal vinha apresentando alguns problemas. Em alguns temas, as linhas horizontais eram tão pequenas que ficavam difíceis de clicar. Para corrigir isso, removemos a linha horizontal da barra de formatação e a convertemos em seu próprio elemento. Além disso, agora você também pode alterar as cores da linha por meio do seletor de cores.

    Atualizações Futuras: O Que Vem por Aí no PBS?

    Como dissemos, ainda temos novidades (e mais atualizações) a caminho. Aqui está uma pequena prévia do que temos reservado para você no futuro:

    • Google Fonts (finalmente!)
    • Estamos explorando a ideia de a barra de formatação de texto ser mais do que apenas um lugar para formatar apenas texto. E se os botões mudassem dependendo do contexto atual? Por exemplo, seria muito interessante se um botão de alinhamento vertical aparecesse quando você estivesse editando algum texto dentro de uma coluna.

    O Que Você Gostaria de Ver nas Futuras Atualizações do PBS?

    Estamos sempre abertos a melhorar o PBS, então se vocês tiverem alguma sugestão, falem conosco! Você tem alguma solicitação de recurso que gostaria de adicionar à nossa lista crescente? Mais alguma coisa que você acha que precisa de ajustes na versão atual? Conte para nós nos comentários abaixo!

    Boas criações de sites!

  • Feliz 4 de Julho! 20% de desconto em TODAS as licenças até 6 de julho!

    Obtenha 20% DE DESCONTO em todas as licenças do Page Builder Sandwich de 4 a 6 de julho de 2017! Basta inserir o código promocional 4JULY2017 para obter seu desconto hoje!

  • Medidas de Segurança no WordPress: A Importância dos Backups

    safety-measures-in-wordpress-the-importance-of-backupsImagine o seguinte: seu primeiro site WordPress, finalmente no ar e funcionando. Você não se sentia tão realizado há meses. Você dá a si mesmo um merecido tapinha nas costas, e as pessoas que ajudaram você a alcançar o fruto do seu trabalho fazem o mesmo. Você instala os plugins de que precisa e começa a planejar o futuro do seu site. O futuro parece brilhante, e tudo vai às mil maravilhas.

    Até que o impensável acontece. E seu site sai do ar.

    Você dá de ombros. Já ouviu falar desse tipo de coisa acontecendo, até mesmo com os melhores. Ora, você tem certeza de que Mark Zuckerberg e David Karp já passaram por isso antes, e ambos estão muito bem agora, não estão?

    Então você tenta colocá-lo no ar novamente, pesquisando freneticamente no Google por soluções. Não funciona na primeira tentativa. Também não funciona na segunda — nem na terceira, nem na quarta, nem na décima sétima e nem mesmo na vigésima segunda. Seus olhos se arregalam ao perceber que você está total e completamente arruinado; seu site se foi para sempre. Você vasculha a web em busca de uma solução, mas quase todos os sites de tutoriais dizem a mesma coisa:

    Você deveria ter feito backup dos seus arquivos do WordPress desde o início.

    Você deveria ter feito backup dos seus arquivos do WordPress desde o início.

    Você deveria ter feito backup dos seus arquivos do WordPress desde o início.

    Um dos piores pesadelos de quem tem um site, no mínimo. É exatamente esse tipo de coisa que queremos evitar, então como podemos preveni-la? Bem, a resposta é bem simples: precisamos instalar um bom plugin de backup.

    "a very "secure" bridge" by Garrett LeSage is licensed under CC BY-SA
    “a very “secure” bridge” por Garrett LeSage está licenciada sob CC BY-SA

    Como e por onde começar?

    O primeiro passo para fazer o backup do seu site WordPress é saber exatamente o que você precisa salvar. No WPBeginner, em seu artigo “Quais arquivos do WordPress você deve fazer backup? E a maneira certa de fazer isso”, os seguintes arquivos são listados como essenciais para esta tarefa:

    • Arquivos principais do WordPress
    • Arquivos na pasta wp-content (seu tema, plugins e uploads)
    • Arquivo de configuração do WordPress
    • Seu banco de dados do WordPress

    Uma explicação mais detalhada sobre backups

    O WordPress por si só não vem com seus próprios sistemas de segurança e backup para o seu site (você poderia aprender como configurá-los manualmente, mas isso levará muito tempo), então cabe a você encontrar uma maneira de diminuir as complicações. Atualizar seu site é sempre essencial (caso você queira adicionar algo novo, como outro plugin, ou se quiser remover algo), e os backups são indispensáveis, a menos que você queira perder dados (o que você não quer). Outras razões para fazer o backup do seu site e reforçar a segurança incluem a garantia de mantê-lo livre de hackers e de que ninguém roube nenhum dado do seu site.

    “Também existe um plugin para isso.”

    O WordPress tem milhares de plugins para todos os tipos de recursos, incluindo (sim, você adivinhou) vários para medidas de segurança e backup. Há uma infinidade desses plugins por onde escolher; alguns dos mais populares incluem o BackupBuddy e o UpDraftPlus. Existem avaliações desses plugins (e de outros) em quase todos os lugares, então não se preocupe – a mágica da internet dá uma mãozinha. Pessoalmente, usamos o VaultPress, tanto para segurança quanto para backup, pelos seguintes motivos:

    1. O VaultPress foi criado pela Automattic– fundada por Matt Mullenweg– a mesma pessoa que fundou o próprio WordPress. Muitos, se não a maioria, dos produtos e serviços da Automattic são infalíveis, e nunca é uma má ideia assinar plugins que já foram testados e comprovados.
    2. Ao contrário da maioria dos plugins de backup, o VaultPress não requer espaço de armazenamento. Eles armazenam seus arquivos em seus próprios servidores, para que você não receba avisos do tipo “você-está-consumindo-muito-espaço-do-servidor” da sua hospedagem.
    3. Simplicidade. Para usá-lo, você só precisa fazer login na sua interface e poderá ver todos os detalhes do seu backup e realizar operações a partir de lá.

    Agora, como o VaultPress atende aos nossos padrões pessoais, ele funciona perfeitamente para nós. No entanto, se você não estiver satisfeito com o VaultPress, muitos sites – como WPBeginner e wpmudev — oferecem artigos de comparação caso você ainda tenha dúvidas para decidir.

    Tudo depende de você

    No final das contas, a decisão de proteger e fazer backup do seu site ou não cabe a você. Algumas pessoas estão confiantes de que conseguirão enfrentar os riscos que um site desprotegido apresenta… e outras não – e tudo bem. Afinal, é melhor prevenir do que remediar.

    Qualquer que seja a decisão que você tomar, lembre-se sempre de ponderar suas opções. Afinal, só você pode avaliar aquilo com o qual é capaz de lidar.

    Boa sorte!