Posts Tagged 'Internet'

Vídeos com HTML 5 e a nova guerra dos browsers

Post movido para: http://blog.guilhermegarnier.com/2010/02/videos-com-html-5-e-a-nova-guerra-dos-browsers/

No final do século 20, a disputa entre os dois browsers mais populares da época, Netscape e Internet Explorer, ficou conhecida como guerra dos browsers. Nos últimos anos, após um período negro de domínio do IE, outros browsers começaram a crescer e recuperar o espaço que era ocupado pelo falecido Netscape.

Mais recentemente, desde o ano passado, os browsers mais modernos começaram a dar suporte ao HTML 5 – o Firefox, por exemplo, suporta desde a versão 3.5. Entre diversas novidades, o recurso mais popular do HTML 5 é a tag video, que permite a execução de vídeos sem o uso de plugins. A imensa maioria dos sites de vídeo usam Flash, que é uma tecnologia proprietária, e não é suportada em plataformas como o iPhone/iPod Touch. Porém, juntamente com esta nova tag surgiu uma polêmica.

No mês passado, o Youtube – seguido posteriormente por outros sites de vídeos – anunciou que começaria a oferecer vídeos em HTML 5, porém usando o codec H.264. Apesar de suportar HTML 5, o Firefox não tem suporte a este codec, pelo fato de ele ser proprietário, e exigir o pagamento de licenças caríssimas. O Firefox suporta somente o codec OGG Theora, que é open source. Esta atitude do Youtube criou uma grande polêmica: por que eles deixariam de usar uma tecnologia proprietária (Flash) para adotar outra igualmente proprietária (H.264)? O uso de HTML 5 deixa a impressão de que o Youtube partiu para tecnologias abertas, mas isto não ocorreu, devido ao codec escolhido.

Enquanto isso, o Safari (incluindo aí o iPhone) suporta o codec H.264, mas não suporta Theora; o Google Chrome suporta ambos os formatos; o Opera começará a suportar vídeos com codec Theora a partir da versão 10.50; e o IE 8 nem suporta HTML 5, criando um cenário totalmente heterogêneo. Um dos problemas desta divisão é que começamos a nos distanciar da padronização – que é o objetivo principal do W3C – e criar um ambiente onde cada browser suporta diferentes formatos de vídeo, retornando à época da guerra dos browsers, onde dificilmente uma página era igualmente visualizada no IE e no Netscape. Outro problema é que, como o Firefox não consegue exibir os vídeos em HTML 5 do Youtube, muita gente diz erradamente que o Firefox não suporta HTML 5, quando na verdade é um problema de codec.

A solução para os desenvolvedores é oferecer seus vídeos em mais de um formato, multiplicando, desta forma, o espaço necessário e o trabalho de codificação dos vídeos. O Video For Everybody ajuda a resolver este problema, oferecendo um trecho de código HTML que deixa a cargo do browser a escolha da opção mais adequada – se o browser suportar HTML 5 e Theora, este vídeo será exibido; se suportar HTML 5 e H.264, usará este formato; caso contrário, usará o plugin de Flash ou QuickTime, caso estejam instalados. Em último caso, exibe uma imagem do vídeo com um link para download. Esta solução exige o armazenamento do vídeo em dois formatos, mas parece uma boa solução diante de tantas variantes.

Referências:

Anúncios

Feeds autenticados no Google Reader

Post movido para: http://blog.guilhermegarnier.com/2009/07/31/feeds-autenticados-no-googl-reader/

Há muito tempo eu uso o Google Reader como leitor de feeds. A principal vantagem sobre as demais alternativas para desktop é o fato de não necessitar de instalação, podendo ser acessado diretamente pelo browser.

Outro dia, tentei cadastrar o feed do Twitter no Google Reader, e recebi a seguinte mensagem: “Sorry, an unexpected condition has occurred which is preventing Google Reader from fulfilling the request”. Tentei acessar o feed diretamente no Firefox, e, após solicitação de login e senha, os feeds apareceram normalmente. Após uma rápida pesquisa, descobri que o Google Reader não suporta feeds autenticados, o que é o caso do Twitter.

Uma das alternativas a este problema seria utilizar um leitor de feeds que suporta autenticação, como a extensão NewsFox para Firefox ou algum outro. Porém, para poder continuar utilizando o Google Reader, uma solução é o FreeMyFeed, um serviço que funciona como uma espécie de proxy para feeds autenticados: você informa a URL, o login e a senha do feed que exige autenticação, e ele gera um novo endereço de feed que permite acesso direto, inclusive pelo Google Reader.

