O Hot Clube de Portugal ardeu. Que vamos fazer?

Como muitos de vocês já saberão (aos outros peço desculpa por ser portador de más notícias), o edifício na Praça da Alegria onde se situava o Hot Clube de Portugal sofreu um grave incêndio hoje de madrugada e, segundo fontes oficiais (Junta de Freguesia, citada pelo Público), dificilmente o prédio poderá vir a ter condições para voltar a albergar o HCP.
Depois do seu 60º aniversário, esta era uma das piores coisas que podia acontecer ao HCP e afecta todos os melómanos e músicos portugueses, em particular os que se sentem próximos do Jazz.
Não faço ideia se e como se organizará um movimento cívico capaz de dar o apoio necessário ao HCP para que planifique e concretize um renascimento depois desta tragédia.
Peço a todos que estejam atentos e que partilhem, dentro do possível, todas as iniciativas de que tiverem conhecimento, para que possamos garantir o máximo apoio e solidariedade.

(mensagem que enviei hoje a vários colegas da Jazz.pt, com conhecimento ao Hot Clube de Portugal)

Dê Sangue! Seja herói por uma vida.

Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue.Sem sugestões e tendo recebido esta semana o Cartão Nacional de Dador de Sangue, pouco tempo depois da primeira dádiva, (e há gente que espera anos!) pareceu-me apropriado mudar o selo do canto direito para um apelo à dádiva de sangue, com link para o Instituto Português de Sangue. A imagem é duma das campanhas recentes (espero que ninguém se incomode com a utilização) e, para quem quiser associar-se, basta seguir um das instruções simples:

Versão 1:

selo fixo no canto superior direito da janela do browser, funciona em browsers modernos e inteligentes (exclui IE 5 e 6)
copiar e colar a seguir a <body>

<div id="selo" style="position:fixed; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.ipsangue.org/" target="_blank" title="Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_ipsangue.gif"
width="100" height="100" border="0" alt="
Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue" /></a>
</div>

Versão 2:

selo fixo no canto superior direito da página (desaparece com o scroll), funciona em todos os browsers modernos e mesmo nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>

<div id="selo" style="position:absolute; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.ipsangue.org/" target="_blank" title="
Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_ipsangue.gif"
width="100" height="100" border="0" alt="
Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue" /></a>
</div>

Versão 3 (a que está em uso neste site):

selo fixo no canto superior da janela do browsers modernos e inteligentes e no canto superior da página nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>

<style type=”text/css”>
body>div.selo {position: fixed;}
div.selo{
margin: 0 -100px -100px -100px;
text-align: right;
position: absolute;
top: 0px;
left: 100%;
width: 100px;
right: 100px;
z-index:1000;
}
</style>
<div class="selo">
<a href="http://www.ipsangue.org/" target="_blank" title="
Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_ipsangue.gif"
width="100" height="100" border="0" alt="
Dê Sangue! Seja herói por uma vida. Participe nas campanhas do Instituto Português do Sangue" /></a>
</div>

Aceitam-se correcções e sugestões. O selo anterior, de apoio à Associação Portuguesa de Deficientes, continua disponível e pode ser usado, como indicado aqui.

Ser solidário, ano II: aceitam-se sugestões

Este blog apoia a Associação Portuguesa de DeficientesHá quase um ano que este blog ostenta no canto superior direito um “selo” de apoio à Associação Portuguesa de Deficientes. A ideia surgiu dum dos membros da direcção da Associação, que precisava de apoio técnico para o colocar no seu próprio blog, e foi com prazer que ao resolver o problema dele, marquei também o meu próprio site. Entre um canto destes e um banner de suporte a causas mais globais ou afirmações humorísticas de independência (estou a pensar na piaçaba, sim), pareceu-me adequado tomar esta posição. E continua a parecer mas, passado um ano, estava a considerar a hipótese de começar a ter alguma rotação no “selo”, destacando por períodos, associações, causas ou organizações que possam ter interesse num modesto contributo para a sua visibilidade online. Não sei que resultado teve este selo para a APD, mas o selo, além de ficar disponível no meu site, pode ser usado por outros, já que partilho o código (sem erros, desta vez) e crio e alojo a imagem necessária.

