Website

Como Criar Um Site – Guia Completo

como criar um site

Como Criar Um Site é um dos primeiros passos que você precisa entender se quer obter uma identidade digital. Com os avanços da criação de sites, agora temos inúmeras maneiras de como criar um site. Neste tutorial, vamos nos concentrar em alguns métodos, usando:

  • Sistemas de Gerenciamento de Conteúdo (CMS).
  • Scripts de ecommerce (loja virtual).
  • Construtores de Sites.

Não se preocupe caso não tenha experiência de como criar um site, pois vamos passar por todos os processos juntos neste guia.

E aproveite nossa oferta especial de hospedagem limitada e crie o seu site agora com desconto!

O que você precisa saber antes de criar um site

Você precisa saber que você não vai acertar na primeira. E nem na segunda. E talvez nem na terceira… e essa é a mágica da internet. Ela te permite testar infinitamente e ajustar as ferramentas e recursos para atender o seu objetivo. Mas tenha isso em mente, essa disposição em aprender e se reciclar a cada dia nesse mundo digital que morre e nasce a cada minuto com diversas funcionalidades.

Convencido e preparado pra lançar seu projeto online? Então vamos lá!

1. Defina o Objetivo do seu Projeto

É preciso definir o seu projeto online e o que você espera dele. Pra isso separamos algumas categorias.

  • Sites em geral. Pode ser um site institucional, para divulgar atividades, compromissos, missão e valores de uma empresa. Bem como um site de notícias do seu bairro ou de prestação de serviços. Mas nada impede de você também fazer um site de entretenimento ou educacional.
  • Blogs. Uma forma mais simples de começar a sua jornada na internet é fazer criar um blog. Os tema são os mais variados possíveis: viagens, gastronomia, fotografia, eventos regionais, aparelhos eletrônicos, tecnologias, games ou um diário virtual. Tenho certeza que você é fiel a pelo menos um blog, não é?
  • E-commerce. No português claro, estamos falando de uma loja virtual. Se você quer vender produtos, possibilitar transações financeiras online, é aqui que você se encaixa. E na internet você tem uma loja 24h, sem precisar de vendedores e gastos com estrutura física.
  • Comunidades online. Cada vez mais acensão, as comunidades online põe milhares de usuários de internet em contato ao mesmo tempo. Elas também são chamadas de fóruns e comportam qualquer tipo de tema ou proposta. Só se atente a uma coisa: conseguir grandes audiências leva tempo. Então, é recomendado começar agora.
  • Portfólios. Mostrar suas habilidades na internet é uma ótima maneira de você criar e manter uma presença e visibilidade online. É assim que você pode conseguir novos clientes e levar vantagem em entrevistas de emprego, competições e na concretização de negócios.

2. Crie um Sitegrama

Como criar um sitegrama

Sitegrama é a estrutura do seu site, que vai te ajudar a visualizar como será o seu projeto. É importante para entender a dimensão que seu site pode atingir e enxergar novas possibilidades para crescimento no futuro.

Com isso definido, é hora de começar!

Etapa 1 – Escolha a Plataforma

Como disse antes, há três formas de como criar um site grátis passo a passo:

    1. Vamos pela CMS. O Sistema de Gerenciamento de Conteúdo e Imagem como ferramentas avançadas que pode ser usado para construir e gerenciar sites e os conteúdos que os compõem. Quando se trata de CMSs, existem três líderes de mercado: WordPress, Drupal e Joomla! Todos são gratuitos e de código aberto, mas o WordPress é, de longe, é usado com muito mais frequência. Os três sistemas foram desenvolvidos usando PHP, todos os três fazem uso de temas e templates para customização visual e todos os três são dirigidos pela própria comunidade. Mesmo que Joomla! e Drupal não possam competir com o WordPress quando se trata de usabilidade, simplicidade e manutenção, tamanho da comunidade e a disponibilidade de plugins e temas gratuitos etc. Para alguém com pouca experiência de como criar um site, o WordPress é a escolha mais óbvia.
    2. Utilizando Construtor de Sites. O mundo da automação chegou a um novo patamar quando os construtores de sites vieram a existência. No começo, as opções de customização independente da funcionalidade e design eram muito limitadas, mas agora há muito que se pode fazer com a função arrastar e soltar em um construtor de sites moderno. Comparado com CMSs e codificar sites do zero, Construtores de sites são muito rápidos e eficientes indiscutivelmente perfeito para pessoas com falta de experiência em desenvolvimento de sites e não querem passar muito tempo no processo de desenvolvimento.
    3. Como Criar um Site do início. A terceira opção a sua disposição é para criar um site desde o zero. Este processo deve idealmente intrigar usuários que tenham no mínimo uma experiência básica de desenvolvimento. As tecnologias utilizadas neste tutorial de como se construir um site estável serão HTML e CSS.

Etapa 2 – Obtenha uma Hospedagem de Sites

Para saber como criar um site, imagine um prédio: como qualquer construção, ele precisa ter um endereço pelo qual os usuários possam acessá-lo e também um lugar onde residir.

Para conseguir publicar seu site na internet, você precisa de uma hospedagem de sites, um serviço que acomoda tudo o que você quiser colocar em um um servidor da internet. É assim que os usuários vão conseguir acessar sua página e conteúdos na rede.

A Hostinger oferece 3 alternativas de serviços de hospedagem que se encaixam com qualquer tipo de projetos online e de qualquer tamanho. Vamos dar uma breve olhada neles e ver qual é o mais apropriado para você.

Hospedagem Compartilhada

Recomendada para sites de pequeno e médio porte, a Hospedagem Compartilhada é um tipo de servidor que guarda sites de vários usuários ao mesmo tempo. Pense nele como um transporte público, como um ônibus ou uma linha de metrô.

Neste tipo de hospedagem, todos os sites usam da mesma fonte de recursos de um servidor físico. Isso permite que o serviço seja mais barato que os outros tipos, embora também tenha algumas limitações.

O que você recebe?

  • Instalador de um clique. Fácil de configurar e instalar nas ferramentas mais populares, como scripts de ecommerce, gerenciadores de conteúdo (CMS) , plataformas de blog, fóruns e mais.
  • Gerenciador de acesso. Quando for trabalhar em um projeto com múltiplas pessoas, dividir uma conta pessoa pode ser um pouco arriscado. Evite essa chateação e garanta acesso ao serviço delimitando as permissões de usuário.
  • Gerenciador de arquivo e FTP. Edite seus arquivos e diretórios em gerenciadores de arquivos que você pode controlar pela internet. Ou use um cliente FTP da sua preferência, como o FileZilla.
  • Backups semanais. garanta a segurança dos seus arquivos e banco de dados com backups semanais automáticos. Tudo acontece dentro do painel de controle. Você pode guardar até três cópias de tudo.
  • Gerenciador de cache. O cache faz com que o seu site carregue as páginas mais rapidamente. Site mais rápido, visitantes mais felizes, resultados melhores!
  • Registro de domínio grátis. Se você adquirir um plano anual Premium ou Business, você consegue um domínio totalmente grátis pelo primeiro ano.
  • Painel de controle poderoso. Fizemos um painel personalizado que vai ajudar você a gerenciar tudo com a máxima eficiência.

De uma maneira geral, a Hospedagem Compartilhada é mais indicada para projetos que estejam começando na internet. Se você não tem expectativas iniciais de receber grande tráfego, essa solução é perfeita para começar seu site.

botão quero minha hospedagem de sites

Hospedagem Cloud

Uma das nossas mais recentes adições, a Hospedagem Cloud preza pela simplicidade da Hospedagem Compartilhada ao mesmo tempo em que entrega um servidor virtual poderoso.

Com a ajuda da computação na nuvem, essa solução oferece o uptime mais confiável, pois ela mantém uma cópia do seu site em diferentes servidores físicos que trabalham em harmonia. Caso algum servidor deixe de funcionar, os servidores restantes garantem que tudo fique bem e seu site não saia do ar.

O que você recebe? 

