Arquivo de março 2008

Como pegar parte do conteúdo (dados) de outro site com PHP

Pegar parte do conteúdo de outro site foi a tarefa que tive que fazer. Pensei que seria bem fácil, mas as coisas não saíram exatamente como eu planejava… Felizmente, consegui! Aprenda, você, também, como coletar informações de outros sites na internet.

A missão: pegar parte do conteúdo de um site

Hoje, no trabalho, tive a missão de “puxar” alguns dados de um site para “enxertar” num trecho de um web site que estou ajudando a desenvolver. Quando a tarefa me foi passada, logo lembrei de uma ocasião em que um amigo fez a mesma coisa (e, na época, ele me explicou, mais ou menos, com o fez). Pensei que seria muito fácil realizar a tarefa, mas, na hora, “lembrei” que não sou tão bom quanto o Gevã… rsrs

O desespero era tanto que cheguei até a entrar em Orkut, para ver se encontrava alguma explicação mais elaborada (viu, Alanna?! :-/ )…

A solução: funções nativas do PHP e expressões regulares

Passei para pesquisas na web, procurando desesperadamente material de referência sobre expressões regulares (que, como verão, é um dos pilares para se conseguir pegar parte do conteúdo de outro site). Procura daqui, procura de lá, até bate-papo com o Gevã rolou para eu tentar entender melhor as tais expressões regulares. Até que, utilizando um pouco de “gambiarra”, consegui realizar meu objetivo.

A primeira coisa a se fazer, é pegar o conteúdo da página inteira que se quer “manipular”. Para tal, usa-se, por exemplo, a função file_get_contents(). Jogando o conteúdo do site numa variável, ficaria assim (vou fazer o exemplo com o mesmo site que tive que mexer):

1
$url = file_get_contents('http://www.bcb.gov.br/');

Pronto, agora a variável $url contém, em string, todo o conteúdo da página inicial do BCB.

Expressões regulares

Até aqui foi fácil; o difícil foi pegar somente o trecho da página que eu queria… Para isso, é preciso usar expressões regulares!

Caso você não saiba o que são expressões regulares, aí vai uma sucinta (e incompleta…) explicação de o que são expressões regulares, da Wikipédia:

Uma expressão regular, na Informática, define um padrão a ser usado para procurar ou substituir palavras ou grupos de palavras. É um meio preciso de se fazer buscas de determinadas porções de texto.

Com as expressões regulares é possível identificar trechos de palavras ou grupos de palavras que correspondem (”match“) a um determinado padrão (”pattern“), que é “regular”.

O PHP tem várias funções nativas para trabalhar com expressões regulares. Basta saber para o que cada uma serve e usar da meneira correta.

Bem, o próximo passo para resolução do problema é identificar o padrão que se quer extrair do site. No caso, eu precisei de uma tabela com algumas taxas cambiais (encontra-se à direita, no site do BCB). Observando o código fonte, vi que as informações estão em uma tabela (abordagem semanticamente correta!); além disso, esta tabela está envolta entre os comentários HTML “<!- - INICIO INDICADORES - ->” e “<!- - FIMINDICADORES - ->”. Isso é uma coisa boa, já que facilita bastante a “identificação do padrão”.

Explicando melhor: o padrão procurado, no caso, é tudo o que está entre os comentários HTML “<!- - INICIO INDICADORES - ->” e “<!- - FIMINDICADORES - ->”. Toda a tabela está aí, para a minha felicidade! :-)

Então, tudo o que é preciso fazer é utilizar uma função PHP (para o caso, escolhi a preg_match_all()) para procurar uma expressão regular dentro da variável $url, que contém toda a primeira página do site em que está a tabela.

Depois de muito tempo testando vááárias expressões regulares, cheguei à conclusão que faria uma pequena mutreta. Mas, antes, deixe-me mostrar como está o código até agora.

1
2
$url = file_get_contents('http://www.bcb.gov.br/');
preg_match_all('/ORES-->(.+)<!--/s', $url, $conteudo);