Suporte a HTML 5 no Firefox 3.5

Post movido para: http://blog.guilhermegarnier.com/2009/07/03/suporte-a-html-5-no-firefox-3-5/

Esta semana saiu o Firefox 3.5, com uma série de melhorias, como o recurso de geolocalização e o modo Private Browsing. Além disso, o browser está muito mais rápido que na versão anterior, devido principalmente ao novo engine de Javascript e ao suporte nativo a JSON.

Além disso, outra novidade importante é a adição de suporte ao HTML 5. Esta versão ainda é um working draft, que traz como principais novidades as tags <video> e <audio>, para suporte nativo a mídias. Assim, não é mais necessário usar tags <embed> e um player externo para a exibição dos já onipresentes vídeos online. Existem vários sites que já utilizam HTML 5 para demonstrar os novos recursos, como mostra este post do Zumo e o Video Bay.

Gerenciamento de perfis no Firefox

Post movido para: http://blog.guilhermegarnier.com/2009/02/05/gerenciamento-de-perfis-no-firefox/

Recentemente escrevi um post listando as extensões do Firefox para desenvolvedores web que eu recomendo. Outro dia, achei que o meu Firefox estava ficando muito lento. Quando fui verificar, percebi que eu tinha cerca de 30 extensões instaladas! Obviamente, quanto mais extensões instaladas, mais memória o browser utilizará.

Uma dica útil para quem deseja utilizar muitas extensões, mas não tem necessidade de utilizar todas no mesmo momento, é utilizar diferentes perfis. Em cada perfil, você pode instalar extensões diferentes, ou alterar as configurações do browser e instalar temas. Ao executar o Firefox, você pode selecionar o perfil desejado. Para isso, utilize o Profile Manager. Basta executar o Firefox com a seguinte linha de comando:

firefox -profilemanager

Fazendo isto, aparecerá uma janela como a seguinte:

Profile Manager

Profile Manager

Nesta janela, aparecerão todos os perfis existentes, e você pode selecionar o que deseja utilizar. Também é possível criar, renomear e excluir perfis. Desmarcando a opção “Don’t ask at startup”, esta tela do Profile Manager será exibida sempre que o Firefox for executado.

Caso você queira carregar um perfil que já existe em outro diretório, basta criar um novo perfil e selecionar o diretório correspondente. Se o perfil já existir, ele será somente adicionado à lista. Na opção excluir perfil, você pode escolher se deseja realmente excluir os arquivos e diretórios ou somente remover o perfil da lista.

Outra opção de linha de comando bastante útil é o Safe Mode. Caso o Firefox comece a ficar instável após a instalação de alguma extensão, basta executar:

firefox -safe-mode

No Safe Mode, todas as extensões, temas e demais customizações são desabilitadas, permitindo a desinstalação da extensão problemática, se for o caso. Além disso, é possível fazer algumas alterações permanentes, como resetar as preferências e bookmarks de usuários e desabilitar as extensões.

Safe Mode

Safe Mode

Para fazer backup de um perfil, existem várias extensões disponíveis. A que achei mais interessante é o FEBE. Esta extensão permite selecionar especificamente quais itens do perfil você deseja incluir no backup (extensões, temas, bookmarks, configurações, cookies, histórico e outras opções), executar o backup manualmente ou agendar para execução diária, semanal ou mensal, verificar os backups anteriores e outras opções. A opção de restauração de um backup também é seletiva: você pode restaurar somente os itens que desejar ou o perfil completo.

Mais informações sobre o backup de perfis usando o FEBE: Export your Firefox 3.0 full profile to Firefox 3.1 (including all addons, themes, cookies, passwords, etc).

Outra opção para backup de perfis é o Profile Manager and Synchronizer, que ainda é experimental. Não testei esta extensão, mas pela descrição ela não parece ter tantas opções quanto o FEBE, apesar de ter recursos interessantes para sincronizar perfis em diferentes máquinas.

UPDATE: Outro recurso interessante é o parâmetro -no-remote, que permite a execução de duas instâncias do Firefox com perfis diferentes. Basta executar o Firefox com a seguinte linha de comando:

firefox -P profile -no-remote

Onde -P é a forma reduzida do parâmetro -profilemanager e profile é o nome do perfil desejado, conforme aparece no Profile Manager. Este perfil não pode ser o padrão. Para abrir a tela do Profile Manager, basta deixar o nome do perfil em branco:

firefox -P -no-remote

Mais informações:

Obrigado ao Tóin pelas dicas.

