Home

Atualizações
Colunas
Críticas

Projetos

Adote Uma Ideia
Leitor Criativo
Quiz Criativo
Songfics

Informativo

Destaques
Vagas abertas
Torne-se VIP

VOCÊ SABIA? As atualizações são anunciadas diariamente pelo nosso twitter. Siga o perfil para saber quais histórias foram atualizadas!

⥃ CONFIRA ATUALIZAÇÕES PASSADAS

Histórias Vip
  1. Garota S, por Natashia Kitamura
    | Outros, Restritas, Finalizada
  2. Beyond Resemblance, por Betiza
    | Original, Restrita, Andamento
  3. Black & Diggory, por Reh
    | Livros, Harry Potter, Andamento
  4. The Most Beautiful Thing, por Liv
    | K-pop, Seventeen, Andamento
  5. Pulsação, por Betiza
    | Original, Andamento

Bons modos de HTML e SCRIPT

O Espaço Criativo provém de páginas .php e segue a risca todas as regras feita para este tipo de formato. Antes de mandar sua fanfic betada, preste atenção nas dicas abaixo para não dar grandes problemas à sua beta.

Parágrafos

Você deve ter aprendido no colégio o que são parágrafos, certo?

Imagine uma linha branca entre a frase de cima e esta frase que está lendo agora; ela é quem está separando o primeiro parágrafo deste segundo.

Aqui nesta página nós não podemos enxergar os códigos por detrás dos parágrafos, mas se fôssemos transforma-los em HTML, ele ficaria desta maneira:

<p>Você deve ter aprendido no colégio o que são parágrafos, certo? </p>

<p>Imagine uma linha branca entre a frase de cima e esta frase que está lendo agora; ela é quem está separando o primeiro parágrafo deste segundo.</p>

<p>Aqui nesta página nós não podemos enxergar os códigos por detrás dos parágrafos, mas se fôssemos transforma-los em HTML, ele ficaria desta maneira:</p>

Quebra de Linha

Uma quebra de linha é, em inúmeras vezes, confundida com um parágrafo e vice-versa.

Acontece que a quebra de linha é uma, hm, quebra na linha de uma parágrafo. Então, você pode ter uma parágrafo bem aqui e querer continuar a frase abaixo
dessa forma, sem criar a linha em branco causada pelo novo parágrafo.
Então terá uma quebra de linha dentro de um parágrafo. Em HTML, isso ficaria assim:

<p> Eu sou um parágrafo muito bonito e tenho <br /> uma linha quebrada no meio de mim. </p>

Se salvássemos isso e abríssemos no Browser o resultado seria:

Eu sou um parágrafo muito bonito e tenho
uma linha quebrada no meio de mim.

Conclusão: Parágrafos e Quebra de Linha

Então, por que você deve se preocupar com isso?

Frequentemente quando vou editar uma fanfic, onde deveriam haver parágrafos temos quebras de linhas, mais ou menos assim:

<p>Era uma vez uma fic que era muito mau editada, eu não conseguia entender o porquê de as meninas escreverem tão bem e não formatarem o html corretamente. <BR><BR><BR><BR>

No primeiro momento até pensei que era preguiça, e achei o cúmulo! <BR><BR>

Mas daí vi que realmente não era, que as meninas eram cheias de vontade de aprender e que estavam interessadas no assunto, então eu resolvi ajudar e tudo se endireitou. FIM <BR></p>

Gente, primeiramente! PELOAMORDEDEUS a tag <BR> não é usada há ANOS! Usem <br /> em minúsculo, tags são SEMPRE em minúsculo, e fechando-a com uma barra.

Nunca, nunca, nunca use um <br /> seguido de outro. Por quê? Porque polui o código, fica feio, ruim de ler, e, principalmente, existem parágrafos para esse tipo de coisa.

Então, o que eu fazia – e perdia horas fazendo -, era corrigir toooooda a fic deixando-a da seguinte forma:

<p>Era uma vez uma fic que era muito mau editada, eu não conseguia entender o por quê de as meninas escreverem tão bem e não formatarem o html corretamente.</p>

<p>No primeiro momento até achei que era preguiça, e acho o cúmulo</p>

<p>Mas daí vi que realmente não era, que as meninas eram cheias de vontade de aprender e que estavam interessadas no assunto, então eu resolvi ajudar e tudo se endireitou. FIM</p>

Inline Styles

Antes que você diga: “MINHA MÃE O QUE DIABOS É ISSO?”, Inline styles é exatamente isso: Estilos em linha.

Alguns exemplos de estilos em linha podem ser:

<p style=”text-align: right;”> Posiciona o texto à direita da página.

<font color= “#FFFFFF”> Muda a cor da fonte para branco.

<font size=”2?> Muda o tamanho da fonte para 2.

E antes que você pergunte: “QUAL O PROBLEMA EM USÁ-LOS SE VAI DEIXAR O TEXTO BONITINHO E DO JEITO QUE EU QUERO?” Então eu respondo:

Porque polui o código, fica feio, ruim de ler. E daí você diz que ninguém lê o código, e sim a fic, bonitinha, colorida como você quer. E eu digo: O Google e outros mecanismos de busca lêem o código. E é pelo código que eles classificam a posição que o seu site vai ficar quando, por exemplo, alguém procurar por “All Time Low Fanfic”. Quanto mais bonito o código das fics do All Time Low estiverem no nosso site, mas destaque teremos nos mecanismos de busca. Deu pra entender?

Veja a tabela de estilos que você pode usar na sua fanfic para substituir inline styles:

<p style=”text-align: right;”> usará <p align=”right”>

Tabela de Estilos

 

CÓDIGO HTML

RESULTADO NA TELA

<em>seu texto em itálico</em> seu texto em itálico 
<strong>seu texto em negrito</strong> seu texto em negrito 
<p align=”right”> seu texto alinhado à esquerda</p>

seu texto alinhado à esquerda

<p align=”left”> seu texto alinhado à direita </p> seu texto alinhado à direita
<del>seu texto com cross-line</del> seu texto com cross-line
<u>seu texto sublinhado</u> seu texto sublinhado
<p align=”center”>seu texto no centro</p> seu texto no centro

 

Tutorial por Natália Arsand, adaptado pelo site. Exclusivo para o Espaço Criativo. Não reproduza sem permissão.