Além dos benefícios da Hospedagem Compartilhada, você também recebe:

  • Endereço de IP dedicado. O IP designado ao seu servidore será único e somente dado a você.
  • Recursos exclusivos. Se comparado com a Hospedagem Compartilhada, os recursos que você tem aqui serão inteiramente dedicados a você. Ninguém mais terá acesso ao que você tem, algo que garante a plenitude do serviço a todo momento.
  • Certificado SSL vitalício. Mantenha os dados e as informações dos seus visitantes em segurança. Como o HTTPS está se tornando o novo padrão na internet, é sempre importante ter as melhores práticas de segurança no seu projeto online.
  • Integração com CloudFlare. Adicione uma camada extra de proteção contra ataques DDoS, WAF, ferramentas de monitoramento e outros recursos avançados.

Que tipos de sites precisam de uma Hospedagem Cloud?

Sites de negócios que têm muito tráfego são os mais recomendados a obterem uma Hospedagem Cloud. Isso porque eles precisam de um uptime sempre disponível. Se você espera grandes picos de tráfego para o seu site, a Hospedagem Cloud é mesmo a ideal.

Fora isso, ecommerces, projetos em larga escala, novos sites com visitantes muito recorrentes também se beneficiam da Hospedagem Cloud. Se você busca por algo poderoso sem entraves técnicos, esse serviço é a sua escolha mais certa.

botão quero minha hospedagem de sites

Hospedagem VPS

VPS significa Virtual Private Server (Servidor Privado Virtual). É um tipo especial de hospedagem que oferece mais controle e liberdade ao usuário. Em contrapartida, o usuário precisa ter conhecimentos técnicos sobre comandos SSH.

De uma maneira geral, a Hospedagem VPS oferece a maior gama de personalizações dentre todas as soluções. Desde o gerenciamento de sistemas operacionais até complementos de softwares que vão estar dentro das opções de controle do acesso root pelo usuário.

O que você recebe?

  • IP dedicado. Cada VPS exige um IP único e que você não compartilha com mais ninguém.
  • SO instalado com um clique. Você pode usar o sistema operacional da sua preferência, dentro das opções de distribuição do Linux. Ele pode ser instalado com um único clique.
  • Backups de servidor. Mantenha seus arquivos salvos com funções de backup e restauração.
  • Recursos isolados. Recursos exclusivos para o usuário. Ou seja, nada do seu projeto é compartilhado com outros usuários da internet ou do serviço de VPS.
  • Liberdade de construir seu próprio ambiente de trabalho. Acesso root permite você configurar e personalizar o servidor de uso como quiser. Existem várias opções de escolha, cabendo ao usuário ter conhecimento especializado em configuração de servidores.

Que tipos de sites precisam de VPS?

Com a Hospedagem Compartilhada/Cloud, os servidores são pré-configurados. Mudar certas coisas, como complementos de softwares, não é possível fazer.

Porém, como a VPS garante acesso root ao servidor, o usuário ganha grande liberdade de gerenciamento e configuração do seu ambiente. Se você precisa de liberdade de customização, então você deve considerar ter servidores virtuais.

botão quero minha hospedagem de sites

Por que escolher a Hostinger? 

Um bom provedor de serviços de hospedagem ajudará a garantir que seu site atenda os padrões desejados de qualidade, eficiência e disponibilidade.

Hostinger fornece hospedagens de sites a preços surpreendentemente baratos, mantendo os padrões acima mencionados.

Abaixo estão algumas das razões pelas quais você deve se juntar aos milhões de clientes que já escolheram a Hostinger.

  • Hostinger é otimizada para o WordPress (WP CLI, WordPress Caching, etc).
  • Você obtém um construtor de sites muito fácil de usar que permite você arrastar e soltar conteúdo para criar um site perfeito.
  • Um site PHP funcionará com facilidade na hospedagem do Hostinger. E é muito favorável aos desenvolvedores. Você pode executar Laravel, CodeIgniter, integrar perfeitamente com seu GIT e obter acesso SSH aos seus servidores.
  • Certificado de Segurança SSL incluso.
  • Um teste gratuito de 30 dias para permitir que você obtenha uma experiência prática de todos os serviços antes de fazer uma compra.
  • Se optar pelo pacote de hospedagem Premium ou Business, você receberá um domínio grátis.
  • Você pode ter quantos endereços de email que quiser.
  • Caso esteja sofrendo algum problema ou tiver dúvidas, a nossa equipe de suporte estará disponível 24/7 para ajudá-lo.
  • Com apenas um clique você pode instalar todos os CMSs, incluindo WordPress, Joomla!, Drupal, entre outros.

Etapa 3 – Obtenha um Nome de Domínio

Simplificando, domínio é o nome de seu site. É o que você colocou de endereço do seu navegador e apertou ENTER para visitar. Por exemplo, o Google.com é um domínio e Facebook.com também.

Escolher um bom nome de domínio também é fundamental, pois é algo que seus usuários vão usar para se referir ao seu site. Aqui estão algumas dicas do que você precisa saber antes de escolher um domínio.

  • Mantenha o Nome Curto. Ninguém quer visitar um EndereçoComNomeDeDominioGigantesco.com. Facilite a leitura e a lembrança do seu domínio pelo usuário.
  • Seja específico com o nome. Seu domínio deve dar uma ideia do que sua empresa ou negócio faz na internet.
  • Escolha as extensões de domínio. As extensões de domínio são as partes do domínio que vem após o ponto final (.). Um domínio .com é uma escolha universal. Mas, dependendo das suas necessidades ou da natureza de seu site, você pode ter de escolher uma opção diferente.
  • Como você se sente quando pronuncia o domínio? Seu nome de domínio deve ser fácil de pronunciar para que seja fácil de falar em conversar e se comunicar com pessoas sobre ele.
  • Evite hífens e números. Esses caracteres especiais aumentam as chances do seu domínio ser digitado incorretamente. Só os use em caso de extrema necessidade.

Assim como os serviços de hospedagem, a Hostinger também fornece serviços de registro de domínio. Você pode usar este Verificador de Nomes de Domínio para escolher o nome de domínio mais apropriado para você.

Hostinger - como criar um site

Se você escolher optar por um plano de hospedagem Business ou Premium, você vai receber seu domínio gratuitamente. Nós também vendemos os seguintes domínios .xyz a um preço inacreditável de R$3,99 ao ano!

Para um passo a passo mais detalhado, acesse o tutorial Como Criar e Registrar um Domínio.

Etapa 4 – Como Criar um Site

Então a base está pronta e agora a diversão começa. Deste ponto em diante, você já sabe onde seu site será hospedado e qual o nome de domínio você vai usar. Com isso, já pode começar a criar seu próprio site.

Abaixo, vamos mostrar alguns métodos de como criar um site. São eles:

  1. Sistemas de Gerenciamento de Conteúdo. Mais indicados para blogs e sites que publicam muitos conteúdos e artigos multimídia. Alguns exemplos que se destacam são o WordPress, Joomla e o Drupal.
  2. Scripts de E-commerce. Se você quer fazer uma loja online, esse é o software que você vai usar. Alguns exemplos notáveis são o WooCommerce, Magento e PrestaShop.
  3. Construtores de Site. Um jeito fácil de saber como criar um site sem precisar entender de programação. Basta arrastar e soltar elementos de página e usar muitos elementos de personalização.
  4. Sites feitos com programação. Se você sabe como programar, então vai se beneficiar muito dessa opção. É claro que, aqui, leva bem mais tempo para você conseguir colocar um site online, mas as opções que você consegue implementar e o profissionalismo empregado compensam.

Opção 1 – Como Criar Um Site com o WordPress

logo do wordpress

O WordPress tem a fama de ser o CMS mais popular do mundo. Com ele, você pode fazer qualquer tipo de site.

Muitas pessoas pensam que a a plataforma serve só para blogs, mas isso é um equívoco. Entre vários exemplos, você pode fazer desde uma loja virtual (ecommerce), um site de portfólios e um site de entretenimento com a ajuda de personalizações e plugins.

Os principais benefícios de usar o WordPress para saber como criar um site são:

  1. Não exige conhecimento em programação. Mas se você souber como programar e usar linhas de códigos, pode ser muito útil e seu site será mais profissional.
  2. Uma das opções mais baratas. Com uma biblioteca imensa de plugins e temas gratuitos, o WordPress se torna bem acessível em termos de custos. Você consegue um design bem atrativo e recursos complexos sem gastar nada com isso.
  3. Muitos tutoriais e comunidade gigantesca. Se tiver alguma dúvida ou não souber como fazer algo na plataforma, você vai conseguir encontrar a resposta rápida em poucos minutos. O WordPress tem uma comunidade ativa muito grande, o que facilita encontrar respostas na internet rapidamente.