Extensões do Firefox recomendadas para desenvolvedores web

Post movido para: http://blog.guilhermegarnier.com/2009/01/06/extensoes-do-firefox-recomendadas-para-desenvolvedores-web/

Quase todo usuário de Firefox que tem um blog já postou uma lista de extensões recomendadas. Chegou a minha vez! Sei que muitas aqui já são velhas conhecidas da maioria, mas acho interessante ressaltar a importância. Hoje em dia é difícil imaginar o desenvolvimento web sem o auxílio do Firefox. Segue abaixo a lista de extensões que eu recomendo:

  • Firebug
    Como não poderia deixar de ser, o primeiro da lista, e totalmente indispensável, é o Firebug. Seria até exagero chamá-lo de extensão, pois o Firebug é uma verdadeira plataforma para debug de aplicações web. Com ele é possível, além de inspecionar visualmente o código HTML, seja diretamente pelo código, seja selecionando o componente visual associado a ele, é possível modificar o código, alterando, excluindo ou incluindo tags, e o resultado aparece em tempo real. O mesmo pode ser feito com os códigos Javascript e CSS da página. Há também um console para debug; é possível utilizar o comando console.log(“texto”) no seu código Javascript, e durante a execução, o texto será exibido no console do Firebug. Também é possível visualizar o resultado de todas as requisições, incluindo arquivos carregados (imagens, arquivos CSS, Javascript e Flash) e chamadas assíncronas (Ajax), exibindo o cabeçalho da requisição, o resultado, o tamanho do arquivo e o tempo de resposta. Esta extensão é tão poderosa que há extensões para ela, como o YSlow, do Yahoo, que exibe estatísticas de desempenho da página.

    Como o Firebug é só para Firefox, foi lançada uma versão Lite que também funciona com IE, Opera e Safari. Nunca testei esta versão, porém acredito que seja uma boa alternativa para debugar problemas que aconteçam num destes browsers mas não no Firefox. Nesse mesmo link é disponibilizada uma versão do Firebug Lite como bookmarklet. Basta arrastar o link para a barra de bookmarks do Firefox para poder utilizá-lo sem precisar instalar o Firebug.

  • Web Developer
    Esta extensão é uma das mais úteis no desenvolvimento web. Entre as opções disponíveis, ela permite visualizar o CSS da página, cookies, bloquear imagens e muitas outras funções.
  • Poster
    O Poster é uma extensão simples, porém muito útil para testar Web Services. Ele exibe uma janela com opções para digitar a URL de destino, o tipo de requisição (GET, POST, PUT ou DELETE), o body e os parâmetros. Feita a requisição, é possível visualizar a resposta recebida.
  • JavaScript Debugger
    Extensão muito poderosa, que exibe uma janela listando todos os arquivos Javascript da página atual. Pode-se definir breakpoints no código e executá-lo passo a passo, verificar e alterar valores de variáveis e tudo o que se espera de uma ferramenta de debug.

    Javascript Debugger

    Javascript Debugger

  • Greasemonkey
    Uma das extensões mais conhecidas, permite criar scripts usando Javascript para modificar o comportamento de sites específicos. O site Userscripts.org possui centenas de scripts pré-definidos para vários sites conhecidos. Com o Greasemonkey, você pode até mesmo ajudar a Vivo a adicionar suporte a HTML no Firefox.
  • Greasefire
    Extensão que adiciona ao Greasemonkey uma funcionalidade de busca automática de scripts para o domínio atual no Userscripts.org. Ao clicar no ícone do Greasemonkey, aparece uma nova opção no menu, que, ao ser selecionada, exibe em uma nova janela a lista de scripts encontrados.
  • CSSViewer
    O CSSViewer exibe todas as propriedades CSS dos elementos da página atual num div flutuante, conforme o cursor do mouse é movido pela tela.
  • X-Ray
    Mais uma extensão simples e útil. O X-Ray permite visualizar o código fonte de uma página sobre a própria. Desta forma, as tags HTML se misturam aos elementos da página, permitindo visualizar exatamente onde se localiza cada elemento do fonte, apesar de a visualização ficar um pouco confusa.
  • Live HTTP Headers
    Exibe numa janela os cabeçalhos HTTP de cada requisição, auxiliando na verificação de erros de rede. As informações dos cabeçalhos também podem ser exibidas numa barra lateral, e as URLs das requisições que serão analisadas podem ser definidas como expressões regulares.

    Live HTTP Headers

    Live HTTP Headers

  • Aardvark
    Esta extensão permite excluir elementos da página com um clique. É muito útil para acessar sites muito poluídos, com excesso de elementos na tela, ou quando há algum elemento sobrepondo outro, no caso de erros de visualização de sites que não foram testados no Firefox. Também pode ser utilizado para remover elementos desnecessários antes de imprimir uma página.
  • MeasureIt
    Exibe uma régua para contagem de pixels de um elemento. Útil para ajustes finos no design.
  • JSView
    Exibe um ícone no rodapé do Firefox. Ao clicar nele, é possível visualizar automaticamente todos os arquivos CSS e Javascript da página atual. Pouco útil caso você já utilize o Firebug.
  • ErrorZilla Mod
    Quando uma página estiver inacessível, esta extensão exibirá uma tela alternativa de erro, com opções para consultar esta página no Google Cache, tentar ping e trace, entre outras opções.

    ErrorZilla Mod

    ErrorZilla Mod

  • CheckBoxMate
    Permite marcar vários checkboxes de uma vez, através de drag & drop. Esta extensão não tem qualquer relação com desenvolvimento web, mas resolvi incluir na lista pois acredito que pode ser útil, por exemplo, quando se deseja selecionar vários emails no seu webmail.
  • Stylish
    Praticamente um Greasemonkey para CSS. Permite criar folhas de estilo para URLs específicas e pesquisar no Userstyles.org por estilos pré-definidos para o domínio atual.
  • ColorZilla
    Permite descobrir o código RGB da cor do elemento atual, fazer zoom de até 1000% na página (para facilitar a seleção de um elemento específico) e selecionar cores numa paleta, entre outras opções.
  • PDF Download
    Converte páginas Web para PDF, além de permitir selecionar a ação desejada ao clicar em um arquivo PDF (download, abrir com o programa padrão, abrir no browser).

