As melhores dicas e ferramentas para construir seu primeiro site WordPress

Tenho uma confissão a fazer hoje: não sou um web designer muito bom. Nunca tive nenhum treinamento formal – sou completamente autodidata. Meu ofício é escrever, e eu peguei o web design como um elemento necessário para ser um escritor freelancer e não ter o orçamento para um site adequado. Decidi desde o primeiro dia que preferia ter um site DIY decente que eu gostasse (mas com alguns possíveis “erros”) do que pagar por um site de baixo orçamento que eu odiava e não podia ajustar com o tempo. Afinal, todos sabemos como os provedores de serviços de baixo orçamento podem ser.

Assim começou minha entrada no web design amador DIY. Rapidamente, o processo do site DIY despertou meu interesse em web design. Ainda não sou um “verdadeiro designer”, mas conheço o suficiente dos fundamentos para maximizar meu fluxo de trabalho, fazer meu caminho em torno de um tema que gosto e implementar os ajustes específicos que desejo.

Aqui está o negócio: eu não sou (e provavelmente nunca serei) um web designer profissional. E pode ser difícil encontrar recursos para pessoas de bricolage como eu – pessoas inteligentes o suficiente para descobrir a maioria das coisas e dispostas a dedicar tempo, mas que não têm formação técnica real.

Estas são algumas das melhores ferramentas e recursos para o web designer DIY que eu peguei ao longo do caminho. Se você também está inclinado, este é para você!

Construtores de sites e temas personalizáveis

Pessoalmente, não sou um grande fã de construtores de sites – adoro o WordPress e gosto de ter muito mais controle do que a maioria dos criadores de sites oferece. Se você gosta da ideia de arrastar e soltar para obter o site exato que deseja sem toda a agonia, dê uma olhada no tema Divi para WordPress. Você também pode encontrar um grande número de temas personalizáveis ​​para WordPress.

Como criar um tema filho do WordPress

Normalmente, é quase impossível encontrar o tema perfeito; sempre há algumas modificações que precisam ser feitas. Então, por que não pegar um bom tema padrão do WordPress, como Twenty Fifteen, e ma...

Todo designer tem seu tema favorito – e o favorito deste DIY (não) designer é o GeneratePress. Ele pode fazer praticamente qualquer coisa que eu imaginar, os complementos valem 100% a pena e são tão acessíveis, os tutoriais em vídeo respondem a 98% das minhas perguntas e o desenvolvedor (Tom) é muito ativo e receptivo nos fóruns de suporte. Eu usei este tema por 2 anos e não poderia estar mais feliz com ele.

Cuidando das aparências

Hoje em dia, até eu sei que o design responsivo e amigável para dispositivos móveis é uma necessidade absoluta. Visitei sites no meu telefone que não eram móveis ou responsivos, e não são bonitos. Atualmente, a maioria dos temas tem um elemento responsivo – certifique-se de que o seu também tenha. E então, enquanto você está no processo de construção, use uma ferramenta como Duo, Screenify ou Browser Shots para garantir que o design do seu site fique bom em qualquer dispositivo.

Você já usou um guia de estilo? É uma folha de referência para todos os elementos visuais do seu design – as fontes, estilos, formatação do título e cores do seu site. É extremamente útil ter e consultar à medida que você cria e ajusta seu site, e você pode gerar o seu próprio com o Stylify Me.

Isso pode parecer incompreensível neste momento em sua carreira de design DIY – ou talvez não – mas chegará o dia em que você desejará fazer algumas modificações no CSS para ajustar a aparência de alguns elementos específicos. Quando chegar a hora, você pode mergulhar em tutoriais, procurar suporte do seu tema ou recorrer a um gerador de CSS para criar o código desejado. Você também pode conferir o Webflow, um editor de arrastar e soltar que permite criar o que deseja ver na página e gerar o código CSS para você. É um serviço pago, porém, que tende a contrariar o DIY.