Instalar o WordPress

Instalar o WordPress é tão simples que você não vai nem precisar clicar muitas vezes. O Auto instalador faz todo o trabalho pesado pra você, embora também tenhamos adicionado uma maneira manual de instalar o WordPress utilizando o FTP.

Instalar WordPress pelo Auto instalador
  1. Faça o login em sua conta de Hospedagem do painel de controle, clique no ícone do instalador automático.
  2. No campo de pesquisa fornecido, digite WordPress. Quando você vêr a última versão no resultado da pesquisa, clique.
  3. Selecione o domínio onde a aplicação será instalada, então clique em próximo para definir outras configurações, como: nome de usuário, senha, email, idioma e título do website. Para concluir é só clicar em Instalar.

Instalando WordPress com auto instalador

É Isso! O WordPress já está instalado.

É altamente improvável que o Auto-instalador não funcione em seu caso, mas se porventura não der, ou se gostaria de realizar a instalação manualmente, então você pode também instalar o WordPress manualmente usando o FTP para transferir os arquivos. Siga esses passos:

Instalando via FTP
  1. Baixe a versão mais recente do WordPress no site oficial.
  2. Utilize um cliente FTP para fazer o upload do arquivo baixado para sua conta de hospedagem. Recomendamos o FileZilla, mas você pode usar qualquer outro cliente. Todos os detalhes FTP que você precisa estão na seção de acesso FTP em sua conta. Caso necessite ajuda com qualquer coisa relacionada a FTP, confira este tutorial. Após subir via FTP, descompacte o arquivo e certifique que todos os diretórios e arquivos do WordPress estão na pasta public_html.
  3. Então, faça o login no painel de controle para criar o banco de dados MySQL que será utilizado para armazenar as informações que seu site precisa. No painel de controle de sua conta Hostinger, vá para seção de Bases de Dados MySQL. Escolha um nome para o banco de dados, usuário e senha, depois clique em Criar! Pronto, seu banco de dados está criado. instalando wordpress via ftp
  4. Como um quarto passo, você precisa agora executar o assistente de instalação de 5 minutos. Todas as etapas anteriores são pré-requisitos desta etapa, portanto, certifique que o banco de dados foi criado corretamente. Agora, vamos instalar o WordPress!
  5. Acesse o seu domínio.
  6. Você verá a mensagem de configuração do WordPress. Clique no botão Vamos lá!.
  7. Agora você deve informar os detalhes do banco de dados que criamos no passo 3. Depois de informar todos os dados corretamente, clique em Enviar. NOTA: o servidor do banco de dados é mysql para as hospedagens compartilhadas hPanel, para cPanel deixe como localhost.instalando wordpress via ftp
  8. Prossiga com a instalação até encontrar a tela solicitando algumas informações do seu site, como: título do site, nome de usuário, senha e email. Preencha todos os campos corretamente, e, para concluir, clique em Instalar WordPress.
  9. Caso tudo tenha sido preenchido corretamente, você vai receber uma mensagem de Sucesso na instalação. Pronto, seu WordPress foi instalado manualmente com sucesso!

Assista como instalar WordPress no cPanel no vídeo abaixo.

Como configurar o WordPress

Agora que colocamos a instalação na lista de tarefas feitas, podemos falar sobre a configuração do nosso recém-criado site WordPress. Vamos dar uma olhada  em algumas das configurações com as quais você deve começar:

Exclua a página padrão, publique e comente
  • Um post padrão “Olá mundo” deve ser criado após a instalação. É uma boa ideia excluí-lo imediatamente. Para fazer isso, vá para Postagens > Todas as postagens e a exclua.
  • Agora vá até Páginas > Todas as páginas e exclua a página de exemplo.
  • Finalmente, vá para a seção Comentários e elimine o comentário padrão.
Configuração de Fuso Horário e idioma do site
  • Vá para Configurações -> Geral  e configure sua zona horária e idioma.
Comentários WordPress

Todas as configurações relacionadas aos comentários pode ser encontradas em Configurações > Discussões no painel do administrador WordPress. Dependendo de suas necessidades você pode:

  • Permitir ou desautorizar as pessoas de publicar comentários sobre novos artigos.
  • Decida se deseja adotar comentários manualmente ou não.
  • Configure as notificações por e mail para comentários.
  • Mostrar Avatares ou não

Você também pode desativar comentários para páginas ou postagens específicas. Para fazer isso, siga estas etapas:

  1. Clique em todas as postagens/ páginas da área wp-admin.
  2. Agora, clique em Editar rápido para a página pertinente.
  3. Em baixo das Tags, você verá uma opção que diz Permitir comentários. Basta desativá-lo e você será feito.
  4. Se deseja fechar comentários em uma publicação após um período de tempo específico.

Ajustando as configurações de mídia

Depois de terminar com esta etapa, o seu site WordPress terá melhor gerenciamento de imagem. Por padrão, depois de fazer o upload de uma imagem, serão criadas várias versões com diferentes tamanhos, que é uma prática muito ineficiente. Para mudar isso, siga estes passos:

  1. Vá para Configurações > Mídia.
  2. No tamanho da miniatura, coloque 0 para largura e altura. Mantenha a opção “cortar miniatura para as dimensões exatas” desmarcada (Normalmente as miniaturas são proporcionais)
  3. No tamanho médio coloque 0 para ambos, largura e altura.
  4. Para tamanho grande, ajuste a largura e altura para 0.
  5. Verifique a opção “organizar meus uploads mensais e pastas baseadas em anos” e clique em Salvar alterações.
Desativando navegação do diretório

Este é um dos ajuste mais técnicos que vai percorrer um bom caminho aprimorando a segurança de seu site. Para desativar a navegação do diretório, você terá que editar o arquivo .htaccess. Para isso siga esses passos:

  1. Conecte-se à sua conta de hospedagem usando qualquer cliente de arquivo (por exemplo FileZilla)
  2. Localize o arquivo .htaccess  e baixe-o.
  3. Abra e adicione a seguinte linha de código no final do arquivo:
    Options –Indexes
    
  4. Clique em Salvar.
  5. Agora re upe o arquivo usando o cliente FTP.

Como personalizar um site WordPress

A estética visual do seu site é tão importante quanto o próprio conteúdo. Os temas do WordPress permitem que você personalize o design e as perspectivas do seu site de acordo com suas necessidades. Por outro lado, os plugins do WordPress permitem que você torne seu site mais funcional. Examinaremos as duas opções, uma a uma.

Instalar temas WordPress

O WordPress tem uma grande comunidade contribuinte, de modo que o número de temas gratuitos e pagos disponíveis é gigantesco!

A grande maioria dos temas gratuitos do WordPress podem ser encontrada aqui. Sites como ThemeForest são o lar de uma infinidade de temas gratuitos e pagos também.

Se não podem escolher o tema certo para seu site, confira nossa lista dos 33 melhores temas gratuitos do WordPress.

Instalar temas no WordPress não é difícil. Siga os passos abaixo.

  1. Clique na seção Aparências na área do Administrador.
  2. Clique em Adicionar Novo.
  3. Você pode pesquisar os temas disponíveis e selecionar aquele que você mais gostar, clique em instalar e em seguida ativar para mudar o tema recém-selecionado.

adicionar tema wordpress no seu site

Se você deseja adicionar um tema novo que tenha comprado, siga os passos abaixo.

  1. Vá para Aparência e clique no botão Adicionar Novo.
  2. O arquivo do tema deve estar em forma impressa. Uma vez solicitado, você navega e faça o upload.
  3. Uma vez que o Upload for concluído, clique no botão Ativar e seu tema será exibido.

Se você quer um tutorial mais detalhado sobre a instalação de temas, você pode verificar este tutorial aqui

Customizar Temas WordPress

Se você conhece como editar arquivos de códigos, então você pode personalizar os temas instalados manualmente. Isso envolve modificação do código escrito dentro de um arquivo CSS (Folha de estilos em cascata) que é responsável por fazer cumprir o Layout de seu site. Para fazer isso, siga essas etapas:

  1. Vá para Aparência no painel de controle WP e então clique em Editor.
  2. Agora clique em Style.css e o editor com o arquivo deve abrir.
  3. Você pode fazer tantas edições quiser, dependendo das suas necessidades e desejos e depois salve os arquivos clicando no Atualizar Arquivo.

