Homembit e Seu Novo Blog

Homembit parece nome de super-herói.

Apesar de isso só existir em quadrinhos, há um Homembit circulando entre nós e seus atos tem sido bastante heróicos ultimamente.

Estamos falando de Jomar Silva, diretor da ODF Alliance Brasil, pessoa com quem tive o prazer de trabalhar em diversas frentes, principalmente na saga da definição do voto do Brasil/ABNT no caso OpenXML.

Ele acabou de migrar seus pensamento para algo que finalmente podemos chamar de blog. Como de costume, seu feed está exposto na minha barra lateral e sugiro assinarem.

Se vocês achavam que o meu blog era fonte para as últimas novidades de ODF e padrões, esperem só até ver o dele. Um dos posts mais chocantes ainda está na primeira página, sobre o real compromisso da Microsoft com o OpenXML.

BlogPlex IBM

Tenho lido os bloggers da IBM todos agregados em um BlogPlex. Tem um time fera ali:

  • Cezar Taurion. Analisando com insights refrescantes simplesmente tudo o que acontece em TI. Open Source, Second Life, Web 2.0, Grid, Mobilidade, ODF.
  • Mario Costa. Web 2.0, colaboração e ferramentas, ODF.
  • Carlos Sena. Web 2.0, colaboração, ferramentas para gerir portais e dicas muito interessantes.
  • Edson Oliveira. Ferramentas Lotus.
  • Avi Alkalay. Eu pego carona na sabedoria deles e falo de mais de tudo um pouco. A facção TI do meu blog é agregada no BlogPlex.

Não deixem de conferir.

Please Encrypt Your BitTorrent Client !

Some evil ISPs implement traffic shaping to specifically limit BitTorrent bandwidth. This brings slower downloads to you and your peer.

All modern BitTorrent clients have encryption capabilities but most of them came disabled by default.

Please configure your client to encrypt connections. You will have faster downloads even if your ISP does not limit your traffic, but because your peer’s ISP does that.

By the way, today I started to use the ultimate BitTorrent client for Linux, BSD and UNIX: rTorrent. It is text and console-based, superlight, superfast, runs very well in my K7/192MB machine, accessible from anywhere through SSH and a screen window.

To install it:

Debian: bash$ sudo apt-get install rtorrent
Fedora/Red Hat: bash$ sudo yum -y install rtorrent

To enable encription I added this line to ~/.rtorrent.rc:

encryption=allow_incoming,try_outgoing,enable_retry

NO Gimp, YES Picasa

While all Linux blogs are talking about new Gimp 2.4, I’m very happy with Picasa.

Yes, I know they have different purposes but Picasa does everything I need with my photos. It is intuitive, powerful, extremely easy to use, fast and nice.

You may say F-Spot is the OSS equivalent but I couldn’t spend more than 15 minutes using it before giving up.

Thanks to Picasa, my last trip photos are really shining, much more than previous Kuickshow+Gimp combination of tools, much faster too.

And did I mention they also provide a Linux version for Picasa ?

Mais sobre Netiqueta

Aquela amiga das mensagens relatadas no outro post me respondeu.

Se desculpou, justificou que é novata e que só encaminha as que acha realmente interessantes. Perguntou também se eu gostaria de continuar recebendo. Ela é muito educada.

Respondi isso:

Oi Selma !

Não causou problema nenhum.

Mas é que como só recebo esse tipo de mensagens de você, perco os parâmetros sobre como avaliar a importância do que você me manda.

Como existe a tal etiqueta no mundo físico, existe a Netiqueta na Internet. Acredito que você não ia gostar de receber na sua casa 80 cartas físicas por dia de textos genéricos julgados lindos ou inteligentes, etc. Te daria trabalho em separar isso da correspondência importante. Então não justifica lotar a caixa postal das pessoas só porque é mais fácil enviar eletronicamente do que pelo antigo correio.

Gostaria de continuar recebendo de você e-mails que você mesma escreve. Comunicação pessoal, não mais generalidades do mundo alheio.

Beijos grande !
Avi

Acho que agora ficou tudo entendido.

Second Life e Orkut

Tenho ouvido algumas pessoas que acho bem pragmáticas desistirem do Second Life.

Eu também desisti. É ruim de usar, nunca tem ninguém e o mais importante: não consigo voar direito. De que adianta um mundo 3D se não consigo levitar como nos meus melhores sonhos ?

A revista Wired publicou uma matéria de capa dizendo que o SL estava às moscas.

O primeiro mundo 3D que ouvi falar foi o There.com. Talvez tenha mais gente lá.

O desafios desses mundos 3D é conseguirem fazer as pessoas desejarem entrar lá. O que você faria no Orkut se todos os seus conhecidos não estivessem lá? Também não entraria. Só vai dar certo quando alguém descobrir a fórmula do Orkut.

Falando em Orkut, para mim ele é o primeiro mundo virtual bem sucedido. Todos os elementos dos mundos 3D estão lá, menos o fator 3D. O Orkut é um software cujo algoritmo imita uma festa. Pense nisso.

É bom lembrar que quando um mundo 3D bombar como o Orkut, vai também ter os mesmo problemas dele: spam, questões técnicas de escalabilidade, ausência de fronteiras para línguas, etc. Este último pode ser visto como algo bom, mas foi exatamente isso que fez o Orkut estacionar em outros países assim que o Brasil o invadiu.

Como tecnologia, os PCs ainda não estão prontos para 3D. Ainda são lentos e teclado e mouse são excessivamente 2D para esses mundos. Quando um mouse 3D, óculos estereográfico e placas de vídeo muito poderosas estiverem presentes em todos os desktops, esses mundos 3D vão bombar e eu vou poder finalmente voar.

Mas por enquanto eu prefiro ser realista.

Caça à Pirataria?

O Rui e o Andre me fizeram voltar no tempo.

Eu lembro exatamente o dia que fecharam o Napster, na época o único serviço P2P que prestava.

Eu mandei as pessoas lembrarem daquela data como sendo o dia que a indústria fonográfica perdeu a guerra contra as redes P2P. Sim, porque a partir dali as pessoas iriam achar outras formas mais eficientes e não-derrubáveis de compartilhar conteúdo. De fato surgiu a rede Gnutella, o Kazaa e o incorrigível BitTorrent.

E para quem achar esses métodos de download muito complexos, há ainda hordas de amantes de música que simplesmente disponibilizam links de RapidShare em seus blogs contendo álbuns completos.

Mas minha previsão se esqueceu de um pequeno detalhe: o fechamento do Napster marcou também o fim da guerra para a indústria do cinema e TV.

Cara indústria de distribuição de conteúdo (Warner, Sony, EMI, etc), a Internet transferiu o poder para as pessoas. Conforme havia profetizado Doc Searls em seu Mundo de Pontas.

Flash Player now supports advanced MPEG-4 content

Adobe’s press release says it all: lab version of o Flash Player 9.0 supports latest and best multimedia technologies.

