thegoodfellas/blogset-br huggingface dataset:
ja aprendi em HTML?</title> </head> <body> </body></html>No corpo do documento, crie um titulo escrevendo: Este e um titulo em HTML.<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> </body></html>Escreva esse paragrafo logo abaixo: Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> </body></html>Crie um subtitulo de nivel 2 com a seguinte frase: O sub-titulo em HTML<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> <h2>O subtitulo em HTML</h2> </body></html>Crie um novo paragrafo com o seguinte texto:O sub-titulo acima tambem foi criado em HTML. Eu nao sabia disso ate agora, mas os titulos e subtitulos em um codigo HTML sao bastante importantes para os mecanismos de busca, como o Google, por exemplo. E com base nesses titulos (e subtitulos) que os buscadores de sites na internet indexam minhas paginas e sabem sobre o que as paginas estao tratando, ou seja, com base nos titulos e subtitulos, o Google obtera maiores informacoes sobre o conteudo de minha pagina e - assim - fara o melhor posicionamento do meu site nos resultados de busca.<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> <h2>O subtitulo em HTML</h2> <p>O sub-titulo acima tambem foi criado em HTML. Eu nao sabia disso ate agora, mas os titulos e subtitulos em um codigo HTML sao bastante importantes para os mecanismos de busca, como o Google, por exemplo. E com base nesses titulos (e subtitulos) que os buscadores de sites na internet indexam minhas paginas e sabem sobre o que as paginas estao tratando, ou seja, com base nos titulos e subtitulos, o Google obtera maiores informacoes sobre o conteudo de minha pagina e - assim - fara o melhor posicionamento do meu site nos resultados de busca.</p> </body></html>Crie mais um subtitulo de nivel 3 com a seguinte frase: Como eu soube
disso?<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> <h2>O subtitulo em HTML</h2> <p>O sub-titulo acima tambem foi criado em HTML. Eu nao sabia disso ate agora, mas os titulos e subtitulos em um codigo HTML sao bastante importantes para os mecanismos de busca, como o Google, por exemplo. E com base nesses titulos (e subtitulos) que os buscadores de sites na internet indexam minhas paginas e sabem sobre o que as paginas estao tratando, ou seja, com base nos titulos e subtitulos, o Google obtera maiores informacoes sobre o conteudo de minha pagina e - assim - fara o melhor posicionamento do meu site nos resultados de busca.</p> <h3>Como eu soube disso?</h3> </body></html>Digite o ultimo paragrafo de seu documento:Soube disso estudando no Blog Expedicao 3w na internet. La eu aprendo tudo sobre HTML, CSS, Javascript e PHP. Vale a apena conferir o site.<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> <h2>O subtitulo em HTML</h2> <p>O sub-titulo acima tambem foi criado em HTML. Eu nao sabia disso ate agora, mas os titulos e subtitulos em um codigo HTML sao bastante importantes para os mecanismos de busca, como o Google, por exemplo. E com base nesses titulos (e subtitulos) que os buscadores de sites na internet indexam minhas paginas e sabem sobre o que as paginas estao tratando, ou seja, com base nos titulos e subtitulos, o Google obtera maiores informacoes sobre o conteudo de minha pagina e - assim - fara o melhor posicionamento do meu site nos resultados de busca.</p> <h3>Como eu soube disso?</h3> <p>Soube disso estudando no Blog Expedicao 3w na internet. La eu aprendo tudo sobre HTML, CSS, Javascript e PHP. Vale a apena conferir o site.</p> </body></html>E para finalizar, aplique o link de nosso blog na seguinte expressao: Blog Expedicao 3w no paragrafo acima. Nosso site para criar o link e esse: http://expedicao3w.blogspot.com.br.<html> <head> <title>O que ja aprendi em HTML?</title> </head> <body> <h1>Este e um titulo em HTML</h1> <p>Com um paragrafo como esse, eu posso escrever meus textos em HTML visualiza-los em meu navegador. Ainda tenho muito o que aprender, mas uma pagina basica ja e possivel fazer. Vou continuar estudando HTML para que num futuro bem proximo eu possa comecar a desenvolver meus proprios sites.</p> <h2>O subtitulo em HTML</h2> <p>O sub-titulo acima tambem foi criado em HTML. Eu nao sabia disso ate agora, mas os titulos e subtitulos em um codigo HTML sao bastante importantes para
os mecanismos de busca, como o Google, por exemplo. E com base nesses titulos (e subtitulos) que os buscadores de sites na internet indexam minhas paginas e sabem sobre o que as paginas estao tratando, ou seja, com base nos titulos e subtitulos, o Google obtera maiores informacoes sobre o conteudo de minha pagina e - assim - fara o melhor posicionamento do meu site nos resultados de busca.</p> <h3>Como eu soube disso?</h3> <p>Soube disso estudando no <a href="http://expedicao3w.blogspot.com.br">Blog Expedicao 3w</a> na internet. La eu aprendo tudo sobre HTML, CSS, Javascript e PHP. Vale a apena conferir o site.</p> </body></html>Salve o documento como tarefa004.htmlVisualize em seu navegador.Visualizacao no Navegador
Vimos na aula 002 a estrutura basica da linguagem HTML (se voce nao leu essa aula, confira aqui).Hoje, iremos ampliar um pouco mais o nosso conteudo, conhecendo tres novas tags do HTML: o <title>, o <h1> e <p>.Mas antes de iniciarmos o nosso estudo, deixe-me responder uma pergunta bastante comum feitas por quem esta aprendendo:O que e e o que nao e o HTML?O HTML e uma sigla que vem do ingles e significa Hyper Text Markup Language (Linguagem de Marcacao de Hipertexto);O HTML nao e uma linguaguem de programacao. E uma linguagem de marcacao, ou seja, ela nao faz calculos, nao executa comandos, etc. Ela apenas marca e estrutura as informacoes para serem lidas por navegadores.O HTML utiliza tags de marcacao (essas que estamos aprendendo aos poucos) para descrever os navegadores o conteudo da pagina web, para que os mesmos possam apresentar o conteudo na tela do usuario.Tarefas a Serem FeitasAntes de continuar a leitura desse texto, por favor, execute as tarefas abaixo:Abra uma pasta em seu PC com o nome "Aula HTML";Abra o seu bloco de notas em branco e salve nessa pasta com o nome "index.html";Digite aquela estrutura basica do HTML nesse arquivo.Obs.: Nao vale a pena copiar e colar, hein? Nao tenha preguica. Utilize essas tarefas para memorizar o conteudo aqui estudo.A Tag <title>Essa tag e responsavel por informar ao navegador qual e o titulo da pagina. Esse titulo aparece na barra superior do navegador (chamada barra de titulo). A tag <title> deve ser (sempre) inserida dentro do bloco <head> do HTML, conforme voce pode verificar abaixo:<html> <head> <title>Titulo da Pagina HTML</title> </head> <body> </body></html>Repare que a tag <title> e uma tag de abertura e </title> e uma tag de fechamento. Tudo o que for escrito dentro dessa tag aparecera na barra de titulo do navegador.Titulo da Pagina ao ser aberta no navegadorVamos fazer um teste? Abra seu arquivo index.html e inclua na secao <head> </head> o seguinte titulo: Minha Primeira Pagina na WEB.Para isso, basta fazer o seguinte:<html> <head> <title>Minha Primeira Pagina na WEB</title> </head> <body> </body></html>Salve esse arquivo e abra em seu navegador para ver o resultado.Se voce reparar, a sua pagina foi aberta corretamente, entretanto, nada aparece na tela. Isso acontece porque nao colocamos nenhuma informacao dentro da tag <body>, apenas na tag <head>. Lembra da aula anterior? Tudo o que colocamos na tag <head> nao aparece no navegador.Ja que estamos falando disso, vamos inserir alguma informacao na pagina? Para isso, vamos conhecer mais duas novas tags: o <h1> e o <p>.A tag <h1>Essa tag e responsavel por dar os titulos as nossas paginas. Sempre que voce quiser criar um titulo, utilize a tag <h1>. Vamos fazer um teste? Abra novamente o seu arquivo de texto. Na secao <body>, vamos digitar o seguinte.<h1> Titulo da Pagina Inicial<h1>repare que devemos abrir a tag <h1> e nao podemos esquecer de fecha-la com a tag </h1>.Veja - abaixo - como deve ficar essa nova estrutura:<html> <head> <title>Minha Primeira Pagina na WEB</title> </head> <body> <h1>Titulo da Pagina Inicial</h1> </body></html>Salve novamente o arquivo e abra em seu navegador.Simples, nao? Entao
lembre-se: sempre que quiser fazer uma titulo em suas pagina, utilize a tag <h1> </h1>.Niveis de titulosCaso voce queira variar os titulos de suas paginas, voce ainda pode utilizar as tags:<h1><h2><h3><h4><h5><h6>Quanto maior o numero acima, menor o tamanho do titulo. Vamos ver? Digite o bloco de texto abaixo no seu arquivo e visualize em seu navegador:<html> <head> <title>Minha Primeira Pagina na WEB</title> </head> <body> <h1>Titulo da Pagina Inicial</h1> <h2>Titulo 2 da Pagina Inicial</h2> <h3>Titulo 3 da Pagina Inicial</h3> <h4>Titulo 4 da Pagina Inicial</h4> <h5>Titulo 5 da Pagina Inicial</h5> <h6>Titulo 6 da Pagina Inicial</h6> </body></html>Veja o resultado em seu navegador:Nao precisa falar que e necessario abrir e fechar as tags de titulo, ne?A Tag <p>E para terminar a aula, vamos conhecer a ultima tag de hoje: <p>.Utilizamos a tag <p> para inserirmos paragrafos em nossas paginas. Cada paragrafo do seu texto devera estar dentro dessa tag.<html> <head> <title>Minha Primeira Pagina na WEB</title> </head> <body> <h1>Titulo da Pagina Inicial</h1> <p>Meu primeiro paragrafo em HTML.</p> </body></html>Repare que a tag <p> abre o bloco do paragrafo e a tag </p> o fecha.Vamos colocar mais dois paragrafos nesse bloco, salvar no arquivo e visualizar no navegador.<html> <head> <title>Minha Primeira Pagina na WEB</title> </head> <body> <h1>Titulo da Pagina Inicial</h1> <p>Meu primeiro paragrafo em HTML.</p> <p>Este e o segundo paragrafo da pagina.</p> <p>E este e o terceiro paragrafo que finaliza a pagina HTML.</p> </body></html>Resultado no navegador:A essa altura, voce ja deve estar se perguntando: mas essa pagina web ta parecendo mais um arquivo de texto Word do que um site propriamente dito. E eu respondo: e assim que comecamos. Temos - primeiro que conhecer e dominar a estrutura HTML, o design (cores, imagens, menus, posicionamentos, etc), vamos ver depois, pois quem fara isso sera o CSS e nao o HTML.Vamos relembrar: a funcao do HTML nao e de design, nem programacao. A sua funcao e apenas a de fornecer conteudo para a pagina. O restante sera estudado assim que terminarmos HTML.Estou criando um forum de discussao sobre essa aula. Caso tenha alguma duvida, basta acessar o link abaixo e postar a sua pergunta:http://forum-expedicao-3w.21820.n6.nabble.com/Duvidas-sobre-a-aula-004-de-HTML-Basico-td4.html E isso ai, pessoal, estudem as tags de hoje e memorizem-nas para darmos continuidade ao curso.
de tributos. Um dos principais objetivos da expansao imperial dos Astecas na direcao sudeste, durante o seculo XV, havia sido o de controlar as regioes produtoras de cacau no Istmo de Tehuantepec e no litoral sul da Guatemala. Diz um cronista quinhentista que os armazens de Montezuma II, em Tenochtitlan, continham mais de 40 mil cargas de amendoas de cacau, algo estimado em torno de 1 200 toneladas. Grande parte desse tesouro destinava-se a pagar o soldo dos guerreiros e tambem alimenta-los. Bernal Diaz, o soldado de Cortes e narrador da conquista, informou que somente a guarda do palacio consumia diariamente mais de 2 000 tacas da bebida. Seu uso como meio de pagamento continuou ate ao seculo XX, pois em algumas partes da America Central, o cacau ainda era usado como dinheiro.</p> Texto adaptado retirado do site Wikipedia em 09/05/2012. Confira fonte integral <a href="http://pt.wikipedia.org/wiki/Chocolate">clicando aqui</a>. </body></html>Salve seu arquivo como "chocolate.html"Visualize em seu navegador.E isso ai, quem tiver alguma duvida sobre essa atividade, poste-a em nosso forum. Abraco a todos e continuem estudando.
Salve, comunidade.Vamos dar continuidade ao nosso curso de HTML basico. Hoje iremos conhecer a tag de linkagem, mas antes queria fazer uma revisao das tags que estudamos anteriormente.A tag <h1> (titulos)Utilizamos essa tag para dar titulos as nossas paginas HTML. Veja, abaixo, um exemplo:<h1>Este e um titulo em HTML</h1>Lembre-se de abrir e fechar as tags de titulo com <h1> e </h1>, respectivamente.A tag H1 e o maior titulo que voce pode dar ao HTML. Abra o nosso editor de HTML (clique aqui para abri-lo) e faca a seguinte tarefa:Tarefa 001Escreva o seguinte titulo na pagina Ola, visitante. Seja muito bem-vindo ao meu site.(A resposta esta no final dessa aula)Vale a pena lembrar que, se quiser dar subtitulos a sua pagina, voce ainda pode utilizar mais 5 tipos de subtitulos em niveis menores:<h2> ... </h2><h3> ... </h3><h4> ... </h4><h5> ... </h5><h6> ... </h6>Resultado no navegadorA tag <p> (paragrafos)Utilizamos a tag <p> para criarmos paragrafos de textos em nossas paginas HRML. Vale a pena lembrar que todo o paragrafo deve ser aberto com a tag <p> e fechado com a tag </p>. Ja falamos sobre isso em aulas anteriores, mas acho essencial a revisao para que voce possa memorizar o conteudo.Vamos fazer uma tarefa?Tarefa 002Abra o nosso editor HTML (clique aqui) e faca a seguinte tarefa.1) No titulo da sua pagina, escreva "Sobre Mim..."2) No primeiro paragrafo, apresente-se dizendo seu nome, sua idade e de onde voce e.3) No segundo paragrafo, diga o porque que voce gostaria de aprender HTML.4) Crie um subtitulo escrito "Como estou aprendendo HTML?"5) Escreva um paragrafo dizendo como voce esta estudando para aprender a criar suas pagina.(A resposta dessa tarefa, encontra-se no final dessa aula).A tag <a> (links)Voce sabe o que e um link? Eu acredito que o link foi uma das principais invencoes no HTML, sem eles, um site nao existiria. Os links sao aquelas palavras-chave que geralmente estao no alto da pagina, ou no canto esquerdo, para que as pessoas possam navegar pelo site (mudar de pagina). Exemplos de links na pagina da UolAnalisando a imagem acima, voce ve varios links. Quando voce passa o mouse sobre eles, a setinha do mouse vira uma maozinha para que voce possa clicar. Caso voce clique, voce sera redirecionado para uma outra pagina HTML com o conteudo em questao.Ex.: clicando em Carros, voce ira para uma pagina que fale sobre carros.Clicando em Ciencia, voce ira para uma outra pagina que fale sobre ciencias.Clicando no titulo da noticia, voce ira acessar a pagina que contem a noticia em questao.Os links sao essenciais para que uma pagina HTML "converse" com outras paginas HTML. A esse grupo de paginas lincadas entre si, damos o nome de site.A estrutura basica de um linkPara criarmos um link, utilizaremos a tag <a> para abrir a linkagem e a tag </a> para fecha-la. Veja - abaixo - como faze-lo:<a>Este e um link.</a>Abra o nosso editor HTML e monte a estrutura acima. Veja o resultado.Voce deve ter reparado que o link nao funcionou. Mas por que? Isso aconteceu porque nos nao especificamos para que pagina a pessoa deve
ir ao clicar nesse link. Qual a funcao de um link? Levar o visitante para uma outra pagina. E como faremos isso? Devemos informar ao navegador para qual pagina ele deve ir, quando clicarmos nesse link.Para informarmos ao navegador qual pagina sera aberta quando alguem clica no link, devemos utilizar o atributo "href". Esse atributo sera colocado dentro do tag <a>, conforme mostrado abaixo:<a href="http://www.uol.com.br">Este e um link da Uol.<a>Monte a estrutura acima em editor HTML e veja o resultado. Repare que agora o link esta ativo e se voce clicar sobre ele sera enviado para o site da Uol (http://www.uol.com.br).Entao vale a pena lembrar: para abrirmos um link, utilizamos a tag <a>, entretanto essa tag sozinha nao vale muita coisa, precisaremos de um atributo (o href) para informar ao navegador qual sera a pagina que se abrira quando clicarmos no link em questao.Obs.: O endereco da web informado no atributo href deve estar sempre entre aspas "" e ser iniciado com o http://.Um exemplo:Vamos criar uma pagina HTML que possui 3 links: um para o nosso blog, outro para o facebook e um terceiro para a pagina da Google. Abra o seu bloco de notas e digite o conteudo abaixo.Clique na imagem para amplia-la.Salve a pagina na sua pasta Aula HTML com o nome links.html e abra no seu navegador. Veja o resultado produzido.Resultado no NavegadorComentando o codigo digitado<html>: da inicio ao codigo HTML no documento;<head>: abre o cabecalho do documento, informacoes ocultas ao navegador;<title>: imprime o texto na aba do navegador, ou na sua barra de titulo;<body>: abre o corpo do documento, tudo o que for escrito aqui dentro aparecera na tela do visitante;<h1>: Abre o titulo da pagina;</h1>: Fecha o titulo da pagina;<a href="http://www.expedicao3w.blogspot.com.br">: abre o primeiro link a ser clicado;</a>: fecha o primeiro link;<a href="https://www.facebook.com">: abre o segundo link a ser clicado;</a>: fecha o segundo link;<a href="http://www.google.com.br">: abre o terceiro link a ser clicado;</a>: fecha o terceiro link;</body>: fecha o corpo do documento;</html>: fecha a pagina HTML.Abra novamente a imagem abaixo e analise cada parte do codigo com base nas informacoes acima:Clique na imagem para amplia-la.Analisando a estrutura de um link HTMLAntes de finalizarmos a aula de hoje, vale a pena analisarmos com carinho a estrutura de um link em HTML para nao termos mais duvidas de como faze-los de agora em diante:Repare que o <a da inicio a linkagem em HTML: e com ele que o navegador fica sabendo que o conteudo a seguir e um link a ser clicado;Href e um atributo que fica dentro da tag <a>: o href informa ao navegador que pagina sera aberta quando o visitante clicar no link em questao. Nao se esqueca de colocar o endereco da pagina entre aspas e com o http://;O > fecha a tag <a>A palavra que vem logo em seguida (Nesse caso Google) e a palavra que recebera a funcao de link. Ela estara no navegador como um link. Caso o visitante passe o mouse sobre essa palavra, a setinha vira uma maozinha para que ele possa clicar e ir para o site da Google.A
tag </a> fecha o link e informa ao navegador que dai para frente, as palavras voltam ao normal, sem serem links clicaveis.Memorize esse conteudo antes de continuar, ok? O codigo comeca a ficar grande e voce precisa compreender cada estrutura para continuar com sucesso o nosso curso. Faca algumas paginas de exemplo e salve em sua pasta para praticar o que ja aprendeu ate agora. Se tiver alguma duvida, nao exite em pedir ajuda ou perguntar. Criei um topico em nosso forum especifico para discutirmos sobre a tag <a>, clique abaixo para visita-lo.Forum de Discussao sobre a tag <a>Disse na aula passada que iria falar hoje sobre imagens, mas achei melhor discutir sobre isso em nossa proxima aula, pois o conteudo atual ficou bem extenso e acho que ha muita coisa que voce precisa estudar hoje. Portanto, falamos sobre isso em nosso proximo assunto.Fico por aqui e espero voce em nossa proxima aula, ok?RESPOSTAS DAS TAREFAS SOLICITADAS NESSA AULATarefa 001Escreva o seguinte titulo na pagina Ola, visitante. Seja muito bem-vindo ao meu site.Resposta:<h1>Ola, visitante. Seja muito bem-vindo ao meu site.</h1>Tarefa 002Abra o nosso editor HTML e faca a seguinte tarefa.1) No titulo da sua pagina, escreva "Sobre Mim..."2) No primeiro paragrafo, apresente-se dizendo seu nome, sua idade e de onde voce e.3) No segundo paragrafo, diga o porque que voce gostaria de aprender HTML.4) Crie um subtitulo escrito "Como estou aprendendo HTML?"5) Escreva um paragrafo dizendo como voce esta estudando para aprender a criar suas pagina.Resposta:<h1>Sobre mim...</h1><p>Ola, meu nome e Wenderson Andrade, tenho 31 anos e moro na cidade de Belo Horizonte em Minas Gerais.</p><p>Gostaria de aprender HTML, pois pretendo ser um webmaster nos proximos meses e - para isso - acho essencial conhecer e dominar a linguagem HTML.</p><h2>Como estou aprendendo HTML?</h2><p>Conheci o Blog Expedicao 3w e estou aprendendo HTML desde o inicio. Estou adorando as aulas e acho que dessa vez eu chego la.</p>Visualizacao do codigo acima no navegador: