Prism - A resposta da Mozilla para o Adobe AIR

Mozilla Prism

Como eu já disse por aqui, o futuro da web está na integração entre a web e o desktop. Não faz muito tempo, a Adobe oficialmente lançou seu projeto AIR, que possibilita aos desenvolvedores criar aplicativos para desktop usando tecnologias típicas da web: HTML, CSS, Javascript, Adobe Flash, Flex e Actionscript. O problema com esta idéia, é que todas as aplicações que você adora continuam na web: Google Docs, Orkut, Facebook, Twitter, Wordpress. Bom, ficavam. Apresento-lhes o Mozilla Prism.

Pra ser totalmente honesto, o título deste post é meio enganatório. Embora o Prism, como o AIR, traga aplicativos com as tecnologias da web para o desktop, ele não produz aplicações reais instaladas na sua máquina que podem rodar off-line, como o AIR. A proposta na verdade é bem mais simples: o Prism “instala” um atalho em seu desktop para um serviço qualquer na internet. Acessando este atalho, o Prism abre o serviço em uma janela sem barras de ferramentas, barra de endereço e controles de browser, deixando todo o fluxo da navegação nas mãos do serviço/aplicativo online. Na screenshot acima, estou rodando o Google Docs direto de um atalho no meu computador. Agora o “pacote office” do google está no meu Menu Iniciar, com o devido respeito que uma verdadeira aplicação merece. Apesar de parecer muito simples, eu garanto que a experiência é bem diferente de rodar este tipo de serviço no browser. Mas isso é só o topo do iceberg. O futuro da integração web-desktop vai muito além: o Firefox 3 promete revolucionar o modo como os usuários usam seu computador enquanto interagem com a grande rede. Como? Fica para o próximo post :)
Comment feed 2 comments

[css] clearing floats

Um problema muito comum em layouts usando a propriedade
float
é quando o “container” não se estica para acomodar as floats. Há muitas maneiras de se resolver isso, mas a maioria inclui código adicional no html, geralmente uma
div
com
clear:both
ao fim do container. Mas todos nós sabemos que bagunçar o html com tags inúteis deixa a tia Semântica muito chateada. Assim, a minha solução preferida, bolada por Tony Aslett (fundador do site csscreator.com) consiste em adicionar um conteúdo “virtual” ao final do container usando no seletor a pseudo-classe
:after
, e aplicar o
clear:both
nele, mais algumas linhas para esconder este conteúdo, e impedir que este ocupe espaço no layout. Segue o código:
.clearfix:after {
  content: ".";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}
No trecho de css acima, estamos adicionando um ponto (
content:”.”
) no final do container identificado pela classe
clearfix
, setando sua propriedade
clear:both
e escondendo-o do layout. Funciona em qualquer browser…bom, menos no nosso querido IEca. Você não achou que ia ser fácil assim, não é? Mas com mais algumas linhas, resolvemos o problema:
/* fix para o IE7 */
*+html .clearfix {
  min-height: 1%;
}

/* fix para o  IE6 */
* html .clearfix {
  height: 1%;
  overflow: visible;
}

/* fix para o resto do mundo */
.clearfix:after {
  content: ".";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}
E é isso. Não tenha medo das floats, elas são suas amigas :)
Comment feed No comments yet

Songerize

Songerize Por muito tempo eu tenho ouvido música pelo Youtube. Era um serviço simples e direto, e era a primeira coisa que vinha na minha cabeça quando eu pensava em procurar por algum tipo de mídia audiovisual na internet. Bom, era. O site songerize.com é um projeto do SeeqPod, e segue a estrategia do Google, que eu chamo de KISS: Keep It Simple, Stupid. Funciona assim: você digita o nome de uma banda ou artista, o nome de uma música e clica em Play. Simples assim.
Comment feed 1 comment

Kafka Wordpress Theme

Kafka Wordpress Theme English Kafka is a 2 columns, “full-widgetized” Wordpress theme, developed for this blog and made public under a Creative Commons license. Named after the czech writer Franz Kafka. Feel free to use and modify it for both commercial and personal purposes, provided that credit is given. Português Kafka é um tema para Wordpress de duas colunas, com suporte completo à widgets, desenvolvido para este blog e disponível sob a licença Creative Commons. Batizado em homenagem ao escritor tcheco Franz Kafka. Sinta-se livre para usar e modificar para uso comercial e pessoal, desde que sejam mantidos os créditos. Download Kafka 0.6
Comment feed 2 comments