Você também pode customizar seus temas modificando o conteúdo do arquivo Functions.php. Ao fazer isso, você pode adicionar, excluir e modificar recursos, funcionalidades e aspectos de design em seu tema. O arquivo de funções do tema e adicionando o código PHP,  o tema pode ser personalizado. Você pode ler mais sobre functions.php aqui.

Instalar Plugins WordPress

Os Plugins tornam a vida de um proprietário de site muito mais fácil, são muitos os benefícios no curto prazo e no longo prazo para o seu site.

Pela simples instalação de um plugin, você pode adicionar funcionalidades ao seu site sem ter que escrever um código ou alterar os arquivos de configuração.

Assim como os temas, existem milhares de plugins WordPress gratuitos e também pagos disponíveis. Aqui estão alguns que são os essenciais para seu site.

  • Wordfence Security: Este plugin manterá seu site seguro e longe do alcance de potencial hackers. Do firewall a defesa de ameaças de segurança, este plugin é completo. Você pode encontrar mais informações sobre ele aqui.
  • Google XML Sitemaps:O plugin oficial do Google para geração automática de mapas de sites XML irá ajudá-lo a melhorar otimização de mecanismo de pesquisa.
  • Yoast SEO: Um dos Plugins de SEO mais populares do WordPress, Yoast SEO tem mais de 5 milhões de instalações ativas. Seja meta-tag ou análise de página, com o Yoast SEO, você não terá mais problemas com correções de SEO.
  • Contact Form 7: O Contact Form 7 pode gerenciar vários formulários de contato, além de permitir a personalização dos formulários e do conteúdo de e-mails, de modo flexível.

Instalar o Plugin WorDpress é igualmente fácil a instalação de temas para seu site WP. Siga as etapas para instalar:

  1. Passe o mouse sobre Plugins no menu principal.
  2. Clique no botão Adicionar Novo.
    como instalar plugins wordpress
  3. No campo de busca que aparece, entre com o nome do plugin que deseja instalar.
  4. Clique em Instalar Agora.
  5. Quando a instalação terminar, clique em Ativar.
  6. Caso tenha comprado um plugin premium você não vai encontrá-lo no diretório oficial e terá que carregar manualmente os arquivos, para fazer isso, siga esses passos:
    1. Clique em Adicionar novo quando passar o mouse perto dos plugins
    2. Agora clique no botão Carregar plugin no topo.
    3. Clique em pesquisar e selecione o arquivo de plugin arquivado.
    4. Quando o upload estiver completo instale o plugin como antes e depois o ative.

Para um guia mais abrangente de como instalar plugins no WordPress, clique aqui.

Adicionar Conteúdo ao WordPress

No WordPress o conteúdo pode ser adicionado de duas formas, você pode criar uma nova postagem ou pode escolher uma nova página. A diferença entre os dois reside no fato de que os posts pode ser divididos em categorias e pode ser marcadas e ou arquivadas. Os posts normalmente são entradas de blogs ou artigos que são exibidos em ordem cronológica em seu site e pode ser referidos como conteúdo sensível ao tempo. Por outro lado as páginas estáticas como por exemplo a área de contatos e páginas como “entre em contato conosco”.

Adicionando uma nova postagem ou página no WordPress:

Para criar uma nova postagem em seu site WordPress, siga os passos:

  1. Passe o mouse sobre Posts ou  Páginas dependendo do que quer criar. E clique em Adicionar Novo.
  2. Agora forneça os detalhes de sua postagem/ página. O conteúdo da postagem virá na caixa abaixo. Você pode formatar seu texto ou adicionar imagens usando a barra de ferramentas disponível.primeiro post wordpress3. Você tem as seguintes meta-boxes disponíveis a sua disposição a direita na tela:
  • Publicar: Você pode salvar a postagem como um rascunho e visualizá-lo antes de publicá-lo, você pode alterar a visibilidade e o status de sua postagem e assim que você clicar em Publicar, sua postagem irá entrará online.
  • Tags: utilizando tags, você pode adicionar tags  a suas postagens. Mas esta opção só está disponível para postagens.
  • Imagem Destaque: Isso permite que adicione uma imagem
  • destacada à sua postagem. A posição da imagem podem variar de acordo com seu tema.
  • Categorias: Atribua sua postagem a uma categoria usando está seção. Se você deseja criar uma nova categoria, clique no botão + Adicionar Nova Categoria. Está opção também não está disponível para páginas.
Adicionando uma página estática

Quando você adiciona suas postagens ao site WordPress, por padrão, ele mostrará os mais recentes posts em ordem cronológica reversa na página inicial de seu site. Muitas vezes é preferível que tenha uma página frontal estática para que seu site receba seu visitante primeiro, em vez de uma lista de postagens logo que o site carrega. Criar uma página frontal estática é simples e fácil. Siga os passos:

  1. Faça o login na área do Administrador WordPress.
  2. Vá para Paginas > Adicionar Nova Página.
  3. Entitule a primeira página como Home.
  4. É possível que seu tema atual permite que você altere a estética de sua página inicial; se assim for, escolha os modelos na caixa do painel de atributos da página.
  5. Você pode adicionar o conteúdo desejado na caixa de conteúdo e clicar em publicar
  6. Agora vá para Configurações > Leitura.
  7. Escolha a opção Página estática e a partir do menu suspenso selecione Início.
  8. Clique em Salvar alterações.

Há muito mais do que você podem fazer com o WordPress e tentamos cobrir muitos tópicos fundamentais que devem ser suficientes para se familiarizar com o CMS e criar seu primeiro site. Para saber mais, visite o códice oficial do wordPress ou confira este abrangente tutorial WordPress.

Opção 2 – Como Criar Um Site com o Joomla

logo do Joomla

O Joomla é um outro CMS bastante conhecido. Mas além disso, o Joomla tem sido um rival do WordPress por muitos anos. E isso aconteceu por uma boa razão.

Como um Sistema de Gerenciamento de Conteúdo, o Joomla permite que você:

  1. Crie qualquer tipo de site. Com uma variedade de módulos, você pode fazer qualquer tipo de site que imaginar. Pode ser um simples blog, uma loja virtual, um portfólio ou um site para qualquer tema que você achar relevante.  
  2. Encontre soluções rapidamente. O Joomla tem uma das maiores comunidades ativas na internet. Qualquer resposta que você precisar pode ser encontrada na internet em questão de minutos. Soluções, correções e dicas estão a apenas alguns cliques de distância.
  3. Implemente novos recursos sem precisar saber de programação. A simplicidade do Joomla garante que até mesmo os iniciantes possam criar um site responsivo e que atraia muitos visitantes.

Instalação

O jeito mais simples de instalar o Joomla é elo Auto Instalador. Na Hostinger, você encontra essa ferramenta no painel de controle da sua hospedagem de sites.

instalação do Joomla pelo painel de hospedagem

Preencha os campos necessários para criar um usuário administrador e continue com a instalação.

informações do usuário para instalar Joomla

Isso é tudo o que você precisa para completar esse processo e instalar o Joomla!

Área de Administrador

Para encontrar a área de administrador do seu Joomla! agora instalado, navegue pela URL seudominio.com/administrator (em que a parte seudominio é o nome do domínio do seu site).

área de administrador do joomla

Coloque as credenciais de acesso (nome de usuário e a senha) para acessar seu painel de controle no Joomla.

painel de controle do joomla

Temas e Visual

Antes de tudo, você precisa pensar em criar um visual bem atrativo para o seu novo site. O Joomla tem dois temas (templates) por padrão, embora eles sejam um pouco simples demais e podem não fornecer alguns recursos essenciais a você.

Ainda que o Joomla não tenha uma uma biblioteca de temas integrada ao seu painel de controle, você pode encontrar vários temas disponíveis pela internet. Alguns dos lugares que você pode visitar são o JoomDev e o ASTemplates.

Para instalar um tema no Joomla, navegue até a seção Install Extensions (Instalar Extensões).  

instalar extensões no Joomla

