Bem vindo de volta a Coding Corner! Hoje, veremos um tópico sobre o qual me perguntam muito ultimamente: a construção de um website.
A web mudou desde meados dos anos 90: o CSS existe, o Flash não existe mais e os sites tornaram-se muito mais voltados para um design bonito e recursos abundantes do que páginas monstruosas com muitos textos e imagens.
Em 1996, se você quisesse criar seu próprio site, tinha duas opções: ingressar em um site de hospedagem como Tripod ou Geocities e ter controle limitado sobre sua presença na web, ou construir o seu próprio do zero usando HTML. Mas os tempos - felizmente - mudaram.
Conheça as siglas: WYSIWYG, HTML, CSS, PHP, WTF?
Antes de entrarmos emComo asvocê pode construir seu próprio site, vamos falar um pouco sobre os blocos de construção da web.
Seu site moderno geralmente é composto de três coisas: HTML, CSS e Javascript.
HTML
HTML significa 'Linguagem de marcação de hipertexto'. Tem sido a espinha dorsal da web desde o início e usa palavras cercadas por divisas () chamadas 'tags' para criar elementos; esses elementos ajudam a organizar e estruturar sua página da web. Algum conteúdo que você vê na web? Está rodeado por HTML.
CSS
CSS, ou 'Cascading Style Sheets', é a linguagem de design da web moderna. Ele pega sua estrutura HTML e a torna bonita: CSS usa um código chamado seletores para identificar o tipo de HTML que você deseja embelezar e, em seguida, usa propriedades e valores CSS para alterar sua aparência.
Javascript (e outras linguagens de script)
Javascript permite que você torne uma página da web normalmente estática interativa: galerias de imagens no estilo Lightbox, páginas de rolagem suave (como as favoritas da Apple) e jogos baseados na web, todos empregam várias funções Javascript.
Existem outras linguagens de script que você pode empregar na web também, incluindo PHP, Ruby e Java, todas as quais permitem que você faça atividades mais complexas e dinâmicas em seu site.
As siglas de 'Don't Panic': WYSIWYG e CMS
Depois de ouvir sobre todas essas linguagens de script e marcação, você pode estar pronto para renunciar a construir um site, mas não entre em pânico: se você quiser construir um site em 2016, o que eu já disse é tudo o que você sempreprecisarsaber sobre essas três linguagens se você não deseja codificar de fato.
Você não precisa saber como escrever HTML, ou onde colocar CSS, ou como o JavaScript funciona - e isso tudo graças a duas outras siglas: WYSIWYG e CMS.
Você não precisa saber escrever HTML, CSS ou JavaScript graças a duas outras siglas: WYSIWYG e CMS.
WYSIWYG significa 'O que você vê é o que você obtém' e foi empregado pela primeira vez em meados da década de 1990 para ajudar pessoas sem experiência em HTML a construir sites. Em vez de ter que escrever um código para tornar o fundo do seu site azul ou verde, você poderia apenas escolher 'azul' ou 'verde' em um menu suspenso e seu site mudaria de acordo. Muitos dos serviços modernos de construção de sites da web, incluindo lugares como Squarespace , operam neste princípio.
Um CMS, ou 'Sistema de gerenciamento de conteúdo', permite que você insira conteúdo em seu site sem nunca ter que tocar no código da página. Já postou no Tumblr ou no Medium? Ambos são CMSes para blogueiros.
jogos de corrida de sujeira para ps4
Como construir um site quando você não sabe codificar
Percorremos um longo caminho desde 1996: há uma tonelada de opções disponíveis para os desenvolvedores de sites, quer você conheça um pouco de HTML ou não. Se você está pronto para mergulhar na construção de uma página, aqui está o que você precisa saber.
Etapa 1: Noções básicas sobre domínios x hospedagem
Para ter um site, você precisa de duas coisas: um nome de domínio (que indica aonde ir na web) e hospedagem (que armazena seus arquivos - sim, cada site é apenas uma coleção de arquivos - em algum lugar onde as pessoas possam acessá-los ) A maioria dos serviços modernos oferece alguma variação de ambos; e muitos dos serviços recomendados abaixo oferecem registro de nome de domínio de nível superior personalizado como parte de seus pacotes pagos. Mas você deveria tirar vantagem disso?
Seu domínio de primeiro nível (TLD) típico custa cerca de US $ 10 / ano para se registrar e, como tal, é uma boa vantagem que os serviços de site podem oferecer como parte de sua taxa mensal de hospedagem. Mesmo que você não planeje ficar com o serviço do seu site, não há mal nenhum em aproveitar as vantagens desse recurso - se o serviço valer a pena, você poderá mover esse domínio para outro serviço de registro, caso saia de seu plano de assinatura.
Uma das razõesnãoaproveitar um freebee pago é se você deseja uma extensão especial de TLD - algo diferente de '.com', '.edu' ou '.net', por exemplo. Muitos construtores de sites não oferecem registro para os TLDs menos conhecidos, em parte porque eles podem ser significativamente mais caros por ano; em vez disso, verifique um serviço de registro de domínio como Flutuar . Você não deve ter problemas para conectar um domínio registrado externo ao seu site.
cabo de áudio óptico apple tv
Se estiver usando um serviço gratuito, você pode ter um subdomínio (como '[seunome] .tumblr.com') fornecido para você automaticamente, mas o serviço também pode oferecer o registro de um domínio de nível superior (TLD) como '[ seunome] .com 'por uma taxa fixa por ano. Nessa circunstância, eu recomendo usar umseparadoserviço de registro para quaisquer domínios de nível superior, já que você não está recebendo um gratuitamente.
Etapa 2: Desejo um serviço gratuito ou pago?
Como nos primeiros dias da web, existem serviços gratuitos que você pode usar para criar e hospedar seu site - mas eles vêm com limitações de recursos. O maior problema é o controle: a maioria dos serviços gratuitos hospeda seus dados e, como tal, você está vinculado a eles. Se o seu serviço falir ou for encerrado, seus dados podem ir com ele.
Os serviços de sites pagos geralmente oferecem nomes de domínio personalizados, acesso total ao construtor de sites e armazenamento extra.
Os serviços gratuitos também contam com subdomínios para sua hospedagem - ou seja, algo como '[seunome] .tumblr.com' em vez do domínio de nível superior '[seunome] .com'. Seu URL da web provavelmente ficará para sempre vinculado ao serviço, a menos que você gaste um pouco mais por um nome de domínio personalizado.
Em contraste, os serviços pagos geralmente oferecem um nome de domínio de nível superior personalizado, acesso total ao construtor de sites e armazenamento extra. Cada serviço oferece uma variedade de opções para a construção real de sites - a maioria é baseada em modelos e WYSIWYG, com alguns permitindo personalização sob o capô se você quiser se aventurar no mundo do HTML e CSS.
Portanto, a questão é: quanto você deve pagar por um serviço de site?
Quando se trata de serviços pagos, você pode esperar pagar cerca de US $ 7 a US $ 10 / mês pela hospedagem de um típico site pessoal ou de blog. (Você também pode ter que pagar uma taxa de US $ 10 a US $ 15 / ano pelo seu nome de domínio, que mencionamos na seção anterior.) Se você deseja hospedar uma loja online ou planeja fazer algo mais complicado, como fornecer arquivos grandes ( como vídeo), você está olhando mais de perto na faixa de US $ 15 a US $ 30 / mês. (Observe que estamos falando principalmente de sites pessoais, aqui: Se seu site se tornar um negócio com tráfego constante, seus custos de hospedagem podem aumentar drasticamente.)
Etapa 3: escolha um serviço de site
Existem alguns serviços gratuitos e pagos na web, o que pode tornar a escolha de um deles uma experiência que causa ansiedade. Felizmente, hoje em dia, é tão simples quanto restringir o que você precisa em seu site.
Blog básico: Quer ter voz na web sem o incômodo de ter seu próprio CMS? Você pode usar um serviço gratuito como o do Yahoo Tumblr e crie blogs de texto, foto, vídeo e GIF para o conteúdo do seu coração. O Tumblr oferece seu próprio subdomínio personalizado e vários temas diferentes; você pode até realizar edições personalizadas completas neles mergulhando em seu backbone HTML e CSS. O Tumblr também permite o mapeamento para um domínio de nível superior personalizado, embora não venda o registro para um.
Site gratuito básico: Quer construir um site pessoal sem custo? Weebly é uma das melhores opções gratuitas por aí, com modelos personalizados e elementos de arrastar e soltar para seu site, blog ou vitrine amador. Você também pode inserir HTML ou CSS personalizado, se desejar esse tipo de coisa. Os usuários gratuitos podem conectar um nome de domínio externo ou usar um subdomínio do Weebly.
códigos qr pokémon prontos para a batalha
Site ou loja paga básica: Há uma razão porque Squarespace tem muito reconhecimento de nome no espaço de sites pagos para iniciantes, e não apenas porque eles compram anúncios em todos os podcasts imagináveis. Seus templates são lindos, a interface de edição é excelente e você não precisa saber um recado de HTML ou CSS para fazer algo bonito e personalizado ao seu gosto. Os planos do Squarespace começam em $ 96 / ano ou $ 12 / mês e incluem 20 páginas, largura de banda ilimitada e registro de domínio gratuito; o plano 'Business' de US $ 216 / ano oferece páginas ilimitadas e também permite que você tenha uma vitrine com até 25 produtos.
O Portfólio de Arte : Se você deseja um site focado em arte ou multimídia, é provável que você já tenha uma assinatura dos produtos Creative Cloud da Adobe. Se o fizer, você pode configurar uma exibição deslumbrante de sua arte com um Portfólio Adobe website: Embora o site esteja limitado a apenas cinco modelos no momento, ele oferece uma maneira impressionante de exibir e integrar projetos de seus aplicativos Adobe (ou da rede social Behance da Adobe) para a web. Você pode usar um subdomínio ou seu próprio nome de domínio adquirido externamente. Se você não for assinante da Adobe Creative Cloud, poderá obter acesso ao Adobe Portfolio - junto com as assinaturas do Photoshop e Lightroom CC - por US $ 9,99 / mês.
Blogs avançados: Se você preferir controle total sobre seu blog, Wordpress é o titã dos sistemas de gerenciamento de conteúdo pessoal. A empresa de blog oferece hospedagem para todos os níveis de blogs, se você está procurando um blog em um subdomínio gratuito do Wordpress (com 3 GB de espaço) ou quer pagar por mais espaço e um nome de domínio personalizado (US $ 99 / ano por 13 GB, ou $ 299 / ano para armazenamento ilimitado). Wordpress é um nome familiar em blogs na web em grande parte devido ao seu tema incrível e comunidade de plugins; você pode adicionar todos os tipos de recursos incríveis ao seu site, escolhendo um ou dois plugins personalizados gratuitos.
Para compradores sérios: Se você está tentando abrir sua própria loja digital, o Squarespace é um bom serviço inicial - mas Shopify é um dos mestres nesta arena. Por US $ 29 / mês, você pode postar um número ilimitado de produtos e armazenamento em seu site; o serviço cuida do processamento e ajuda você a criar etiquetas de remessa, rastrear o estoque e muito mais.
Hospede seu próprio site: Se você não conseguir encontrar um serviço da web que faça exatamente o que você deseja - ou se decidiu que deseja construir algo mais ambicioso - você vai querer se livrar dos serviços da web e comprar sua própria hospedagem na web . Essa pode ser uma etapa assustadora para alguém que nunca experimentou construir sites antes, então geralmente recomendodepoisvocê já experimentou um ou dois serviços da web, e apenas se realmente precisar de uma construção personalizada.
Existem alguns excelentes hosts da web por aí, e todos têm opiniões sobre qual empresa é realmente a melhor, mas tive excepcionalmente boa sorte com Dreamhost ao longo dos anos. Hospedei vários sites pessoais via Dreamhost desde meados dos anos 2000; a empresa se destaca em tornar a hospedagem na web o mais amigável possível e oferece uma tonelada de 'Goodies One-Click' que permitem a instalação automática de um CMS em seu site, para que você nunca precise mexer em um código. Quer o conforto do Wordpress ou de um site no estilo Wikipedia em seu próprio servidor? Sem problemas.
Etapa 4: comece a construir!
Depois de escolher um serviço da web, é tão fácil quanto montar seu modelo e enviar as imagens desejadas para o seu site. Se você deseja aprimorar seu modelo de serviço da web pré-fabricado com seu próprio talento, recomendo encontrar uma boa (e diferente) paleta de cores: Coolors oferece um gerador de cores maravilhoso que permite 'bloquear' cores específicas (por exemplo, as do seu logotipo) e usa-as para construir um esquema de cores complementar para o seu site.
Se você está procurando mais inspiração para o design, também recomendo assistir PBS's A Arte do Web Design - é um pequeno vídeo divertido que conta a história do web design, além de ótimas dicas para fazer isso da maneira certa.
Questões?
E isso cobre esta edição do Coding Corner. Ainda tem alguma dúvida sobre a construção de sites como um iniciante? Deixe-me saber nos comentários e eu darei uma olhada.