Thanks to YouTube and other online video services, the Adobe Flash Player browser plug in is probably the most popular video player in the world. But before this version, only the proprietary and now inefficient FLV format was supported.

Tinic Uro, a multimedia software engineer at Adobe explains that the Player now supports:

  • H.264/MPEG-4 AVC
    The best, most sofisticated and advanced video codec, capable of high quality, low bitrate video performances. H.264 is the standard for HD-TV, HD-DVD and BluRay. H.264 is better than MPEG-4 ASP/Xvid/DivX.
  • AAC and HE-AAC (a.k.a AAC SBR)
    The ISO successor of MP3, for audio. MP3 is already very good, extremely popular, and still supported by the MPEG-4 ISO standard and Flash Player. There is no practical advantage on AAC over MP3 for the music you load in your portable player, but HE-AAC achieves much better quality on very low bit rates (desired for streaming) than MP3.
  • MP4 file format
    The MP4 container was designed for many types of usages, including streaming over the Internet. An MP4 file can carry many video, audio, subtitle, scripting, VRML, XML and other metadata multiplexed and in parallel.

All this formats are parts of the ISO MPEG-4 standard.

This is a much expected update for the Flash Player and its users. Every new video on YouTube is being compressed with this technologies since June and the old ones will be converted over time.

We will see quality and speed improvements in multimedia content happening in the right way. Also, the formats of the video files people exchange will converge into a single one based on MPEG-4 standards: MP4 files containing higher-quality-for-megabyte H.264, AAC and subtitle streams.

This is also good news for the Linux and open community. A number of good MPEG-4 related authoring tools already exist and are maturing fast: x264 for video compression, FAAD/FAAC for audio, and GPAC and others for MP4.

Como promover a Netiqueta ?

Nós que já somos cidadão idosos da Internet conheçemos bem a Netiqueta. Mas sempre vão surgindo a mãe de um amigo, a sobrinha que cresceu ou o humanista que achava que a Internet era só para geeks etc que entram na rede e ficam somente a repassar piadinhas ou tralhas que recebem de sei-lá-quem.

Sobre o problema de todos os endereços, inclusive o meu, ficarem expostos na repassagem eu já nem esquento. O que mais me preocupa é que passo a desconsiderar e-mails dessas pessoas, e acabo perdendo contato digital com elas. Ai quando me convidam por e-mail para alguma festa, ou mandam uma mensagem realmente para mim, passa despercebido.

Eu sou meio cascagrossa e nas vezes que dava esse toque à pessoa, ela geralmente se ofendia e me mandava para aquele lugar. Então parei de dar o toque e tento conviver com isso.

Mas resolvi dar o toque novamente para uma amiga querida. Respondi isso:

Para: Selma
Assunto: Re: Fw: Re: Re: Re: “O AFOGAMENTO DE LULA…”{ABRA É ÓTIMA E NOVA}

Selma, eu reluto muito antes de dar essa dica para as pessoas, mas chegou a hora.

Como você espera que eu leia algum dia uma mensagem que você realmente precisa que eu leia, que a “Selma escreveu para o Avi” ?

Só recebo e-mails genéricos de você, que geralmente não tenho tempo de ler porque sei que são impessoais.

Não quero perder contato digital com você, mas por enquanto seus e-mails estão sendo tratados pelo meu sistema como “repassador generico, arquivar sem ler”.

Então a dica é: valorize suas mensagens, enviando para as pessoas somente o que for realmente pessoal entre você e elas.

Obrigado,
Avi

Lanço uma pergunta no ar: qual é a melhor forma de dar esse toque, sendo delicado e efetivo ?

Outra pergunta: como os sábios e idosos cidadãos da Internet lidam tecnicamente com isso? Regras de arquivamento automático no GMail? Filtros REGEX para /Re: Fw: Re:/ ?

Boas Vindas à Correia Fotorreceptora

E falando em amigos, favor dar as boas vindas ao André Uratsuka Manoel que acabou de ingressar na blogosfera.

Consta que ele teve uma estréia dupla hoje, porque além do blog saiu também no Link do Estadão, com foto e tudo, falando de pé para uns 50 ouvintes no BlogCamp que aconteceu semana passada em São Paulo. Na ocasião ele chamava a atenção dos representatnes da blogosfera brasileira sobre questões legais, de propriedade intelectual, e responsabilidade do dono do blog inclusive sobre a parte de comentários de terceiros em suas páginas. Dá até para me ver mais ou menos na foto também.

Voltando a rasgação de seda, pode-se dizer que o André é um dos grandes pilares da Internet brasileira. Cérebro por trás de cohecidas incursões na Internet de nomes como Bradesco, NET Virtua, zip.net, Agência Estado, iG e muitos outros, junto com a Insite, sua empresa.

Ele é um daqueles caras que em uma conversinha de 15 minutos vira sua semana pelo avesso. Principalmente se você estiver metido com tecnologia, porque quando você pensa que descobriu uma coisa nova e está sendo inovador, ele já voltou com a colheita.

Mas não só de Internet, Kernel, IPTables e mod_perl vive o André. É espetacular encontrá-lo para conversar de cultura, sociedade e livros, muitos livros. E pizza de margherita do Speranza.

Como então um dito filhote de Internet só começou a blogar agora? Talvez porque confundiram quem é pai de quem aqui e o verdadeiro pai estava é muito ocupado em criar o filho.

Então para esquentar a Correia Fotorreceptora vou fazer de novo: por falta de espaço vou retirar o feed do grande Cezar Taurion da minha barra lateral e colocar no lugar o do grande André.

Por favor, o caminho é por aqui.

Some SVG Games

I’ve been using SVG more as an offline drawing language and not much as a technology for the web. But I met a friend in a bloggers conference this weekend and he mentioned something obvious, but that I never looked for: an SVG Tetris game. Of course there are many other SVG games.

Check it out:

SVG is just the language to represent graphics and get input. Game logic is actually written in JavaScript.

Web developers are used to mix (X)HTML with JavaScript. Maybe it is time to start thinking about mixing SVG and JavaScript to see proprietary technologies as Flash or Silverlight to be less massively used. For that, better IDE tools for JS+SVG will be required and browsers and platforms must find a more standard way to render audio and video (a feature covered by Flash and SL, but not by SVG).

Viagem de Inovação aos EUA

Andei postando sobre algumas coisas que tenho visto aqui nos EUA, mas não contei o que de fato vim fazer aqui.

A IBM tem um grupo chamado International Technical Support Organization que produz livros técnicos chamados Red Books. Trata-se de livros gratuitos que podem ser lidos ou baixados do site do ITSO. Pode-se também comprar cópias impressas que geralmente damos para clientes. Os autores são voluntários do mundo todo, geralmente funcionários da IBM, mas também clientes, parceiros ou qualquer pessoa que se qualificar na entrevista feita para a chamada do livro na lista do ITSO. O livro é geralmente escrito em Austin, Texas (há também outras localidades) durante algumas semanas de imersão. Todas as despesas de viagem são pagas pela IBM, tem se a oportunidade de trabalhar com pessoas de diversas partes do mundo, e fazer mais turismo que só o superficial.

