Finalmente começou! Dê o seu melhor para ser um dos melhores alunos e para ganhar o prêmio final! Aproveite cada aula e cada dica, ainda mais se você for participante do HTML PROJECT II. Boa sorte ;)
Tecnologia do Blogger.
Introdução - O que é HTML, principais códigos sexta-feira, 27 de junho de 2014
Boa noite, alunos! Sinto muito pela demora para postar a primeira aula, mas é que tive que limpar umas coisas... Enfim, vamos a primeira aula!
O que é HTML?
Com certeza todo mundo sabe o que é HTML, pois todo mundo que se inscreveu no HP School sabe que não é muito bom nisso... Por isso, aqui vai a definição de HTML (na minha concepção e após uma básica pesquisa).
- HTML é uma das definições que se dá para códigos que definem aparência. É possível encontrar, também, "CSS". Ou, quando é dividido em classes, como HTML3, HTML1, HTML3.2, etc. HTML não se aplica somente a sites, mas também a programação em geral. Por isso são nomeados de formas diferentes, pois depende da função do código. No nosso caso, no editor do blogger e em editores de aparência de sites, é o HTML. Resumindo, HTML é um código que realiza uma função notável em certo espaço virtual/digital. Certo?
Muito bem! Agora que você sabe o que é HTML. Por favor, faça o seguinte:
1. Crie um blog de testes;
2. Selecione o modelo Travel/Viagem com fundo celeste;
3. Após "Aplicar ao blog", suba a página e clique em EDITAR HTML;
4. Já podemos começar!
Principais códigos
Uma caixa cheia de códigos irá aparecer. Não se assuste! Não é tão difícil editar isso, basta saber os códigos que definem cada coisa. Nós do HP School trabalharemos somente com o modelo Travel, pois é o mais fácil de editar. Vamos aos códigos então:
O ".Header h1 {" é o código responsável pela edição direta do título do blog. Nele é possível modificar fonte, cor, tamanho, alinhamento, por imagem e tudo o mais!
body {O "body {" é responsável por muuuuitas coisas dentro de um layout. Mas as pessoas costumam usá-lo para personalizar o plano de fundo do blog. Vamos trabalhar bastante com essa parte.
a:link {O "a:link {" é responsável pela cor dos links no blog. Links como os que a gente coloca dentro da postagem, e como os "X comentários", links dos marcadores, etc. Abaixo deste código estão "a:visited {" "a:hover {", que são opções adicionais para personalizar os links.
.main-inner h2.date-header {Faz a personalização da data! Muita gente não sabe disso, mas esse código personaliza a data que aparece ao lado das postagens no blog. Alguns gostam de por imagens, outros, só personalizam a data mesmo.
h3.post-title {O "h3.post-title {" e os derivados que estão abaixo dele, são os responsáveis pela personalização do título da postagem.
h2 {O "h2 {" é responsável pela personalização do título dos gadgets/sidebar. Algumas pessoas preferem personalizar o título pelo "]]></b:skin>", mas o "h2 {" é o responsável direto.
]]></b:skin>A raiz da personalização! Acima do "]]></b:skin>", vai todos os códigos que você pode usar para personalizar o seu blog. Nele você personaliza menu, blockquote, comentário, título de sidebar, basicamente tudo! Ele é o código principal da operação.
</head>Esse código é um dos que faz com que o layout exista. Mas ele geralmente é usado somente para adicionar slides, etc.
#comments {Esse código e os derivados abaixo dele servem para a personalização da área dos comentários. Infelizmente essa é uma das áreas mais difíceis de modificar.
.sidebar .widget h2 {Aqui é possível personalizar o fundo do título dos gadgets! Muita gente não sabe disso.
.footer-inner {
É o código responsável pela personalização dos gadgets que ficam "em baixo" no layout.
.sidebar .widget {
Geralmente usado para personalizar qualquer área da sidebar! Seja em cima ou em baixo!
.tabs-inner .widget ul {
É responsável pela personalização das páginas do blog! muita gente não sabe personalizar essa parte e simplesmente faz um menu... Mas, menus são legais mesmo assim!!
.main-inner .column-center-outer {
Código responsável pela personalização da área da postagem!
Uff! Acho que são esses os códigos principais, e que nós mais vamos usar nas aulas. Espero que entendam tudo direitinho. Até amanhã!