Aqui, você pode escolher três métodos de instalação. São eles:

  1. Upload Package File (Upload do Pacote de Arquivo). Arraste e solte um tema da sua preferência e o Joomla vai instalar tudo automaticamente.
  2. Install from Folder (Instalar de uma Pasta). Faça upload do arquivo do tema para um local específico dentro da sua conta de hospedagem de sites.
  3. Install from URL (Instalar de uma URL). Se você tiver um link direto de onde o arquivo do seu tema está, basta colocar esse mesmo link no campo indicado.

IMPORTANTE: Tenha cuidado quando for usar temas de fontes terceiras. Recomendamos dar prioridade de temas disponibilizados em comunidades especializadas. Ou, então, de grupos que você confia.

Artigos e Conteúdos

O CMS Joomla! permite que você crie 3 tipos de conteúdos instantaneamente. Eles são:

  1. Artigos. São as publicações mais básicas que você pode ter no Joomla (equivalem às postagens do WordPress). Você consegue adicionar cada artigo a certas categorias e também tags, que ajudam tudo a ficar mais organizado.
    adicionar artigos no Joomla

  2. Categorias. Seções que você pode agrupar seus conteúdos de acordo com os assuntos deles. Isso vai manter seus visitantes mais engajados. E permite que eles encontrem conteúdos relacionados de forma mais rápida.
    categorias do joomla

  3. Mídia. Aqui você pode fazer upload de fotos, vídeos, áudios, PDFs e qualquer outro tipo de conteúdo visual. Mais tarde, basta adicioná-los aos conteúdos individuais que você quiser.
    mídia no Joomla

Extensões e Módulos

Por último, mas não menos importante, você vai precisar saber como adicionar recursos extras no seu novo site feito no Joomla. Ainda bem que não é difícil. Pelo contrário: é moleza.

O Joomla oferece uma variedade de extensões grátis e também pagas que você pode instalar diretamente pelo painel de controle do CMS. Você só precisa instalar um módulo extra que aparece assim que você entra na seção Install Extensions (Instalar Extensões).

instalar extensões no Joomla

Quando fizer isso, você terá acesso a uma grande biblioteca de plugins que vão estar organizados em categorias.

categorias de extensões e plugins para Joomla

Abaixo estão 8 das melhores extensões do Joomla que você pode usar para melhorar a fluidez de uso do CMS.

  1. Akeeba Backup

Uma ferramenta poderosa que cuida de todos os backups e migrações que você precisar. Usando a extensão Akeeba Backup, você poder:

  • Criar um backup inteiro do seu site;
  • Restaurar seu site em qualquer servidor que suporte o Joomla;
  • Excluir certas pastas/arquivos ou tabelas de banco de dados;
  • Escolher certos tipos de formatos de compressão de dados.
  1. Breezing Forms

Dependendo do tipo do seu site, permitir que os visitantes entrem em contato com você é uma ótima maneira de encontrar novas oportunidades. Com o plugin Breezing Forms,  você pode:

  • Criar e inserir um formulário de contato;
  • Proteger contra spams usando o CAPTCHA;
  • Fazer e publicar um formulário para juntar feedbacks;
  • Usar uma variedade de exemplos pré-definidos.
  1. J2Store

Quando começar a ter uma audiência mais fiel, pode ser que você queira monetizar seu site ou começar a vender produtos. Com o plugin J2Store, você pode:

  • Usar a interface dos conteúdos para adicionar produtos e categorias para eles;
  • Configurar vários tipos de pagamentos e uma página de checkout;
  • Configurar cotações de impostos para localidades e para moedas de outros países.
  1. DJ-ImageSlider

Imagens de alta qualidade pode ajudar você a impressionar e a captar a atenção dos seus leitores. Uma ótima forma de fazer isso é com sliders e slideshows. Com o plugin DJ-ImageSlider, você ganha:

  • Compatibilidade com os principais navegadores;
  • Uma interface simples de usar, com um sistema do tipo arrasta e solta;
  • Várias opções de personalização de imagens;
  • Colocar imagens e galerias em qualquer seção do seu site.
  1. JHCOptimize

Ter um site rápido é algo que você vai querer ter. Assim, você deixa seus leitores mais felizes e entusiasmados a voltar à sua página. A extensão JCH Optimize vão melhorar o desempenho do seu site por:

  • Combinar arquivos CSS/JS em um só;
  • Aplicar compressão geral de arquivos;
  • Adicionar imagens de fundo em um único painel.
  1. sh404SEF

Uma extensão que vai ajudar você a aproveitar o máximo possível do SEO que um site feito no Joomla pode oferecer. Algumas das funções principais do sh404SEF incluem:

  • Gerenciamento de meta-título e meta-descrição;
  • Integração com Google Analytics e Tag Manager;
  • Redirecionamento automático de páginas com erro 404;
  • Páginas personalizadas para erros comuns (como o 404, o 500 e assim por diante).
  1. EasyBlog

Como o Joomla é um Sistema de Gerenciamento de Conteúdo, muitas pessoas vão usá-lo para fazer um blog. Sendo assim, você pode expandir as funções e recursos da plataforma com o plugin EasyBlog. Com ele, você tem:

  • Uma interface nova e melhorada para as páginas de conteúdo;
  • Suporte ao Google AMP e ao Facebook Instant Article;
  • Uma ferramenta de migração que facilita a transferência de arquivos de outras plataformas (ex: WordPress);
  • Integração com mídias sociais (como Facebook, Twitter, Pinterest e Google+).

OBS.: O EasyBlog não é gratuito para usar. Ele tem apenas uma versão paga.

  1. JFBConnect

As redes sociais são algumas das páginas mais acessadas na internet. Vocẽ não vai querer que seu site fique de fora de todo esse tráfego, não é mesmo? Com a extensão JFBConnect, você vai poder:

  • Criar e configurar contas de usuários usando dados de redes sociais;
  • Habilitar login com um só clique em qualquer rede social;
  • Implementar curtidas, comentários e compartilhamentos pelo Facebook/Twitter/G+;
  • Agendar compartilhamento automático de conteúdos.

OBS.: O JFBConnect não tem uma versão grátis. Para usá-lo, você terá que comprá-lo.

Como que você aprendeu o básico de como criar um site usando o Joomla, o que está esperando para começar seu site agora mesmo?

botão começar agora hospedagem

Opção 3 – Como Criar Um Site com o Drupal

logo do Drupal

O Drupal é também um dos Sistemas de Gerenciamento de Conteúdo mais famosos e usados no mundo. Contudo, ele é um pouco diferente.

Enquanto o WordPress e o Joomla dispensam a necessidade de conhecimento em programação para saber como criar um site, o Drupal é o oposto. Ou seja, você precisa entender de linguagens de programação para fazer um site com o Drupal.

Com isso, ele é uma sugestão de CMS bem mais indicada a desenvolvedores com certa experiência.

Algumas das características que fazem o Drupal se destacar são:

  1. Alta flexibilidade e escalabilidade. A plataforma ideal tanto para projetos iniciantes quanto gigantes. Se programação e desenvolvimento de sites é seu forte, o Drupal é a escolha mais segura para você.
  2. Gigantesca variedade de módulos grátis. Qualquer recurso que você precisar, é certeza que você consegue encontrá-lo.  
  3. Foco em criação e publicação de conteúdo. Você tem ampla liberdade de criação, publicação e gerenciamento de conteúdo. Tudo está acessível no painel de controle do CMS.

Instalação

Na Hostinger, você instala o Drupal pelo seu próprio painel de hospedagem de sites. Basta clicar no ícone do CMS e usar o AutoInstalador para começar o processo de instalação.

cms drupal no AutoInstalador

Preencha as informações básicas pedidas. Crie um usuário administrador. Logo em seguida, você terá acesso ao painel de controle do Drupal, também chamada de área do administrador.

Área do Administrador

Para acessar o painel de controle do Drupal, acesse a URL seusite.com/user/login (em que o trecho seusite é o nome do domínio do seu site).

área de administrador do drupal

Dentro do painel, você consegue controlar tudo o que é referente ao seu site Drupal.

painel de controle do Drupal

Aparência e Visual

Primeiro de tudo, seu site precisa de um visual bonito. Com o Drupal, você nem vai precisar procurar muito ou passar trabalho para fazer isso. O CMS tem uma biblioteca com cerca de 2500 opções de temas para você usar. E a maioria deles é gratuita.

temas para Drupal