Alguns livros interessantes que o ITSO produziu:

Bem, vim participar de um livro menos técnico que a média do ITSO. Conta como a IBM criou um programa interno de inovação onde qualquer funcionário pode criar, divulgar e hospedar na Intranet algum software que aumente a produtividade dos funcionários. Qualquer coisa. Desde simples plugins para o Firefox, Lotus Sametime, uma ferramenta de blog corporativo interno, ferramenta de criação de wikis internos, uma aplicação para sincronizar mídia interna com dispositivos móveis, etc.

Dentro da IBM chamamos essas coisas de inovações e são tratadas como beta, para beta testers ou early adopters.

Ao longo do tempo elas vão amadurecendo, viram um serviço padrão da Intranet, e as vezes acabam até virando produtos que a IBM vende. Foi exatamente o caso do Lotus Connections, um produto para ser usado numa Intranet e que tem serviços como diretório de funcionários, departamentos e suas linhas gerencias, blogs, tagging tipo del.icio.us, entre outras coisas. O Lotus Connections reune exatamente o que funcionários da IBM andaram usando e refinando ao longo dos últimos anos, e posso dizer que é o que temos de mais útil na nossa Intranet.

O modelo desse programa de inovação livre é muito parecido com o universo Open Source. As tais “inovações” podem ser comparadas a um software GPL que alguém fez e publicou no Freshmeant.net, este comparável ao portal na Intranet que indexa todas as inovações, mede sua vitalidade, fornece notícias e links para acesso ou download.

Conversei com muitas pessoas que estão em altos cargos globais, entre eles a CIO global da IBM, e é interessante ver como pensam e as informações que tem acesso. As vezes pensamos que eles estão longe do mundo real mas surpreendentemente tem muito mais noção das coisas do que um gerente de nível mais baixo.

As pessoas que criaram esse processo de aceitação e publicação de inovações dentro da IBM tem a sensação que inventaram a roda porque é de fato muito bem sucedido e todos conhecem. Mas na verdade funciona igualzinho a comunidade Open Source. Há um quê de liberdade, de esforço por um bem maior, de comunidade. Copiaram sem saber que copiaram.

A grande inovação está mesmo no fato de que trouxeram a dinâmica da comunidade Open Source na Internet para dentro de uma empresa, para gerar valor de produtividade interna.

O livro conta mais detalhes. Aguardem a publicação.

Candidatos Democratas e o YouTube

Ontem aqui nos EUA passou na TV um debate dos pré-candidatos democratas (entre eles somente um será o candidato a presidência a representar os democratas).

Da perspectiva política já era um debate interessante, mas o que realmente chamava atenção era o formato.

O programa chamava-se CNN & YouTube. As pessoas gravavam e enviavam suas perguntas pelo YouTube e no programa o video era apresentado num telão. Junto havia o logotipo do famoso site e podia-se ver também aqueles controles tradicionais de Play, Pause, etc do videos do YouTube.

Alguns videos eram bem simples, com o cidadão fazendo uma pergunta em frente a câmera. Outros tocantes, como o do homem mostrando o túmulo de seu pai, avô e filho mais velho que morreram em guerras. E outros bem produzidos e editados, e engraçados.

As perguntas eram das mais variadas: saúde, impostos, guerras e a guerra com o Iraque, aquecimento global, e aquecimento global relacionadas ao alto padrão de consumo americano.

A indústria do entrenimento não se contenta mais em receber a ligação ao vivo e transmitir a voz do telefone. Buscou e encontrou um novo formato. No site da CNN há uma video-matéria entrevistando os fundadores do YouTube discutindo essa nova forma de debate, com cenas do debate em sí. Há muitos outros videos sobre o debate em CNN.com.

Eu achei muitíssimo interessante. Os pré-candidatos que se destacaram foram Barack Obama e Hillary Clinton. E se você visitar seus sites verá que ambos tem blogs e outros mecanismos a la Web 2.0 de interagir com seus clientes, digo, eleitores.

Viagem de Nerd

Não é de hoje que vos digo que o Google Maps é o melhor site da Internet (depois de um blog ou outro).

Pois bem, vou fazer uma longa viagem a trabalho para os EUA, com muitas cidades, muitos lugares para ir, vários hoteis, muitos aeroportos. E como todo bom nerd, estou posicionando todos esses pontos em um mapa pessoal.

meu mapa pessoal

Ainda mais nos EUA, que está inteiro semanticamente mapeado (na linguagem nerd: the country is entirelly geocoded). Assim posso traçar rotas e imprimir mapas personalizados e não mais quebrar a cabeça procurando os meus lugares em mapas genéricos.

Não vivo mais sem o Google Maps.

Ah, esses Agregadores

PlanetaEsses agregadores de feeds estão entre as coisas mais interessantes que aconteceram na blogosfera. Isso é a pura Web 2.0 em ação.

Coisa mais óbvia: juntar em um só lugar todo mundo que se interessa e escreve sobre mais ou menos o mesmo assunto.

O interessante começa no “mais ou menos”. Porque eu, fulano e sicrano não escrevemos só sobre tecnologia. Mas já que estamos aqui, por que não ler sobre outros assuntos que estão escrevendo pessoas com quem temos afinidades ?

Com a isca do “só vou ver o que mais vai ler quem for me ler” ou “só vou ver como meu post ficou no planeta” você foi fisgado pelo meme. E a informação flui, a consciência se amplia, e a qualidade dos leitores melhora.

Meu blog já está em 3 planetas técnicos. Mas quero mais, muito mais. Quero estar em agregadores não técnicos também. O resto do mundo precisa conhecer essa maravilha cybersociológica.

E tenho preparado os feeds do meu blog para isso: além das amadas tags/categorias por assunto, estou criando também tags operacionais, tipo lang:en para posts em inglês, geek:no para classificar coisas para mortais não técnicos, etc. E forneço o feed mais abrangente possível, de acordo com a audiência do planeta/agregador.

Matisse

Se você também está num desses agregadores, deve estar me lendo agora. Saiba que eu te leio também. E adoro. E comento no seu blog. Então comente no meu também. É legal. É giro (para os portugueses que me lêem).

Para os que que só lêem, tratem de criar um blog e entrar para a festa. É legal. É giro.

Microsoft Silverlight

When we think all standards, tools and frameworks for web on the client was already invented and now its time to spread its use, Microsoft comes with a “new” thing: Silverlight.

Silverlight logoSilverlight has same functionality of Adobe Flash. You install it on your desktop system and it works as a browser plugin. Silverlight leverages proprietary .NET, thus it is proprietary too.

When it says cross platform, read Windows and Mac only.

Development tools are Microsoft only.

My advise is to stay away from Microsoft Silverlight or any Mono reimplementation as Moonlight (as noted by Roberto Teixeira in comments). It will lock you in into proprietary technologies.

