"Compondo blocos ..."

"Compondo blocos ..."
Foto © Darren Heste CC: Atribuição, Não-Comercial


Mostrando postagens com marcador page creator. Mostrar todas as postagens
Mostrando postagens com marcador page creator. Mostrar todas as postagens

segunda-feira, 13 de agosto de 2007

Desafio da semana: inserir áudio no seu blog ou na sua página pessoal da internet

Já imaginou publicar em seu blog ou na sua página uma declamação de um aluno seu. É ponto!!! A mãe do "pimpolho" se tornará uma fervorosa fã do seu trabalho! E se você gravar o aluno falando "Mamãe, eu amo você! Você é demais!" como homenagem para o Dia das Mães? É "gol de letra"!

Como publicar áudio? O código

<div align="center"><embed width="200" height="25" type="audio/mpeg" src="http://old.doctorjoe.net/Louie Armstrong - What a Wonderful World.mp3" controls="TRUE" autoplay="false"></embed></div>

incluído nesta postagem resulta no seguinte controle:



Para reproduzir o áudio é preciso clicar no botão com a seta para a direita.

Se você quiser ver o código html da sua postagem clique na aba "Editar Html" do editor de postagens. Caso você estivesse editando a presente postagem, o que você veria ao clicar em tal aba? Exatamente o que se segue:

O código

&lt;div align="center"&gt;&lt;embed width="200" height="25" type="audio/mpeg" src="http://old.doctorjoe.net/Louie Armstrong - What a Wonderful World.mp3" controls="TRUE" autoplay="false"&gt;&lt;/embed&gt;&lt;/div&gt;

incluído nesta postagem resulta no seguinte controle:
<div align="center"><embed width="200" height="25" type="audio/mpeg" src="http://old.doctorjoe.net/Louie Armstrong - What a Wonderful World.mp3" controls="TRUE" autoplay="false"></embed></div>
Para reproduzir o áudio é preciso clicar no botão com a seta para a direita.

Como você pode observar, texto em html consiste em "texto bruto" mesclado com marcadores html que iniciam com o caractere < e terminam com o caractere >. Tais caracteres são chamados de delimitadores. Caso se pretenda mostrar esses delimitadores na página, é preciso colocar &lt; e &gt; no código html. Você pode esquecer desses pormenores. Eles só foram apresentados aqui para que você possa entender minimamente o código html apresentado acima.

Como, então, publicar um áudio no seu blog? Se o aúdio já estiver publicado na internet em mp3 e você quiser reproduzi-lo como no exemplo acima (o endereço de internet, também chamado de URL, do exemplo é http://old.doctorjoe.net/Louie Armstrong - What a Wonderful World.mp3) basta fazer o seguinte:

  1. Copie o código abaixo (marque o texto do código, isto é, posicione o cursor no início do código abaixo, aperte o botão esquerdo do mouse, arraste o cursor até o final do código e solte o botão esquerdo do mouse; a seguir, aperte conjuntamente as teclas Ctrl C):

    <div align="center"><embed width="200" height="25" type="audio/mpeg" src="" controls="TRUE" autoplay="false"></embed></div>

  2. No editor de postagem do Blogger, clique na aba "Editar Html", identifique o local apropriado para a inserção do controle de áudio e cole o código copiado no passo acima (posicione o cursor na posição desejada, clique o botão esquerdo do mouse e aperte conjuntamente as teclas Ctrl V). Se você quiser um controle mais comprido ou mais curto, então aumente ou diminua, respectivamente, o valor 200 em width="200".

  3. Em outra janela do Firefox, localize o áudio desejado e copie o seu URL. Para ilustrar a cópia de um URL, entre na página "Dr. Joe's Oldies and Goodies music page" mencionada em "Desafio da semana: Spider Player, o tocador mp3, e as músicas dos 'bons tempos'", localize uma música em formato mp3, posicione o cursor em cima do nome da música, clique com o botão direito do mouse e, no menu que se abre, escolha a opção "Copiar link").

  4. Volte à janela do editor de postagem e, entre as suas aspas em scr="", cole o URL do áudio selecionado (posicione o cursor entre as duas aspas, clique com o botão esquerdo do mouse e, a seguir, aperte conjuntamente as teclas Ctrl V).

  5. Para ver se ficou tudo a contento, clique em "Visualizar" no editor de postagem. Se o controle de áudio não estiver posicionado corretamente, clique em "Ocultar visualização", recorte todo o trecho do código que você acaba de inserir (marque o trecho e aperta concomitantemente as teclas Ctrl X) e cole-o no local desejado. Repita isto até conseguir posicionar corretamente o controlador de áudio. Depois disso, já inicie o texto que se segue ao controle de áudio após o </div>, como no exemplo acima com o fundo abóbora. Basta a primeira letra da frase. Agora você pode clicar na aba "Escrever" e continuar editando a sua postagem normalmente. O controle para reproduzir o áudio não é apresentado, mas não se preocupe. Ele aparecerá assim que você publicar a sua postagem.
