Âncora de link

"Ancorar" um link significa não apenas dizer em que página ele irá (para onde a "origem" -- o nome técnico do link -- aponta), mas também em que ponto da página (a "âncora") ele deve ir.

E, ao mesmo tempo, isso coloca outra questão interessante: a possibilidade de fazer links internos a uma postagem (ou página web). Isto é útil quando a postagem é grande e podemos fazer uma lista inicial de itens de texto, que o leitor click e vá diretamente a eles.

Vou ensinar as estruturas de HTML que são necessárias criar para gerar tais links. Na verdade, é necessário fazer e inserir também um código para a âncora.

OBSERVAÇÃO IMPORTANTE: descobri que a maneira tradicional de fazer links internos a uma postagem está com problemas -- por uma questão técnica do Blogger, que fica colocando uns links que atrapalham. O assunto é um pouco técnico, e procurei ajuda em fóruns e no Google, mas não encontrei uma solução além do que vou propor, que tem a desvantagem de ter que abrir novamente a página.

Quando o link/âncora estão na mesma página os códigos são os seguintes (perceba que para link interno explico o jeito usual - NÃO PARA O BLOGGER - e o modo normal (em primeiro) para fazer nele:

Código de link para âncora na mesma página - JEITO NORMAL (não no Blogger)

<a href="#nome_da_ancora">link</a>

Código de link para âncora na mesma página - MODO BLOGGER

<a href="endereço_da_postagem#nome_da_ancora">link</a>

Código da âncora - JEITO NORMAL (não no Blogger) (repare que o # não é colocado)

<a name="nome_da_ancora">texto âncora</a>

Código da âncora - MODO BLOGGER (repare que o # não é colocado)

<div id="nome_da_ancora">texto da âncora</div>

 Quando o link/âncora estão em páginas DIFERENTES os códigos são os seguintes:

Código de link para âncora em outra página

<a href="http://www.nomedosite.com/completo/exemplo#nome_da_ancora">nome do link</a>

Código da âncora - JEITO NORMAL (não no Blogger) (repare que o # não é colocado)

<a name="nome_da_ancora">texto âncora</a>

Código da âncora - MODO BLOGGER (repare que o # não é colocado)

<div id="nome_da_ancora">texto da âncora</div>

Evidentemente, é necessário termos acesso à edição do texto da página em que estará a âncora para a inserirmos (no caso do link externo). O local do texto é qualquer um, no entanto é necessário que a tag seja aberta e fechada e que não se esqueça o "nomedancora" (à sua escolha). Aliás, vale notar que não precisa ser necessariamente em algum texto, mas só antes dele. O importante, como disse, é que tag esteja completa: aberta e fechada.

É esse nome de âncora que será agregado à estrutura do código do link. A partir do "Mais", darei um exemplo de link-âncora interno a uma postagem. Infelizmente, como disse antes, o método aceito no Blogger implicará em sempre ter que abrir a página da postagem. Uma pena isso. (Eu poderia, seguindo a lógica exposta, ter feito um link de retorno, mas ia dar muito trabalho, então deixei sem...)

Se existe outro método mais interessante, agradeço o comentário de quem souber.

Recursos para educadores na web

1. Programas suíte Office
2. Disco Virtual - repositório e compartilhamento de arquivos
3. Fotos - sites para compartilhar e arquivar
4. Apresentações - sites para compartilhar e arquivar
5. Música - sites para compartilhar e arquivar
6. Textos - sites para publicar e compartilhar
7. Vídeo - sites para compartilhar e arquivar
8. Vinhetas e efeitos sonoros
9. Música com licença Creative Commons ou similar
10. Mapas mentais online
11. Fotos gratuitas (geralmente para uso não comercial)
12. Programas para capturar telas do computador
13. Texto colaborativo e wiki
14. Criação de blog
15. Criação de microblog
16. Criação de arquivo PDF
17. Criação de avatares animados
18. Criação de livros de histórias
19. Criação de histórias em quadrinhos
20. Criação de sites
21. Criação de página web personalizada com sites favoritos
22. Criação de Caça-Palavras
23. Criação de vídeos com animações
24. Edição de áudio
25. Edição de imagens online
26. Edição de vídeos online
27. Gravação em vídeo da tela do computador
28. Encurtadores de URL
29. Enquetes, murais e chats para sites e blogs
30. Formulário de contato para sites e blogs
31. Gravação de mensagens de vídeo
32. Gravação de mensagens de áudio
33. Geradores de nuvens de tags a partir de textos
34. Gerenciamento de referências
35. Busca de ícones gratuitos
36. Compartilhamento de conteúdo
37. Coleta e organização de conteúdo
38. Conversão de arquivos online
39. FTP
40. Automação da programação de rádio
41. Podcast
42. Programas para baixar vídeos do YouTube
43. Protetor de e-mail divulgado em blog/site
44. Programas para conversão de formatos de vídeo
45. Gravação de páginas web
46. Serviços de VoIP

Programas suíte Office:

• Google Docs (online)
• Zoho (online)
• OpenOffice

Disco Virtual - repositório e compartilhamento de arquivos:

• DropBox
• Esnips

Fotos - sites para compartilhar e arquivar:

• Flickr
• Picasa

Apresentações - sites para compartilhar e arquivar:

• Slideshare
• Slide
• Prezi
• Photopeach
• Animoto (slideshow + vídeo)

Música - sites para compartilhar e arquivar:

• Goear
• Boomp3

Textos - sites para publicar e compartilhar:

• ReadOz
• Scribd
• Issuu

Vídeo - sites para compartilhar e arquivar:

• YouTube
• Vimeo
• TeacherTube

Vinhetas e efeitos sonoros:

• Free-Loops
• FreeSound

Música com licença Creative Commons ou similar:

• Creative Commons/Áudio
• ccMixter
• Free Music Archive
• Jamendo
• Magnatune
• BeatPick
• CASH Music
• SectionZ
• Opsound
• AudioFarm
• Internet Archive’s Netlabels Collection

Mapas mentais online:

• Mind42 (online)
• Bubbls.us (online)
• FreeMind

Fotos gratuitas (geralmente para uso não comercial):

• http://www.imageafter.com/
• http://www.photogen.com/
• http://freerangestock.com/
• http://www.public-domain-photos.com/
• http://www.burningwell.org/
• http://www.freedigitalphotos.net/
• http://pdphoto.org/

Programas para capturar telas do computador:

• DuckLink Screen Capture
• EasyCapture
• MWSnap
• Jing (+ compartilhamento online)

Texto colaborativo e wiki:

• Writeboard
• PiratePad
• ZohoWiki
• Linoit
• Etherpad Lite
• Wetpaint

Criação de blog:

• WordPress
• Blogger

Criação de microblog:

• Twitter
• Tumblr

Criação de arquivo PDF:

• PDFCreator

Criação de avatares animados:

• Voki

Criação de livros de histórias:

• Storybird

Criação de histórias em quadrinhos:

• Toondoo

Criação de sites:

• Wix
• Google Sites

Criação de página web personalizada com sites favoritos:

• Symbaloo
• Netvibes

Criação de Caça-Palavras

• Caça-Palavras
• Puzzle Maker

Criação de vídeos com animações:

• Xtranormal

Edição de áudio:

• Audacity
• Audio Editor Myna (online)

Edição de imagens online:

• Pixrl
• Splashup
• Sumo
• Aviary
• Picnic

Edição de vídeos online:

• YouTube Editor
• Wevideo
• Stroome
• JayCut

Gravação em vídeo da tela do computador:

• CamStudio
• Screenr (online)

Encurtadores de URL:

• Bitly
• Migre.me
• TinyURL

Enquetes, murais e chats para sites e blogs:

• Xat.com
• JotForm
• CBox
• Meebo
• Survey Monkey

Formulário de contato para sites e blogs:

• Kontactr

Gravação de mensagens de vídeo:

• EyeJot

Gravação de mensagens de áudio:

• Gengibre

Geradores de nuvens de tags a partir de textos:

• Wordle
• WordItOut

Gerenciamento de referências

• Zotero

Busca de ícones gratuitos:

• Iconlet

Compartilhamento de conteúdo:

• Scoop.it

Coleta e organização de conteúdo:

• Diigo
• LiveBinders

Conversão de arquivos online:

• Zamzar

FTP:

• Filezilla

Automação da programação de rádio:

• ZaraRadio

Podcast:

• PodOmatic
• PodcastOne

Programas para baixar vídeos do YouTube:

• VDownloader

Protetor de e-mail divulgado em blog/site:

• MailtoEncoder

Programas para conversão de formatos de vídeo:

• SUPER

Gravação de páginas web:

• Read it Late

Serviços de VoIP:

• Voxopop
• Skype