Percebi que muita gente está cansada de usar o freewebs para seus sites e querem algo novo e diferente, estou aqui para ajudar.
Vai ser um processo difícil e eu sei que muita gente vai postar que não entendeu tal parte, enfim, vamos ao tutorial.
O que é um Layout?
Layout (ou leiaute) é um esboço mostrando a distribuição física, tamanhos e pesos de elementos como texto, gráficos ou figuras num determinado espaço. Pode ser apenas formas rabiscadas numa folha para depois realizar o projeto ou pode ser o projeto em fase de desenvolvimento.
Ou seja, uma prévia do serviço pronto antes de executado, onde se pode alterar sua disponibilidade sem danos a nenhuma das partes envolvidas no processo (designer e cliente) para que o serviço seja produzido de acordo com o gosto de cliente, para apenas ao término do desenvolvimento e obtenção de aprovação, se leva a público.
O termo layout pode também configurar-se como projeto envolvendo diferentes cadeias associativas e técnicas visuais sempre com objetivo e função.
Como eu consigo um Layout?
Faça o seu ou baixe um.
1- Pegando um Layout
Vá em qualquer site de Design, etc, e baixe um layout. O conteúdo será este:
Abra o index e veja seu Layout:
2- Editando seu Layout
Abra o index.html com o bloco de notas e procure o local do texto do Layout:
Apague o texto e digite o que você quizer:
Nota: Em todos layouts vai ter um código antes e depois dos textos, esses códigos são super importantes, nunca, nem estando bêbado você deve apagar esses códigos, no layout do exemplo esse código é < p > < / p >
Isso serve também para os outros códigos.
Está separado pra não dar erro.
Para mudar o título do texto apague o texto que se encontrar no header:
Para mudar o título do seu site vá no ínicio e apague o que está no título e mude para seu gosto:
Para mudar os links de navegação procure NAVIGATION LINKS START HERE e mude para os links das outras páginas do seu site (explicando como fazer mais adiante)
Mude o Navigation para um nome a seu gosto, por exemplo, Menu. Onde diz Link Here você coloca o título da página e em # você coloca o link da página, por exemplo, meu site se chama shizanofelks.hfree.com.br, em vez de colocar shizanofelks.hfree.com.br/capitulos.html, vou colocar somente capitulos.html:
Depois de editar tudo a seu gosto, deixe o resto como está.
3- Colocando imagens nos textos
Para colocar imagens nos textos você deve colocar a imagem na pasta image e adicionar esse código no seu texto:
Coloquei como imagem porque não tem como postar, não vai aparecer.
Nos números 750 e 69 são os atributos da sua imagem, se você não sabe os atributos da sua imagem, abra ela no paint, Imagem>Atributos e ponha o numero da Altura no lugar de 750 e o da largura no lugar de 69.
4- Criando outras páginas
Após a página inicial estar pronta, você vai criar as novas páginas, faça uma cópia do index.html e cole na pasta do layout com o nome da sua página, que no meu caso, foi capitulos.html, edite ela a seu gosto e salve.
Nota: Sempre que for criar uma nova página, nunca esqueça de colocá-la nos links de navegação.
5- Colocando seu site no ar
Procure um site de hospedagem grátis (pra você que é iniciante, o plano grátis é a melhor opção), eu recomendo o [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] veja as vantagens que ele lhe fornece:
Espaço Ilimitado para seus arquivos.
Tráfego completamente Ilimitado!.
Painel Administrativo Line 2!
Dicas de WebDesign por email.
Dominio meusite.hfree.com.br Grátis!
Acesso FTP para enviar arquivos.
Suporte via Email.
Ferramentas Grátis - Usuários Online e outros.
Suporte a HTML e CSS.
Sem exibição obrigatoria de publicidades!
Serviço com qualidade e TOTALMENTE GRÁTIS
Eu não estou ajudando na divulgação de uma empresa, estou ajudando os iniciantes a começarem bem.
Após se registrar no site, baixe o programa Filezilla: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Faça o login no filezilla com o endereço do seu site, exemplo: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Localize a pasta do seu Layout e mova tudo para a área sem nada (isso não vai excluir os arquivos do seu computador).
Quando terminar de carregar, deve ficar assim:
Quando a hospedagem estiver completa, seu site deverá ficar como você editou:
Espero ter ajudado
Créditos: Anivetz
Vai ser um processo difícil e eu sei que muita gente vai postar que não entendeu tal parte, enfim, vamos ao tutorial.
O que é um Layout?
Layout (ou leiaute) é um esboço mostrando a distribuição física, tamanhos e pesos de elementos como texto, gráficos ou figuras num determinado espaço. Pode ser apenas formas rabiscadas numa folha para depois realizar o projeto ou pode ser o projeto em fase de desenvolvimento.
Ou seja, uma prévia do serviço pronto antes de executado, onde se pode alterar sua disponibilidade sem danos a nenhuma das partes envolvidas no processo (designer e cliente) para que o serviço seja produzido de acordo com o gosto de cliente, para apenas ao término do desenvolvimento e obtenção de aprovação, se leva a público.
O termo layout pode também configurar-se como projeto envolvendo diferentes cadeias associativas e técnicas visuais sempre com objetivo e função.
Como eu consigo um Layout?
Faça o seu ou baixe um.
1- Pegando um Layout
Vá em qualquer site de Design, etc, e baixe um layout. O conteúdo será este:
Abra o index e veja seu Layout:
2- Editando seu Layout
Abra o index.html com o bloco de notas e procure o local do texto do Layout:
Apague o texto e digite o que você quizer:
Nota: Em todos layouts vai ter um código antes e depois dos textos, esses códigos são super importantes, nunca, nem estando bêbado você deve apagar esses códigos, no layout do exemplo esse código é < p > < / p >
Isso serve também para os outros códigos.
Está separado pra não dar erro.
Para mudar o título do texto apague o texto que se encontrar no header:
Para mudar o título do seu site vá no ínicio e apague o que está no título e mude para seu gosto:
Para mudar os links de navegação procure NAVIGATION LINKS START HERE e mude para os links das outras páginas do seu site (explicando como fazer mais adiante)
Mude o Navigation para um nome a seu gosto, por exemplo, Menu. Onde diz Link Here você coloca o título da página e em # você coloca o link da página, por exemplo, meu site se chama shizanofelks.hfree.com.br, em vez de colocar shizanofelks.hfree.com.br/capitulos.html, vou colocar somente capitulos.html:
Depois de editar tudo a seu gosto, deixe o resto como está.
3- Colocando imagens nos textos
Para colocar imagens nos textos você deve colocar a imagem na pasta image e adicionar esse código no seu texto:
Coloquei como imagem porque não tem como postar, não vai aparecer.
Nos números 750 e 69 são os atributos da sua imagem, se você não sabe os atributos da sua imagem, abra ela no paint, Imagem>Atributos e ponha o numero da Altura no lugar de 750 e o da largura no lugar de 69.
4- Criando outras páginas
Após a página inicial estar pronta, você vai criar as novas páginas, faça uma cópia do index.html e cole na pasta do layout com o nome da sua página, que no meu caso, foi capitulos.html, edite ela a seu gosto e salve.
Nota: Sempre que for criar uma nova página, nunca esqueça de colocá-la nos links de navegação.
5- Colocando seu site no ar
Procure um site de hospedagem grátis (pra você que é iniciante, o plano grátis é a melhor opção), eu recomendo o [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] veja as vantagens que ele lhe fornece:
Espaço Ilimitado para seus arquivos.
Tráfego completamente Ilimitado!.
Painel Administrativo Line 2!
Dicas de WebDesign por email.
Dominio meusite.hfree.com.br Grátis!
Acesso FTP para enviar arquivos.
Suporte via Email.
Ferramentas Grátis - Usuários Online e outros.
Suporte a HTML e CSS.
Sem exibição obrigatoria de publicidades!
Serviço com qualidade e TOTALMENTE GRÁTIS
Eu não estou ajudando na divulgação de uma empresa, estou ajudando os iniciantes a começarem bem.
Após se registrar no site, baixe o programa Filezilla: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Faça o login no filezilla com o endereço do seu site, exemplo: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Localize a pasta do seu Layout e mova tudo para a área sem nada (isso não vai excluir os arquivos do seu computador).
Quando terminar de carregar, deve ficar assim:
Quando a hospedagem estiver completa, seu site deverá ficar como você editou:
Espero ter ajudado
Créditos: Anivetz