Supondo que você gerou o seu próprio áudio em formato mp3 com o Audacity ("Desafio da semana: Audacity"), por exemplo. O arquivo de áudio deve estar em algum servidor Web para poder ser publicado da forma como descrito acima. Antes de depositar o áudio, deixe a sua postagem pronta já com o código html de reprodução de áudio apresentado acima com fundo salmão. Onde depositar o áudio para que ele tenha um URL? Uma maneira simples é usar, em outra janela do seu navegador, o "Page Creator" mencionado em "Desafio da semana: criar uma página na internet".

Ao entrar no Page Creator você terá à direita uma coluna com os arquivos depositados junto ao Googlepages. Para carregar um arquivo lá, clique em "upload" no final de tal coluna e clique em "Arquivo...". Na janela "Enviar arquivo", navegue até o diretório em que se encontra o arquivo de áudio a ser depositado junto ao Googlepages, clique no arquivo e, depois, no botão "Abrir". O processo de carga (upload) se inicia automaticamente. Após o seu término, posicione o cursor sobre o nome do arquivo na coluna com todos os arquivos já depositados, clique no nome com o botão direito do mouse e selecione a opção "Copiar link" no menu que se abriu. Na janela com o editor de postagem, basta, agora, colar a URL entre as suas aspas em scr="" do código html com as teclas Ctrl V. Clique em "Visualizar" e verifique se o controle de reprodução de áudio se encontra no local desejado de sua postagem e se o áudio é capaz de ser reproduzido corretamente. Em caso afirmativo, tarefa cumprida! Parabéns!

Como publicar o áudio em uma página criada com o Page Creator? Abra o editor e clique no seu corpo da página desejada. A seguir, clique em "edit html", selecione o local onde você pretende inserir o código de reprodução de áudio e proceda da mesma forma como descrito logo acima. Inserido o código com o URL do áudio, clique em "Save Changes" e pronto!

Quer saber um pouco mais sobre os marcadores html? Então visite "Html ilustrado".

segunda-feira, 16 de abril de 2007

Desafio da semana: criar uma página na internet

Mais adiantado que os demais e esperando pelo término de tarefas de outros colegas para você poder continuar com as atividades programadas para o curso? Pois bem, aqui vai um desafio: editar e publicar uma página pessoal na internet. É complicado fazer isso? Não é preciso ter conhecimentos mais especializados para publicar uma página na internet? Na realidade, não mais. Há uns tempos atrás era preciso usar uma linguagem de marcação chamada html, usar ferramentas específicas, transferir a página editada no meu computador para um servidor Web e outras coisas mais. Hoje tudo ficou mais simples. O próprio Google oferece um serviço para editar e publicar páginas Web, tudo através de um navegador e sem necessidades de instalar softwares adicionais, que se chama Page Creator. As páginas do Curso Yai foram todas criadas e publicada através desse serviço.

Para usar o serviço, entre na página do serviço (http://pages.google.com/) e, caso ainda não autenticado junto ao Google, apresente as suas credenciais (nome de usuário e senha). Edite e publique primeiramente a página chamada home, a página principal do seu sítio (site), experimente com diferentes formas de apresentação (look) e de organização (layout), publique a página e veja como ela ficou na internet. Experimente e teste, sem medo, as diferentes facilidades oferecidas pelo serviço Page Creator. Caso necessário, apague e refaça se você não gostou do resultado. Tente, também, estabelecer conexões com outras páginas Web (como a página do curso, por exemplo). Se, por acaso, você tiver dúvidas ou encontrar alguma dificuldade maior, então entre em contato através do grupo de discussão do Curso Yai para receber orientações mais precisas. Para encaminhar as suas dúvidas, envie mensagem para:

Uma vez criada a página, publique no seu diário (blog) o seu endereço, chamado de URL no jargão mais técnico.

Você encara o desafio? Esperamos que não e você não irá se arrepender!

 Licença de Uso


Creative Commons License
Esta obra está licenciada sob uma Licença Creative Commons.





 Promoção e Apoio

Logo: UnicampLogo: Instituto de ComputaçãoLogo: Escola de Extensão da UnicampLogo: Prefeitura do Município de ItatibaLogo: Laboratório Interdisciplinar de Tecnologias Educacionais (LITE)