Além de muitas extensões úteis, existem outras nem tanto. A extensão mais inútil para Firefox, na minha opinião, é o Fast Close Tabs: você acha irritante ter que clicar no X à direita de uma aba para fechá-la? Com esta extensão, você pode fechá-la clicando no X da própria janela do Firefox!

Finalizando, um site que acho muito interessante é o Firefox Facts, que traz muitas dicas sobre o Firefox, principalmente sugestões de novas extensões e temas.

Ajude a Vivo a adicionar suporte a HTML no Firefox

Post movido para: http://blog.guilhermegarnier.com/2008/12/23/ajude-a-vivo-a-adicionar-suporte-a-html-no-firefox/

Conforme publicado no BR-Linux.org há algum tempo, segundo a Vivo, o Firefox não suporta HTML. Para ajudar a resolver este problema, basta usar o GreaseMonkey. Para quem não conhece, é uma poderosa extensão do Firefox que permite criar scripts em Javascript para modificar funcionalidades de sites específicos.

Ao instalar o script Corrigir Vivo Online, o Firefox finalmente passa a suportar HTML e a se comportar como um browser de verdade.

Script para verificar o status da conexão PPPoE

Post movido para: http://blog.guilhermegarnier.com/2008/11/24/script-para-verificar-o-status-da-conexao-pppoe/

No meu computador pessoal, o acesso a Internet é através de um link de rádio. A autenticação no provedor utiliza PPPoE. Para configurar a autenticação no Windows XP, basta usar o cliente PPPoE que vem por padrão. No Ubuntu também é muito simples, basta executar o comando pppoeconf, e seguir os passos de configuração. Na maioria das perguntas só precisei selecionar a opção default. Fora isso, são solicitados username e senha do provedor. Ao término da configuração, a interface PPP já está configurada, e é ativada automaticamente na inicialização.

Apesar de a configuração acima ter funcionado no Ubuntu, a conexão parava de funcionar com freqüência (a cada 20 ou 30 minutos, aproximadamente). Apesar de continuar aparecendo como ativa, eu não conseguia acessar nada. Quando isto ocorria, eu precisava executar o comando poff para encerrar a conexão e, em seguida, pon dsl-provider para restabelecê-la. A princípio, achei que fosse algum problema do provedor; porém, isso não ocorre no Windows XP.

Encontrei algumas referências a esse problema nos forums do Ubuntu, mas nenhuma solução definitiva. Para resolver, criei um script que verifica periodicamente se a conexão está ativa (na verdade, tenta pingar o site do provedor 3 vezes, aumentando o timeout a cada tentativa). Em caso negativo, executa os comandos poff e pon, conforme descrito acima, e repete o procedimento. Segue o script abaixo (salvei-o como /home/guilherme/scripts/internet.sh):