Esta é uma batata pequena, mas certifique-se de que seu site tenha um favicon. Você pode usar este gerador de favicon ou obter um plugin de favicon simples para o seu site WordPress para tornar o processo super simples. (Eu prefiro muito mais a rota do plugin, na minha opinião não profissional.)

O favorito de todos: fontes

As fontes são o filho de ouro do web design; parece que todo mundo adora tipos de letra. Mas se você não sabe o que está fazendo, as fontes podem ser um pouco intimidantes. Comprar uma fonte, instalá-la, até modificá-la…yeesh. Se você quer apenas que seu site tenha uma boa aparência, você pode instalar o Google Fonts e fazer uso de um banco de dados bastante robusto de fontes amigáveis ​​para a web. Também é fácil encontrar combinações de fontes do Google que parecem boas junto com uma simples pesquisa na web.

O Type-Finder é um site que faz uma pequena série de perguntas e oferece sugestões de fontes. Escolha e escolha os que você gosta, e você está no caminho certo. Isso torna a escolha de fontes mais fácil, especialmente se você não for bem versado em fontes e teoria de fontes.

Quando você estiver se sentindo corajoso e pronto para obter a fonte exata que deseja para seus cabeçalhos, pins e muito mais, confira Glyphr. É um editor de fontes e é super legal.

Ferramentas de fluxo de trabalho

Quando você é um designer de bricolage voando pelo assento de suas calças, raramente pensa em fluxo de trabalho. Mas eu aprendi (da maneira mais difícil) que alguns ótimos elementos de fluxo de trabalho de design podem tornar seu web design DIY muito menos uma dor de cabeça.

13 ferramentas baseadas em navegador que todo designer deve ter em seu kit de ferramentas

Ah, o aplicativo baseado em navegador. É um software sólido que se atualiza sozinho. Você não precisa mexer com o download de coisas. E, talvez o mais fantástico de tudo, seu aplicativo de escolha pode ser acessado em qualquer ma...

A primeira coisa que você quer adotar de “real web designers” é o conceito de wireframes. Os wireframes podem ser tão simples quanto esboçar cada página no papel ou tão complexos quanto as grades no Adobe Photoshop. Para meus propósitos, geralmente esboços em papel são suficientes (afinal, nunca sou super-técnico com meus designs), mas se você preferir ver as coisas de forma mais formal em uma grade digital, confira o Mockflow (que é um serviço pago) ou Moqups.

Outro lugar onde eu fico preso é onde as palavras vão e como elas vão ficar – antes de eu ter a cópia escrita. Para isso, um gerador de texto fictício é ótimo. Ter uma cópia em seu site enquanto você o está construindo facilita a avaliação sem ficar preso ao que as palavras realmente serão (que é minha ruína pessoal).

Quando é hora de parar de brincar com linhas e palavras e começar a brincar com cores, você tem algumas opções divertidas. Os seletores de cores são algumas das minhas coisas favoritas – eu escolho uma cor e, em seguida, o seletor de cores cospe ótimas combinações de cores. Adobe e Color Wizard são duas opções divertidas para brincar.

Se seus seletores de cores não estão cortando para você, você pode usar algo como Pictaculous. Carregue uma imagem que você gosta, e ela irá cuspir um tema de cores desenhado a partir da imagem. É muito legal!

Isso não é tudo

Não há fim para as ferramentas de design que são ótimas para designers de bricolage, mas essas são as coisas que descobri que tornam a vida muito mais fácil para o designer iniciante. Qual é a ferramenta que você gostaria de ter?

Ebook grátis: 25 ferramentas obrigatórias para web designers

O kit de ferramentas de um designer pode ser a chave para seu sucesso, mas como você sabe quais ferramentas incluir em seu fluxo de trabalho? Acreditamos que essas 25 ferramentas são indispensáveis ​​para qualquer web designer de sucesso.