Explicando: o primeiro argumento da função, é o padrão que quero procurar; o segundo, é onde vou procurar; o terceiro, guarda em um array todas as ocorrências da expressão procurada. Para a maioria dos casos, talvez já estivesse bom, por aqui; entretanto, no problema que tive, ainda é preciso mais algumas linhas de código.

No momento, a variável $conteudo contém um array com as ocorrências encontradas. Usando um print_r(), descobri em qual posição, exatamente, o que eu procurava estava: $conteudo[0][0].

Fazendo uma “mutreta”

Para fazer a tal “mutreta”, jogo o conteúdo desta posição da matriz para uma outra variável (para facilitar a manipulação).

1
2
3
$url = file_get_contents('http://www.bcb.gov.br/');
preg_match_all('/ORES-->(.+)<!--/s', $url, $conteudo);
$exibir = $conteudo[0][0];

Havia trechos do que me foi retornado (ou seja, da tabela com as taxas cambiais) que eu não queria que aparecessem no site (como alguns links). Então, resolvi retirá-los através da função str_replace(), que substitui trechos de strings. É possível, como argumento, passar um array. Então, por enquanto e quase no fim, o código está assim:

1
2
3
4
5
$url = file_get_contents('http://www.bcb.gov.br/');
preg_match_all('/ORES-->(.+)<!--/s', $url, $conteudo);
$exibir = $conteudo[0][0];
$retirar = array('mais moedas','atas Copom','mais detalhes','ORES-->','<!--');
$exibir = str_replace($retirar, '', $exibir);

Ou seja: sempre que aparecer alguns dos itens do array $retirar em $exibir, será substituído por “” (nada…). Perceba que os últimos dois elementos do array são “poluições” desnecessárias, que vieram devido à minha preguiça de fazer uma expressão regular mais elaborada. :-)

Finalizando…

Depois disso, basta mandar exibir na tela o que “sobrou” do conteúdo retira da página inicial do site do BCB.

1
2
3
4
5
6
$url = file_get_contents('http://www.bcb.gov.br/');
preg_match_all('/ORES-->(.+)<!--/s', $url, $conteudo);
$exibir = $conteudo[0][0]</span>;
$retirar = array('mais moedas','atas Copom','mais detalhes','ORES-->','<!--');
$exibir = str_replace($retirar, '', $exibir);
echo $exibir;

E se o servidor não permite a função file_get_contents() ?

Há muitos servidores que, por motivos diversos (principalmente “segurança”), não permitem que se utilize a função file_get_contents(). Para esses casos, é possível colocar numa variável alguma página externa utilizando o seguinte código (depois você procura as explicações no manual oficial do PHP):