These are some alternatives (name in bold) for such an impressive interactive web functionality:

  • JavaFX [home] should be considered as a trully open standards alternative. Altough it is as new as Silverlight, JavaFX leverages all mature Java ecossystem.
  • SVG+JavaScript. A true and mature W3C standard for advanced 2D graphics presented as a XML dialect embedable in web pages. With the addition of DOM capabilities of well known JavaScript, SVG can have provide advanced animations. Drawbacks here are lack of user friendly graphical development and animation tools. SVG does not provide multimedia, but this type of content can be used leveraging the regular media player (and its browser plugins) the user has installed on its system.
  • Althought YouTube and other great online video services use Flash to deliver multimedia content, Flash is generally known as evil for web applications. But if you need such a fat client for web, Flash is more cross platform, cross browser and widely used than Silverlight.
  • Plain AJAX can also deliver high impact interactiveness. Its capabilities are similar to SVG above.

As happened with Real versus Microsoft media formats, and Java versus .NET, it is expected that when Silverlight gets more popular, the Flash plugin will be removed from default Windows installations (forcing users to explicitly install it), considered as non-strategic (or a competitor) for Microsoft.

500 Comentários !

Tinha previsto para o fim do ano chegar a 500 comentários no post de Aquecimento Global.

Essa marca foi alcançada hoje, 6 meses antes 😀 . A média é +/- 3.3 comentários por dia ou 22.8 por semana.

Pena que poucos realmente se salvam. Tinha apontado alguns engraçados, mas outros melhores ainda apareceram:

Pelo menos fico feliz em saber que estou contribuindo com vários trabalhos escolares.

The Web and the Internet :: A Web e a Internet

  • The Internet is the collection of cables, routers, protocols, servers, IT services and data you can access with a browser or some other networked application.
  • While the Web is a mesh of human relations where knowledge and experiences are being trade.
  • Web 2.0 is the Web that uses the Internet in a more optimized way.

  • A Internet é o emaranhado de cabos, servidores, roteadores, protocolos, dados e serviços de TI que se pode acessar com um browser ou outro programa de rede.
  • Já a Web é a malha de relações humanas onde se troca conhecimento e experiências.
  • A Web 2.0 é a Web que usa a Internet de forma mais otimizada.

Welcome Planet Fedora Readers

My blog feed was included in one more of these planet-like web sites.

Welcome Planet Fedora readers.

I was already being read by Pandemonium and Planeta GNU/Linux Brasil readers.

I guess 90% of high quality readers and comments I get come from these community planets. OK, I have some very popular posts with 470+ comments but they are terrible.

For new readers, I blog a lot about Linux, Open Standards, Open Source, ODF, business related to all this stuff together with SOA, Web 2.0, and all those buzwords. At work I was asked to start blogging, to keep a connection with the community. So I can say to blog is officialy part of my job.

I also enjoy writing about travels, food, metaphysics, music, politics, and this is the place I store my published articles and presentations I use to deliver in events. Most of that in portuguese, but many technical stuff are in english.

Welcome all.

SOA, Web Services, Virtualização, Grid, Web 2.0: Mashup gigante

SOA é um estilo de arquitetura que tenta alinhar melhor processos de negócio com a TI.

Apesar de os frabricantes de TI — como a IBM — serem os que mais falam sobre isso, ingressar em SOA significa primeiro modularizar seus processos de negócio para depois mapear isso aos módulos de aplicações e infra-estrutura.

Grid é um conceito meio obsoleto. Como conceito, mas não como tecnologia. O conceito é obsoleto porque sua atuação é extremamente estrutural e muito complexa. Toda a terminologia relacionada a Grid tem caráter técnico, difícil de explicar e de nada adianta uma empresa pensar em Grid se seus processos de negócio e aplicações que os implementam não estiverem modularizados.

Por isso inventaram SOA. Para que provedores de TI pudessem ter um discurso mais ameno e acessível ao vender a idéia para gestores em seus clientes. E também para atacar o problema do excesso de complexidade da TI do cliente em sua raiz: na modelagem de seus processos de negócio.

E Web Services, onde entra? Dividindo em camadas, o conceito de SOA mora na fronteira entre negócios e TI. Na hora em que os processos vão se materializar em software e aplicações, a boa prática sugere usarmos certos padrões de desenvolvimento, de integração entre módulos. Esses padrões foram agrupados juntos nas especificações de Web Services, e se preocupam em definir como se faz chamadas a serviços (métodos) remotos, como um serviço encontra outro, etc. Então, nessas camadas conceituais, Web Services encontra-se logo abaixo de SOA.

E Grid está logo abaixo de Web Services. Ocupa-se dos mesmos problemas e soluções, mas com abordagens mais operacionais. Grid nasceu em um ambiente científico e WS em um ambiente de aplicações de negócios. Reinventaram a roda um do outro diversas vezes. Mas nos últimos anos têm juntado esforços para limpar os overlaps a fim de produzir um único conjunto de métodos e boas práticas.

Tudo isso é Virtualização

Se a virtualização de hardware (Xen, VMWare, z/VM) divide um equipamento em vários pedacinhos, SOA, WS e Grid dividem a aplicação em vários pedacinhos funcionais.

A virtualização de software (SOA, etc.) é mais difícil de fazer. Mas é também muito mais poderosa que a de hardware. Traz benefícios mais consistentes, mais abrangentes (porque tiveram que arrumar a casa dos negócios antes) e de mais longo prazo.

Tudo isso tem a ver com a Web 2.0

Explicar Web 2.0 está fora do escopo agora, mas sua arquitetura tem muito a ver com SOA.

Ao invés de feeds, podcasts e APIs JavaScript da Web 2.0, SOA tem serviços, provedores de dados e de funcionalidades. Equivalente ao HTML, capaz de juntar funcionalidades e dados de diversos sites, SOA tem a Linguagem de Execução de Processo de Negócio (BPEL, que é XML) que define a ordem e dependências ao juntar Web Services para formar uma aplicação maior. O papel das tags e folksonomy da Web 2.0, é exercido pelo UDDI no contexto de Web Services.

Mashups da Web 2.0 (experimente o iGoogle) são as Aplicações Compostas do SOA (veja também na Wikipedia).

E o Enterprise Service Bus do SOA (também na Wikipedia) tem o Browser como seu equivalente na Web 2.0. Sim, porque ambos tem a missão de materializar as conexões lógicas definidas pelo DHTML ou BPEL.

Web 2.0 é a Arquitetura Orientada a Serviços global.

The Blog Icons

This is a collection of high quality vectorial icons to represent common ideas and actions of the blogosphere.

They were based on the SVG work from FeedIcons.com. The base button is the same, but mathematically simplified on the XML level. New buttons were added based on other popular icons found on the web or created by myself. Also some redesign was made for new shapes to make the icons look better when exported to smaller image sizes.

By the way, I am not a designer nor an artist. I just know how to use SVG-creation tools as Inkscape or make good XML. Or I just have a blog demanding for these icons. So I’m sure people can contribute better color mixings an outlines. Let me know and lets integrate your ideas into this project in the right way.

