Links internos - @Curso em Vídeo HTML5 e CSS3

330.62k views2834 WordsCopy TextShare
Curso em Vídeo
Você sabe como criar links internos para seu site? Sabe como usar o nofollow? Sabe para que serve um...
Video Transcript:
e vamos dar continuidade ou nossos estudos com links e esse vídeo também faz parte do nosso Capítulo 10 [Aplausos] E aí [Música] o Olá tudo bem com você seja bem-vindo seja bem-vinda a mais uma aula aqui do seu curso de html com CSS e a gente tá no décimo capítulo falando sobre a criação dos links que são as ligações entre uma página e outra se por acaso você não viu o vídeo anterior ou já viu há muito tempo e quer dar uma relembrada Eu recomendo que você deu mais lembrada porque lá nós falamos sobre links externos agora nós vamos falar sobre links internos Beleza então vamos diretamente por nosso computador e vamos continuar aquele exercício que foi criado na hora entendeu Por isso que ela é tão importante e o recado dessa vez é mais uma vez do estudo alta que está patrocinando o nosso curso esse curso por sinal que tá te ensinando um monte de coisa legal para você aprender a criar sites para criar sites não é a única coisa que você pode criar na sua vida digital e o estudo na alta tem um curso especial que já tá com quatro módulos que vai te ajudar na criação de aplicativos para celular utilizando a plataforma Android e a ferramenta Android Studio que é distribuído pelo próprio Google o link da criação de site você sempre quis aprender a criar aplicativos de celular de uma maneira simples e descomplicada explicada passo a passo e com projetos físicos Considere a possibilidade de você ser um aluno do estudo em alta e por uma assinatura mensal você tem acesso a esses módulos de Android Studio e muitos outros cursos que a gente vem falando aqui durante o andamento desse curso de HTML e CSS inclusive os módulos do curso de html CSS também estão sendo disponibilizados no estudo anal e aí é mais uma maneira mais uma oportunidade de você ter um certificado de uma plataforma diferente fazendo o curso com uma pessoa que você já conhece Obrigado estudonalta pelo Patrocínio e voltamos agora a nossa aula normal né Oi gente olha só exercícios já está sendo criado Você viu o vídeo anterior se não viu corre lá para ver mas vamos criar agora que a gente tá se chamando aqui ó usando link interno o que tem um link interno interno ele é um link que vai dar uma ligação de vai fazer uma ligação nem que vai fazer a ligação ótima clique é ligação ele vai fazer a relação com outra página que está dentro do nosso servidor e com destino a e diz respeito à nossa própria página Então antes de criar um link interno a gente tem que ter outras páginas e eu vou te ensinar dois tipos de link interno Olha só em primeiro lugar a gente tem um eles que geralmente é por onde o arquivo é aberto por onde o site aberto e nós temos os links para ir para navegação Então vou criar Aqui ó Novo arquivo eu vou criar um pag0 021 HTML Essa é a minha página dois aqui eu também vou criar um código HTML padrão uma página separada tá outra aqui página 02 H1 esta é a segunda página do meu site certo só para vou botão parágrafo aqui a segunda página está aqui beleza então é só eu tenho aqui o pague 002 windex eu quero no index chamar o Parque Dez 02 então vou fazer o seguinte Olha só no index eu vou querer aqui ó é esta é a primeira página do site se você quiser pode acessar também a minha ó que é uma Âncora já aqui ó só digitei a e dente a minha aqui dentro da Âncora segunda página cuidar versão digital lugar errado tá é aqui ó dentro entre o a a segunda página aqui eu vou botar um nome do arquivo que eu quero carregar se você não visual Studio code cara que sempre te ajuda segurar o controle e apertar de Páscoa Segurei o controle é perfeito e faço ele já vai te dizer quais são as páginas que você tem aqui então beleza página dois então quando eu faço um link interno eu não preciso indicar a URL inteira e eu posso simplesmente dizer vai para a página 02 contanto que vou te mostrar aqui ó a página desse para funcionar desse jeito aqui a página 02 tem que estar na mesma pasta do Index certo vamos ver se funciona atualizar aqui ó usando links internos é essa é a primeira página do site se você quiser pode acessar também a minha segunda página quando eu clicar em cima da página ele já foi para cima da página beleza aqui na segunda página eu quero link para voltar para primeira página então vamos aqui no página 002 e vou querer mais um parágrafo aqui e nesse parágrafo vou criar um link que vai voltar vou apertar contra o espaço vou voltar para o index voltar para a primeira página ó voltar para primeira página quando eu clico aqui ó ele volta para a primeira página E aí eu queria um sistema de navegação eu estou na primeira página a segunda página é a próxima página e aqui eu tenho que voltar para página anterior e aí lembra que na aula anterior a gente falou sobre o réu existe o réu ex tornou não existe o réu um turno mas existe esse aqui lá na página é a próxima página né então vou botar aqui ó real entre as "eu vou colocar né que quer dizer próximo perto aqui no botão de voltar eu vou colocar aqui ó é o por isso a palavra toda kryvius né que é o anterior você vai digitar até o ver tá tanto frio é o anterior então a página próxima página uma página de avanço não necessariamente a página dois né na página principal você pode avançar para várias outras páginas Então olha a próxima página de navegação você usa rayonex aqui então Vai facilitar também o mecanismo de busca encontrar Qual é o sistema de navegação que você tá querendo o seu site e você não vai deixar o Google decidir qual é a próxima parte você tá dizendo para ele Olá Google a mulher da nesse código aqui e essa aqui é a próxima página e você é melhor maneira eu venho aqui eu disse Google ó vocês estão nessa página aqui a página imediatamente anterior essa daqui tá tá bom você consegue criar esse essa navegação aqui visualmente vai acontecer nada você vai fazer uma página volta com a primeira e tudo tá funcionando tá mas esse sistema de navegação aqui um pouco dentro da tem um significado tem uma semântica envolvido a gente já falou várias vezes sobre semântica Que Você Dá Um Valor a esse link inclusive pode ser até botar isso aqui na segunda página na segunda página vou criar um outro link para ver a segunda página tá aqui eu vou botar aqui ó esta página é um oferecimento de mas sei lá botar o nome da empresa lá sei lá host. net geralmente arroz frete não porque eu já trabalho lá já faz tempo então tem um aval meu mas geralmente é você quando faz um link para uma empresa aqui sei lá você não sabe realmente se esse link não é esse caso né mas eu já você tá fazendo um link para uma matéria que você não sabe então site oficial você tava escrevendo uma tela sobre fake News você tá fazendo alguma coisa que não tem o seu aval existe um régua também para isso que é um novo solo tá ou então até o Google recomenda é sempre que você fizer um patrocínio link patrocinado né uma empresa pagou para estar ali ele pagou pela marca estar ali você também faça um link Pois é a roxa e envelopar por um artista e se você não sabe o que eu tô fazendo cara você pulou o vídeo certo tão envelopar eu te ensinei envelopar em vídeos anteriores eu coloquei aqui ó vamos acessar https: 2 Barras host www. host.
com. br aí eu vou fazer aqui ó para abrir uma nova tela target underline Belém e o réu em vez de colocar é o réu ex tornou posso te colocar hexano mas existe um link por exemplo dizer um sim porque esse lindo aqui eu não dou meu aval não quero comer até mesmo de busca perpetue essa busca isso é vai lá no site do cara começa a indexar e tudo mais aí você bota aqui ó novo rolo certa não Síria a verdade novo fórum não é para pessoa que está visitando é para o mecanismo de busca que vai bater lá dentro graça Então tá lavando a segunda página falando quando eu vou lá oferecimento pochete eu clico ele vai abrir uma nova aba a propaganda do cara tá funcionando o cara pagou para Talita ali tranquilo sem problema só que você está dizendo para o a música que você não dá um aval para esse conteúdo necessariamente certo então se for seu caso tem cliente que pega eu quero um link e não quero nem que não falo que eles chamam de link do follow aí você não pode botar esse daqui tá mas existe essa possibilidade vamos agora voltar para primeira página e agora eu quero criar uma terceira página só que eu quero criar de um modelo um pouco diferente olha só nós vamos virar aqui no meus arquivos tá na no Exercício das eu vou criar uma pasta nova aqui dentro novo basta eu vou criar aqui ó sei lá em Notícias vou dar certo não tá tão frio aí notícias aqui ela já criou uma pasta notícias aqui eu vou criar mais um arquivo dentro da pasta não tinha história só que eu fiz eu cliquei na pasta notícias e clique no botão mais aí vai querer lá dentro apague 003. HTML e aí vou criar também aqui tem que ter Drpágina aqui eu vou fazer uma dá um terceira página Esta é a terceira Páscoa beleza a falar é facinho é só você criar aqui na na primeira página linda vamos criar lá você também pode acessar a nossa página de notícias é a página de notícias vai virar meu link ó vou envelopar ela com a tag a página de notícias ele só botar é fácil só botar pague 003.
HTML moleza Ocre O link tá certo Olha só quando você clicar em página de notícias tá lá o arquivo não foi encontrado você lavou como não como o arquivo não foi encontrado o arquivo tá aqui ó páginas as três eu tô vendo só que é o seguinte ele tá dentro da pasta notícias e você resolver ia isso usando a tecla de atalho que eu te ensinei Ó você aqui no link vasinho tá pressionar contra o espaço ele vai te dizer você não tem página dois você tem que o index tem página dois você tem a pasta notícias você não tem página 3 de perdão clicando aqui Notícias aí você tem página Cristão clicando nele tá lá olha o caminho que Ele montou a HF notícias/página 003 conta Gabriela e ir para o clicar em paisagens notícias tá lá na página Essa é a terceira parte aqui então você tem que informar o caminho caso ele esteja dentro de uma pasta certo a uma outra coisa que a gente vai fazer Deixa eu botar aqui também um réu next outra coisa que a gente que eu não comentei existe um target específico para abrir na própria página porque quando você tá navegando aqui você quer que esse link aqui ó o repositório público do hijab abra uma aba nova né para eu poder ficar com os dois sites aqui agora quando eu tenho aqui na segunda página não precisa abrir uma aba nova se toda a aba sua toda página que tá dentro do teu próprio site se abrindo uma nova fica bem zoado você vai começar a fazer um que o usuário abra várias Abas então você pode simplesmente não fazer nada não botando target ou botar um target dizendo que a própria página target underline selfie tá escreve selfie assim é o direito tá também aqui target underline selfie selfie significa na própria aba Então quando você clicar segunda página foi volto terça a página de notícias tá lá não tenho nem para voltar vamos fazer aí vem um outro problema Olha só quando você tem um link aqui como criar um link aqui vou tá aqui ó voltar para a primeira página na hora de voltar você vai falar Tá beleza vamos para o index. hu ML porque é né é o certo aquela só você vai para a página de notícias voltar para primeira página quando você clica ele dá lá que a página não foi encontrada por quê Porque eu index não está dentro da pasta página 03 eu tenho que voltar uma pasta como é que eu volto no seu material em PDF tem uma um aviso lá que eu coloquei aprenda Linux cara Lenoxx é a não mas eu não uso o Linux no dia a dia que você vai fazer site você vai usar Linux no seu dia a dia porque tá tua máquina pode ser uma ducha nossa máquina que tem medo mais ou servidor o lugar onde você botar os seus arquivos em Linux e você vai ter que aprender a utilizar Então já começa aprendendo junto com o aprendizado aqui já vai lá no curso em vídeo desse canal que eu coloquei aqui ó ó vou te mostrar vem aqui comigo vou voltar aqui na mão vai no o bico sem vídeo e você vai Cala a boca clique em playlists e aqui na Toyota Você foi no canal que ligou aqui playlist e vai clicar aqui ó Linux curso de Helena os primeiros passos aqui você vai ter senão a propaganda aqui ó of Legends League of Legends League of Legends já fiz uma propaganda tudo tranquilo então faça o curso dele no cara faz esse grande favor para você aprender Leno você vai aprender que é o seguinte se você botar. /Significa a própria pasta se você botar.
. /Significa a pasta anterior então isso daqui significado volte uma pasta seu toda da partida de Notícias. .
/Vai fazer eu retorno certo que eu vi aqui só apertar contra o espaço ele me dá a solução não me dá então você tem que saber que ponto. /Não é: em cima do outro não. .
Exatamente como eu fiz aqui. . /Aí ele vai me dar as opções eu clico aqui então aqui ó olha no link ficou.
/Inglesa.
Related Videos
Links para download - @Curso em Vídeo HTML5 e CSS3
8:55
Links para download - @Curso em Vídeo HTML...
Curso em Vídeo
287,525 views
lofi hip hop radio 📚 beats to relax/study to
lofi hip hop radio 📚 beats to relax/study to
Lofi Girl
Links e Âncoras em HTML5 - @Curso em Vídeo HTML5 e CSS3
12:30
Links e Âncoras em HTML5 - @Curso em Vídeo...
Curso em Vídeo
344,193 views
Estilos CSS inline - @Curso em Vídeo HTML5 e CSS3
16:13
Estilos CSS inline - @Curso em Vídeo HTML5...
Curso em Vídeo
228,131 views
Imagens Dinâmicas - @Curso em Vídeo HTML5 e CSS3
16:31
Imagens Dinâmicas - @Curso em Vídeo HTML5 ...
Curso em Vídeo
298,641 views
Deep Chill Music for Focus and Stress Relief
1:15:05
Deep Chill Music for Focus and Stress Relief
Chill Music Lab
3,394,542 views
Listas mistas e de definição - @Curso em Vídeo HTML5 e CSS3
12:04
Listas mistas e de definição - @Curso em V...
Curso em Vídeo
290,119 views
The Good Life Radio • 24/7 Live Radio | Best Relax House, Chillout, Study, Running, Gym, Happy Music
The Good Life Radio • 24/7 Live Radio | Be...
The Good Life Radio x Sensual Musique
DESENVOLVENDO MEU PRIMEIRO SITE COM HTML | 4#
7:18
DESENVOLVENDO MEU PRIMEIRO SITE COM HTML | 4#
bremado
458,824 views
RAINING IN JAPAN ☔ Rainy Lofi Songs To Make You Calm Down And Relax Your Mind ☔ Pluviophile Lofi
RAINING IN JAPAN ☔ Rainy Lofi Songs To Mak...
Pluviophile Lofi
Estilos CSS externos - @Curso em Vídeo HTML5 e CSS3
17:05
Estilos CSS externos - @Curso em Vídeo HTM...
Curso em Vídeo
231,326 views
Listas OL e UL - @Curso em Vídeo HTML5 e CSS3
12:32
Listas OL e UL - @Curso em Vídeo HTML5 e CSS3
Curso em Vídeo
328,388 views
Chill Music for Focus and Creativity — Deep Concentration Mix
1:10:32
Chill Music for Focus and Creativity — Dee...
Chill Music Lab
9,109,551 views
Citações e Códigos - @Curso em Vídeo HTML5 e CSS3
19:26
Citações e Códigos - @Curso em Vídeo HTML5...
Curso em Vídeo
363,849 views
Criação de Sites com HTML5 e CSS3 :: Aula 20 :: Responsividade e Projeto Final
1:25:19
Criação de Sites com HTML5 e CSS3 :: Aula ...
Ricardo Maroquio
6,545 views
CSS Grid Layout e Flexbox - Quando Utilizar
39:09
CSS Grid Layout e Flexbox - Quando Utilizar
Origamid
653,332 views
Desafios propostos - @Curso em Vídeo HTML5 e CSS3
5:48
Desafios propostos - @Curso em Vídeo HTML5...
Curso em Vídeo
286,341 views
Что такое TCP/IP: Объясняем на пальцах
15:38
Что такое TCP/IP: Объясняем на пальцах
Listen IT
1,006,212 views
Paleta de cores - @Curso em Vídeo HTML5 e CSS3
18:59
Paleta de cores - @Curso em Vídeo HTML5 e ...
Curso em Vídeo
143,969 views
Como mudar o favicon de um site - @Curso em Vídeo HTML5 e CSS3
15:50
Como mudar o favicon de um site - @Curso e...
Curso em Vídeo
470,244 views
Copyright © 2024. Made with ♥ in London by YTScribe.com