$ch = curl_init();
$timeout = 0;
curl_setopt($ch, CURLOPT_URL, ‘http://O_SITE_QUE_VOCE_QUER’);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
$conteudo = curl_exec($ch);
curl_close($ch);

Então, o conteúdo da página “O_SITE_QUE_VOCE_QUER” estará na variável $conteudo.

Conclusão

Então, pessoal, para se retirar uma parte do conteúdo de um web site (utilizando PHP), os passos são:

  • Saber em qual página está o conteúdo que se precisa;
  • Jogar o conteúdo do site em uma variável;
  • Extrair o trecho que se quer utilizando expressões regulares;
  • Se preciso, cortar mais algumas coisas do resultado da ER;
  • Exibir em tela o resultado final.

O grande pulo do gato, neste caso, é saber mexer com expressões regulares; coisa que, sinto informar, só se aprende fazendo! E fazendo muito! Leia as referências no fim deste artigo e procure na internet mais material a respeito.

Uma outra coisa importante é o seguinte: tenha sempre em mente que, como você está pegando o conteúdo de um site, caso este altere sua estrutura, muito provavelmente será preciso alterar a expressão regular, também.

Fique ciente de uma coisa: se você, desenvolvedor web, ainda não precisou usar expressões regulares, pode ter certeza de que sua hora vai chegar!

Referências Nacionais

Expressões Regulares - Guia de Consulta Rápida
Este é o guia de Aurélio Marinho Jargas, excelente para se aprender expressões regulares e para se consultar nos momentos de aperto!

Expressões Regulares no PHP
Artigo do Viva o Linux, de Marcelo Santos Araujo, com uma introdução sobre expressões regulares.

Referências Internacionais

Regular-Expressions.info
Site especialmente dedicado às expressões regulares.

Regular Expression Library
Biblioteca virtual de expressões regulares.

RegExr
Para testar expressões regulares em tempo real!

Adicionar artigo ao Rec6    Adicionar artigo ao Linkk    Adicionar artigo ao doMelhor    Adicionar artigo ao del.icio.us   Postar artigo no StumbleUpon!

Compact Menu: extensão para Firefox para compactar a barra de menus

Lendo meus feeds, vi no Efetividade.net um artigo sobre como aproveitar melhor o espaço disponível na tela, usando Firefox.

Nele, o autor conta um pouco de sua experiência com o Eee PC e suas limitações de resolução de tela. Basicamente, ele encontrou 2 plugins do Firefox que servem para “compactar” a barra de menus e economizar espaço em tela quando se utiliza o navegador.

Depois de ler o artigo, testei os 2 plugins citados. Pessoalmente, gostei mais do Compact Menu, por ser mais customizável (é possível posicioná-lo onde se quer, na “barra de ícones”) e pela opção de ter simplesmente um ícone indicativo de onde ficam os menus, ao invés de “Menu”, como na outra extensão que o Augusto citou.

Então, baseado nos testes que fiz (e em meu gosto pessoal), recomendo, para os que querem (e/ou precisam) economizar espaço em tela ou simplesmente “aliviar o visual” do Firefox, a instalação do plugin Compact Menu.

Adicionar artigo ao Rec6    Adicionar artigo ao Linkk    Adicionar artigo ao doMelhor    Adicionar artigo ao del.icio.us   Postar artigo no StumbleUpon!

45 bons temas para Wordpress

Dando uma passada de vista no feed do Noupe, vi um artigo muito interessante com uma compilação de temas para Wordpress muito bons! É um respositório indispensável para quem costuma implementar Wordpress customizado para clientes.

A lista de temas para WP está organizada por categorias:

  • Minimalistas;
  • Grunges;
  • Para jornais e revistas;
  • Mobile;
  • Pessoas [?];
  • 2 colunas;
  • 3 colunas;
  • Para fotologs;
  • Artísticos;
  • Outros mais.

Para quem é desenvolvedor web e utiliza Wordpress customizado para os jobs e/ou quem gosta ou precisa de listas de temas para as horas de aperto, a lista de themes para Wordpress compilada pelo pessoal do Noupe é muito bem-vinda!

Adicionar artigo ao Rec6    Adicionar artigo ao Linkk    Adicionar artigo ao doMelhor    Adicionar artigo ao del.icio.us   Postar artigo no StumbleUpon!

Pirâmide de conteúdo: estrutura lógica de web sites (para pessoas)

Lendo um dos livros de Dan Thies, cheguei a um capítulo onde era feira uma analogia interessante: a estrutura lógica de web sites (conteúdo voltado para pessoas, e não para bots de busca) pode ser representada por um pirâmide, sendo esta dividida; cada parte representaria um aspecto importante da estrutura lógica dos sites.

Pirâmide de conteúdo: estrutura lógica de web sites (na perspectiva das pessoas / visitantes).

O próprio Thies dá explicações a respeito de cada divisão; com minhas próprias palavras (decorrentes de como interpretei a explicação), ficaria algo mais ou menos assim:

Página inicial

De acordo com Dan Thies, a página inicial é onde a maioria dos visitantes entram (ou conhecem) na maioria dos web sites e, embora possa ser feito um trabalho (SEO) para que outras páginas tenham um bom posicionamento, com o intuito de as pessoas entrarem no site através delas (o que acontece, efetivamente), a página inicial é visitada por mais pessoas e mais freqüentemente que qualquer outra página dos sites.

A “regra de ouro” é que se as pessoas conseguirem encontrar o que elas procuram (naquele site) a partir da home page, então o desenvolvedor optou pelo caminho certo; do contrário, há bastante trabalho a ser feito.

Categorias

A segunda “parte” é referente às categorias (“roadmap pages”, como Thies chama). Esta divisão da pirâmide é relativa à estrutura de páginas (ou hierarquia de diretórios), mais especificamente à maneira como esta estrutura está organizada e, a partir desta organização, o qual fácil é para quem está no web site encontrar a informação que deseja ou realizar uma tarefa que é necessária.

Há um mito na área de usabilidade na web que apregoa: “Qualquer informação no site deve estar a, no máximo, 3 cliques”. Na verdade, não é bem assim. Como cita Dan Thies (e Jacob Nielsen, também, em seu livro “Projetando Websites com Usabilidade”), as pessoas não se importam tanto com a quantidade de cliques que têm que dar, desde que o “trajeto” seja simples e que, a cada clique dado, a proximidade do objetivo almejado seja maior.

Com esta preciosa informação em mente, é possível pensar melhor na arquitetura da informação do web site e como ela pode facilitar (ou não…) a experiência do usuário.

Por “curiosidade”, na perspectiva de SEO, a segunda parte da pirâmide é formada por qualquer página do site que consiga fazer link com a página inicial.

Conteúdo

As “Destination pages” (literalmente como consta no livro para designar o conteúdo, propriamente dito), em um site típico, são as mais importantes, na perspectiva das informações e processos de web sites. O esquema de navegação de um “visitante comum” costuma ser o seguinte:

Esquema de navegação de pessoam que visitam web sites.

Exemplificando com um site de e-commerce, as “roadmap pages” seriam as categorias de produtos (eletrodomésticos, livros, CDs, etc) e as “destination pages” seriam as descrições de cada produto dentro de uma dessas categorias.

Em uma perspectiva de otimização para mecanismos de busca, as “destination pages” seriam quaisquer páginas que ficam a 2 cliques da página inicial.

Conteúdo profundo

Na maioria dos web sites, ter até três níveis de conteúdo (destination pages) é o suficiente: é possível ter milhares de páginas utilizando este profundidade.

A partir deste “limite”, é preciso fazer um trabalho um pouco mais elaborado (quer dizer, diferenciado) de SEO para uma adequada indexação de páginas que ultrapassam o terceiro nível do site.

Então, segundo o que Dan Thies dá a entender, somente em casos em que realmente é preciso que devemos fazer um site com uma estrutura mais aprofundada que 3 níveis (que são mais que o suficiente).

A “Pirâmide de Conteúdo para Pessoas” tem sentido, mesmo?

Ainda não terminei de ler o livro de Dan Thies; de qualquer maneira, digo que, até o momento, li coisas sobre SEO interessantíssimas, que jamais havia lido em sites sobre o assunto.

Esta “pirâmide de conteúdo”, que representa a estrutura lógica de web sites para pessoas, realmente faz algum sentido. Somando a experiência do autor na área (anos de atuação) com as palavras e a lógica que ele se utilizou no livro, muito provavelmente esta analogia da pirâmide é correta.

Adicionar artigo ao Rec6    Adicionar artigo ao Linkk    Adicionar artigo ao doMelhor    Adicionar artigo ao del.icio.us   Postar artigo no StumbleUpon!

Gestalt aplicado ao design web (parte 6): princípio da experiência passada

No último artigo da série, apresentei alguns exemplos de aplicação do uso do princípio do alinhamento em alguns web sites. Neste artigo, falo um pouco sobre o princípio da experiência passada, ou, como alguns preferem, princípio da aprendizagem. Quebrando um pouco o estilo da série, apresento a parte conceitual desta lei de Gestalt e alguns exemplos, de uma vez.

O princípio da experiência passada refere-se, como o próprio nome sugere, à experiência já adquirida (no passado…) que o observador de determinada obra, peça, cena, web site, etc, tem e de quais maneiras isso pode (ou não pode) ajudá-lo a interpretar, reconhecer e “conectar“.

É algo bastante pessoal, subjetivo, já que a experiência ocorrida é peculiar e cada indivíduo tem suas próprias vivências, histórias e situações; quer dizer, algo observado pode (e geralmente tem) um significado diferente de pessoa para pessoa devido, dentre outras coisas, às experiências passadas.

Pelo exposto, não é complicado inferir que é a partir do processo de associação que a interpretação acontece: associamos coisas / elementos que já conhecemos previamente quando em face ao novo. Valendo-me das palavras de Danilo Medeiros, do digitalminds,

[...] se a gente vê uma coisa com caule, galhos e folhas a gente imagina que seja uma árvore, se a gente vê uma coisa com quatro patas que late a gente imagina que seja um cachorro [...]

Isso é associação! ;-)