Mas gostava de, em vez de usar apenas os meus critérios subjectivos, poder contar com sugestões dos leitores. Pode ser?

Estou mais virado para causas e operações locais (think global, act local), de dimensões pequenas e médias, a quem possa interessar este tipo de visibilidade online. Usarei os meus critérios e quadro de valores como filtro, mas todas as sugestões serão bem recebidas.

O selo da APD e o código continuarão sempre disponíveis, aqui.

Ser solidário (update)

Os utilizadores de Internet Explorer 5 e 6 terão reparado que o “selo” que pus no blog não funcionava como era suposto. Ou melhor, o IE não é capaz de ler correctamente os estilos CSS usados para fazer esse efeito. E, mais uma vez, obriga a um “work-around” que só serve para complicar.

Assim, o selo fica com várias versões possíveis, todas elas com código válido, mas com comportamento diferente de acordo com os browsers usados:

Versão 1:

selo fixo no canto superior direito da janela do browser, funciona em browsers modernos e inteligentes (exclui IE 5 e 6)
copiar e colar a seguir a <body>

<div id="selo" style="position:fixed; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>

Versão 2:

selo fixo no canto superior direito da página (desaparece com o scroll), funciona em todos os browsers modernos e mesmo nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>

<div id="selo" style="position:absolute; left:100%; top:0px;
height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>

Versão 3 (a que está em uso neste site):

selo fixo no canto superior da janela do browsers modernos e inteligentes e no canto superior da página nos pouco inteligentes (inclui IE 5 e 6)
copiar e colar a seguir a <body>

<style type=”text/css”>
body>div.selo {position: fixed;}
div.selo{
margin: 0 -100px -100px -100px;
text-align: right;
position: absolute;
top: 0px;
left: 100%;
width: 100px;
right: 100px;
z-index:1000;
}
</style>
<div class="selo">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>

Claro que os experts de CSS me dirão que há outras formas de resolver isto e que até há formas que servem para ter um comportamento uniforme em todas as plataformas, mas como não gosto de arriscar demasiado ficar com CSS inválido e acho que deve haver um mínimo de proporcionalidade entre o tempo que se perde e o ganho que se tem, fico-me por esta solução.

Depois de mais um bocado de volta destas trapalhadas do comportamento do CSS em IE, até dá vontade de sugerir que se usem estes selos colocando apenas a imagem num sítio do site ou blog como o topo da barra lateral ou assim. Essa solução, tão simples, passa apenas por colar no sítio onde se quer a imagem esta linhazita de código:

<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia
a Associação Portuguesa de Deficientes"><img
src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif"
width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>

Ser solidário

Este blog apoia a Associação Portuguesa de Deficientes Um amigo pediu-me uma ajuda para poder pôr no blog dele uma espécie de selo a afirmar o seu apoio à Associação Portuguesa de Deficientes.

É sempre bom saber que algumas das minhas habilidades podem ser úteis.

O “selo”, cá está, disponível para ele e para quem mais o quiser usar.

Para usarem o selo no canto superior direito dos vossos blogs ou sites (como tenho no meu, agora), só precisam de adicionar este bocado de código aos vossos sites/templates:

<div id="selo" style="position:fixed; left:100%; top:0px; height:100px; width:100px; margin:0 -100px -100px -100px; z-index:10000;">
<a href="http://www.apd.org.pt/" target="_blank" title="Este blog apoia a Associação Portuguesa de Deficientes">
<img src="http://joaomartins.entropiadesign.org/wp-content/uploads/selos/apoio_apd.gif" width="100" height="100" border="0" alt="Este blog apoia a Associação Portuguesa de Deficientes" /></a>
</div>

A ideia e o código (pouco original, simples, acessível e standard) pode ser reciclada para outras entidades e causas.
Se tiverem sugestões ou precisarem de apoio para implementar variações, a caixa de comentários está aqui para isso.

Uma variação óbvia é usar position:absolute; em vez de position:relative; e assim o “selo” fica preso no topo do site em vez de ficar preso no canto da janela do browser. Com essa variação, o código tem que ser colocado no início da página, a seguir a <body>.