Please share alike this icons. They have a Creative Commons license. I appreciate if you can link to my blog when using them.

Icons for Feed and OPML

Feed IconThese icons where the base for this work, specially the feed icon as found in its website. They were probably created with proprietary tools such as Adobe Illustrator and then exported to open formats such as SVG or PNG. The original OPML icon can be found at opmlicons.com

OPML IconThe versions here are visually identical to the original ones, but mathematically simplified. They are now being maintained in an open format — SVG — here, and are a better option because of its open source code and formats, and distribution.

Icons for Trackback and Share

Trackback and Pingback IconThese icons can be found sometimes in the blogosphere. I don’t know who designed them but they are a good representation of the Trackback and Pingback ideas.

The Share icon is not my preferred but for now it is just a copy of what can be found around.

Share IconColors and shapes are identical and based on the feed icon button. I never saw these icons in a size bigger than 16×16 pixels. Now, in a scalable format, they can be rendered at any size you want.

Permalink IconThese are original creations and come in several options. I am still not sure which one is the best. You can also suggest other shapes.

As you can see, I am using this icon to identify that each section on this post has a permalink.

Other Icons

Comment Icon Edit Icon Cancel Icon Tag Icon Download Icon Clock Icon

Other original icons: Comments, Edit, Cancel, Tag, Download, Upload and Clock (to represent date and time). I’m open to suggestions for better shapes.

Challenges for Icon Sizes

The original design of these icons (from feedicons.com) looks wonderful on sizes bigger than 22 pixels, but most people will use them on small sizes as 16×16. So this package delivers also shape design that look better on small sizes as 22×22, 16×16, etc. I am using these sizes all around my blog as you can see.

Converting the SVG Files into Images

In the Blog Icons ZIP file you will find the XML:SVG source code for all icons. Additionally you will get all icons in PNG (preferred), GIF and JPG formats, in common sizes from 10×10 to 128×128 pixels. If you want a specific size, you can import the source SVG file in some graphical tool as Inkscape (on Linux), or CorelDraw, Adobe Illustrator, etc and export them into any format and size you want.

Or use the Makefile like this (on Linux you will need Inkscape and ImageMagick installed):

Make all default sizes of all icons, in PNG, GIF and JPG:

bash$ make all

Make Feed icon in GIF format, at 40×40 pixel size:

bash$ make SIZE=40 feed.gif

Make all icons, all formats at 40×40 pixel sizes:

bash$ make SIZE=40

O Efeito Online

Estou usando barba a uns 2 anos.

Mas nesse tempo todo não troquei minhas fotos online, tipo a do MSN Messenger, Orkut, etc. No cyberespaço estou sem barba.

Ai, reencontro pessoas que não me vêem a uns 6 meses (as últimas vezes que me viram ao vivo já estava com barba), mas me dizem que estou diferente, que deixei a barba crescer !!

Isso tem acontecido com muita freqüência.

Conclusão: inconscientemente, as pessoas esperam me enxergar ao vivo com a mesma fisionomia que me vêem online.

Como Criar um Website

Este guia é para você que é leigo em computadores, mas que precisa contratar alguém para fazer o site de sua empresa, restaurante, hotel, etc. Vai ajudá-lo a ter um site mais acessível, prático e funcional, usando padrões e técnicas novas e que os usuários gostam, e deixando de lado as técnicas não muito naturais da web, ou que não é de boa prática o seu uso.

Quando for comprar serviços para criar seu site, exija os seguintes pontos (os links levam para as explicações):

  1. Quero um site onde eu mesmo posso atualizar o conteúdo, como se fosse um blog.
  2. Onde hospedar o site, em que computadores ele vai rodar ?
  3. O site/blog não pode ser feito em Flash.
  4. O site/blog deve ser compatível com qualquer browser em qualquer plataforma, principalmente Firefox, Internet Explorer, Safari e Opera.
  5. Não é necessário ter uma animação de abertura.
  6. Não pode haver popups nem frames, deve ser de fácil navegação e usar permalinks semânticos.
  7. O site/blog deve conter informações objetivas e precisas.
  8. O site/blog deve usar tecnologias abertas e não-proprietárias.

Seguem os detalhes de cada ponto…

Não se chama mais site, agora é blog

Blogs estão na moda, então entre na moda.

Não é a toa. Se você disser “entre no blog do meu restaurante” ao invés de “site”, as pessoas sabem que estarão mais próximas de quem criou a informação ali, e não só da informação em sí. Na cabeça das pessoas, um site raramente é atualizado, mas um blog sempre tem novidades. O já conhecido formato de blog sugere que os visitantes poderão interagir, comentar.

Não conte para ninguém, mas site e blog são praticamente a mesma coisa, mas optando pelo formato de blog abre um leque de opções do uso de ferramentas já prontas para facilmente gerenciar seu conteúdo. Isso significa que seu site (ou blog) ficará pronto mais rápido (instantaneamente, na verdade), com mais funcionalidades, nasce bonito, e organizado de um jeito já familiar para as pessoas, além de ser interativo.

Outra vantagem de um blog é que você mesmo vai poder configurar e atualizá-lo tão facilmente quanto escreve um e-mail.

O visual de um sistema de blog como o WordPress é definido pelo tema usado. A idéia de temas pode ser comparada a uma roupa que se veste: troque de roupa e mude seu visual sem tocar no conteúdo, da mesma forma que troca-se o tema de seu blog sem interferir no conteúdo textual etc.

Há uma infinidade de temas gratuitos genéricos prontos na web, mas para uma empresa, estabelecimento, etc o ideal é contratar um webdesigner para criar (ou adaptar) um tema específico, com o seu logotipo e a sua cara. O trabalho técnico para executar esse trabalho dura aproximadamente 1 semana, e no caso do WordPress.org, o webdesigner deve ter conhecimento de PHP, além dos básicos XHTML e JavaScript (não precisa lembrar esses nomes, só garanta que seu webdesigner conhece tais tecnologias).

Em que computadores seu site vai rodar, onde hospedar ?

O custo mensal para se ter um blog/site é baxíssimo. No Brasil pode-se contratar excelentes provedores de espaço como a Insite por aproximadamente R$16 por mês. Já incluso todas as ferramentas necessárias para criar o blog, como o WordPress.org.

DreamHost bannerO provedor que escolhi para este meu site é o DreamHost que fica nos EUA. Por uns R$70 por ano eles me dão 230GB de espaço, mais banda praticamente ilimitada e um ótimo serviço. Alí pode-se rodar um blog WordPress.org, ou outros softwares que facilitarão a sua vida para gerenciar o conteúdo, seja textos, fotos, multimídia, etc: Drupal, Joomla, Gallery etc.

Seu site vai morar em computadores que rodam Linux (por oferecer maior segurança e estabilidade) e seus usuários Linux, Windows, Mac ou qualquer outro poderão navegar nele sem problema.

Evite Flash