E, como faz parte de um processo de aprendizagem / interpretação humano, certamente que podemos nos valer disso para a feitura de web sites; podemos “tirar vantagem” do princípio da experiência passada para compor layouts!

Exemplos do princípio da experiência passada aplicado ao web design

Exemplo do princípio do Gestalt da experiência passado aplicado ao web design.

No site Spot.BG, por exemplo, vemos esta estranha forma, esta coisa irreconhecível, à esquerda, sorrindo. “Estranha forma”? Não, não… A não ser que você seja alguém que jamais viu uma mulher antes, em toda sua vida, seu cérebro fará a correta associação e identificará, instantaneamente, que esta é a cabeça de uma mulher, cujo corpo está “escondido” atrás do corpo do site.

Exemplo do princípio do Gestalt da experiência passado aplicado ao web design.

No restaurantica podemos perceber (em resolução de tela de 1280 por 1024, ou superior) como o princípio da experiência passada é bem utilizado, apresentando estes bonitos talheres (viu, é possível saber que são talheres porque sabemos como são os talheres, dado que já os vimos no passado).

Exemplo do princípio do Gestalt da experiência passado aplicado ao web design.

Vejam que bonitos livros fazem parte da composição do design do site dustycover.da. São livros, não são? ;-)

Exemplo do princípio do Gestalt da experiência passado aplicado ao web design.

