Arabic Arabic English English French French German German Portuguese Portuguese Spanish Spanish

 

MINE TREINAMENTO | Terceirização de criação de sites

Terceirização de sites

Mine Treinamento GRATUITO - 5 aulas com todos os segredos da terceirização de sites Lucre entre 50 mil e 100 mil em 12 Meses!

Foto por @elienelondero

Criação de sites: Criar sua própria página da Web é fácil

fácil criação de sites

Criação de sites: Criar sua própria página da Web é fácil

Criação de sites fácil: Sim, é fácil a criação de sites, e criar uma página web embora você não seja um profissional de TI ou uma pessoa que esteja envolvida nas coisas de TI. Uma página web básica é composta de simples tags ou códigos HTML e HTML é fácil de aprender.

Depois de passar por este tutorial, você aprenderá como criar suas próprias páginas web para seu site. Isto inclui os seguintes tópicos divididos em três (3) partes:

<b>Parte 1:</b>
Esboço de uma página web
Criação de um modelo de página web
Colocando comentários invisíveis em seu código
Criar um espaço simples ou duplo
Criação de uma lista ordenada e lista não-ordenada
Inserção de uma imagem

<b>Parte 2:</b>
Criação de tabelas
Usando caixas CSS como layout da página web

<b>Parte 3:</b>
Ligação de outras páginas e outros websites
Usando CSS no estilo de suas páginas web

<b>Vamos discutir aqui a Parte 1:</b>

Esboço de uma página web
Criação de um modelo de página web
Colocando comentários invisíveis em seu código
Criar um espaço simples ou duplo
Inserção de uma imagem

Linha de uma página web básica

Se você é novo em html, estou lhe dizendo agora que uma página web é simplesmente criada com tags html. As tags Html são mostradas como &lt;tagname&gt; e &lt;/tagname&gt;. Veja o esboço de uma página da web abaixo:

&lt;html&gt;
&lt;head&gt;
&lt;título&gt;

Aqui você colocará o título da página. Os textos aqui são exibidos na parte superior esquerda de um navegador ou página web.

&lt;/title&gt;
&lt;style type=”text/css”&gt;

Este é o lugar para as Folhas de Estilo em Cascata ou conhecidas como CSS. CSS define os estilos que você usará em sua página web, como cor e tamanho da fonte do texto, imagem de fundo, caixas, etc. Estas são efetuadas no corpo, mas a maioria das definições de estilo afeta apenas as áreas em que você as utiliza. aos poucos vamos compreendendo que é fácil a criação de sites.

&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;

Aqui você implementará o layout usando definições de estilo que você fez na seção “estilo”. Sem colocar nada aqui, a página ficará em branco, exceto o título que aparecerá no canto superior esquerdo da página. Você também colocará aqui o conteúdo de seu site. Pode ser uma mistura de textos, imagens, áudios e vídeos.

&lt;/body&gt;
&lt;/html&gt;

O acima deve ser salvo como uma página html com extensão de html ou htm. Se você quiser ver como ficará a página acima como uma página web, copie o acima de &lt;html&gt; to &lt;/html&gt; e cole em seu Bloco de Notas ou equivalente. Depois clique em File – Save as – digite mywebpage.html ou mywebpage.htm em File Name – Selecione All files as file type – Clique em Save. Depois vá para windows explorer ou gerenciador de arquivos e abra o arquivo com seu navegador. Veja? É tão simples quanto isso. Agora, não feche seu Bloco de Notas e seu navegador. Nós usaremos isso em nossa prática.

Como nota importante, sua página inicial ou a página inicial de seu site deve ser nomeada como index.html ou index.htm. Esta será a primeira página quando seu website for chamado sem especificar uma página em particular. Como este site, se você digitar www.freetipsandwits.com ou freetipsandwits.com no endereço do navegador, ele abrirá o arquivo index. Se você gosta de vê-lo, tente clicar no link para o meu site. Você pode se perguntar por que o arquivo de índice é “index.php”. Bem, este site é baseado em php, mas não se preocupe com esta coisa de php. Familiarize-se primeiro com html e depois você pode aprender php, asp, jsp, cgi e muito mais. Em html, você deve salvar seu arquivo index como “index.html” ou “index.htm”. Páginas diferentes da página inicial devem ser salvas com palavras-chave descritivas usando hífen como separador. Isto é para otimização de mecanismos de busca.

Criando um modelo básico de página web

Primeiro, eu gostaria que você fizesse um simples modelo de página da web. Usaremos isto para praticar os códigos html que vamos aprender mais tarde. Portanto, em mywebpage.html acima, apague todos os códigos que você digitou antes e digite o seguinte:

&lt;html&gt;
&lt;head&gt;
&lt;title&gt;My Web Page&lt;/title&gt;
&lt;style type=”text/css”&gt;

&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;/body&gt;
&lt;/html&gt;

Deixe alguns espaços entre o estilo e as etiquetas do corpo. Agora, clique em Salvar ícone ou clique em Arquivo – Salvar. Se você fechar este arquivo acidentalmente, você pode abri-lo pesquisando o arquivo, clicar com o botão direito do mouse sobre ele, clicar em Editar ou Abrir com Bloco de Notas ou seu equivalente. Para ver como ele se parece na web, basta atualizar o uso do navegador quando você abriu o contorno html há um tempo atrás.

Colocando um comentário invisível em seus códigos

Gostaria que você soubesse como colocar seus comentários em seus códigos html. Os desenvolvedores web normalmente colocam comentários em alguns dos códigos para referência futura, particularmente para edição. Será fácil para você encontrar o que está procurando quando estiver atualizando ou editando seus códigos html. Isto também ajudará outros webmasters se você deixar que eles editem seus códigos. Estes comentários são exibidos apenas em códigos html brutos ou em seu editor html, mas não na página da web ou na página do navegador. Isto é feito da seguinte maneira:

&lt;!– digite aqui seu comentário –&gt;

Por exemplo:

&lt;!– tutorial de construção de website começa aqui –&gt;
Para a fácil criação de sites, Basta aprender os códigos html básicos e pronto. Não tenha medo dos códigos html, eles são fáceis de aprender. Quando você começar a aprender html, você vai pedir cada vez mais…. e assim por diante…. até que você se torne um desenvolvedor web especializado.
&lt;!– o tutorial de construção de website termina aqui –&gt;

Digite o acima em sua mywebpage.html entre as tags do corpo. Você aprenderá mais rápido se digitar novamente ou refazer as tags acima. Mas se você estiver com pressa, você pode copiar e colar. Salve-o clicando no ícone Save ou File – Save.

Agora, atualize seu navegador para o arquivo html acima. Veja? Sim, você não pode ver seus comentários entre &lt;!– e –&gt;. Portanto, para sua referência e edição mais fácil de seus códigos no futuro, não se esqueça de colocar seus comentários.

<h2>Fazer uma linha para quebrar ou criar um espaço de linha em branco</h2>

Se você quiser quebrar uma linha ou criar um espaço de linha em branco, use esta etiqueta de quebra &lt;br /&gt;. Veja como ela é usada abaixo:

Isto irá quebrar a afiliação&lt;br /&gt;marketing da palavra “afiliado”.
Este quebrará este web&lt;br /&gt;site a partir da letra “web”.
Este resultará em um motor de busca de espaço de linha dupla&lt;br /&gt;&lt;br /&gt;otimização a partir da palavra “motor”.

Você digita isto dentro das tags corporais de sua mywebpage.html, salva-o e atualiza seu navegador. Sim, a frase é quebrada e a segunda linha começou com “marketing” a palavra antes da tag de quebra. A palavra também foi dividida em duas com a próxima linha iniciada com “site”, quebrada da palavra “website”. As duas etiquetas de quebra consecutivas criaram um espaço duplo entre “motor” e “otimização”.

Fazer uma lista ordenada e lista não ordenada

Isto é útil quando você está enumerando ou listando algo. Veja a ilustração abaixo:

<b>Lista de encomendas</b>

&lt;ol&gt;Esta é a Lista de Pedidos
&lt;li&gt;Item 1&lt;/li&gt;
&lt;li&gt;Item 2&lt;/li&gt;
&lt;li&gt;Item 3&lt;/li&gt;
&lt;/ol&gt;

Agora digite o acima em sua mywebpage.html dentro das tags do corpo, salve-o e atualize seu navegador e veja os resultados. Veja? Está numerado sequencialmente. Agora, aqui está a lista não ordenada da fácil criação de sites:

<b>Lista desordenada</b>

&lt;ul&gt;Esta é uma lista não ordenada
&lt;li&gt;Item 1&lt;/li&gt;
&lt;li&gt;Item 2&lt;/li&gt;
&lt;li&gt;Item 3&lt;/li&gt;
&lt;/ul&gt;

Agora digite o acima em sua mywebpage.html dentro das tags do corpo, salve-o e atualize seu navegador e veja os resultados. Agora, não está numerado. Está em um formato de bala. Aos poucos, você mesmo torna fácil a criação de sites.

Inserindo uma imagem

Você pode colocar uma imagem em sua página web inserindo estes códigos onde você gosta que as imagens apareçam em sua página web:

&lt;img src=”http://your-domain-name.com/image-directory/image-file.gif” alt=”descrição da imagem” height=”???” width=”???” border=”???” /&gt;

Olhando para os códigos html acima:

“img” é a tag html da imagem;

“src” é a fonte ou o caminho do arquivo de imagem com extensão de gif, jpg e png;

“alt” é a descrição do texto alternativo caso o navegador não possa exibir uma imagem;

“altura” e largura são a dimensão da imagem;

“borda” é o contorno da imagem.

Faça isso:
Substitua o nome de domínio acima, o diretório de imagens e o nome do arquivo pelo seu.

Substitua os valores de “alt” por sua própria descrição. Isto é necessário para SEO ou otimização de mecanismos de busca;

Substitua os valores de “altura” e “largura” por suas dimensões preferidas de sua imagem em pixel sem distorcê-la. O tamanho da imagem será ajustado com base nas dimensões que você especificou. A fixação da altura e da largura da imagem fará com que ela seja carregada mais rapidamente;

Substitua o valor da “borda” pela espessura da borda que você preferiu. 0 não é uma borda.

Para tentar o acima, obtenha uma imagem de seu arquivo e copie-a para o diretório onde se encontra sua mywebpage.html. Agora, digite os códigos acima em seu mywebpage.html mas substitua o src=”http://your-domain-name.com/image-directory/image-file.gif” por src=”image-filename”. Depois, salve-o e atualize seu navegador para ver como ele é no navegador da web. Viu aqui você percebe que não é tão difícil assim a fácil criação de sites.

 

 

https://millennialsresultados.com.br/

https://g.page/r/CWHCHVxAyqf1EAE

Compartilhe em suas Redes Sociais:

Facebook
LinkedIn
Pinterest
OK
VK

Continue lendo:

Compartilhe este artigo

Facebook
LinkedIn
Pinterest
OK
VK

Procurando uma agência séria para construir seu site?

Parabéns, você encontrou! Somos especializados em criação de sites desde o básico ao avançado! Sites completos, bonitos e funcionais! Sites que convertem em vendas!

Informações de Contato