Flash é a tecnologia que permite animações bonitinhas em sites da web, mas que começou a ser impropriamente usada para fins mais centrais de alguns sites, até o ponto enlouquecido de o site inteiro ser feito em Flash.

É ruim para seus visitantes: Flash é uma tecnologia proprietária, e nem todos os seus visitantes vão tê-lo instalado. E os que tiverem talvez o terão numa versão antiga (você lembra de ter atualizado seu Flash alguma vez?). Visitantes que usam Linux por exemplo — 20% da web aproximadamente — em geral não tem. Não exclua seus usuários.

É ruim para seu blog: Há uma ciência oculta na web chamada Search Engine Optimization (ou Otimização Para Sistemas de Busca), em que profissionais especializados conseguem fazer um site aparecer no topo da pesquisa por palavras em sites como o Google, Yahoo, MSN Search, etc. Bem, qualquer palavra ou link (isso inclui menus que levam ao texto) contidas em arquivos Flash serão invisíveis ao Google, fazendo seu blog praticamente desaparecer em resultados de busca. Os potenciais clientes que usam o Google e companhia para procurar coisas que você vende também desaparecerão.

Use Flash somente em coisas marginais e mesmo assim em elementos que não interferem na informação que seu site/blog provê.

Existem outros browsers

Lembre-se que o browser que você e seu produtor de site usam pode não ser o mesmo de todos os seus visitantes. O Firefox já usado por uns 30% da web. Para acertar neste ponto, garanta que seu blog é bem visto no Firefox, Safari (popular no Mac), Opera (popular em celulares) e Internet Explorer.

A Internet não é um panfleto de propaganda

Uma das coisas mais inúteis e irritantes de muitos sites é a tal da apresentação inicial, geralmente feita em Flash. Claro que há o link para “pular a animação” mas se este também estiver embutido no Flash pode dizer adeus a alguns visitantes: o resto de seu site é inacessível e contribui para a tal exclusão digital.

Um panfleto é recebido na rua de forma passiva, e a capa deve ser atraente para que o usuário queira abrir e ver o resto. Na Internet é diferente. Dificilmente alguém vai “cair” no seu site por acaso. As pessoas ativamente te clicaram porque acreditam que você tem a informação que elas precisam. Não as aborreça com essas apresentações iniciais. Em suma, isso só serve para duas coisas: dar uma desculpa ao webmaster que você contratou para te mostrar seus conhecimentos em operar o programa que cria aquilo, e gastar seu dinheiro pelas horas de trabalho cobradas.

Use melhor as horas pagas ao seu web-designer e peça para ele criar um site/blog semântico, que os mecanismos são capazes de ler.

Morte aos Popups

Sobre as tais janelas saltitantes que surgem quando clicamos em links de sites mal feitos, saiba que browsers modernos corretamente as bloqueiam. Se você as vê na hora que está testando seu site pela primeira vez, provavelmente foi porque o browser foi explicitamente configurado para deixá-las saltar. Em geral seus usuários não as verão.

Os popups tem outro sério problema: em sites mal feitos, certas informações preciosas só podem ser encontradas dentro de popups, e como essas janelinhas estão fora do fluxo de navegação normal (como Flash) essas informações também serão invisíveis ao Google e companhia, e não aparecerão nos resultados de busca.

Estabeleça a idéia de que todo pedaço de informação em seu site deve poder ser acessível diretamente por links externos (também conhecidos por “permalinks“), e não só navegando via a página principal.

Seus clientes querem te ligar

Você ficará surpreso em saber quantas pessoas tem preguiça de ler ou gastar 5 minutos (ou mais, se o site for desestruturado) navegando em seu blog para encontrar o que procuram.

Para aproximá-las de você, deixe seu telefone com código de área visível em todas as páginas, por exemplo no final de cada uma. Só e-mail não basta. Muito menos formulário para entrar em contato. Lembre-se: de qualquer forma, antes da Internet o único jeito de contactarem seu estabelecimento era por telefone.

Se o seu estabelecimento for um serviço, restaurante, hotel, loja, vai perceber que a maioria liga para saber onde fica, preços, se está lotado, o que há no cardápio, etc. Quando as perguntas freqüentes ficaram óbvias, trate de criar páginas com respostas claras no seu site, mapas interativos como o abaixo, etc.

map
map
Restaurante Maha Mantra
map
Cantina do Mello

Evite tecnologias proprietárias

Use padrões abertos. Eles estão disponíveis, são mais baratos, e te dão mais flexibilidade que as tecnologias proprietárias.

Não é exatamente o webdesigner quem deve escolher as tecnologias usadas em seu site. Ele vai te sugerir as que ele conhece, mas não necessariamente são as melhores para você.

Um site/blog desenvolvido com tecnologias proprietárias te forçará a ter que pagar por elas pelo resto da vida de seu site. E saiba que a cultura da Internet criou diversas tecnologias abertas, muitas vezes melhores, muitas vezes gratuitas, que te dão escolha, poder de negociação, etc.

Veja uma comparação:

Tecnologias Proprietárias (evite) Tecnologias Abertas (prefira)
Flash DHTML, Ajax, XHTML+JavaScript
ASP, ASP.NET JSP, PHP
.NET, C#, Cold Fusion, Delphi etc Java, Java Enterprise ou J2EE
Windows ou qualquer outro sistema operacional Linux
Mídia em formatos WMA, WMV e Real Mídia em formatos MP3, AAC, MPEG e Xvid (ou DivX)

Outros detalhes

  • Seu site ou blog deve usar a codificação UTF-8 ou Unicode. Esta técnica é a garantia de que acentos vão aparecer corretamente em qualquer browser e sistema operacional.
  • Evite também frames. Eles nasceram a partir de um erro de projeto, são considerados obsoletos, tem problemas similares aos popups e Flash, violam padrões, e seus criadores se arrependeram de te-los criado.

Mapas Personalizados no Google Maps

Confira o novo Google Maps, que já era na minha opinião o serviço mais prático e legal da Internet.

A partir de hoje (não lembro de ter visto isso ontem) pode-se criar mapas personalizados com marcadores coloridos e balões com informações formatadas, como este mapa com legendas de Paraty e região.

Além do mais, pode-se exportar essas informações para um arquivo KML, importável no Google Earth. Mas como KML é um idioma XML aberto, pode-se usa-lo como meta informações geográficas em quaisquer outras aplicações. A imaginação do desenvolvedor de aplicações é o limite. Discretamente, KML irá se tornar um padrão aberto e universal para descrever metainformações em mapas.

Havia desenvolvido um plugin para WordPress (ou qualquer outro sistema de blog, ou página simples) para embarcar mapas interativos dentro de posts, capaz de incrementar posts como este (na verdade, a maioria de meus posts sobre viagens tem mapas interativos). Ele ainda é muito prático, porque a API do Google Maps ainda não provê um serviço para desenhar os novos mapas personalizados fora do próprio Google Maps. Mas duvido que isso demore a acontecer, e quando acontecer, das duas uma: ou o plugin vai ficar muito mais simples, ou ele vai se tornar completamente obsoleto.