No site desta Igreja Batista Missionária, por exemplo, podemos perceber a sutil árvore posta em background. Todos percebemos que é uma árvore porque uma já foi vista em algum momento de nossas vidas, e conseguimos, segundo prega a lei da experiência passada, associar e interpretar a composição, identificando que, realmente, trata-se de uma árvore.

Usabilidade na web e o princípio de Gestalt da experiência passada

Pessoalmente, acredito que o princípio da experiência passada tem muito a ver com a usabilidade na web, já que é a partir de situações já passadas por pessoas que utilizam a internet (estudas por especialistas da área) que determinados comportamentos foram “consagrados” nos “esquemas” de web sites. Por exemplo, posições de determinados elementos num web design facilitam e melhoram a experiência de quem os usam e facilitam a realização de tarefas.

A usabilidade na web é um assunto amplíssimo; só citei a respeito para complementar o assunto e deixar claro que faço parte daqueles que pensam que o princípio da experiência passada e a usabilidade têm muito a ver um com o outro.

Mas este é um assunto para uma outra série…

Conclusão

Como os exemplos de sites mostraram, é possível obter efeitos interessantes e visualmente agradáveis se valendo da teoria do princípio da experiência passada. Como costumo dizer, o mais importante é saber quando usar e, mais importante, o motivo e os efeitos que esta técnica podem causar na experiência de quem vê a obra.

Bem, pessoal, este foi o último artigo sobre Gestalt aplicado ao design web. Pelo menos o último que trata especificamente sobre um dos princípio de Gestalt que podem e mais são utilizados para o desenvolvimento para web. No próximo artigo, apresento outros princípios (não menos importantes) de Gestalt e como eles podem ser usados no web design.

Abraços e até a próxima!

Adicionar artigo ao Rec6    Adicionar artigo ao Linkk    Adicionar artigo ao doMelhor    Adicionar artigo ao del.icio.us   Postar artigo no StumbleUpon!