Para instalar temas no Drupal, você deve:

  1. Navegar até a seção Appearance (Aparência) no menu superior.
  2. Selecionar o botão Install New Theme (Instalar Novo Tema).
  3. Cole um tema ou selecione um do seu computador local.
  4. Clique em Install (Instalar) e finalize a configuração.

botão de instalar tema no Drupal

Conteúdo e Páginas

Adicionar postagens, escrever artigos e publicar landing pages: você pode fazer tudo isso com o Drupal de uma maneira relativamente fácil. Tudo pela seção Content (Conteúdo).

criar conteúdos no Drupal

Logo de cara, você pode criar:

  1. Conteúdo. Seção em que você escrever os artigos ou páginas básicas (como uma do tipo “Sobre Nós”).
  2. Comentários. Seção em que você pode moderar as mensagens deixadas pelos seus leitores.
  3. Arquivos. Seção em que você encontra todas as imagens e mídias que usa no seu site.

De uma maneira geral, o Drupal tem um pacote bem impressionante de funções. Essa é uma das razões do porquê ele se destaca como uma das melhores plataformas de criação e publicação de conteúdo.

Módulos e Funcionalidades

Por último, vamos falar sobre os módulos do Drupal e como você pode adicionar funcionalidades ao seu novo site.

Navegue até a seção Extend (Extensões) pelo menu superior. É de lá que você vai conseguir instalar novos recursos ao seu site.

extensões para Drupal

Existe uma penca de módulos que você pode usar já a partir da instalação do Drupal. Mas, além disso, existem outros 40 mil módulos extras no repositório oficial.   

Para implementar um módulo no Drupal, você deve:

  1. Clique no botão Install New Module (Instalar Novo Módulo).
  2. Colar uma URL com o módulo que você quer ou selecionar o arquivo do seu computador pessoal.
  3. Clique em Install (Instalar) e complete a configuração do módulo no Drupal.  

instalando módulos no Drupal

Agora que você já sabe como criar um site usando no Drupal, que tal começar um agora mesmo?

botão começar agora com hospedagem drupal

Opção 4 – Como Criar Um Site com um Construtor de Sites

construtor de sites da Hostinger

Outra maneira de como criar um site no Hostinger é usar o construtor de sites. É perfeito para as pessoas que não querem mexer com o código ou instalar o CMS.

O recurso Arrastar e soltar torna extremamente simples de usar – você pode colocar qualquer tipo de informação: texto, imagens, tabelas, galerias ou formulários em seu site facilmente.

Assista nosso vídeo sobre o construtor de sites Zyro.

Como você viu, o construtor de sites Hostinger vem com mais de 100 modelos impressionantes que você pode escolher e é um mecanismo de busca responsiva padrão. Isso significa que seu site ficará sempre com a melhor exibição em dispositivos móveis e desktop sem nenhum esforço extra. Siga as instruções abaixo para criar um site usando o construtor de sites.

Faça login no painel de controle do Hostinger. E depois, a partir do painel, role para a seção do site e clique em Website Builder.

Você receberá uma lista de modelos. Eles serão categorizados para sua facilidade no lado esquerdo.

construtor de sites

Você pode clicar no botão Visualizar para ter uma ideia de como o site irá procurar pela Template ou clique em Selecionar para continuar.

Para sua ajudá. Um painel de Etapas irá aparecer no lado direito. Você pode seguir a maneira recomendada ou também podem pressionar o ponto de interrogação verde para ver a explicação do menu do construtor.

barra de controle hostinger

O modelo deve ter algum conteúdo falso padrão carregado no site. A primeira coisa que você deve fazer é mudá-lo para descrever o que seu site é sobre. Você pode fazer isso clicando em qualquer lugar onde o texto está escrito. Você também pode alterar a cor, formatação, ou tamanho do texto utilizando a barra de ferramentas de edição.

criador de sites zyro

Para adicionar um novo texto, você pode clicar na opção Texto no menu e arrastá-lo para qualquer lugar na tela.

Para adicionar uma nova imagem, você pode clicar em Imagem e em seguida, arraste na tela. Assim que você soltar o cursor uma janela será aberta, através da qual você vai poder escolher a imagem. Uma vez carregado você pode arrastá-la para se adequar aos seus desejos.

Você pode adicionar um novo menú utilizando a opção Menu da barra de ferramentas. Uma vez criado você pode modificar diferentes itens do menu.

Você também pode adicionar mapas ou integrações de redes sociais usando arrastar e soltar.

Com a seleção Avançada, você obtém opções como Skype, Musica, HTML, Calendários e AdSense etc…

A seção Comércio você encontrará ferramentas e os mais populares gateways de pagamento. Use os se desejar criar um site E-commerce.

O botão Auto-Layout no topo da página vai ajudar a aninhar todos os elementos da tela automaticamente e salva-lo da concepção manual. No entanto, caso não goste do resultado, sempre há como desfazer, clicando no botão Desfazer.

Quando você fizer todas as alterações e ajustes que queria, você pode publicar o site clicando no botão Publicar no canto superior esquerdo. Você também pode salvá-lo como rascunho clicando em Salvar Rascunho.

Opção 5 – Como Criar Um Site Usando Programação

Nesta seção, mostraremos como criar um site estático a partir do zero, usando  HTML e CSS. Um site estático é aquele que não muda independente do usuário que acessa e tem um conteúdo fixo. Pode ter suas vantagens e suas desvantagens; Vamos dar uma olhada em alguns deles:

Prós:

  • Os sites estáticos são rápidos.
  • Os sites estáticos não são vinculados a nenhum banco de dados.
  • Facilmente fácil de configurar em comparação com as suas contrapartes dinâmicas.

Contras:

  • Leva mais tempo para gerenciar e fazer upload de conteúdo
  • Não há como disponibilizar nenhum conteúdo dinamicamente para o usuário.

Também você vai precisar de um editor de código. Alguns dos melhores editores são:

  • Notepad++
  • TextWrangler
  • Sublime Text

Começando com a página HTML Básica

Hypertext Markup Language (HTML)é uma linguagem de marcação para criar páginas da web.

Abra o editor de código que você está usando e cole este no arquivo vazio.

<html>
<head>
<title>Your website’s title here</title>
</head>
<body>
<p>
This is where the content comes.
</p>
</body>
</html>

Abra o arquivo salvo em seu navegador. Obviamente, a página vai parecer, à primeira vista, ridiculamente feia, nada parecido com o que você imagina para seu primeiro site.

Mas isso é tudo que é preciso para criar uma página de site básica. Vamos continuar para melhorar isso. Agora, clique em salvar como em seu editor de código e salve o arquivo com uma extensão .html (por exemplo, Site.html)

Quer mais dicas de códigos HTML? Consulte o guia O Que É HTML e aprenda como usar mais recursos no seu site.

Adicionando CSS para melhorar aparência

O CSS em inglês significa Cascading Style Sheets ou Folha de estilos em cascata, que permite você, criar seu site e implementar estilos consistentes ao longo dele. Com isso, você pode utilizar fontes para áreas específicas de seu site, alterar cores para algumas seções ou alterar um plano de fundo de seu site etc…

Para criar uma folha de estilos, abra um novo arquivo de texto e guarde-o com o nome Style.css. Ele deve ser salvo no mesmo diretório que possui o arquivo HTML de sua página principal Para fazer com que o arquivo de índice leia as sugestões de design do arquivo CSS, estabeleça um link entre os dois adicionando está linha dentro da tag <head>. assim:

<link rel="stylesheet" type="text/css" href="style.css">

Até agora, tudo que fizemos foi vincular o arquivo CSS e o arquivo HTML. vamos agora dividir nosso site em 5 sessões e duas colunas usando o CSS. Insira o seguinte código em seu arquivo CSS:

body {background: #F6E7E7; margin: 0 auto; padding: 0;text-align: center;}
a {color: #310909;}
#container {width: 1000px; margin: 0 auto; padding: 0; background;}
#header {width: 1000px; 	height: 180px; 	margin: 0 auto; padding: 0; border: 0; background: #f346e1;}
#sidebar {width: 300px; height: 410px; 	margin: 0; padding: 0; border: 0; float: left; background: #E83535;}
#content {width: 700px; height: 410px; 	margin: 0; padding: 0; border: 0; float: left; background: #8be0ef;}
#footer {width: 1000px; 	height: 70px; 	margin: 0; padding: 0; border: 0; float: left; background: #000000; color:#eee; clear:both;}

Os valores de fundo podem controlar a cor das diferentes seções e você pode alterá-las de acordo com seus próprios desejos. Então, temos cinco seções na página: container, cabeçalho, barra lateral, corpo e rodapé. Os nomes das seções indicam suas funções, a área do contêiner cobre basicamente todo o site e sua largura pode ser alterada para 1000px se desejado, mas você deve garantir que você altere as dimensões das outras seções para fazer tudo alinhado. Você pode configurar a largura, as alturas e as cores de todas as seções de acordo com seus próprios desejos e, uma vez feito, atualize o arquivo da sua página inicial para isso:

<html>
<head>
<title>Your website’s title here</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="container">
<div id="header"><p>Header Goes Here</p></div>
<div id="sidebar"><p>Left Navigation Goes Here</p></div>
<div id="content"><p>Content Goes Here</p></div>
<div id="footer"><p>Footer Goes Here</p></div>
</div>
</body>
</html>

Aqui, como pode ver, nós usamos a tag <div> para dividir nosso site em duas sessões diferentes e definindo a ID, nós também estabelecemos considerações de design específicas para eles, que serão lidas a partir do arquivo CSS.

criando site com a hostinger

Há muito mais que você pode conseguir utilizando apenas o CSS e o HTML.

Brincando com as Fontes

Se você não adicionar nenhuma especificação no arquivo CSS ou no HTML, você verá um texto exibido no tipo de fonte padrão de seu computador, normalmente serão Times New Roman. Usando o CSS no entanto, você pode mudar os estilos de fontes para estarem de acordo com o que deseja para o site.

#content p {font-family: Open Sans; font-size: 18px}

Quando você adiciona a linha de código acima em sua folha de estilo (após a sessão #conteúdo), ele fará com que o texto do parágrafo use a fonte Open-Sans e o tamanho do texto será mantido em 18px.

Adicionando hyperlinks

Ao fazer um site, as vezes você precisa se conectar a um site externo ou a uma parte diferente do seu próprio site. Este link que, quando clicado, leva você a uma seção diferente em seu próprio site ou a um externo, é chamado de hiperlink. O “href” especifica o destino do link enquanto a tag <a> define os links. Não se preocupe, compartilharemos um exemplo:

Adicione esta tag: <a href=”https://www.google.com”> Ir para o Google </a> para o corpo do seu site, aparecerá como Ir para o Google e quando um visitante clicar nela, eles serão levados para a página inicial do Google.

Adicionando imagens

Com o HTML, é tão fácil quanto usar uma etiqueta e fazer referência a sua imagem. A marca <img> permite que você adicione imagens. Veja como usá-la:

<img src="cat.jpg" alt="Cute Cat">

Dentro da vírgula seguinte a src, você vai adicionar a localização da imagem. Neste caso, a imagem deve estar no mesmo diretório do seu arquivo índice. A linha que segue alt só será exibida no navegador se a imagem não puder ser carregada.

Criando Tabelas

Organizar informações muitas vezes se torna parte do design ou requisito funcional e no HTML, você também pode fazer isso utilizando tabelas. Usando a tag <table>. Para especificar um cabeçalho na tabela você usa a tag <th> (table Header) e para uma linha, você deve usar a tag <tr> (table row) para os dados do quadro, utilize a tag <td>.

<table>
<tr>
<th>My Header 1</th>
<th>My Header 2</th>
<th>My Header 3</th>
</tr>
<tr>
<td>Data 1 for header 1</td>
<td>Data 1 for header 2</td>
<td>Data 1 for header 3</td>
</tr>
<tr>
<td>Data 2 for header 1</td>
<td>Data 2 for header 2</td>
<td>Data 2 for header 3</td>
</tr>
<tr>
<td>Data 3 for header 1</td>
<td>Data 3 for header 2</td>
<td>Data 3 for header 3</td>
</tr>
</table>

Após aplicar o código acima, seu site deve ficar assim:

criar site - resultado final

Quando você está trabalhando com HTML e CSS, as possibilidades de jogar e tornar o seu site mais funcional e mais agradável de forma estética são infinitas. Nós apenas abordamos alguns dos conceitos mais fundamentais que você deveria estar ciente para começar e criar seu próprio site a partir do zero. A Internet está cheia de ótimos tutoriais e ferramentas interativas que ajudarão a aprender a codificar:

Etapa 5 – Publicar, Crescer, Monitor e Melhorar Seu Site

Você já sabe como criar um site e usar as ferramentas necessárias para desenvolver seu projeto na internet. Mas a jornada não pára por aqui. Na verdade, ela está só começando.

Abaixo estão 8 dicas valiosas que vão ajudar seu site a se transformar numa referência na internet.

Conheça Seu Nicho

Talvez uma das coisas mais importantes que você deva fazer sobre o seu site é decidir qual será o seu nicho de atuação. Isso vai definir a direção que você vai dar a ele. Sem um planejamento apropriado, as coisas podem sair do controle bem rapidamente.

Um bom modo de começar é:

  • Saiba qual é a sua paixão. Você sempre vai conseguir resultados melhores se você gostar do que faz. Além disso, suas chances de ter sucesso com seu site vão aumentar. Por exemplo, se você for um grande fã de games, fazer um site de jogos eletrônicos pode ser o começo ideal.
  • Avalie o mercado. Saber o que as pessoas estão procurando pode dar a você uma noção de que tipo de site desenvolver. Use ferramentas como o Google Trends, KWFinder e AnswerThePublic para ver as questões e termos mais pesquisados no seu nicho de atuação.
  • Estude os concorrentes. Os competidores são uma ótima fonte de inspiração, sobretudo os melhores deles. Você pode conseguir algumas ideias novas e até visualizar como poderia ser o design do seu site. Além disso, muitos deles têm programas de afiliados, onde você pode ganhar dinheiro trazendo novos usuários às plataformas deles.
  • Tenha ideias originais. Finalmente, abra um arquivo de texto e comece a escrever todas as suas ideias, não importa o quão malucas elas pareçam. Criar um plano perfeito vai levar bastante tempo e dedicação. Mas, não desista, pois cada passo pequeno que você der conta.

De modo geral, você vai conquistar o melhor resultado se você criar um site sobre um tópico ou nicho que você realmente gostar. Essa é a chance que você vai ter para produzir conteúdos sensacionais e garantir que esteja sempre disposto a criar coisas novas.

Implemente o Google Analytics

Pode ser difícil tomar decisões importantes sem ter qualquer tipo de dado para visualizar como seu site está se desenvolvendo. É por isso que ter estatísticas sobre o seu projeto é tão importante.

Assim, uma das melhores coisas que você pode fazer é vincular o seu site com o Google Analytics.

exemplo Google Analytics para integrar na sua loja

Se você nunca usou o Google Analytics, não se preocupe. A própria ferramenta tem uma série de guias e cursos que ajudam você a entender como tudo funciona. Comece com:

Essas são excelente fontes de informação para você usar o Google Analytics de forma assertiva. Você aprenderá o básico, truques e dicas de como aproveitar os recursos mais importantes.

Monitore o Consumo de Recursos

Cuida do bem-estar do seu seu site evita que você tenha problemas com quedas e lentidão desnecessária. Sendo assim, é essencial que você verifique de vez em quando como está o consumo de recursos pelo seu site.

Com a Hostinger, você encontra essa informação diretamente no seu painel de controle de hospedagem. Tudo o que você precisa acessar é a seção Uso de Recursos do Plano.

recursos em uso da hospedagem

Se mais pessoas visitarem seu site e você perceber que existem picos incomuns de acessos, pode ser um sinal de que sua hospedagem precisa de mais recursos. Além disso, você também pode otimizar o consumo de recursos.

Crie Um Ambiente de Desenvolvimento

Um fator de crescimento importante em qualquer site é atualizá-lo de tempos em tempos, além de adicionar novos recursos. Para fazer isso de forma eficiente, você precisa de dois ingredientes principais:

  • Feeback dos visitantes. Na maioria dos casos, os visitantes do seu site são aquilo que você mais precisa se preocupar. As mudanças que você faz no site devem ter o propósito de melhorar a qualidade do tempo que eles gastam no seu projeto online. Qual outro melhor jeito de descobrir isso senão perguntando a eles mesmos?
  • Criar um ambiente para desenvolvimento. Testar coisas novas em um site já publicado não é um método muito eficiente, pois pode ser que você encontre algum erro pelo caminho. Para driblar isso, você pode usar a ferramenta de Adicionar Site para criar um domínio adicional e fazer estes mesmos testes.  

opção de adicionar site para criar novo subdomínio no seu site

Não existe site feito no mundo sem um longo processo de tentativa, erro e sucesso. A coisa mais importante é fazer testes, ter conclusões sólidas do que está acontecendo e seguir em frente.

Use um Protocolo HTTPS

O protocolo HTTPS está se tornando o novo padrão de segurança da internet. Se seu site precisa lidar ou guardar informações importantes dos usuários (como senhas e detalhes de pagamento), então isso é extremamente necessário ter.

Além disso, existem outros benefícios que o SSL/TLS têm. São eles:

  • Melhora o SEO. Os mecanismos de busca, como o Google, adoram sites que tenham certificado de segurança SSL instalado. Ter o protocolo HTTPS no seu site é um diferencial que vai melhorar o posicionamento do seu projeto na internet.
  • Aumenta a confiança. Seus visitantes e usuários vão saber que seu site é seguro para guardar informações. Assim, eles vão ficar bem mais dispostos a se cadastrarem na sua página e até fazer compras.
  • Evita o aviso de site não seguro. Desde a versão 68 do Google Chrome, sites que usam HTTP (sem o “S”) vão receber um aviso de que não são seguros para acesso próximo à URL.   

diferença entre site com e sem SSL

Para usar HTTPS, primeiro você precisar configurar um certificado SSL/TLS. Na Hostinger, você consegue SSL gratuito vitalício na contratação anual do plano Business.

Reforce a Segurança do Seu Site

Segurança sempre em primeiro lugar. Hoje em dia, quanto mais seguro seu site estiver, melhor para você seus visitantes. Algumas coisas mais específicas que podem afetar seu site são:

  • Ataques DoS/DDoS. Um tipo de ataque cibernético em que um site é bombardeado por uma quantidade absurda de pedidos de acesso. Como resultado, o site acaba ficando extremamente lento e até indisponível.
  • Spam. Se seu site permite comentários ou tem formulários de contato, é possível que as pessoas abusem dessas funções para lotar seu site de conteúdos inúteis. Certifique-se de implementar medidas de segurança para estas coisas (como o captcha).
  • Ataques de Força Bruta. Esse tipo de ataque envolve uma pessoa tentar, muitas vezes e em sequência, a combinação certa de uma senha de acesso ao site. Isso pode fazer com que você não consiga acessar seu próprio site.

Para proteger seu site contra estes tipos de perigos, algumas medidas de segurança que você pode adotar são:

  • Use captcha. Uma ferramenta simples e eficiente para barrar spams e abusos em formulários de contato.
  • Limite as tentativas de login. Configure entre 5 a 10 minutos de tempo de espera até que uma próxima tentativa de login seja permitida.   
  • Instale um plugin de segurança. Se você usa o WordPress, use plugins de referência como Wordfende ou o Sucuri para adicionar uma camada extra de proteção ao seu site.
  • Mantenha tudo atualizado. Scripts desatualizados podem ter brechas de segurança. A maioria delas é corrigida com atualizações. Então, lembre-se de fazer isso regularmente.
  • Implemente o CloudFlare. Instalar e configurar o CloudFlare protege seu site contra vários tipos de ataques. A ferramenta também acelera o acesso às páginas em várias regiões geográficas.  

Por último, a plataforma de hospedagem de site que você usa precisa ser segura.

Por exemplo, a Hostinger usa regras de firewall e ferramentas de monitoramento em tempo real para bloquear ataques do tipo Força Bruta, DDoS, XSS e outras ameaças online. Assim, seu site roda o tempo inteiro sem problemas.  

Melhore a Velocidade do Seu Site

Poucos coisas são tão frustrantes quanto visitar um site lento. A velocidade da página e o tempo de carregamento são dois fatores cruciais na experiência do usuário.

Como resultado, um site mais rápido não apenas tem um SEO melhor, mas os visitantes com certeza também ficarão mais felizes de navegar pela sua página.

Para checar o desempenho do seu site, use ferramentas como GTmetrix ou o PageSpeed Insights, do Google.  

velocidade da Hostinger

Baseado nos resultados que você obtiver, considere acessar os conteúdos abaixo para fazer melhorias no seu site.

Planeje os Próximos Passos

Por último, tente planejar seus passos para o futuro. Se o site que você fizer seja de uma empresa, decida quais páginas você deve incluir. Caso você esteja planejando construir uma loja virtual, pense em como os produtos que você for vender podem converter cada vez mais usuários.  

Tente guardar todas as suas ideias em um único documento. Assim, você conseguirá ver como progrediu com o tempo. Fora isso, você também vai poder apresentar tudo para outras pessoas quando seu projeto crescer bastante. E isso abre portas para novos negócios.

Conclusão

Neste tutorial, pretendemos ajudar os iniciantes a colocar as mãos em uma tela com construtores de sites e mostrar como criar um site usando o WordPress ou mesmo do zero. Seja qual for o caminho que você tenha escolhido para criar seu site, esperamos que você tenha entendido direito e desejar-lhe a melhor sorte para executá-lo e mantê-lo.

Ariane G.

Ariane é jornalista, analista de conteúdo & SEO na Hostinger Brasil e tem o papel de contar para todo mundo o poder transformador da internet. Com foco em otimização, produção para web e técnicas de SEO, divide os dias entre pesquisas de palavras-chave e passagens aéreas (ela ama viajar).

6 Comentários

Deixe seu comentário!

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • Muito chateada com a Hostinger, quando contratei estava informando que teria suporte por telefone e agora fico sabendo que não mais oferece esse tipo de serviço. Nunca montei um site mesmo e tenho duvidas onde ficar escrevendo pelo chat é muito complicado, as indicações para trabalhar com vcs foram ótimas inclusive que eu teria a opção de ter suporte por telefone. Lamentável

    • Olá, Letícia, como vai? Eu entendo sua frustração quanto ao telefone.

      Nós queremos que nossos clientes sejam os mais felizes que existem, por isso buscamos ouvi-los e melhorar o nosso atendimento a cada dia. Neste ano, aconteceram algumas mudanças em nosso atendimento, tornando nossas respostas mais rápidas e eficientes, sem contar no atendimento 24/7. Neste processo percebemos que o perfil de nossos clientes não exigem atendimento ao telefone, por este motivo ele foi desativado.
      Nosso índice de resolução de problemas é de 90% e possuímos o selo Reclame Aqui de Qualidade. Isso prova que estamos altamente preparados para ajudar vocês, pode ter certeza que nós garantimos a solução e o melhor atendimento.

      Você pode entrar em contato conosco a qualquer momento via seu painel de controle e será muito bem atendida pelos nossos agentes de sucesso do cliente, que estão altamente preparados para prestar um excelente atendimento e garantimos que ficará muito satisfeita. Não fique chateada, nós não te deixaremos na mão nunca!

      Estamos a total disposição para ajuda-la! Basta entrar em contato e ficaremos felizes em atende-la. 😀

    • Oi, Rodrigo, tudo bem?
      É muito importante para a reputação de seu site possuir um SSL, aumentando suas chances de ter uma melhor posição no mecanismos de busca (SEO), além de transparecer segurança aos usuários. 😉
      Todos os sites precisam ter seu próprio SSL! Para obter um SSL gratuitamente na Hostinger é muito fácil, basta visitar nossos planos no site Hostinger e adquirir um Plano Business 12 meses onde você obtém um certificado SSL como presente. Aproveite! 🙂

  • “How to Create a Website” nice topic which you have choose.
    second is, the information which you have provided is better then other blog.
    so nice work keep it up. And thanks for sharing.

  • Boas dicas para iniciantes como eu. Porém no item “Desativar configurações do diretório”, quando procedo a alteração pelo Filezilla, não consigo mais entrar no painel do Word Press (domínio/wp-admin). Dá erro 550.

Comece a Economizar Agora!

Hospedagem com tudo incluso e nome de domínio
R$2
29
/mês*

Cadastre-se

Receba nossos conteúdos e novidades direto no seu e-mail!

 

Estamos cadastrando...

Pronto! Obrigado por se inscrever!