Eu sou tão fascinado por mapas que provavelmente fui um cartógrafo em outra encarnação.

E para quem não sabe, o Google Maps e o GMail são os sites populares que primeiro usaram os conceitos de AJAX.

Inclusão Digital

Já posso desencarnar feliz porque tenho um blog popular.

Meu post sobre Aquecimento Global é o campeão de audiência com 246 comentários neste exato momento, mas se você for verificar agora, o número já deve ter crescido. Até o final do ano deve facilmente chegar a 400 comentários.

Escrito numa noite mal dormida, de pesadelos, após ter assistido o filme do Al Gore, nunca tinha imaginado que seria tão visitado, e nem por esse tipo de público: a maioria são estudantes fazendo trabalho para a escola.

Uma conhecida que corrige redações de vestibular me disse uma vez que o nível dos textos é muito baixo. Confesso que achei que ela estava exagerando e sendo pessimista demais, mas minha opinião mudou depois do meu post popular.

Veja alguns comentários ali:

E a lista não pára…

A inclusão digital está acontecendo mais rápido do que qualquer outra inclusão.

Aproveitando, meus outros posts populares são o de download de música, o do Google Maps para WordPress, e o do tema do meu blog.

My Podcasts

A podcast is a blog that, in addition to text, also publishes media files. So you need a special “reader” to listen them, so people use softwares like iTunes, Amarok, iPodder to subscribe and automatically get the media.

I’m officially releasing my podcasts here, posting songs in high quality MP3 format. These are the channels, subscribe using the orange buttons below:

Enjoy.

Sobre Podcast

Uma vez perguntei a um amigo o que é um podcast, e ele disse que é um MP3. Bem, isso é tão minimalista quanto dizer que um Gaudí é um amontoado de tijolos, ou que a Internet é uma porção de bits dançantes.

Um podcast é um blog não-textual. Seu conteúdo pode ser audio e/ou vídeo, rodeado por metainformações do tipo “autor”, “entrevistado”, “banda”, “estilo”, “sumário” etc.

Como todo blog, ele tem regularidade: “episódios” no lugar de posts e assim por diante.

Você “assina” um podcast como assina uma revista, da mesma forma como assina um blog (via RSS ou ATOM). Mas como um browser é um leitor essencialmente textual, é mais comum e prático assinar podcasts usando softwares de mídia: iTunes, Yahoo! Music Engine, Amarok, etc.

Na convergência das coisas, um podcast pode ser comparado a um programa de rádio onde o próprio ouvinte decide quando e como vai ouvi-lo.

Num mundo onde tivermos banda larga no ar tão abundante e livre quanto ondas de rádio, além da memória para freqüências de estações, os rádios de nossos carros terão também a assinatura de nossos podcasts preferidos. Com ainda não chegamos a isso, temos que usar MP3 players modernos como o iPod – que tratam podcasts de forma especial – para termos essa funcionalidade.

E nesse mundo, os podcasters seremos você e eu, pessoas comuns falando diretamente para o mundo. Publicar um podcast é tão simples quanto publicar posts num blog. É inclusive algo que se pode integrar com plataformas de blogs comuns, com plugins para WordPress, etc.

Se você tem um fluxo de coisas para dizer, crie um podcast. Se você tem um fluxo de coisas para serem assistidas, crie um podcast. Se você tem um fluxo de coisas que quer que as pessoas ouçam, crie um podcast. Este último é o meu caso, sobre Jazz Brasileiro, e por isso estou juntando os pedaços e os módulos para criar um.

Andei estudando isso ultimamente, e achei importante compartilhar…

Google Maps Plugin for WordPress

This software will let you easily render Google Maps anywhere on your blog as a web service. It also includes code for easy integration with WordPress blogs, but what the code does best can actually be used with any other blog system or plain web page.

This plugin will let you easily create from simple maps with one marker and a text balloon, to complex multimarker maps with hypertext balloons as this page.

Installation on WordPress Blogs

Install it as any other plugin (unziping plugin files under [WORDPRESS_ROOT]/wp-content/plugins directory and activate it in WP Plugins admin tool). Then go to the Google Maps API key signup page, get an API key for your website, and install it in the plugin’s admin page under Options.

Google Maps WP admin page

Creating Simple Maps

This is the easy part.

  1. Go to Google Maps, find the spot you want to show, select Map, Satelite or Hybrid view buttons, double-click on the most important point on the map to centralized it, and define the zoom factor you want.
  2. On the left-top corner of the map, click on the “Link to this page” link, and copy your browser’s location to the clipboard. You can do the same for complex maps created on the My Maps section of Google Maps website.

    Link selection

  3. While creating the post, select the text that will be displayed on the map marker, and create a link with it.

    Select text for the map's mrker

  4. Paste the map URL on the Link URL field, and on Title write “googlemap“.

    Link creation dialog

  5. Continue editing your post and publish.

You are done. This example will render a map like this (don’t forget to click on the marker to see the balloon):

TuxThis will be a map’s marker text with an image.

Passing Parameters

You may have noticed that on the Title field above we used other commands. In fact you can use the following switches, separated by “;” to control the way the map will appear in your site.

googlemap
Instructs the plugin to transform this link into a Google Map area. If not used, the plugin will not work on the link and you’ll get a plain link to the Google Maps site.
nocontrol or nocontrols
Renders a map without the zoom and scale controls
nomarker or nomarkers
Renders a map without the marker with the information balloon.
w:SIZE_IN_PIXELS and h:SIZE_IN_PIXELS
Defines the size of the map area in pixels.
w:PERCENT% and h:PERCENT%
Defines the size of the map area relative to full width and height.

Since other plugins may use the title attribute, you can also put these commands in the rel attribute and activate this functionality in the plugin configuration dialog.

Some examples for the Title (or rel) field:

googlemap
Renders a map with controls, marker an default sizes, as specified in the plugin’s admin page, under WP Options.
googlemap;nocontrols;w:300;h:200
Renders a 300×200 map with marker but no zoom controls.
googlemap;nomarker;nocontrols;w:100;h:100
Renders a small 100×100 map without marker and zoom controls.
googlemap;nomarker;nocontrols;w:100%;h:300
Renders a maps that fills the full width available with a 300 pixels height, without markers and zoom controls.

Creating Complex Maps

This procedure requires some HTML knowledge, but will let you create maps with multiple markers, and results as good as on this post.

The proccess consists of creating a definition list (<dl> XHTML element) of a center point and markers with their text balloons.

Learn by example. Pay attention to the following complex map, and select all its markers to see the text inside their balloons:

Center of map
map
Center of São Paulo
map
Flea market
map
Traditional market
balloonless marker
map
Japanese town

It was generated by this (X)HTML code:

<dl title="googlemap;w:100%;h:400">
	<dt><a href="http://maps.google.com/?z=15&ll=-23.550887,-46.631985&om=1">Center of map</a></dt>

	<dt><a href="http://maps.google.com/?ll=-23.550592,-46.633122">map</a></dt>
	<dd><strong>Center of São Paulo</strong></dd>

	<dt><a href="http://maps.google.com/?ll=-23.547563,-46.631041">map</a></dt>
	<dd>Flea market</dd>

	<dt><a href="http://maps.google.com/?ll=-23.54535,-46.627693" title="marker">map</a></dt>
	<dd>Traditional market</dd>

	<dt><a href="http://maps.google.com/?ll=-23.54715,-46.637263">balloonless marker</a></dt>

	<dt><a href="http://maps.google.com/?ll=-23.555195,-46.635547" title="marker">map</a></dt>
	<dd>Japanese town</dd>
</dl>

So the structure must folow these rules:

  1. Create a definition list (<dl>) and put map-related commands and parameters on title= attribute as specified above.
  2. First definition term (<dt>, first green line) must contain only a link to Google Maps site, to define its center and other map parameters. The text for the link is ignored when a map is generated, so use a text like “Center of Map” so people accessing your posts outside your blog (for exemple, through feed readers) will have a clue what is this link for.
  3. The rest is a pair of terms and definitions (<dt> and <dd>) with the marker position (as a Google Maps URL) and the text on the balloon respectivelly.
  4. You can create a balloonless markers specifying only a <dt> without a <dd>.
  5. Whatever you put inside the <dd> block will appear inside the balloon. Put links, images, lists, tables, etc.

Using Google My Maps or KML and GeoRSS maps

You can use Google My Maps service to create and manage colorfull markers, paths, regions and the text inside the balloon, and simply use the “Link To This Page” link to embed the map in your page as described above.

The plugin will use the KML-exported version of your map to create the balloons, markers, regions and paths. Simply exaplained, KML is XML dialect that contains all meta information of your maps: markers positions and images, line colors, balloon texts, etc. You can create KMLs with tools like Google Earth, Goole Maps or even using a plain text editor. GeoRSS format is also supported but can’t be used for paths, regions and markers colors, only plain geographical positions.

The good news is that you can embed KML-maps from any source, and not only from Google My Maps. You can upload a KML file to your web server and pass it to the plugin to render it. Here is an example on how to do it in a more advanced way:

<dl title="googlemap;w:100%;h:400" id="my-wonderful-map-with-kml">

	<dt><a href="http://maps.google.com/?z=7&ll=-23.550887,-46.631985&om=1">Center of map</a></dt>

	<dt><a title="kml" href="http://my.server.com/spots-on-the-farm.kml">markers</a></dt>

	<dt><a title="kml" href="http://my.server.com/spots-on-the-beach.kml">more markers</a></dt>

</dl>

This example will render a map centralized on geo position -23.550887 -46.631985 and overlay it with two KML specifications: spots-on-the-farm.kml and spots-on-the-beach.kml. Note the required title=”kml” parameter that indicates to the plugin that this is KML or GeoRSS overlay and not a plain marker position.

Positioning and Style Possibilities

To have better control over the map positioning and overall look, you can manually edit the HTML code while posting, including style and class attributes. Find the <a> or <dl> tag for your link and use this examples to get some clues:

  • <a style=”float:left; width:300px; height:300px;” title=”googlemap”
    Renders a 300×300 map floating on left of the paragraph. See example.
  • <a class=”photo” style=”float:right;” title=”googlemap”
    Renders a map with default dimensions floating on the right of the paragraph, with style class photo, that in my theme defines some margins and borders.
  • <dl style=”visibility: hidden;” title=”googlemap”
    Using style=”visibility: hidden” will make the browser hide the map definititon text while loading the page. Seconds later, when the plugin renders the maps on your page, the hidden blocks will finaly appear as maps.

The HTML attributes id=, style= and class= you specify will be inherited by the generated map.

In addition, a CSS class called map will be added to all maps, and to all balloons a CSS class named balloon will be assigned. This way you can define your own style for these elements.

Troubleshooting

Some common problems people have, and solutions.

  • Map does not appears or appears on a different geo locationMake sure the Google Maps URL you are pasting is correct and complete. A correct URL must have the following parameters: ll= required to define latitude and longitude for center of the map or a marker, om= option to show or not the overview map on bottom-right, z= required to define the initial zoom factor, t= option to define if map is plain, satellite or hybrid, msid= required if you are pasting My Maps from Goole Maps website.
  • Problems with &You should not have problems with & chars being modified by the WordPress editor. If so, it means you are working with complex maps. Yes, WordPress WYSIWYG editor sucks a little bit. So if you are working with complex maps, you should switch to the plain text editor. You can’t just open the post editor in WYSIWYG and select the plain text editor after that. The mess was already done. You will have to edit your profile under Users->Your Profile and deselect the “Use the visual editor when writing” options when you edit that post. Once it is saved you can reselect it again.
  • Grey area instead of markers, or simply don’t have markersGoogle Maps API uses a lot of CSS style to render its maps on your page. This problem is caused by a conflict between CSS needed by Google Maps and your page or theme defined style. Use Firefox’ DOM inspector to drill down into your document structure until you find the markers XHTML nodes. Then switch to CSS Style Rules mode on the inspector, then select a rule that was defined by your theme, on the top-right box, then delete “background-” related properties on the bottom-right box, one by one, until the marker appears. This will indicate you which property you have to delete from your theme’s or own style.css file.
  • Problems displaying the map on IE7

I still don’t know what is the problem here. I rarely use Windows nor IE, so I can’t reproduce it. This is probably caused by the same CSS conflict above. If you can correctly see the map on this page with IE7, indicates that the problem is specific to your page and related stylesheets. You must debug your CSS styles.

No WordPress ?

If you use other blogging systems, or just want a simple way to create maps on your pages you can still take advantage of this plugin.

Download the plugin, unzip, install its content somewhere on your server accessible from the web. Then edit the HTML source of the pages you want to render maps, find the <head> block, and include the following code inside of it:

<!-- Google Maps Plugin (begin) -->
<!-- http://avi.alkalay.net/2006/11/google-maps-plugin-for-wordpress.html -->

<!-- Google Maps API -->
<script src="http://maps.google.com/maps?file=api&v=2.x&key=MY_API_KEY" type="text/javascript">
</script>

<!-- Google Maps Plugin logic -->
<script src="http://my.site.com/path/to/plugin/googlemapsPlugin.js" type="text/javascript"></script>

<!-- Google Maps Plugin initialization -->
<script type="text/javascript">
	//<![CDATA[

	MapPluginInit(
		/* Default maps width  */          500,
		/* Default maps height */          300,
		/* Use rel instad of title? */     false);
	//]]>
</script>

<!-- Google Maps Plugin (end) -->

Change the red parts to fit your needs. Every page containing the above block will be able to render simple and complex maps as described.

About

This plugin was inspired on Macdiggs Google Maps plugin, but was completely redesigned, rewritten, has much more functionality, made more user friendly, has cleaner code and is more standards oriented. The former Macdiggs’ plugin will not receive updates anymore so this is the plugin you should be using.