#!/bin/bash

cmd_ping="/bin/ping"
cmd_pon="/usr/bin/pon"
cmd_poff="/usr/bin/poff"
provider="dsl-provider"
host="www.radlink.com.br"
frequency="10s"
verbose=0

while [ true ]
do
    ok=0
    for timeout in 1 2 3
    do
        `$cmd_ping -q -c 1 -W $timeout $host > /dev/null 2>&1`
        if [ $? -eq 0 ]
        then
            ok=1
            break
        fi
    done

    if [ $ok -eq 1 ]
    then
        sleep $frequency
        continue
    fi

    `$cmd_poff $provider > /dev/null 2>&1`
    `$cmd_pon $provider > /dev/null 2>&1`
    if [ $? -ne 0 ]
    then
        $verbose && echo "Erro na conexão com o provedor"
        exit 1
    fi

    sleep $frequency
done

exit 0

Os parâmetros no início do script definem os paths para os comandos utilizados (ping, pon e poff), o nome do provedor, conforme foi especificado no comando pppoeconf (o default é dsl-provider), o host que será pingado e a freqüência de execução do loop.

Para completar, coloquei este script na inicialização. Primeiro é necessário criar um script shell e salvá-lo no diretório /etc/init.d (usei este artigo como modelo):

#! /bin/sh

PATH=/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin
DAEMON=/home/guilherme/scripts/internet.sh
PIDFILE=/home/guilherme/scripts/internet.pid
NAME=internetd
DESC="Internet"

test -f $DAEMON || exit 0

set -e

. /lib/lsb/init-functions

case "$1" in
  start)
    log_begin_msg "Starting $DESC: $NAME"
    start-stop-daemon --start --quiet --background -m --pidfile "$PIDFILE" --exec $DAEMON
    log_end_msg $?
    ;;
  stop)
    log_begin_msg "Stopping $DESC: $NAME"
    start-stop-daemon --stop --quiet --pidfile $PIDFILE
    rm -f $PIDFILE
    log_end_msg $?
    ;;

  restart|force-reload)
    log_begin_msg "Restarting $DESC: $NAME"
    if start-stop-daemon --stop --quiet --pidfile $PIDFILE; then
        start-stop-daemon --start --quiet --background -m --pidfile "$PIDFILE" --exec $DAEMON
    fi
    log_end_msg $?
    ;;
  status)
    echo -n "Status of $DESC: "
    if [ ! -r "$PIDFILE" ]; then
        echo "$NAME is not running."
        exit 3
    fi
    if read pid < "$PIDFILE" && ps -p "$pid" > /dev/null 2>&1; then
        echo "$NAME is running."
        exit 0
    else
        echo "$NAME is not running but $PIDFILE exists."
        exit 1
    fi
    ;;
  *)
    N=/etc/init.d/${0##*/}
    echo "Usage: $N {start|stop|restart|force-reload|status}" >&2
    exit 1
    ;;
esac

exit 0

Em seguida, dê permissão de execução ao script (salvei o arquivo com o nome internetd):

sudo chmod +x /etc/init.d/internetd

Finalmente, para colocar o script na inicialização, o comando é:

sudo /usr/sbin/update-rc.d -f internetd defaults

Caso seja necessário interromper ou reiniciar o script, use o comando sudo /etc/init.d/internetd start/stop/restart.

Depois que atualizei o Ubuntu para 8.04 não tive mais esse problema, porém no Ubuntu 7.10 acontecia constantemente. Além disso, este procedimento só é necessário caso o seu ponto de Internet esteja conectado diretamente ao micro, o que era o meu caso na época. Como posteriormente comprei um roteador com Wi-Fi, todo esse procedimento tornou-se desnecessário, pois o próprio roteador passou a fazer a autenticação PPPoE. Para desfazer as configurações, primeiramente retire o script do init.d com o comando:

sudo /usr/sbin/update-rc.d -f internetd remove

Em seguida, remova a interface PPP que foi criada pelo pppoeconf editando o arquivo /etc/network/interfaces e removendo ou comentando as linhas correspondentes a essa interface. No meu caso, as linhas eram as seguintes:

auto dsl-provider
iface dsl-provider inet ppp
pre-up /sbin/ifconfig eth0 up # line maintained by pppoeconf
provider dsl-provider

UPDATE: os scripts acima estão disponíveis no GitHub.


@guilhermgarnier

Erro: o Twitter não respondeu. Por favor, aguarde alguns minutos e atualize esta página.

Estatísticas

  • 58,442 hits
Linux Counter