Edição 36

:: ANO 6 :: R$ 9,90 :: Edição 36

:: ANO 6 :: EDIÇÃO 36

:: www.locaweb.com.br ::

A Internet em Revista

O NOVO SEO

O nov o

::Locaweb Startup ::Google Page Speed ::Mídias sociais ::Prism

a tão cad s e s e r o o d Os buscaais rígidos quaançd vez m unto é otimiz cãeor o ass es para apare s de sit ueado. Mas nó s q s são oa i a bem ran u q s o sabem as táticas par e ar métodoos topo e continu fira chegarpaosicionado. Con bem veja também

LOCAWEB

Windows 8

Conheça as principais inovações apresentadas pelo sistema operacional revolucionário da Microsoft

CapaLocaweb36.indd 1

Entrevista

Rene Silva, famoso por cobrir pelo Twitter a invasão do exército ao Morro do Alemão, revela o poder das mídias sociais

SmarTV

Aprenda a desenvolver apps para as TVs integradas à web e faturar uma grana

9/18/12 7:42 PM

205 X 275:Layout 1 24/09/2012 17:39 Pรกgina 1

205 X 275:Layout 1 24/09/2012 17:39 Pรกgina 2

Nesta edição... windows8

Constante evolução

Q

uando surgiu a ideia de fazer uma reportagem sobre SEO nesta edição, a equipe da Locaweb em Revista ressaltou o fato de o tema já ter ilustrado outras capas da publicação. Era hora, então, de buscar as tendências do mercado a respeito do assunto. E como o poder de renovação dos recursos disponíveis na web é impressionante, a repórter Andreza Emília Marino levantou tantas novidades que deu corpo a uma nova reportagem de capa. Em “O novo SEO”, que você confere nas próximas páginas, diversos profissionais do mercado revelam como a ferramenta para melhorar o posicionamento de sites em sistemas de busca mudou no último ano – e continuará mudando nos próximos meses. Por isso, é preciso estar sempre atento às novas ideias e se preparar para as exigências cada vez mais flexíveis do segmento. Novidade também é o que não falta no Windows 8, outro tema abordado nesta edição. O novo sistema operacional da Microsoft traz uma série de recursos avançados em relação às edições anteriores. Aqui, você confere as principais mudanças apresentadas, e ainda verá outras reportagens que revelam o quanto a tecnologia se mantém em constante evolução. Prova disso é que a Adobe passou a oferecer, pela primeira vez na história, uma família de fontes gratuitas para uso na internet; um site foi lançado nos Estados Unidos com o objetivo de transformar o sisudo ambiente da programação em algo amigável; e um novo mercado está se abrindo com o desenvolvimento de apps para TVs inteligentes. Confira tudo isso nas próximas páginas. Afinal, o melhor jeito de se dar bem no universo web e se mantendo antenado. Boa leitura!

:: ANO 6 :: R$ 9,90 :: Edição 36

:: ANO 6 :: EDIÇÃO 36

Claudio Gora editor@locawebemrevista.com.br

:: www.locaweb.com.br ::

A Internet em Revista

O nov o O NOVO SEO

::Locaweb Startup ::Google Page Speed ::Mídias sociais ::Prism

es estão cada do Os buscador rígidos quan vez maisnto é otimização o assu para aparecer de sitesueado. Mas nós os bem ranq quais são sabemos as parar e as tátic métodos topo e continua ao Confira ado. chegarposi cion bem veja também

LOCAWEB

Windows 8

Conheça as principais inovações apresentadas pelo sistema operacional revolucionário da Microsoft

Entrevista

Rene Silva, famoso por cobrir pelo Twitter a invasão do exército ao Morro do Alemão, revela o poder das mídias sociais

SmarTV

Aprenda a desenvolver apps para as TVs integradas à web e faturar uma grana

CapaLocaweb36.indd 1

9/18/12 7:42 PM

Aydano Roriz Luiz Siqueira Tânia Roriz Vivi Carrara

EditorialeSumario.indd 4

Locaweb em Revista Edição 35 VP Comercial e Marketing: Claudio Gora Coordenação de Comunicação: Luis Carlos dos Anjos Coordenação Editorial: Fernanda Brianezi Valim Editora Europa Editor e Diretor Responsável: Aydano Roriz Diretor Executivo: Luiz Siqueira Diretor Editorial e Jornalista Responsável: Roberto Araújo - MTb.10.766 araujo@europanet.com.br

Editores: Paulo Basso Jr. e Sérgio Vinícius Revisão: Cátia de Almeida Editor de Arte (projeto gráfico): Alexandre Dias (Nani) Colaboração: Adèle Helena Ribeiro, Aline Mariano, Andreza Emília Marino, Felipe Magalhães, João Felipe e Max Reinhold Publicidade São Paulo: publicidade@europanet.com.br Diretor de Publicidade: Mauricio Dias (11) 3038-5093 Executivos de Negócios: Alessandro Donadio (coordenador), Ângela Taddeo, Adriana Gomes,

8

As novidades Windows do

C

ode ademy Imagen: iStock

lwao_leitor

Conheça uma escola de programação online que pode render muitos frutos a novos e experientes programadores

Criado com a ideia de transformar as linguagens de programação em um ambiente agradável, o www.codecademy.com é, atualmente, uma das melhores plataformas de ensino na internet

Por Adèle Helena Ribeiro e Max Reinhold Jahnke

O

Codecademy é um site gratuito que se propõe a ensinar a programar diversas linguagens, em uma interface amigável e interativa. Logo na página inicial, acessada em www.codecademy.com, você encontra um terminal com lições básicas de programação a serem resolvidas dentro de um chat com o personagem “Ryan”. É uma forma descontraída de aprender. Há cursos muito bons e detalhados sobre JavaScript, Python, Fundamentos da Web e JQuery. Isso sem mencionar o Code Year, um curso completo que reúne de forma bem didática todos os conceitos de programação. A ideia dos criadores era gerar um desafio global, com o objetivo de ensinar definitivamente as pessoas a programar. E não é que deu certo! Mais de 200 mil interessados surgiram na semana de estreia do site, incluindo o prefeito de Nova York, Michael Bloomberg. Os cursos propostos pelo Codecademy são bem “mão na massa”. Além de ensinar a teoria, o site apresenta projetos elaborados para motivar os desenvolvedores e

A nova versão do sistema operacional da Microsoft pode, ao mesmo tempo, ser muito parecida e muito diferente das anteriores Por Sérgio Vinícius

O

novo Windows 8 apresenta uma série de semelhanças em relação às versões anteriores do sistema operacional. E, ao mesmo tempo, é bastante diferente. Isso porque conta basicamente com duas interfaces principais. Uma é baseada no sistema de janelas, que apresenta o desktop tradicional, e pode ser confundida com a do Windows 7. A outra, formada pelo que se denominou design Metro (nome já aposentado pela MS), é baseada em quadradinhos bem definidos e tem a intenção de ser cumpridora para PCs e para smartphones e tablets. Além de os sistemas contarem com alguma semelhança visual, para

utilizar o Windows 8 a máquina pede requisitos de hardware idênticos aos do 7. São eles: processador de 1 GHz, 1 GB de RAM para 32 bits e 2 GB para 64 bits, espaço no disco rígido 16 GB (32 bits) ou 20 GB (64 bits). É preciso também contar com o dispositivo gráfico Microsoft DirectX 9 ou superior. Em vários momentos, um observador mais distraído que roda o Windows 8 no formato de janelas pode até mesmo confundir o novo OS da Microsoft com o XP ou Vista. Isso sem contar que, durante a instalação, os procedimentos são idênticos aos das últimas versões do sistema. É na primeira utilização do sistema que começam a aparecer as diferenças. Em dado momento, o sistema pergunta se o usuário deseja cadastrar seu login e senha da

plataforma Live (pode ser uma conta no Hotmail, Outlook e Skydrive). Em caso positivo, cada vez que acessar o PC, o usuário o fará por meio de seus dados nas redes da MS (senha). A partir daí, o sistema sincronizará uma série de informações que poderão ser facilmente acessadas em diversos dispositivos (além do PC, em tablets e smartphones que usem versões renovadas do Windows Phone, sistema semelhante ao Windows 8 e plenamente compatível com ele). Daí para a frente, há muitas particularidades e semelhanças com versões anteriores. Nas próximas páginas, você confere funções e recursos realizados com a nova versão do OS da Microsoft e a forma como isso era feito no Windows 7. Lado a lado, eles podem ser muito, muito diferentes. Mas nem sempre.

52locaweb

46locaweb

Win8.indd 46

::Windows 8 46

9/18/12 11:13 PM

Codecademy

Codecademy.indd 52

9/18/12 11:21 PM

Codecademy.indd 53

O nov o

o Um bom trabalh se atualizaram. Engine inglês Search de SEO (do no Brasil ), traduzido Optimization ismos ação para Mecan de um como Otimiz a supervisão de Busca, requer e experiente. capacitado l ssiona profi precisam variáveis que internet, do Existem muitas o mundo da desde o início os “Como . “O ser consideradas quando dizem de na fase de layout te, impressão ainda a , dá projeto era”, amento do websi de muito tempo de carreg dos diversos os falando que estam os! um é E não estam por exemplo, buscadores uer tempo atrás. utilizados pelos 10 anos, qualq seu itens de o s Se s. to Há meno ar as página um conhecimen de para ranque apenas com pessoa com rução se preocupar o em const webdesigner te desenhará volver intermediári provavelmen capaz de desen a beleza, ele o que páginas era mas tão pesad mentar certas dia um site lindo, chegue um um site e imple rar os página a melho que . irá s para imped explica Bastos regras básica pesquisas”, isas. nas pesqu ao topo das rá na resultados o SEO auxilia as-chave bem “Acredito que bons para “Algumas palavr , uma dos únicos e as no código produção conteú coordenador escolhidas inserid acordo com diz Héric Tilly, e títulos de os usuários”, SEO da & Site para boa descrição ento ciente de Desenvolvim já eram o sufi sócioo”, o conteúdo Beto Rades, uma boa posiçã sável Locaweb. Para que o site tivesse CEO Interativa, respon , fundador e diretor da Plyn s ligadas à conta Ivan Bastos sa que mantém institucionai empre por páginas trilíngue da WebJump, as do colégio Gazeta ados como A educação, como Skatescola, portais renom do projeto social m.br. em Beit Yacov e TotalRace.co ade é focado Esportiva e qualid sido de haviam um projeto (Return Os sites não o Investimento mento em sões, Retorno sobre com o pensa construídos OI) e em conver isas. On Investment/R pedidos de orçamento topo das pesqu aparecer no ser os parte deles. as em que podem não a maior o ou as compr Pelo menos, área, com em um fale conosc em qualquer lo. como exemp , por Assim ão passou e-commerce anos, a evoluç não o passar dos que s aquele do a tirar do merca

N

a Marino Andreza Emíli

32locaweb 32

MateriaCapa36.indd 32

:: O novo SEO 32

locaweb33

9/18/12 11:54 PM

MateriaCapa36.indd 33

9/18/12 11:54 PM

::Entrevista: Rene Silva ........................... 6 ::Caixa de entrada ................................... 8 ::Notícias ................................................. 10 ::Case e WebStore.................................. 16 ::Programa Locaweb Startup................ 22 ::Espaço ABRADI ................................... 24 ::Opinião: Fabio Akita............................ 26 ::Opinião: Marcelo Negrini .................... 28 ::Opinião: Marcelo Barbusci.................. 30 ::Fontes abertas da Adobe .................. 42 ::Google Page Speed.............................. 52 ::Apps para SmarTV .............................. 58 ::Prism ..................................................... 62 ::Parceiros ............................................... 66

Elisangela Xavier, Ligia Caetano, Renato Peron, Rodrigo Sacomani e Rose Alves Criação Publicitária: Paulo Toledo Tráfego: Renan Pereira (11) 3038-5097 Circulação e Promoção Gerente: Ézio S. Vicente Desenvolvimento de Pessoal: Tânia Marilia Ribeiro Roriz e Elisangela Tokashiki Locaweb em Revista é uma publicação da Editora Europa Ltda. e do departamento de comunicação

Existe uma preocupação do Codecademy em dar suporte a vários idiomas, mas o site, por enquanto, roda apenas em inglês. A boa notícia é que a interface inicial já está disponível em português. Para acessá-la, entre em www.codecademy. com/pt. A partir daí, porém, é preciso ter conhecimento da língua inglesa.

9/18/12

capaSEO

ha que o Se você ac nguim sã panda e piis animais, do as en ap do que na s ai m está ualizar hora de ateitos sobre seus conc web na as sc bu

EM PORTUGUÊS

locaweb5

locaweb47

::Codecademy 54

uma série de exercícios. Certamente dá para aprender bastante em todos os cursos disponíveis. Um ponto negativo, porém, é que ainda não há cursos traduzidos para o português. Assim, é necessário ter conhecimento de inglês para aproveitar essa oportunidade. Também não são disponibilizadas as respostas para os exercícios. Existem apenas verificadores que apontam se sua solução está correta ou não. Portanto, se procura uma base de código pronto para ter como

e marketing da Locaweb Serviços de Internet. A Editora Europa não se responsabiliza pelo conteúdo dos anúncios de terceiros. Distribuidor Exclusivo para o Brasil: Fernando Chignalia Distribuidora S. A. Rua Teodoro da Silva, 907 - CEP 20563-900 - Grajaú - RJ Impressão: Prol Editora Gráfica Somos Filiados à ANER Associação Nacional dos Editores de Revistas

9/18/12 11:57 PM

Com apenas 18 anos, Rene Silva é editor-chefe do jornal Voz da Comunidade, no Complexo do Alemão, e ministra palestras sobre redes sociais

Arquivo pessoal

lwentrevista

R

ene Silva pode se considerar um jovem brilhante. Diferentemente de muitos adolescentes que usam a internet apenas para fazer pesquisas, bater papo e jogar, este estudante de 18 anos mostrou que, com o uso da criatividade, há muito mais a extrair do universo online – sobretudo das mídias sociais. Em 2010, Silva se tornou mundialmente conhecido ao twitar, passo a passo, o que acontecia no Complexo do Alemão, no Rio de Janeiro, após a famosa invasão das forças policiais e do exército que culminou na pacificação da área. Editor-chefe do jornal Voz da Comunidade (2005), o estudante sempre teve o interesse, desde a criação do periódico, de colocar a comunidade a par dos problemas e fatos que ocorriam na região. Hoje, Silva ainda reserva parte do seu tempo para ministrar palestras, como a realizada em julho de 2012 durante o 14º Encontro Locaweb de Profissionais de Internet. A seguir, confira o que o estudante tem a dizer sobre as mídias sociais.

O melhor da internet

Famoso pelos tweets realizados após a invasão do exército ao Complexo do Alemão, Rene Silva revela como as mídias sociais são fundamentais para o desenvolvimento dos jovens Aline Mariano

6locaweb

Entrevista.indd 6

9/18/12 11:16 PM

lwentrevista

Locaweb em Revista Quando você decidiu criar o twitter@vozdacomunidade? Rene Silva Antes do Twitter, já existia o jornal Voz da Comunidade, que começou a rodar em 2005. Com o passar do tempo, já em 2008, muitos leitores passaram a usar a internet, o que nos impulsionou a criar o @vozdacomunidade. A princípio, entretanto, só falávamos sobre problemas ‘mais comuns’ dentro do Complexo do Alemão. Também era um mecanismo para pedir doações, por exemplo.

“As mídias sociais são ferramentas de protesto importantes. Mesmo em busca de pequenas causas, é possível gerar mobilizações da massa” matérias. Eu mesmo as edito e publico. É um trabalho do qual me orgulho e gosto muito, sem dúvida.

LW Como e por que passaram a usar o Twitter para divulgar o que ocorria depois da invasão policial no Complexo do Alemão? RS Foram os próprios leitores que passaram a nos pedir para divulgar o que estava acontecendo na favela. Nenhum outro meio de comunicação estava cobrindo os acontecimentos de forma tão próxima, pois não tinham como entrar na comunidade. Então, as pessoas só poderiam saber por nós o que estava acontecendo.

LW Você conseguiu usar as mídias sociais para ampliar um negócio, mas qual é a sua opinião geral sobre esse meio de comunicação? RS Se bem utilizadas, as mídias sociais podem se transformar em ferramentas de protesto importantes. Mesmo em busca de pequenas causas, é possível gerar mobilizações da massa, como vemos no Facebook, por exemplo. Eu mesmo relatei diversos problemas sociais, inclusive sobre a minha escola. Não há dúvidas de que, quando algo relevante é publicado na internet, a repercussão e a chance de chegar a órgãos competentes é muito maior.

LW Por causa do Twitter, muitas pessoas que sequer sabiam direito o que estava acontecendo passaram a acompanhar a invasão. Como você encara essa repercussão? RS O fato é que as mídias sociais conseguem uma repercussão inviável para outros meios. Com o jornal, por exemplo, jamais teríamos o mesmo resultado. Após a invasão, o nosso Twitter passou a ser acessado até mesmo por empresas de comunicação de outros países como fonte principal, para narrar o que estava acontecendo no Complexo do Alemão. Com isso, além dos jornalistas, pessoas do Brasil todo passaram a seguir o Twitter para saber, em primeira mão e de forma sucinta, o que estava acontecendo.

LW Como você faz para manter os leitores e atrair novos seguidores? RS O primeiro passo é oferecer matérias de qualidade para os leitores, para que eles gostem do que encontram e venham buscar novas informações depois. O que costuma despertar interesse, principalmente nos novos leitores, é a descoberta de fatos exclusivos, casos singulares que ocorrem nas favelas e que não são publicados por outros meios de comunicação. Para manter os leitores, costumamos também realizar sorteios para entrega de brindes, por exemplo. Em datas festivas, como Natal e Páscoa, tentamos encontrar alguma empresa que queira ser parceira do projeto e então criamos as “brincadeiras” online.

LW O sucesso da mídia social ampliou o número de leitores do jornal? E que outros efeitos o Twitter trouxe para o Voz da Comunidade? RS Antes, nosso jornal era distribuído apenas na comunidade. Hoje, ele vai para muitos outros lugares. São cerca de 5 mil exemplares. Tudo por causa da repercussão no Twitter. A mídia social mesmo começou com cerca de 180 seguidores e, atualmente, tem mais de 90 mil. O site vozdascomunidades.com.br é mais um exemplo de como os tweets foram benéficos para o negócio. Começamos a ficar conhecidos e achamos legal fazer o que o nome do jornal prega, ou seja, dar voz a mais comunidades. Temos correspondentes dentro das outras favelas que nos mandam fotos e

LW Qual é sua opinião sobre o caso da fanpage Diário de Escola, em que uma garota foi perseguida após expor os problemas de seu colégio, mas, com a repercussão do caso, conseguiu atrair atenção para que seus propósitos fossem atendidos? RS Acho inacreditável que as pessoas da escola dela não a tenham apoiado. Já tive a mesma atitude diversas vezes – publicando o que de mais precário tinha na minha escola – e todos sempre me ajudaram muito. De qualquer forma, acho a iniciativa dela bárbara. Ela está certíssima de reivindicar direitos. É uma pena que os outros não viram os propósitos dela dentro da perspectiva correta desde o início.

locaweb7

Entrevista.indd 7

9/18/12 11:16 PM

lwcaixa_de_entrada //O canal direto entre você e a equipe de redação da Locaweb em Revista

PC instável Meu computador estava com diversos vírus e problemas de arquivos maliciosos. Passei alguns programas de limpeza e, agora, ele está bastante instável. Um dos softwares que rodei foi o CCleaner. Tenho a impressão de que ele eliminou mais do que eu precisava. A máquina trava a todo instante, o navegador não funciona, é impossível fazer downloads. Gostaria de saber se vocês indicam que eu reinstale o Windows. Em tempo: tenho os CDs originais. Aline Carlos // Por e-mail É muito difícil fazer uma análise acurada sem

observar a máquina. Levar a uma assistência técnica poderia ser uma solução correta. Entretanto, de acordo com o panorama apresentado, aparentemente algum programa de limpeza jogou fora arquivos importantes, como certas DLLs e outros itens do sistema. O CCleaner, software para limpeza de vírus e outras pragas, pode, sim, ter danificado a máquina. Outro problema que pode estar acontecendo é que alguns vírus podem ainda estar em seu PC, escondidos e realizando os contratempos descritos. Nesse caso, uma saída que poderia ajudar seria mesmo reinstalar o sistema. Em teoria, uma reinstalação corrigiria todos os problemas. Porém, há duas formas de

trabalhar com isso – em uma, você repara o sistema. Nesse caso, o computador mantém os arquivos antigos e só joga os novos por cima. A segunda opção é excluir tudo que há no HD e começar do zero. Quando se opta por reparar o OS, nem sempre todos os erros são corrigidos. Portanto, para ter 100% de certeza de que o Windows ficará perfeito, é preciso deletar tudo o que está armazenado no PC e recomeçar do zero. Para realizar esse processo, é essencial guardar os arquivos importantes (esse processo leva o nome de backup). Crie uma pasta, salve tudo que for vital para seu dia a dia lá dentro e depois coloque o conteúdo desse diretório em algum

ENVIE SEU E-MAIL Se você tem alguma dúvida, sugestão ou crítica, entre em contato com nossa redação pelo e-mail locaweb@ europanet.com.br.

local externo ao PC, como um DVD ou pen-drive. Basta copiar e colar. Feito isso, coloque o CD do Windows no computador e reinicie a máquina. Se nada acontecer, é preciso configurar o sistema para que ele inicie pelo drive de CD ou DVD. Para fazer isso, resete o PC novamente e entre na BIOS do sistema, apertando uma tecla específica durante a inicialização (a forma de acesso varia de acordo com o fabricante; costuma ser o botão Delete, ou o F5 ou o F12, fique atento ao que aparece na tela enquanto o computador é ligado). Depois, basta seguir as instruções. Em breve, seu PC estará normal.

ERRATA

Interface principal do Windows 7: problemas do OS podem ser resolvidos com uma rápida reinstalação

Na reportagem “Para qualquer tipo de mídia” publicada na Locaweb em Revista 35, o cargo de Diego Eis aparece errado. O correto é coordenador de programação frontend da Locaweb.

8locaweb

Email.indd 8

9/18/12 11:08 PM

lwnotícias //As novidades da Locaweb, a maior empresa de serviços de internet do Brasil

Publicidade na internet Parceria entre Locaweb e Google lança serviço de gerenciamento para Google Adwords focado na criação, monitoramento e gestão de campanhas na web

D

ois gigantes do segmento de tecnologia uniram forças para oferecer às pequenas e médias empresas mais um aliado na busca pelo sucesso. Chega ao mercado o Gerenciamento Locaweb para Google Adwords, serviço que permite criar, monitorar e gerenciar campanhas online, otimizando recursos e aprimorando o retorno sobre investimento. Segundo o Interactive Advertising Bureau (IAB), principal entidade que acompanha o mercado publicitário digital brasileiro, os investimentos nessa modalidade de campanha devem crescer 39% no Brasil até o final de 2012, assumindo o segundo lugar entre as mídias mais atraentes. E os links patrocinados ocupam papel de destaque nessa realidade, por ser uma ferramenta prática e acessível para empresas de diversos portes. “Identificamos no Brasil um amadurecimento das pequenas

Segundo o Interactive Advertising Bureau (IAB), os investimentos no Google Adwords devem crescer 39% no Brasil até o final de 2012

Com custo inicial de R$ 199, serviço possibilita a criação, monitoramento e gerenciamento de campanhas online

e médias empresas, que passaram a buscar soluções inteligentes para incrementar o próprio negócio. Ao disponibilizarmos o novo Gerenciamento Locaweb para Google Adwords, vamos permitir que um número maior de empresários usufrua dos benefícios que a publicidade online oferece,” diz Guilherme Mazzola, gerente de marketing de produtos SaaS da Locaweb.

O novo serviço tem custo inicial de R$ 199. Para mais informações, acesse: www.locaweb.com.br/ googleadwords.

10locaweb

Noticias.indd 10

9/18/12 11:28 PM

lwnotícias

Ferramenta permite que o profissional volte o foco apenas para o desenvolvimento enquanto a Locaweb se preocupa com o gerenciamento do servidor

As últimas novidades do Cloud Server Pro O Cloud Server Pro traz novos recursos para facilitar o gerenciamento e o dia a dia do administrador. São novas APIs que oferecem funcionalidades para otimização das principais atividades, como comandos padrões para criar, deletar, desligar, ligar e reiniciar a máquina, além de monitoração proativa do servidor, que identifica o consumo de cada recurso e a necessidade de upgrade com alertas por e-mail, ambas já inclusas em todos os planos de Cloud Server Pro. Acesse www.locaweb.com. br/produtos/cloud-server/precos.html.

Locaweb é uma das 150 Melhores Empresas para Trabalhar no Brasil

Java e Ruby on Rails para Servidores Gerenciados A

Locaweb passou a oferecer ambiente para Java e Ruby on Rails por meio do Cloud Server Gerenciado. Com essa nova opção, o profissional poderá focar apenas no desenvolvimento de suas aplicações nas plataformas java, .net, ruby e php, sem precisar se preocupar com atualizações de sistema operacional, segurança e servidor web, além das rotinas de backup e restore. Além disso, por meio da parceria fechada com a New Relic, clientes

de cloud da Locaweb contam com o New Relic Standard grátis, ferramenta de monitoramento de aplicação. Com ela, o cliente passa a ter acesso a um dashboard completo com informações da sua aplicação em produção em tempo real. Isso auxilia no encontro de gargalos, informação quanto às consultas a banco de dados, entre outras informações que auxiliarão a otimizar o seu desenvolvimento. Confira mais informações em www. locaweb.com.br/Gerenciados.

O Guia Você S/A 2012 divulgou a lista das 150 melhores empresas para trabalhar no Brasil, e a Locaweb acaba de entrar para esse ranking. Se você conhece alguém que se identifica com os valores da empresa e sonha em trabalhar em uma das I50 melhores, indique a página Trabalhe Conosco: www.locaweb.com. br/sobre-locaweb/trabalhe-conosco. html. Você também pode participar!

2º Seminário Locaweb de Negócios Digitais Se você estiver em Goiânia ou Florianópolis, confira o 2º Seminário Locaweb que ocorre nessas cidades, respectivamente, em 20 e 29 de novembro. Além de informação e conhecimento, o evento oferece um grande networking para os profissionais da rede, estudantes e empreendedores. Tudo isso gratuitamente! Acesse: www.seminariolocaweb.com.br/ participants/new. locaweb11

Noticias.indd 11

9/18/12 11:28 PM

lwwishlist

O melhor da vitrine digital O que há de mais interessante nas prateleiras ao redor do mundo CAIXA DE SOM PARA IPAD E SMARTPHONES

A caixa de som Logitech Wireless Boombox tem como pontos positivos excelente qualidade de áudio e suporte a transmissão wireless. Com 1,1 kg e potência de 20 W RMS, o equipamento conta com conectividade via bluetooth e cabo com conexão 3,5 mm. O equipamento funciona com iPads, iPhones ou qualquer outro smartphone ou celular com saída 3,5 mm. Sua autonomia de bateria é de até 6 horas. O preço sugerido da caixa de som é de R$ 600. Mais informações: www.logitech.com/pt-br/home

MESA DIGITALIZADORA

A mesa digitalizadora Wacon Intuos 5 Touch é voltada para profissionais que buscam fidelidade nos traços. O equipamento chama a atenção pelo design, fino e preto, que acompanha uma caneta de aparência retrô. Tem 1.800 g e resolução de 5.080 lpi (linhas por polegada). A caneta apresenta 2.048 níveis de pressão. Conectado via USB e com taxa máxima de transferência de dados de 197 pps, tem preço sugerido de R$ 1.000 (pode variar de acordo com as dimensões da mesa). Mais informações: www.wacom.com

12locaweb

WishList.indd 12

9/18/12 11:08 PM

lwwishlist

CAIXINHA INTELIGENTE

A InternetBoxTV, da Multilaser, funciona mais ou menos como a Apple TV. Trata-se de uma caixinha que, via cabo HDMI, é conectada à TV para permitir o acesso à internet e a uma série de aplicativos Android, que acompanham o equipamento. Assim, o usuário pode ver, na tela da televisão, vídeos do YouTube, acessar mídias sociais e brincar com games. Com conexão wi-fi e Ethernet e 340 gramas, a InternetBoxTV tem preço sugerido de R$ 500. Mais informações: www.multilaser.com.br

TABLET COM 2 GB DE RAM

O HP Slate 2 é mais um equipamento que chega ao mercado de tablets. Com tela de 8,9 polegadas, o aparelho inova ao rodar o sistema operacional Windows 7 Professional. O hardware chama a atenção, graças ao processador: Intel Atom Z670, de 1.5 GHz, e à memória RAM de 2 GB. Além disso, o Slate 2 conta com câmera de 3 Mpixels e espaço de armazenamento de 64 GB em SDD. As conexões se dão em Wi-Fi, Bluetooth 4.0, micro SD, modem 3G, P2 e USB. O preço sugerido é de R$ 2.750. Mais informações: www8.hp.com/br

PEN-DRIVE 3.0

O DataTraveler 111 é a primeira memória Flash USB 3.0 da marca Kingston disponível a partir de 8 GB. A tecnologia oferece taxas mais rápidas de leitura e transferência de arquivos, como músicas, fotos, vídeos e outras mídias. Disponível nas versões 8 GB, 16 GB e 32 GB, o DT 111 tem preços sugeridos de R$ 39, R$ 67 e R$ 135, respectivamente. Funciona nos sistemas operacionais Windows 7, Vista e XP, Mac OS (a partir da versão 10.5) e Linux (a partir da versão 2.6). É compatível também com as entradas USB 2.0. Mais informações: www.kingston.com.br

locaweb13

WishList.indd 13

9/18/12 11:09 PM

lwwishlist

ULTRABOOK MACIO

O ultrabook Samsung Série 5 Ultra conta com processador i5 de 1,6 GHz e memória RAM de 4 GB. Com a espessura de um envelope cheio – 31,5 x 1,49 x 21,8 (LxAxP, em cm) –, o equipamento tem tela: 13.3" LED HD 16:9 antirreflexiva com resolução de 1.366 x 768 px e chama a atenção pelo teclado, que é bastante macio. Traz ainda alto-falantes 4W estéreo (2W x 2), câmera integrada de 1.3 megapixel HD e disco rígido de 16 GB iSSD. Como todo ultrabook, porém, não conta com drives de CD e DVD. O preço sugerido é de R$ 2,4 mil. Mais informações: www.samsung.com.br

TECLADO INTELIGENTE

O teclado gamer Razer DeathStalker Ultimate conta com uma interface inovadora chamada de Switchblade. Ao mesclar funções touchpad de LCD e keypad de LED, o equipamento transforma o periférico em um painel de controle com dez teclas que podem ser usadas para preparar comandos, macros e habilidades com mais facilidade. O painel de LCD abaixo das teclas pode ser usado para exibir informações do jogo ou para visualização de conteúdo externo, como o do YouTube ou de mídias sociais. O preço sugerido é de R$ 1.299. Mais informações: www.razerzone.com

FONE CONFORTÁVEL

O Razer BlackShark é um fone de ouvido voltado principalmente para jogadores, já que suas almofadas de couro sintético são confortáveis e eliminam os ruídos ambientes indesejados. Assim, quem usa o equipamento tem o foco totalmente voltado para o game. Com design arrojado, inspirado no game de aviação militar Battlefield 3, o BlackShark pode ser usado em PCs e também em aparelhos portáteis, já que integra um microfone destacável. O preço sugerido do fone é de R$ 499. Mais informações: www.razerzone.com

14locaweb

WishList.indd 14

9/18/12 11:09 PM

lwwishlist

HD EXTERNO PARA IPHONE E IPAD

O Kingston Wi-Drive é um HD externo wireless desenvolvido para usuários de iPhone, iPad e iPod Touch. Ele se conecta aos aparelhos por meio de um app gratuito que pode ser baixado na App Store. O acesso ao conteúdo é feito a distância, sem o uso de cabos. Com o app, dá para gerenciar e conferir conteúdos multimídia de uma maneira simples e prática, o que é muito útil na hora de rodar vídeos e fotos. Com 16 GB de espaço e conexões USB e Wi-Fi, tem preço sugerido de R$ 200. Mais informações: www.kingston.com.br

NOTEBOOK ULTRAFINO

Com hardware de ponta, alto desempenho e um belo design, o Dell XPS é um notebook ultrafino equipado com processador Intel i7 com 1,7 GHz e memória RAM de 4 GB. Rápido nas respostas, o equipamento tem bordas arredondadas e é muito fácil de carregar. Sua tela é de 13,3 polegadas e a capacidade de armazenamento é de 256 GB SSD. O XPS conta ainda com webcam de 1,3 Mpixel, teclado retroiluminado e bateria de 6 células, com duração de até oito horas. O preço sugerido é de R$ 5.998. Mais informações: www.dell.com.br

CELULAR COM WINDOWS

O smartphone Lumia 900 da Nokia vem equipado com Windows Phone. O sistema permite ao usuário acessar o conteúdo por meio de quadros grandes na tela principal, pela nova interface da Microsoft, batizada de Metro. Destaque para as respostas rápidas dos botões, cujo uso é bastante intuitivo. O aparelho tem processador de 1.4 GHz e câmera de 8 Mpixels. A capacidade de armazenamento é de 16 GB. Destaca-se ainda a tela, de 4.3 polegadas, com 800x480 pixels de resolução. O preço sugerido é de R$ 1,7 mil. Mais informações: www.nokia.com/br-pt

locaweb15

WishList.indd 15

9/18/12 11:09 PM

lwcase //Ações criadas pelos clientes da Locaweb para melhorar o dia a dia online

Adeus às “travadas” Nova era de games deixa choke e loss de lado e se concentra apenas em oferecer boa qualidade para os que não vivem sem o mundo virtual Aline Mariano

O

Extreme Games (www. extremegames.com.br) é um site que oferece novas possibilidades para os amantes de jogos online. Inaugurada há cinco anos, a empresa tem como foco oferecer soluções de games na internet a

partir de servidores dedicados. Entre os títulos destacam-se Counter Strike e Call of Duty. Ver os jogos travarem nas fases mais difíceis é algo comum para quem curte games online. Por isso, encontrar um ambiente estável é essencial para aproveitar tudo que as

disputas oferecem. “Se trava, perde toda a graça”, afirma Jônatas Rossi, gerente comercial da Extreme Games. E é para isso que servem os servidores dedicados a jogos, revendidos pela empresa a partir dos serviços oferecidos pela Locaweb.

Servidores Certos jogos, como Counter Strike, precisam estar conectados a algum servidor para rodarem. A partir daí, quando se contrata uma máquina exclusivamente para game, o resultado é que o jogo ganha muito em qualidade. “Com um servidor dedicado, o jogo não trava, já que você restringe

NOVOS NEGÓCIOS

Empresa: Extreme Games URL: www.extremegames.com.br Área: Games

Jogos Valve: Counter-Strike Czero, Counter-Strike 1.6, Counter-Strike SOURCE, Left 4 Dead, Left 4 Dead 2, Team Fortress. Call of Duty: Call of Duty 2, Call of Duty 4. Urban Terror: Urban Terror. Outros: America’s Army, Tactical OPS, Enemy Territory, Day of Defeat, Team Fortness 2.

16locaweb

Case.indd 16

9/18/12 11:23 PM

lwcaseextremegames

A Extreme Games usa dois servidores dedicados II da Locaweb. Abaixo, painel de gerenciamento oferecido ao usuário

aquela parte da máquina apenas para a sua disputa, e só convida seus amigos para a dividirem com você”, diz Rossi. Segundo o gerente comercial da Extreme Games, existem diversos servidores públicos para jogos online, mas costumam travar constantemente, já que são divididos com inúmeras pessoas. “Enquanto isso, os servidores próprios são restritos e bem mais eficazes”, acrescenta.

e mudar addons (plugins que geram status e para a conversa). Além disso, há um painel de gerenciamento via web que possibilita desligar, reiniciar e ligar o servidor quando necessário. Os convites para jogos são feitos dentro do próprio game. Cada um tem uma quantidade de slots. Isso significa, na prática, que quem tiver 45 slots pode jogar, nesse servidor, com até 45 pessoas.

Como tudo funciona

Com o objetivo de melhorar sempre seus serviços, a Extreme Games se uniu à Locaweb há quatro meses. A princípio com um teste piloto, o projeto atingiu sucesso rápido e, hoje, a empresa é a única a hospedar jogos no servidor dedicado Locaweb. Nas máquinas usadas pela Extreme Games, são colocados servidores de jogos para que sejam

A Extreme Games aluga dois servidores dedicados II da Locaweb. Neles, a empresa hospeda diversos jogos. Uma vez conectado o CS (Counter Strike) no PC, por exemplo, é possível contratar um servidor específico para o seu jogo. Quando o usuário contrata o plano do Counter Strike no site, é enviado um número de IP mais o número de uma conta – tudo em um código só. Assim que inicia o jogo, o gamer encontra a opção “Jogar na Internet”. Se já tiver contratado o servidor da Extreme Games, basta adicionar o número completo que eles enviaram, para então entrar em sua conta particular na rede. Isso permite ao usuário o acesso total ao servidor para gerenciar

Parceria Locaweb

TEAM SPEAK Para quem não está acostumado com jogos, o team speak é um recurso usado pelos gamers para se comunicarem. Quase indispensável nas salas de games, é o auge das disputas realizadas hoje em dia.

Com a Locaweb, percebemos que há ótima estabilidade no servidor e, por consequência, no jogo ::Jônatas Rossi Gerente comercial da Extreme Games

repassados aos clientes por meio de um aluguel, contratado no próprio site extremegames.com.br. “Desde que começamos a usar a Locaweb, percebemos que há ótima estabilidade no servidor e, consequentemente, no jogo. Outro aspecto importante é que a Locaweb oferece proteção a ataque DDOS, então estamos livres dessa pane”, conta Rossi. Esse tipo de ação maligna é uma tentativa de derrubar um servidor por meio de muitos acessos simultâneos a ele. “Assim, conseguimos hospedar novos clans, como Call of Duty 2 e 4 e alguns no Counter Strike 1.6 e Counter Strike Source. Agora saímos na frente dos concorrentes ao hospedar o novo Counter Strike: Global Offensive”, finaliza o gerente da Extreme Games.

locaweb17

Case.indd 17

9/18/12 11:23 PM

lwcasewebstore

Sua loja AQUI! Se você também tem uma WebStore

Locaweb e deseja aparecer nesta seção, entre em contato conosco por meio do e-mail locaweb@europanet.com.br. Aguardamos seu contato!

www.motomobile.com.br

O SITE Ao acessar o site MotoMobile, o internauta encontra em destaque, logo na home, os produtos oferecidos pela loja. À esquerda da tela, existe um menu onde eles estão separados por categorias, o que torna a busca mais fácil. Em uma barra superior, o visitante pode acessar informações sobre a loja, pagamento e entrega.

18locaweb

Webstore.indd 18

9/18/12 11:09 PM

lwcasewebstore

MotoMobile Com contratação da WebStore da Locaweb, oficina amplia oportunidades de negócios e passa a vender peças e acessórios pela web

D

esde 2003, a oficina MotoMobile oferece aos seus clientes, no bairro da Mooca, em São Paulo, os serviços de manutenção e conserto de motos, como pintura e instalação de alarme. O estabelecimento também vende peças e acessórios para motocicletas. Entre as pessoas que procuram esses serviços e produtos, destacam-se amantes das motos e motoboys. Pensando em oferecer cada vez mais conforto a esses usuários e sempre em busca de novos clientes, a MotoMobile aderiu ao e-commerce. A entrada para o mundo digital aconteceu em julho de 2012, e a escolha da solução da loja virtual da Locaweb se deu pela praticidade da ferramenta. Com as imagens de todos os produtos em mãos, foram necessárias apenas oito horas para o site ficar pronto. No dia seguinte, a página já estava no ar com todos os produtos disponíveis para compras, de um jeito amigável e fácil de o usuário compreender. Era exatamente isso que os sócios da MotoMobile buscavam: uma plataforma ágil e que trouxesse números rápidos. No seu primeiro mês, a loja online atingiu uma média de

Em apenas oito horas, o site da MotoMobile ficou pronto. Em um dia, já estava no ar utilizando a ferramenta de loja virtual da Locaweb. No seu primeiro mês, a página recebeu uma média de 65 visualizações por dia 65 visitantes por dia, muito mais do que a loja de bairro. A webstore da MotoMobile está fazendo tanto sucesso que os seus donos já estudam manter por lá apenas a oficina e restringir as vendas ao site. Eles acreditam que administrar uma loja pela internet é bem mais fácil, pois o foco fica voltado exclusivamente para o que interessa. Entre os produtos mais procurados estão os equipamentos de segurança, como capacetes, jaquetas, alarme e cadeados de segurança. Entre no endereço online www.motomobile.com.br e confira.

locaweb19

Webstore.indd 19

9/18/12 11:09 PM

lwvitrinewebstore

+WebStore Está procurando um lugar que seja fácil, prático e rápido para comprar? Confira aqui 11 lojas virtuais, parceiras da Locaweb, e faça suas compras com todo o conforto que você sempre desejou. Banana's Price

www.bananasprice.com.br

TOYSHOP colecionáveis

Empório | N.A.

BRUSFER

Empório Naturallis

toyshopbrasil.webstorelw.com.br

brusfer.webstorelw.com.br

www.emporiona.com.br

comitre.webstorelw.com.br

20locaweb

VitrineWebstore.indd 20

9/18/12 11:04 PM

lwvitrinewebstore

Tillamo

MaxStore.com

take a take

NeoNutri

Farmais TremembĂŠ

Capital da Louça

tillamo.webstorelw.com.br

takeatake.webstorelw.com.br

farmaistremembe.com.br

projetodigital.webstorelw.com.br

neo-nutri.com.br

capitallouca.webstorelw.com.br

locaweb21

VitrineWebstore.indd 21

9/18/12 11:04 PM

Evento Startup Plotter

Branco.indd 22

9/18/12 11:59 PM

Evento Startup Plotter

Branco.indd 23

9/18/12 11:59 PM

lwopinião

espaçoabradi

Onde estão profissionais? Jonatas Abbott

Sócio-diretor executivo da Dinamize e presidente da ABRADi E-mail: abbott@dinamize.com

A dificuldade das agências em preencher cargos se deve a dois motivos: o aumento da demanda e o fato de os profissionais bons serem escassos e estarem bem colocados

C

om o mercado de internet em pleno crescimento, a escassez de profissionais é uma das maiores queixas das agências digitais. Um levantamento recente que conduzimos na ABRADi ilustra bem este momento e a demanda do mercado digital brasileiro, destacando o problema crônico de formação no Brasil. Destaque para o profissional da área comercial, o segundo mais difícil de ser encontrado. Uma das queixas mais comuns que ouço de agências e empresas de tecnologia no Brasil é a falta de bons comerciais. Há dois problemas aí: a histórica carência de formação comercial no Brasil, onde "vendedor" é um termo pejorativo e não uma profissão; e a falta de conhecimento da área por alguns empreendedores de tecnologia. Resultado: os donos das agências tornam-se os vendedores. A dificuldade das agências em preencher cargos se deve a dois motivos: o aumento da demanda e o fato de os profissionais bons serem escassos e estarem bem colocados. As exigências não param de crescer na proporção da evolução da cultura digital dentro das empresas e do aumento e complexidade das mídias (meios) digitais em que elas devem estar presentes.

Uma recente pesquisa de cargos e salários do mercado digital, conduzida pela ABRADi, chama atenção para os cargos de programador sênior – com um aumento de 30% de 2010 para 2011 –, atendimento com 40% de aumento, seguido pelo diretor de mídia com 50%. A tendência daqui pra frente é o aumento da escassez de profissionais na medida em que o meio acadêmico não acompanha a criação de cursos no ritmo da demanda de mercado. O que é natural, apesar de novos cursos, especificamente digitais, estarem surgindo tanto em universidades como em institutos particulares, já que a demanda é muito superior à necessidade do mercado brasileiro por profissionais bem capacitados. E há um agravante que explica essa escassez. As agências passaram a competir com as empresas-clientes na contratação, haja vista que profissionais de e-commerce, social media, e-mail marketing e até mesmo SEOs têm um ótimo espaço hoje nas grandes corporações brasileiras em geral. Essas empresas, independentemente das agências fornecedoras, descobriram que é impossível manter uma vida digital própria, com resultados positivos, sem manter uma equipe interna, mesmo que pequena.

24locaweb

ColunaABRADI_Jonatas.indd 24

9/19/12 1:56 PM

kwarup.com

gerenciamento.

MAIS UMA RAZÃO PARA VOCÊ CONTRATAR O CLOUD LOCAWEB. Com o gerenciamento da Locaweb você garante um ambiente constantemente atualizado e de alta segurança para suas aplicações, pois todas as rotinas de backup de armazenamento, restore e atualização dos sistemas operacionais, além da pré-configuração de Firewall, são de nossa responsabilidade. Deixe todas as preocupações de gestão do ambiente com a Locaweb.

Cloud É loCaweb. Locaweb.com.br/Cloud

An_Gerenciamento_205x275.indd 1

9/12/12 10:04 AM

lwopinião

mercado

O culto da moral cinzenta do SEO E

Fabio Akita Cofundador da Codeminer 42 E-mail: akitaonrails@ codeminer42.com

Não é preciso ser gênio: se um site precisa recorrer a técnicas Black hat, obviamente é porque seu conteúdo ou utilidade é próximo de zero

xistem apenas dois tipos de produtos no mundo: os bem feitos e os mal feitos. Há apenas dois tipos de desenvolvedores web no mundo: os White hats e os Black hats. E existem apenas dois tipos de profissionais no mundo: os inteligentes e os que acham que são inteligentes. Search Engine Optimization, ou SEO, não é algo novo. Todo buscador, como Google, tem guias bem documentados que, necessariamente, qualquer desenvolvedor web tem obrigação de saber. Técnicas documentadas como “melhore a estrutura das suas URLs” não são dicas voltadas apenas para SEO. Na verdade, são boas práticas de programação em geral. Podemos até afirmar que se um desenvolvedor programa por meio de boas práticas, o produto final automaticamente já terá SEO. Alguns falam em SEO como se fosse algo “extra”. Porém, como uma técnica como “torne seu site mais fácil de navegar” pode ser algo “extra”? De qualquer forma, técnicas como as descritas no “Google SEO Starter Guide” são conhecidas como White hat. Muitos programadores web – que na verdade são, no máximo, “codificadores” ou “costuradores de código”, mas nunca “programadores” – usam as técnicas conhecidas como Black hat, ou

seja, aquelas que exploram possíveis defeitos ou buracos para enganar os buscadores e, eventualmente, conseguir melhores posições no ranking. São técnicas usadas pelos péssimos profissionais e produtos web. Não é preciso ser gênio: se um site precisa recorrer a técnicas Black hat, obviamente é porque seu conteúdo ou utilidade é próximo de zero. Se um programador implementa essas técnicas, significa que está em um emprego medíocre de um site que não tem futuro. E técnicas Black hat são meramente “bugs” no sistema que, quando encontradas, são corrigidas. Aí, muitos desses “codificadores” reclamam quando o Google muda suas regras. Para garantir um posicionamento no ranking de pesquisas de buscadores recorrendo apenas a boas práticas – White hat –, seu produto precisa ser bom. Atrair pessoas pelas funcionalidades, pela usabilidade. Isso dá trabalho, mas é o que garante um bom negócio no longo prazo. Para atrair pessoas no curto prazo, você sempre precisará enganá-las, ser vigarista, ser imoral, aceitar o fracasso do seu produto e usar técnicas Black hat para, em um curto período de tempo, enganar a si mesmo achando que o aumento de tráfego significa bons clientes. Ledo engano.

26locaweb

ColunaMercado1_Akita.indd 26

9/19/12 2:00 PM

kwarup.com

SEGURANÇA.

MAIS UMA RAZÃO PARA VOCÊ CONTRATAR O CLOUD LOCAWEB. Se você busca mais proteção para arquivos e informações importantes do seu negócio, contrate o Cloud Locaweb, que armazena dados de cada cliente isoladamente, garantindo mais segurança.

Cloud É loCaweb. Locaweb.com.br/Cloud

An_Segurança_205x275_neg.indd 1

9/12/12 10:05 AM

lwopinião

mercado Pa nda

Pinguim

Cuidado com os bichos do Google O Marcelo Negrini

Diretor de Evangelismo da Buscapé Company E-mail: marcelo.negrini@ buscapecompany.com Dúvidas: www.formspring. com/mnegrini

Quando o Pinguim e o Panda são atualizados, eles atingem grandes sites que se especializaram em usar “buracos” nos algoritmos a seu favor

Google batizou seus últimos algoritmos para SEO como Pinguim e Panda. Eles representam mudanças na maneira como a gigante da tecnologia classifica suas páginas e, quase sempre estão associados à queda de muitos sites nas classificações do Google. Essas atualizações de algoritmos são relacionadas de maneira diferente do que ocorre quando um site é penalizado pela equipe humana do Google. A boa notícia em relação aos algoritmos é que basta você ajustar seu site para que os rankings no Google melhorem automaticamente, sem passar pelo “castigo” das punições manuais. O Pinguim e o Panda são algoritmos especiais, que rodam fora do índice principal do Google. Quando eles são atualizados, atingem visivelmente grandes sites que se especializaram em usar “buracos” nos algoritmos a seu favor. Pinguim: Excesso de Otimizações – Esse algoritmo, de 2012, atinge sites que foram tão otimizados que ferem as recomendações do Google. Exemplos incluem sites com links de má qualidade, conteúdos duplicados ou excesso de palavras-chaves. Nesses casos, o Pinguim anula os sinais positivos observados por meio dessas práticas, piorando muito os resultados orgânicos.

Por exemplo: um site pode usar métodos pouco louváveis para aumentar seus links de entrada, como diretórios de SEO, links recíprocos e comentários com links em blogs. Em outras palavras, o uso de palavras-chaves nesses “geradores de links” é sempre abusivo e pode aumentar o peso desses sinais. Mas o Pinguim do Google vai estar lá para acabar com a festa. Panda: Conteúdo Ruim – Antes do Pinguim, em 2011, o Google já havia criado o Panda para atacar sites com conteúdo de má qualidade, como os inúmeros endereços de dicas e de “como fazer”. Esse algoritmo é atualizado constantemente e virou o inferno tanto dos “blogs de marca” quanto de grandes empresas de conteúdo raso, as chamadas content farms. Textos “bobinhos” e, principalmente, copiados e colados de outros lugares, especialidade dos blogs de empresas brasileiras, são os mais atingidos. De novo, os valores desses sinais são zerados e o conteúdo ruim não serve para nada. Esses bichos do Google têm o objetivo de recompensar os sites que realmente criam bons conteúdos e, portanto, recebem links de qualidade. Assim, seguem o objetivo original do Google, que é constantemente distorcido por “especialistas” em SEO.

28locaweb

ColunaMercado2_MarceloNegrini.indd 28

9/19/12 2:16 PM

kwarup.com

ELASTICIDADE.

MAIS UMA RAZÃO PARA VOCÊ CONTRATAR O CLOUD LOCAWEB. Com o Cloud Locaweb, você redimensiona a estrutura contratada na hora e só paga pelo que usar. É ideal para seu hotsite ou e-commerce, em que as demandas podem variar.

Cloud É loCaweb. Locaweb.com.br/Cloud

An_Elasticidade_205x275.indd 1

9/12/12 10:03 AM

lwopinião

mercado

O famoso restaurante desconhecido

V Marcello Barbusci Autor do blog barbusci.com.br E-mail: marcello@barbusci. com.br Twitter: @mbarbusci

Para que o SEU marketing esteja aliado ao SEO, é necessário contar boas histórias para criar boas indexações nos sites de busca

ocê alugou um ponto e contratou o melhor arquiteto e decorador da região. Chamou o chefe de cozinha mais experiente e, mesmo assim, o seu restaurante não decola. Tem uma ou duas mesas ocupadas no almoço e no jantar. Isso porque as pessoas são de sua família e vão até lá apenas para dar uma força moral, já que a situação financeira está um bagaço. Pois bem: de que adianta ter de tudo do melhor se ninguém o conhece? Assim, entramos no foco da coluna desta edição: SEU marketing aliado ao SEO. Em um passado não muito distante, os entendidos em fazer marketing na internet simplesmente cadastravam seus sites nos buscadores para aparecerem nas primeiras páginas. Com o tempo, porém, isso foi mudando. As empresas e pessoas foram adicionando mais conteúdo aos sites que, até então, eram simples vitrines estáticas. Vieram os blogs e as redes sociais. Os canais começaram a trabalhar de forma integrada e os sistemas de busca também se aperfeiçoaram, descobrindo o quanto essa integração era benéfica aos seus resultados. E aqui vai a relação com o restaurante... O que adianta você usar todos os canais se

nenhum deles se comunica e, para piorar, não faz uma divulgação condizente? O SEO não vive mais só de palavras-chaves bem escolhidas e posicionadas dentro dos canais que você usa, mas sim de algo que vem do passado, adaptado ao presente: o fato de saber contar histórias, o chamado Storytelling. É isso mesmo, para que o SEU marketing esteja aliado ao SEO, é necessário contar boas histórias para criar boas indexações nos sites de busca. E, consequentemente, ficar bem posicionado nos resultados das pesquisas. As pessoas navegam hoje em sites enquanto se relacionam nas redes sociais e recebem notícias via RSS em seus e-mails, tudo ao mesmo tempo. Somos onipresentes perante a internet. E para tornar o seu negócio relevante neste novo tempo, você precisa mostrar o que faz, nos principais locais frequentados pelos seus clientes ou possíveis clientes. Você deve contar sua história em partes e cada pedaço em um canal. Assim, cria uma união entre os diferentes canais, gera relevância nos sites de busca por meio dos diferentes links publicados nos resultados e o melhor de tudo, prende o seu espectador. Quer melhorar o SEO? Aprenda a contar boas histórias.

30locaweb

ColunaMercado3_MarceloBarbusci.indd 30

9/19/12 2:19 PM

o O n vo

ue q a h c a ê c Se vo pinguim são panda e ois animais, apenas dis do que na está ma atualizar hora de ceitos sobre seus con a web buscas n no mília Mari Andreza E

32locaweb 32

MateriaCapa36.indd 32

9/18/12 11:54 PM

capaSEO

abalho . Um bom tr se atualizaram ngine E h inglês Searc de SEO (do Brasil o n o n), traduzid Optimizatio ismos an ec M ão para aç iz m ti O o com são de um uer a supervi q re a, sc u B de periente. pacitado e ex ca al n m io ss fi pro que precisa ternet, as variáveis it in u a m d o em d st n o Exi io d o mu o desde o iníc emos “Com consideradas r se t. “O u quando diz yo la e e d a fase d impressão jeto, ainda n site, ro p eb era”, dá a w o d to e muito rregamen d ca o d e d n o la p fa m te os sos que estam m dos diver mos! exemplo, é u E não esta or p s. á ores tr ad a sc o u p r tem os pelos b qualque ens utilizad e 10 anos, it d o seu s e o S . n e as m Há r as págin ecimento ea h u q n n co ra a m ar u p apenas com pessoa com se preocupar strução de er n n co ig á es m d e o eb ri w te desenhar lver intermediá provavelmen e e desenvo el d a, z a ez p el e b ca u a ado q páginas era certas mas tão pes plementar m site lindo, u im ue um dia e eg te ch s si a o um elhorar e a págin u m q á ra s. ir a p ed s p ca im explica Basto regras bási pesquisas”, isas. u as d sq e o p p s to na a n ao liará resultados e o SEO auxi e bem “Acredito qu alavras-chav bons para e os ic a “Algumas p m ún nteúdos código, u co o n ão as dor uç d ri od se pr lly, coordena m escolhidas in ”, diz Héric Ti de acordo co s os ri lo tu uá tí us e da os ão SEO boa descriç ento Site & ente para Desenvolvim eram o sufici de já o sóciod , ú es te ”, n ad ão R o co ra Beto oa posiç b Pa . a m eb l u w e ca ss Lo ve , responsáve que o site ti yn Interativa ador e CEO Pl d n da fu r s, to à to re as di as ad conta Ivan B itucionais lig que mantém r páginas inst po p, empresa m o trilíngue gi Ju lé eb co W a a d o A Gazet como as do , m ão co aç os escola, uc ad ed o social Skat portais renom com.br. v e do projet e. co ac Ya lR t ta ei B To do e é foca em Esportiva e sido o de qualidad m et ia oj av pr h ão um n ento (Return Os sites samento em bre o Investim so en p no o es, or m et R co em conversõ construídos ment/ROI) e pesquisas. st ento as m ve d In ça o p n or O to de o es. pedidos el d os aparecer n r te se ar p m em or de mpras que po não a mai sco ou as co m Pelo menos, um fale cono quer área, co al em u q em o. o pl , por exem Assim com ução passou e-commerce anos, a evol ão n o passar dos es que ercado aquel a tirar do m

N

locaweb33

MateriaCapa36.indd 33

9/18/12 11:54 PM

capaSEO

Anota aí!

Defina a estratégia, pergunte-se como quer ser encontrado e comece a trabalhar no conteúdo

“A otimização do mecanismo de busca é parte da estratégia de marketing do projeto web por fazer o usuário ou cliente interagir com o site. Antes, pensava-se unicamente no aumento de pageviews e pageclicks”, diz Rades. Tilly, da Locaweb, aposta que o grande papel do Google e a razão do seu sucesso é gerar uma boa experiência para o usuário final, entregando o conteúdo mais próximo do que ele estava buscando. “Desde 2003, o buscador vem fazendo periódicas mudanças no algoritmo, às quais os profissionais de SEO já poderiam estar acostumados”, lembra Manuela Sanches, diretora geral da Agência Enlink, especializada em link building e conteúdo otimizado e indicada pelo projeto Escola Dinheiro, como umas das dez principais agências do País no assunto. O motivo, de maneira resumida, é que o Google declarou guerra ao spam e quer se manter na liderança de mercado. As oscilações no ranking de busca provocadas pela mudança no algoritmo ganharam até um apelido: Google Dance. Para entender a utilidade de tais atualizações, deve-se imaginar uma situação. Pense em quantos blogs que falam sobre games, sejam eles independentes, sejam representantes de alguma agência de notícias. Suponha que a Nintendo anunciou uma nova versão do famoso jogo Super Mario Bros. Em poucas horas,

Boas práticas

» Sites de comércio eletrônico, concorrentes de um mesmo segmento, vendem os mesmos produtos e as descrições técnicas do fabricante são iguais. Com as mudanças de algoritmo que visavam destruir o conteúdo duplicado, as lojas virtuais que quiseram se destacar

Rades: “O bom SEO auxilia e resulta na produção de conteúdo único e essencial para o usuário de internet de forma geral”

todos os sites estarão com a mesma notícia no ar. Muitos deles, usando o próprio texto fornecido pela empresa. Ao considerar esse cenário, alguns desenvolvedores passaram a usar técnicas para que os buscadores entendam que o conteúdo do seu site é mais relevante que o do vizinho, mesmo que o texto e o assunto sejam praticamente os mesmos. “Para ‘enganar’ os mecanismos de pesquisas, lotam as páginas com palavras-chave, criam textos e links ocultos nos websites, entre outros truques”, comenta Bastos, da WebJump. Esse tipo de prática é considerada desonesta e afeta a credibilidade dos resultados dos buscadores, assim como mina os

Página do Google: sistema de busca molda a produção de conteúdo atual na internet

esforços de quem faz um trabalho de SEO competente. As últimas mudanças do algoritmo foram batizadas de Panda e Pinguim. Robinson Melgar, consultor, com passagens como especialista em SEO em companhias como a Vostu, esclarece que o Panda foi implementado

desenvolveram conteúdos próprios. De acordo com Héric Tilly, também começaram a utilizar as avalições sobre o produto na página. Isso nada mais é do que conteúdo gerado pelos clientes que compraram aquele produto. Cada loja tem seu próprio material. Um bom exemplo é o ebay (página do iPad, em http://goo.gl/X74MP).

34locaweb

MateriaCapa36.indd 34

9/18/12 11:54 PM

capaSEO

em fevereiro do ano passado com o objetivo de colocar sites de maior qualidade no topo das buscas. “Isso fez com que páginas sociais e de notícias conseguissem posicionamentos melhores do que os com muita publicidade, por exemplo”, comenta. Já o Pinguim, de abril, foi liberado com a intenção de penalizar ainda mais os sites que usam táticas de black hat, como inflar o número de palavras-chave, mostrar um conteúdo para o usuário e outro para o robô da busca, e a criação deliberada de conteúdo duplicado. “Ambos são baseados nas diretrizes do Google”, frisa Tilly. “Qualquer processo que não siga tais conselhos não deve ser seguido. Se você quer fazer testes, utilize sites que não sejam o principal ou o seu ganha-pão. Acho válido o estudo, pois assim aprende-se o que não fazer. Porém, não recomendo usar técnicas duvidosas em nenhum projeto de cliente, pois cedo ou tarde irá cair no ranking e manchar a reputação”, aconselha. Para o profissional, os que andam na linha

O Pinguim foi liberado com a intenção de colocar sites desenvolvidos no topo do ranking dos buscadores web” ::Robinson Melgar Consultor

não têm o que temer. Na verdade, serão beneficiados, pois removerão do índice os concorrentes desleais. No blog oficial da Central do Webmaster do Google, a recomendação é “concentrar-se na criação de sites de alta qualidade, que providenciam uma experiência de valor para o usuário e utilizam métodos de SEO white hat, em vez de recorrer a táticas agressivas de webspam”. Melgar acredita que o Panda e o Pinguim não são uma caça às bruxas. “O Google não quer trapaça com black hat, compra de links em outros sites, Blog Central do Webmaster, do Google: a dica é concentrar-se na criação de sites de alta qualidade

modificações no conteúdo que será rastreado pelos robôs dos buscadores ou textos recheados de palavraschave usando o CSS escondidos, por exemplo. “A obrigação do profissional de SEO é estar atento às mudanças e adaptar suas estratégias de acordo com elas”, sentencia.

Reconstrução de página

» Ivan Bastos, CEO da WebJump, explica como reformulou o site da Caçula de Pneus utilizando técnicas de SEO. “Ao recriar o site da Caçula de Pneus (www.caculadepneus.com.br), a principal preocupação era manter a posição nos buscadores. A página foi reconstruída em uma nova plataforma, seguindo todas as regras de SEO e de migração com as mudanças de URL amigáveis. Recomenda a criação de uma lista que informa aos buscadores que uma URL antiga mudou e qual passou a ser a nova URL. Não houve impacto negativo nos resultados das buscas pela migração e, pouco tempo depois, o site passou a ter melhor acesso, devido a toda a reformulação e inclusão de muitas informações e textos relevantes ao assunto. Foi um trabalho realizado em parceria com a empresa, que estava comprometida e disposta a melhorar o seu site.”

locaweb35

MateriaCapa36.indd 35

9/18/12 11:55 PM

capaSEO

Quem ganha com o endurecimento dos buscadores é o usuário, que faz a pesquisa e encontra realmente o que está procurando” ::Ivan Bastos CEO da WebJump

Existe um post na Central do Webmaster do Google que explica como a empresa vê sites de qualidade (http://goo.gl/u4zz8). Há também fóruns de ajuda a webmasters em diferentes idiomas para quem quiser obter conselhos ou dar feedback adicional (http://goo.gl/Lxn70). “Quem ganha com tudo isso é o usuário final, que faz a sua pesquisa e encontra realmente o que está procurando”, avalia Bastos. Segundo Manuela, se as mudanças no algoritmo trouxerem quedas no

Apoio

» Estude os dados de ferramentas como Google Analytics, Google Webmaster Tools e Omniture para saber como as pessoas estão

ranking de busca, é preciso identificar, primeiramente, o que de fato aconteceu. “Foi mordida do Pinguim ou do Panda? Foi justo ou não? Se sim, faça os ajustes necessários, como remover conteúdo duplicado ou inserir canonical tag (tag html capaz de indicar para os mecanismos de busca que existe um conteúdo duplicado de uma página), adicione conteúdo informativo, tente remover links que possam parecer suspeitos e aposte em links de qualidade. Então

chegando ao site, por quais meios, quais palavras-chave estão sendo usadas, quanto tempo estão ficando e tudo que possa dar dicas sobre comportamento.

preencha o formulário ou escreva no fórum que o Google abre para webmasters”, ensina. Caso ache que foi punido injustamente, peça revisão preenchendo os formulários destinados a esse fim e aguarde.

Como estruturar um projeto de SEO Para começar, não existe milagre. A otimização nos mecanismos de busca é obtida por meio de um conjunto de aplicações. Imagine um site que não segue nenhuma recomendação de SEO. Ao inserir palavras-chave nele, pode-se ter um aumento de cinco posições no ranking. Ao implementar apenas um sistema de url amigável, ganha-se os mesmos cinco lugares. No entanto, se forem feitas as duas implementações juntas, o resultado pode ser 15 ou 20 posições. “Costumo dizer que, quando o assunto é SEO, a soma de um mais um pode ser igual a três. Ou é como fazer uma receita de bolo e retirar um dos ingredientes. O resultado pode ser algo

A página Google Analytics informa como as pessoas estão chegando até o seu website e o que procuram nele

36locaweb

MateriaCapa36.indd 36

9/18/12 11:55 PM

capaSEO

impossível de ser comido”, exemplifica o CEO da WebJump. Ele conta que é bastante comum uma empresa que já tem um site no ar querer apenas melhorar a visibilidade nos mecanismos de busca. No entanto, na maioria dos casos, a página foi desenvolvida de tal forma que se torna muito mais difícil trabalhar em cima do modelo atual do que construir um site novo. “Geralmente, isso acontece porque a empresa não quis investir no desenvolvimento com agências e profissionais realmente qualificados, e fez o site com o famoso ‘sobrinho’ a um preço nada competitivo.” Bastos aconselha definir a estratégia na fase de planejamento, antes mesmo do desenvolvimento do layout da página. Tilly foca também nas palavraschave. “A escolha delas deve ser feita baseada naquilo que o site vai oferecer”. Para Bastos, não importa quais sejam as mudanças nos algoritmos, os mecanismos de busca estarão sempre atrás de relevância.

Site da WebJump: companhia especializada em SEO diz que nem tudo é preto no branco no assunto “websearch”

“Ao procurar determinado assunto, o buscador quer destacar os sites que entregam o que está sendo procurado”, diz. A dica de ouro então é fugir dos atalhos. De acordo com o consultor Melgar, as últimas mudanças no algoritmo

do Google tiveram pouco impacto na escolha da palavra-chave. “Se for um site de compras, por exemplo, é preciso entender como a pessoa busca por produtos em diferentes momentos de sua tomada de decisão”, conta. “Primeiro, ela não sabe bem o

Google Webmaster Tools: companhia entrega a empresas e usuários diversas ferramentas e dicas para fortalecer sites

Omniture: outra excelente solução que informa modos de comportamento, que devem ser avaliados e assimilados

locaweb37

MateriaCapa36.indd 37

9/18/12 11:55 PM

capaSEO

Anota aí!

Tenha conteúdo de qualidade. É a melhor arma para um bom resultado nas buscas

É alta a importância do conteúdo na elaboração de um projeto sólido de SEO: os resultados são visíveis

Facebook: um bom conteúdo em sites garante que ele seja disseminado em redes sociais, gerando muita audiência

que quer e faz buscas mais amplas. Depois, já tem uma ideia melhor e busca por detalhes e especificações. Finalmente, toma a decisão e entra em um site para fazer a compra em si. Em cada um desses estágios, ela usa palavras-chave diferentes e é preciso identificar esses padrões para estar bem colocado em todas essas situações.”

Conteúdo ainda reina Por mais clichê que possa parecer, todas as fontes ouvidas pela Locaweb em Revista destacaram a importância do conteúdo na elaboração de um Twitter: quanto mais repercussão sobre sua página, melhor para o SEO

Panda x Pinguim

» Panda • Primeira versão do Panda foi lançada em fevereiro de 2011 no Google.com; • Atacou sites com conteúdo duplicado, bounce rate alto (taxa de rejeição) e links externos de baixa qualidade;

projeto sólido de SEO, com resultados visíveis nas páginas dos buscadores. A máxima de que o conteúdo é rei está mais forte do que nunca! O coordenador de Desenvolvimento Site & SEO da Locaweb aposta que há mais chances de indexar bem um site de bom conteúdo com pouca técnica do que o contrário. “Claro que, neste caso, o mínimo aceitável é que pelo menos o robô de busca consiga acessar o site. Hoje, temos muitas pessoas produzindo bons conteúdos, que não têm, necessariamente, conhecimento técnico. E, mesmo assim, estão bem colocadas na busca”, comenta. “O mundo ideal é conseguir casar conteúdo e técnica.” “Um bom conteúdo irá fazer com que as pessoas o divulguem mais nas redes sociais”, garante Melgar.

• Mais de 12% das pesquisas em inglês foram afetadas; • Chegou ao Brasil em agosto de 2011; • Esta mudança impactou entre 6% e 9% das pesquisas; • A atualização, a 3.5, foi lançada em 19 de abril e afetou sites brasileiros também.

“Além disso, fará com que outros sites incluam links para ele, e os links externos são um dos principais fatores para o sucesso do SEO.” Para Bastos, a lógica é simples: “Um texto bem elaborado, aliado às técnicas corretas de SEO, é a fórmula perfeita para o topo das pesquisas”. Se alguém entrou em um site desconhecido, por meio de uma pesquisa em um mecanismo de busca, é porque está procurando por uma resposta sobre aquele assunto específico. Se o conteúdo do site não dá essa resposta, significa que aquele texto é irrelevante e o usuário sai do site. “Os robôs estão cada vez mais capazes de identificar a relevância do conteúdo oferecido. Se não está condizente com o que foi definido como palavra-chave, título

Pinguim • Lançada em todas as línguas em 24 de abril; • Ajustaram fatores de spam, incluindo keyword stuffing e link spam; • Aproximadamente 3% das queries em inglês foram afetadas.

38locaweb

MateriaCapa36.indd 38

9/18/12 11:55 PM

capaSEO

do site, URL, e outros itens usados na indexação, é considerado irrelevante e perde posições nas buscas”, ensina.

Recorro ao Adwords se o cliente deseja resultados imediatos, para gerar tráfego no projeto eletrônico”

Como lidar com a pressão do cliente Um projeto de SEO sério não vai dar resultado do dia para a noite (aliás, desconfie 100% se alguém prometer isso!). É importante amealhar documentos, relatórios, históricos e tudo o mais possível – boas práticas e conhecimento técnico inclusos –, evitando a pressão desnecessária. “Para começar, não prometa datas e, muito menos, colocações. Trace metas e objetivos e explique que o que vem rápido vai rápido”, ensina Tilly. Bastos acredita que a melhor forma de alinhar expectativas é explicar como todo o processo funciona. “Não há como garantir o topo das posições. Hoje, você pode estar em primeiro nas buscas. Amanhã, o seu concorrente percebe isso, melhora o site e ganha o seu posto”, comenta. O trabalho de SEO deve ser contínuo: a cada mudança nos algoritmos, é preciso reavaliar se algo novo precisa

::Héric Tilly Coordenador de Desenvolvimento Site & SEO da Locaweb

ser implementado para não perder lugar. O importante não é conseguir resultados rápidos, e sim manter-se bem colocado. Já Melgar sugere ao profissional que tem mais experiência citar casos de sucesso anteriores para dar mais tranquilidade ao cliente. Entretanto, se a ansiedade é grande ou o cliente está apenas em busca de resultados imediatos, uma alternativa é utilizar a busca paga (AdWords) enquanto não ganha posições na busca orgânica. “Eu costumo fazer isso no começo, para gerar tráfego, ganhar confiança e ter retorno para continuar o projeto”, afirma Tilly. Bastos, da

WebJump, conta que o melhor de tudo é que a maioria dos sistemas oferece a opção de custo por clique. Isso significa que o anúncio pode ser exibido milhares de vezes sem a necessidade de pagar um centavo por isso, a menos que ele seja clicado. Ainda que um website tenha uma boa colocação nas buscas orgânicas, dependendo do ramo de atuação da empresa, o investimento em links patrocinados é indispensável. “Isso serve, por exemplo, para lojas virtuais, em que geralmente a concorrência é muito grande”, revela Bastos.

Dicas para produzir um bom conteúdo

Página de vídeos: uma boa dica para aumentar a relevância da página é transcrever o conteúdo de filmes

» Criar recursos como infográficos, e-books, artigos, slides, podcasts; » Listar fontes sobre determinado tópico; » Contar com a colaboração de pessoas influentes por meio de entrevistas ou opiniões de líderes em determinado segmento ou assunto. Além de contar com conteúdo de altíssima qualidade, eles compartilharão em suas próprias redes; » Transcrever conteúdo de vídeos e transformá-los em artigos; » Envolver as pessoas da empresa para que divulguem em suas redes pessoais; » Utilizar Facebook Ads, tweets patrocinados e Linkedin Banner Ads para promover suas redes e conteúdo. *Dicas da Manuela Sanches, diretora geral da Agência Enlink

locaweb39

MateriaCapa36.indd 39

9/18/12 11:55 PM

capaSEO

Anota aí!

Trabalhe no código e não se esqueça dos títulos, descrições e robôs quantidade e relevância dos cliques”, enumera. O AdWords permite a geração de códigos de conversões para identificar o retorno do investimento por meio de relatórios consistentes, seja por vendas ou para que o visitante simplesmente entre em contato com a empresa pelo formulário.

Futuro do SEO

Site da Agência Enlink: empresa diz que conteúdo a partir de métricas de SEO é a chave para aliar qualidade e visitas

Tilly lembra que, mesmo para links patrocinados, convém fazer um estudo sobre as palavras que deseja comprar e onde irá aparecer, para não gastar dinheiro à toa. “Se o objetivo é vender rodas de carro, não adianta comprar a palavra ‘pneu’. A pessoa que acessa o site por essa palavra, mesmo sendo coisas relacionadas, está procurando por ‘pneu’, que não é o negócio do site”, ilustra Bastos. Paga-se pelo clique sem resultado algum. E como mostrar ao cliente que o rico dinheirinho dele e o seu precioso tempo não foram em vão? “Se for um site de comércio eletrônico, pelo próprio Google Analytics é possível gerar um relatório de quanto entrou de venda apenas pela busca orgânica”, ensina Tilly. “Para outro segmento, a sugestão é tentar mensurar o que seria um retorno positivo, como um contato pelo fale conosco do site ou a visita a alguma página específica. Pode-se ainda mapear quantos acessos tal página obteve pela busca orgânica.” Ele cita também o caso de clientes que ligam para a empresa para fechar negócio após terem

No site Brick Marketing (http://goo.gl/ gzgBk), análise do Pinguim contra o Panda

visto a página na busca. Neste caso, é importante sempre perguntar como a empresa foi encontrada. Rades tem uma equação simples na cabeça: ROI = aumento de conversões. Não é audiência pura e simples. Na WebJump, adota-se muito o Google Adwords, que oferece uma plataforma de acompanhamento de desempenho e conversões sobre a campanha. Mas Bastos sublinha a importância de saber usar a ferramenta e extrair dela o melhor. “A escolha mais apropriada de cada palavra, mudanças sutis de valores dos cliques, horário de exibição, geolocalização, extensão de anúncios, entre muitos outros fatores, podem ter uma variação enorme na

Na maioria das vezes, as atualizações são lançadas nos EUA primeiro, depois para queries em inglês e também no Google de países da Europa. O Panda chegou aqui meses depois de ser lançado nos EUA. Isso é bom porque os desenvolvedores brasileiros podem acompanhar diversos casos e tirar deles importantes lições. Entretanto, não é uma regra. No caso do Pinguim, a atualização foi feita em todas as línguas simultaneamente. “É muito importante que conteúdo, SEO, gestão de redes sociais, link building e assessoria de imprensa estejam bem amarrados, e que sejam pensados como uma única estratégia, com vários desdobramentos”, explica Manuela. Há desenvolvedores que pensam que são os mocinhos e as atualizações, os vilões. “Elas são aliadas porque nos ajudam a convencer clientes a apostar em qualidade, ao invés de quantidade – o que é um grande alívio.” De acordo com ela, sempre que acontece alguma mudança no algoritmo, aparecem artigos com previsões apocalípticas sobre o fim do SEO. “É um exagero. Os sistemas de busca dependem de sites otimizados para entregar bons resultados. As alterações diminuem cada vez mais a relevância de práticas consideradas antiéticas e que são um atalho para chegar ao pote de ouro”, afirma. “Quem quer estar entre os primeiros tem de fazer por merecer. Ponto-final.”, sentencia Manuela. Trata-se de dançar conforme a música.

40locaweb

MateriaCapa36.indd 40

9/18/12 11:55 PM

C

M

Y

CM

MY

CY

CMY

K

Empresa lança uma família livre e dá uma guinada no rumo da história da tipografia Por Adèle Helena Ribeiro e Max Reinhold Jahnke

42locaweb

Design36.indd 42

9/18/12 11:22 PM

adobefreefonts

P

ela primeira vez, a Adobe lançou uma família de fontes de código aberto. Trata-se da Source Sans Pro, disponível nos formatos TTF e OTF (adobe.ly/NQSN1B). À primeira vista pouco significante, essa notícia carrega uma grande importância histórica. Para entender esse fato, é preciso voltar aos anos 1980, época em que a Apple liberava o sistema de fontes Royal para a Microsoft usar no OS/2 e a Adobe anunciava a publicação das especificações para o PostScript Type 1, espécie de remake da então proprietária linguagem Interpress, da Xerox. Nesse período, o mercado de computação pessoal ainda engatinhava. A Adobe possuía um monopólio de impressoras e cobrava taxas abusivas pelo licenciamento do sistema de fontes dela. Isso explica por que a Apple ajudava a Microsoft, pois, dessa forma, além de atacar o monopólio da Adobe, conseguia gerar compatibilidade com impressoras como a Linotype e produtos da extinta Compugraphic. Em meio a tudo isso, a briga por um sistema bom de fontes tornou-se grande e deu origem a um dos principais problemas na época: a dificuldade de criar produtos com um bom design de texto, independentemente do tamanho em que ele era exibido. Quem primeiro conseguiu resolver esse problema foi a Apple, e a solução encontrada pela empresa da maçã foi o lançamento do até hoje difundido sistema TrueType. Depois de muita briga, a Apple chegou a um acordo e licenciou o interpretador de PostScript da Adobe para suas impressoras. Enquanto isso, o TrueType, primeiro sistema que realmente conseguia escalar o texto mantendo uma boa resolução, transformou-se em padrão de fontes. O fato, porém, é que a briga não terminou por aí. A Microsoft e a Adobe

Página do Google Web Fonts, sistema desenvolvido para facilitar a busca e o uso de fontes na internet. Nele, existem centenas de famílias de fontes livres e com recursos interessantes

LIBERDADE JÁ!!!!

Tipologia da Source Sans Pro, primeira família de fontes livres lançada pela Adobe

lançaram o OpenType, uma espécie de “TrueType Open”, que hoje é o formato mais usado na maioria das plataformas. E assim criou-se uma dissidência no mercado que existe até hoje.

Fontes livres Apesar de a especificação das fontes ser livre, normalmente o design das letras é proprietário e faz com que o arquivo precise ser licenciado para uso. Por causa disso, muitas pessoas e empresas se interessaram em desenvolver fontes livres. Assim, surgiram vários exemplos de fontes bonitas, como as Fell, criadas pelo engenheiro civil Igino Marini e oferecidas sob a licença Open Font License. Essa família de fontes foi criada com base em manuscritos originais do século 17. E como ela existem muitas outras. O próprio Google mantém um diretório, chamado Google Web Fonts, feito com o intuito de facilitar

Pode parecer estranho, mas coisas simples como impressoras ou tipografia podem causar verdadeiras revoluções. Um exemplo é o do criador do Software Livre, o hippie malucão Richard Stallman, que começou o movimento após se frustrar por não ter acesso ao código fonte do software de uma impressora e, dessa forma, não poder implementar funcionalidades importantes para o laboratório para o qual ele trabalhava. Já o famoso cientista da computação Donald Knuth, escritor da obra The Art of Computer Programming, incomodado com a baixa qualidade das fontes disponíveis para a publicação do segundo volume da sua série de livros, resolveu criar seu próprio sistema de tipografia, hoje conhecido como Tex. O Tex se tornou a base do LaTeX, que é amplamente usado por periódicos científicos. Muitas universidades, inclusive, obrigam que teses e dissertações acadêmicas sejam escritas por meio dessa ferramenta.

locaweb43

Design36.indd 43

9/18/12 11:22 PM

adobefonteslivres

a busca e o uso de fontes na web. O serviço conta com centenas de famílias de fontes livres e com recursos interessantes, como a possibilidade de montar uma pequena galeria pessoal. Também é possível usar uma API, que explora recursos novos do HTML5 e agiliza a adição de novas fontes a um website. Existem ainda outros serviços desse tipo, como o Typekit e o WebInk. No repositório do Google, todas as fontes têm código aberto. Além

A Source Sans Pro da Adobe tem diversas formatações e dá suporte a vários idiomas disso, elas podem ser distribuídas livremente, usadas comercialmente e, o mais interessante de tudo, modificadas e melhoradas. O mesmo ocorre com a família de fontes Source Sans Pro lançada agora

pela Adobe, que sempre trabalhou com tecnologia relacionada à tipografia de alta qualidade, mas que nunca tinha investido no esquema Open Source. A Source Sans Pro tem diversas formatações e dá suporte a vários idiomas.

Conclusão

Baixe as fontes Adobe pelo site typekit.com/fonts/source-sans-pro; abaixo, tipos da família Fell

Hoje em dia, existem diversas fontes livres e abertas. Diversas delas são de altíssima qualidade, como as recentemente liberadas pela Adobe. Isso sem contar as várias opções disponíveis no serviço do Google e até mesmo as feitas por entusiastas, como as belas famílias criadas por Marini. Dessa maneira, pode-se dizer que, com o lançamento da Adobe, os universos da tecnologia da informação e do design deram um grande passo, não só para o desenvolvimento de websites mais bonitos e eficazes, mas também para o fim da pirataria de fontes.

44locaweb

Design36.indd 44

9/18/12 11:22 PM

ANUNCIO.indd 1

18/09/2012 17:40:40

windows8

8

As novidades Windows do

A nova versão do sistema operacional da Microsoft pode, ao mesmo tempo, ser muito parecida e muito diferente das anteriores Por Sérgio Vinícius

O

novo Windows 8 apresenta uma série de semelhanças em relação às versões anteriores do sistema operacional. E, ao mesmo tempo, é bastante diferente. Isso porque conta basicamente com duas interfaces principais. Uma é baseada no sistema de janelas, que apresenta o desktop tradicional, e pode ser confundida com a do Windows 7. A outra, formada pelo que se denominou design Metro (nome já aposentado pela MS), é baseada em quadradinhos bem definidos e tem a intenção de ser cumpridora para PCs e para smartphones e tablets. Além de os sistemas contarem com alguma semelhança visual, para

utilizar o Windows 8 a máquina pede requisitos de hardware idênticos aos do 7. São eles: processador de 1 GHz, 1 GB de RAM para 32 bits e 2 GB para 64 bits, espaço no disco rígido 16 GB (32 bits) ou 20 GB (64 bits). É preciso também contar com o dispositivo gráfico Microsoft DirectX 9 ou superior. Em vários momentos, um observador mais distraído que roda o Windows 8 no formato de janelas pode até mesmo confundir o novo OS da Microsoft com o XP ou Vista. Isso sem contar que, durante a instalação, os procedimentos são idênticos aos das últimas versões do sistema. É na primeira utilização do sistema que começam a aparecer as diferenças. Em dado momento, o sistema pergunta se o usuário deseja cadastrar seu login e senha da

plataforma Live (pode ser uma conta no Hotmail, Outlook e Skydrive). Em caso positivo, cada vez que acessar o PC, o usuário o fará por meio de seus dados nas redes da MS (senha). A partir daí, o sistema sincronizará uma série de informações que poderão ser facilmente acessadas em diversos dispositivos (além do PC, em tablets e smartphones que usem versões renovadas do Windows Phone, sistema semelhante ao Windows 8 e plenamente compatível com ele). Daí para a frente, há muitas particularidades e semelhanças com versões anteriores. Nas próximas páginas, você confere funções e recursos realizados com a nova versão do OS da Microsoft e a forma como isso era feito no Windows 7. Lado a lado, eles podem ser muito, muito diferentes. Mas nem sempre.

46locaweb

Win8.indd 46

9/18/12 11:13 PM

8

windows8

W7

Tela inicial

Foi uma das que mais mudaram. No Windows 8, uma página inteira é dedicada ao menu, ao contrário da módica janela lateral das edições anteriores.

W8 W7

Área de trabalho

Tanto no Win 8 como no 7 (bem como no XP e no Vista), é tudo igual visualmente falando. Pastas, janelas, barra de ferramentas... Tudo segue o mesmo padrão.

W8

Relógio do sistema

O que era um tanto discreto no 7 (também XP e Vista) passou a ter grande destaque no Win 8 (como nas últimas versões do Windows Phone).

W7

W8 locaweb47

Win8.indd 47

9/18/12 11:13 PM

windows8

W7

Compartilhamento

Para compartilhar arquivos nas versões anteriores, era necessário entrar em uma área específica. No Windows 8, abre-se uma pequena aba lateral que permite clicar sobre o sistema de compartilhamento, já informando o que se deseja dividir.

W8 W7

Configurações

Segue rigorosamente a linha de compartilhamento: janelas e áreas dedicadas no 7; abas e poucos cliques para realizar a ação no 8.

W8

Menu Iniciar

Sempre foi algo onipresente nas versões anteriores, uma espécie de norte do usuário. Na dúvida, bastava clicar sobre ele. No 8, o menu surge apenas caso o operador coloque o mouse para fora da tela, no lado esquerdo inferior.

W7

W8 48locaweb

Win8.indd 48

9/18/12 11:13 PM

windows8

W7

Menu lateral

O do Windows 8 relaciona os aplicativos abertos. Nas versões anteriores, isso não existia (suporte a apps para portáteis), mas em dadas versões do Windows (Vista e XP), havia a opção de uma barra lateral para informar itens de produtividade (como clima e anotações).

W8 W7

Administrador e perfil No Windows 8, está

W8

diretamente relacionado aos perfis nos serviços online da Microsoft. Nos anteriores, uma situação não estava ligada à outra. O acesso ao Windows era próprio; seu login e senha do Hotmail, por exemplo, era outra coisa.

Instalação de programas Outro item

clássico dos Windows é o Painel de Controle e seu sistema de desinstalar ou remover programas. No 8, dá para realizar a tarefa por meio de uma aba dedicada, na aba inferior da tela.

W7

W8 locaweb49

Win8.indd 49

9/18/12 11:13 PM

windows8

Preview de aplicativos Neste caso,

não há comparação. O preview de app é algo que existe apenas no Windows 8. Trata-se de uma nova opção de interface que está diretamente ligada à capacidade do sistema operacional de atuar em diferentes eletrônicos, além de PCs, como tablets e smartphones em geral. Nas versões anteriores do sistema da Microsoft, não havia compatibilidade nativa a apps.

W8 W7

Programa padrão

W8

Para abrir um arquivo com um programa padrão, o usuário clicava sobre ele com o botão direito e acessava uma janela que dava escolhas. No Windows 8, a sugestão aparece de forma mais sutil, no canto direito da tela.

Todos os programas Até a versão 7, podiam ser acessados pelo menu Iniciar. A partir da versão 8, aparecem em uma interface que inclui apps, documentos e uma barra de pesquisa que permite acessar todo o conteúdo do computador com poucos comandos.

W7

W8 50locaweb

Win8.indd 50

9/18/12 11:13 PM

Untitled-2 1

11/06/2012 18:02:10

C

Imagen: iStock

ode adem

Conheça uma escola de programação online que pode render muitos frutos a novos e experientes programadores Por Adèle Helena Ribeiro e Max Reinhold Jahnke

52locaweb

Codecademy.indd 52

9/18/12 11:21 PM

Codecademy

my Criado com a ideia de transformar as linguagens de programação em um ambiente agradável, o www.codecademy.com é, atualmente, uma das melhores plataformas de ensino na internet

O

Codecademy é um site gratuito que se propõe a ensinar a programar diversas linguagens, em uma interface amigável e interativa. Logo na página inicial, acessada em www.codecademy.com, você encontra um terminal com lições básicas de programação a serem resolvidas dentro de um chat com o personagem “Ryan”. É uma forma descontraída de aprender. Há cursos muito bons e detalhados sobre JavaScript, Python, Fundamentos da Web e JQuery. Isso sem mencionar o Code Year, um curso completo que reúne de forma bem didática todos os conceitos de programação. A ideia dos criadores era gerar um desafio global, com o objetivo de ensinar definitivamente as pessoas a programar. E não é que deu certo! Mais de 200 mil interessados surgiram na semana de estreia do site, incluindo o prefeito de Nova York, Michael Bloomberg. Os cursos propostos pelo Codecademy são bem “mão na massa”. Além de ensinar a teoria, o site apresenta projetos elaborados para motivar os desenvolvedores e

uma série de exercícios. Certamente dá para aprender bastante em todos os cursos disponíveis. Um ponto negativo, porém, é que ainda não há cursos traduzidos para o português. Assim, é necessário ter conhecimento de inglês para aproveitar essa oportunidade. Também não são disponibilizadas as respostas para os exercícios. Existem apenas verificadores que apontam se sua solução está correta ou não. Portanto, se procura uma base de código pronto para ter como

EM PORTUGUÊS

Existe uma preocupação do Codecademy em dar suporte a vários idiomas, mas o site, por enquanto, roda apenas em inglês. A boa notícia é que a interface inicial já está disponível em português. Para acessá-la, entre em www.codecademy. com/pt. A partir daí, porém, é preciso ter conhecimento da língua inglesa.

locaweb53

Codecademy.indd 53

9/18/12 11:21 PM

Codecademy

Há cursos muito bons e detalhados sobre JavaScript, Python, Fundamentos da Web e JQuery exemplo, não vai encontrar lá. Em compensação, há diversas outras ferramentas interessantes que podem ser acessadas.

De olho nos cursos para iniciantes Para quem está começando agora no mundo web, os cursos mais indicados disponíveis no Codecademy são os de Fundamentos da Web e Fundamento para JavaScript. Ao rodá-los, você irá se deparar com diversos recursos que possibilitam, por exemplo, a criação de uma página web pessoal, sem que para isso seja preciso ter uma noção de programação. Mas para qualquer trabalho que exija uma customização maior, conhecer HTML e CSS é fundamental. O HTML é a linguagem que descreve o conteúdo da página, ao passo que o CSS diz ao navegador o estilo. Com o curso de Fundamentos da Web disponível no Codecademy,

você aprenderá a construir blocos de HTML e CSS, que formarão um esboço da sua primeira página na internet. Ao completar todas as aulas do curso, você será capaz de resolver os exercícios e desafios sem muitas dificuldades. Um desses desafios, por exemplo, pode ser construir uma página diretamente no Scratch, a interface de programação que interpreta seu código e mostra o resultado na hora. Arrisque para ver como se sai. Já com o curso de Fundamento de JavaScript, aprenderá o básico de programação. Tudo começa com os conceitos de variáveis, funções, laços e instruções que trabalham com condicionais, abordando até conceitos mais complicados como Orientação a Objetos. Como esses conceitos são semelhantes em todas as linguagens de programação, eles certamente o ajudarão não só a aprender JavaScript, mas qualquer outra linguagem. Ao final do curso, terá as

noções necessárias para trabalhar nos frameworks de JavaScript e estará apto a fazer aplicativos e construir um jogo de verdade! E o desafio da vez é criar um jogo Blackjack.

Para quem deseja um pouco mais de desafio Para quem deseja realizar um curso mais avançado, o Codecademy oferece aulas de programação em Python e o JQuery. O Python, apesar de possuir sintaxe simples, é uma linguagem poderosa. Certamente é uma boa escolha caso seja a primeira linguagem que você está disposto a aprender. Com ela, é possível criar aplicativos para web e para desktop. Dá, inclusive, para desenvolver jogos. O curso está ainda na versão Beta, mas já é possível aprender os conceitos mais simples, como sintaxe, strings, instruções condicionais e funções. Em cada passo, é exigido o desenvolvimento de um projeto, como uma calculadora e um relógio. Isso estimula o usuário, que passa a ver os seus projetos na tela enquanto aprende. O curso de JQuery, por sua vez, é possivelmente o mais empolgante e divertido do site. Ao completar todas

REFERÊNCIA

É possível navegar pelos cursos ainda em construção do Codecademy. Uma ferramenta de busca avançada permite filtrar os cursos por nível de complexidade e por linguagem. Para visualizar todos os cursos disponíveis, acesse: www.codecademy.com/ courses/lang/all.

Além do Codecademy, há diversos outros sites que ministram cursos interessantes de programação na internet. Entre eles, destaca-se o W3Schools (w3schools.com)

54locaweb

Codecademy.indd 54

9/18/12 11:21 PM

Codecademy

Aulas de programação em Python disponíveis no Codecademy são voltadas para quem deseja dar seus primeiros passos ou se aprimorar nessa poderosa linguagem

as aulas, você terá implementado diversos jogos e animações. O JQuery é uma biblioteca de códigos em JavaScript destinada à criação de belos efeitos visuais no navegador. Para usar, é preciso estar acostumado com os conceitos básicos de JavaScritpt, HTML e CSS. O curso oferecido pelo Codecademy possui duas aulas para ensinar o básico. A partir da terceira aula, já são ministrados conceitos mais específicos que permitem percorrer o DOM (Modelo de Objetos de Documentos) e modificar elementos. Com esse conhecimento, já será possível construir um jogo de damas! Na aula seguinte, você saberá como desenvolver, inserir, manipular e remover elementos DOM como um profissional, o que permitirá melhorar o game de damas e realizar todas as operações que o jogo real permite. Com eventos, efeitos e plugins, dá para implementar o jogo Forca e criar uma agenda de voos. Além dos exercícios e do projeto de cada aula, são propostos quatro desafios, todos bem interessantes. Entre eles, destacam-se a inclusão de um slider, um menu com várias abas, painéis animados de mensagens e um aplicativo de sua escolha.

Área do professor O Codecademy não é apenas um site desenvolvido para quem procurar aprender um pouco mais sobre o universo da programação. Ele também permite que você ensine outras pessoas. Além de colaborar com a comunidade, o projeto permite que o usuário entre em contato com diferentes pessoas do ramo e construa um perfil para ajudar a se promover profissionalmente. Como professor colaborador, é possível criar cursos de JavaScript, Python e Web em três níveis de complexidade: iniciante, intermediário e avançado. Além de contar com uma interface bem amigável e intuitiva, o professor tem à disposição alguns exemplos de curso e uma seção com dicas de como usar o criador de cursos. Diante de tanta facilidade, também é possível contar com o suporte do fórum. Como uma boa escola, o Codecademy se mostra um excelente lugar para aprender e ensinar.

Outras opções para aprender Ensinar e aprender no Codecademy é muito fácil. Todas as interfaces e funcionalidades

disponíveis no site foram muito bem projetadas e todos os passos são bem intuitivos e documentados. É tão agradável navegar pela página que você praticamente aprende e ensina brincando. No entanto, existem outros sites muito bons, dedicados a oferecer cursos gratuitos na internet. Alguns são mais voltados para a área de tecnologia da informação, como o W3Schools, o HTML Goodies e HTML Dog. Outros já abordam assuntos diversificados, como o famoso Khan Academy e o Coursera.

Conclusão O Codecademy é hoje um dos sites de ensino de programação mais populares da internet. Embora tenha apenas um ano de idade, tem crescido muito e reúne milhões de usuários em quase todos os países do mundo, graças aos seus mais de 50 milhões de exercícios interativos. Com a nova onda de cursos gratuitos online, a adesão de tantos participantes e toda essa quantidade de material, além da inclusão de novos idiomas, o site certamente continuará a crescer e deve se manter entre as melhores opções para aprender a programar.

locaweb55

Codecademy.indd 55

9/18/12 11:21 PM

lwprogramação Serviço: Desenvolvimento

Nível técnico: Iniciante/Intermediário/Profissional

Google PageSpeed Use o sistema de aferição de velocidade para deixar sua página ainda mais rápida e atrair mais visitantes João Felipe PAGESPEED Serviço do Google, ainda gratuito e em fase beta, permite que webmasters reescrevam suas páginas, de forma a torná-las mais rápidas em termos de exibição e de carregamento

O

timizar! Uma palavra que sempre esteve presente em todos os assuntos voltados à grande rede, a internet, desde sua criação. No início, muito se falava sobre a necessidade de criar websites otimizados devido à baixíssima velocidade da internet na época. O tempo passou, a velocidade da internet

melhorou bastante. Mas isso não fez com que a necessidade de que ao criar um website ele seja visualizado da forma mais rápida possível, ou seja, otimizado. Possuir um website lento incomoda o usuário, prejudica a experiência e cria uma péssima reputação para o website. Por conta disso, sabendo dessa necessidade de

O PageSpeed Service pode melhorar o desempenho do website de 25% a 60%

velocidade aplicada à web, o Google criou o projeto PageSpeed. Trata-se de um CDN (Content Delivery Network), serviço que, ao trocar o website para o DNS do Google, vai buscar o conteúdo nos servidores e reescrever as páginas contidas no website. Ele insere as melhores práticas, comprime imagens utilizadas no website, grava páginas no cache nos servidores do Google em torno do mundo. Além disso, ajusta o código CSS e JavaScript para obter melhor desempenho e ainda lista alguns possíveis erros em websites.

De acordo com o Google, o PageSpeed pode melhorar o desempenho do site de 25% a 60%. É importante lembrar que, para ocorrer essas melhorias, o serviço depende de uma série de fatores, como conteúdo, qualidade da conexão à internet e localização geográfica. O projeto é formado por: • Google PageSpeed Service (Beta) • Google PageSpeed Optimization SDK • Google PageSpeed para Apache • Google PageSpeed Insights para web • Google PageSpeed Insights extensão para navegadores

56locaweb

ProgramacaoGooglePageSpeed.indd 56

9/18/12 11:15 PM

lwprogramação

PESQUISA Gráfico mostra itens de navegação de internet em que o usuário considera essencial apresentar resultados rápidos

PARA NAVEGADORES

PageSpeed Service O Google PageSpeed Service, até o fechamento desta edição, estava com status de beta (versão de testes). Assim, por enquanto, é liberado a um grupo seleto de desenvolvedores. Para tentar participar desta lista, basta preencher um cadastro em https:// docs.google.com/spreadsheet/ viewform?hl=en_US&formkey=dDdjcm NBZFZsX2c0SkJPQnR3aGdnd0E6MQ. Uma vez inscrito, deve-se esperar para ver se você será selecionado pelo Google para testar esta versão. Caso seja, a companhia envia um e-mail com informações sobre como utilizar o PageSpeed Service. O Google PageSpeed Service está sendo disponibilizado de graça para quem utiliza a versão beta do produto. Quando a versão final for liberada, de acordo com o Google, será cobrado um preço competitivo para utilizar o produto.

Google PageSpeed SDK Sabendo da particularidade de alguns websites, o Google disponibiliza o Google PageSpeed SDK. Isso nada mais é que uma biblioteca de arquivos

desenvolvidos na linguagem C++. Ela tem o intuito de realizar o mesmo procedimento que o Google PageSpeed Service. O Google PageSpeed SDK pode ser baixado gratuitamente em http://code.google.com/p/page-speed/ wiki/DownloadPageSpeed.

Google PageSpeed para Apache O Apache, que é um dos servidores web mais utilizados do mundo, pode receber o módulo do Google mod_pagespeed para otimizar as páginas. Para usuários que desejam fazer a configuração manualmente, o mod_pagespeed pode ser baixado em https://developers.google.com/speed/ pagespeed/mod. O módulo tem o intuito, por meio de filtros, de otimizar o conteúdo do website.

Google PageSpeed Insights para Web Com toda experiência que o Google obteve na construção do PageSpeed Service, do PageSpeed SDK e do PageSpeed para Apache, a companhia resolveu criar o PageSpeed Insights. Trata-se de uma ferramenta para identificar problemas que prejudicam

O Google oferece o serviço PageSpped por meio de extensões que podem ser instaladas nos navegadores Mozilla Firefox e Chrome. A extensão para Firefox é desenvolvida pelo próprio Google. Para utilizar, é necessário ter a extensão FireBug (que pode ser baixada em https://addons.mozilla. org/pt-BR/firefox/addon/firebug). Com ela instalada, é possível realizar o download do addon Google PageSpeed Insights em https://dl-ssl. google.com/page-speed/current/ page-speed.xpi. No Google Chrome, apenas é necessário instalar o Google PageSpeed Insights (https:// chrome.google.com/webstore/detail/ gplegfbjlmmehdoakndmohflojccocli). Alta velocidade em um website é excelente para usuários. Entretanto, vai além disso. Ao carregar páginas rapidamente, o motor de busca do Google classificará melhor o site, que aparecerá mais bem ranqueado no buscador. O Google tem como objetivo fornecer a informação mais relevante junto com a forma mais rápida possível. Por exemplo, suponha que o site www.exemplo-1. com e o site www.exemplo-2.com.br contenham informações praticamente iguais. Se exemplo-2 apresenta tal informação de forma cinco vezes mais rápida, o motor de busca vai beneficiá-lo nos resultados, em detrimento do exemplo-1.

o desempenho e dar dicas e sugestões para solucionar esses problemas. Para facilitar a vida de desenvolvedores, esta análise pode ser realizada via internet, por meio do link https://developers. google.com/speed/pagespeed/insights. Ao entrar com URL, o sistema analisa arquivos e gera uma nota de 0 a 100 para a página, de acordo com as melhores práticas de otimização.

locaweb57

ProgramacaoGooglePageSpeed.indd 57

9/18/12 11:15 PM

lwprogramação Serviço: Aplicativos para Smart TVs

Nível técnico: Iniciante/Intermediário/Profissional

Apps para a telona Desenvolva aplicativos para televisores inteligentes com poucos comandos Adèle Helena Ribeiro e Max Reinhold Jahnke

Smart TV da Samsung: a empresa tem um kit próprio para o desenvolvimento de aplicativos

A

s áreas de atuação para desenvolvedores web têm crescido muito nos últimos anos. O HTML e o CSS hoje são praticamente linguagens de programação que, junto ao JavaScript, permitem que aplicativos poderosos sejam feitos para dispositivos eletrônicos comumente usados no cotidiano.

Entre eles, computadores, telefones celulares e, agora, televisores. Por muitos anos, as TVs eram os principais eletrodomésticos de uma residência. Esse posto, porém, foi aos poucos sendo tomado pelos computadores pessoais, que evoluíram ao ponto de oferecer boa parte do conteúdo disponível na TV, e, de quebra, deram aos usuários o controle de

Quem sabe desenvolver para a web encontra facilidade no ambiente das Smart TVs

como e quando se entreter. Agora, os televisores estão ficando mais inteligentes e permitem uma espécie de entretenimento parecida com a que se pode obter com um computador pessoal. A Smart TV, como vem sendo chamada essa nova onda de integrar os televisores aos recursos web 2.0, tem o foco em mídia online interativa. Assim, oferece conteúdo sob demanda e possibilita a instalação de apps. Seu foco é diminuir a programação tradicional e investir em serviços pouco usuais diante da telona.

Em geral, as Smart TVs podem ser definidas como televisores integrados à internet, que possuem um sistema operacional completo e contam com um kit de desenvolvimento público. É exatamente esse último recurso que permite a desenvolvedores independentes e empresas escreverem aplicativos. As TVs inteligentes também têm uma loja de aplicativos, para que seja possível baixar, instalar e desinstalar os apps que mais interessarem aos usuários. O sistema é o mesmo adotado em tablets e smartphones.

58locaweb

ProgramacaoSmartTV.indd 58

9/18/12 11:14 PM

lwprogramação

Com foco em mídia online, a Smart TV oferece conteúdo sob demanda e possibilita a instalação de apps

Grandes fabricantes de TVs firmaram uma aliança com o objetivo de gerar softwares multiplataforma

Começar a desenvolver para Smart TV Alliance é relativamente simples. Basta ter conhecimento afiado de HTML5 e JavaScript, para aprender lendo os códigos dos exemplos, o manual da IDE e a referência da API.

Smart TV Alliance O primeiro grande desafio para o conceito de Smart TV funcionar foi facilitar a vida dos desenvolvedores e fabricantes de TV, principalmente na criação de aplicativos multiplataformas – que funcionam corretamente em aparelhos das mais diversas marcas, dotados de tecnologias diferentes. A ideia é evitar a fragmentação do desenvolvimento que tem acontecido com a plataforma Android, em que é necessário testar o aplicativo desenvolvido nas mais diversas marcas de celulares para ter certeza de que funcionará como esperado. Assim, foi criada a Smart TV Alliance, uma aliança entre alguns gigantes do ramo. Essa parceria, formada por LG, Toshiba, TPVision (empresa chinesa que comprou o braço de televisores da Philips) e outras companhias, tem o intuito de promover a criação multiplataforma com tecnologias abertas. A aliança tem um kit de desenvolvimento próprio, gerado com o intuito de criar softwares que rodem sem nenhuma modificação nos televisores

Sistema da Samsung Kit da Smart TV Alliance vem com uma versão modificada da IDE Eclipse

inteligentes de todos os parceiros. O kit deles é multiplataforma, rodando em Windows, Mac e Ubuntu, conta até com um pacote genérico para facilitar a instalação em outros sabores de Linux. O kit possui, resumidamente, uma versão da IDE Eclipse modificada para o desenvolvimento para Smart TV Alliance, vários códigos de exemplos e templates para exibir algumas funcionalidades e facilitar o começo do desenvolvimento de aplicativos. Também acompanha um emulador baseado no VirtualBox, com os navegadores da plataforma. Com isso, o pacote inclui praticamente todos os recursos necessários para rodar e testar os apps, e também um debugger para facilitar a resolução de problemas durante a criação.

Infelizmente, porém, a Smart TV Alliance ainda está no começo e algumas das grandes fabricantes de TV ainda estão de fora do grupo – inclusive a Samsung, que tem seu próprio sistema de TVs inteligentes

NA INTERNET O software necessário para desenvolver para Smart TV Alliance, os manuais da IDE, os códigos de exemplo e a referência da API podem ser obtidos em: www.smarttv-alliance.org.

locaweb59

ProgramacaoSmartTV.indd 59

9/18/12 11:14 PM

lwprogramação Apps para SmartTVs

e também disponibiliza um kit de desenvolvimento. A empresa também possui um fórum de discussão e documentação. A Samsung disponibiliza ainda uma IDE que, na verdade, é uma extensão da IDE Eclipse, e um emulador para testar os aplicativos desenvolvidos. Ambos são multiplataforma, permitindo que o programador use o sistema operacional preferido. Assim como no caso da Smart TV Alliance, tecnicamente falando, os aplicativos para Samsung Smart TV são apenas uma página web feita com HTML, CSS e JavaScript, com a opção de usar Flash. Então, é muito fácil para um profissional de desenvolvimento da web começar a programar logo nos primeiros minutos, após obter o software necessário. Mas a grande vantagem de desenvolver para Samsung está na documentação, que é bem completa e abrangente, cobrindo todo o processo de desenvolvimento. Ela aborda desde conceitos necessários para o começo de um aplicativo, com guias de design que visam uma experiência melhor para o usuário, até detalhes técnicos de como usar JavaScript para ter controle dos recursos da TV.

Ginga Desenvolvido inicialmente pela PUC-Rio e a Universidade Federal da Paraíba, o Ginga é um software de código aberto que foi criado com o intuito de gerenciar todas as funções de interatividade da televisão digital do Brasil. Apesar de tecnicamente não ser um sistema de Smart TV – já que funciona principalmente associado à radiodifusão, e não via internet –, o desenvolvedor de aplicativos para os televisores inteligentes precisa estar atualizado em relação a essa tecnologia. Uma curiosidade é que o governo brasileiro obriga os fabricantes a instalarem o sistema embarcado

Fórum de discussão e documentação da Samsung é uma boa fonte para quem pretende desenvolver apps

Ginga em todos os televisores produzidos por aqui. A diferença básica entre o Ginga e as Smart TVs é que o primeiro dá preferência para a interatividade, enquanto a segunda se inspira na compra de aplicativos. O Ginga fornece, principalmente, informações via radiodifusão, normalmente associadas à programação, como a lista de atletas escalados em um jogo de futebol que está sendo transmitido ou informações a respeito de como comprar um determinado produto que está sendo anunciado. Já o modelo Smart TV, como acontece com o Android Market do Google e App Store da Apple, apela para a compra de conteúdo sob demanda. Assim, é possível enxergar as coisas de uma forma mais otimista:

Software de código aberto Ginga foi criado para gerenciar a interatividade na TV digital

o Ginga não é um competidor das Smart TVs, mas uma espécie de complemento que pode aumentar as possibilidades na criação de apps. Além disso, o governo pretende usar o Ginga como meio de inclusão digital, incentivando as emissoras a criarem aplicativos sociais ou mesmo usando o sistema para dar a possibilidade de agendar consultas no Sistema Único de Saúde, o SUS.

Conclusão Graças à evolução de linguagens como o HTML, o CSS e o JavaScript, a carreira de desenvolvimento para a Web 2.0 tem crescido muito e ficado rica em possibilidades de atuação. O fato animador é que os profissionais que já sabem desenvolver páginas para a web têm todo o conhecimento necessário para começar a desenvolver para TVs inteligentes. É de se esperar, portanto, que, como aconteceu com os celulares inteligentes, que conseguiram criar toda uma nova economia de venda de softwares, o mercado de aplicativos para televisores cresça e abra muitas oportunidades de negócios. Sem dúvida, vale a pena investir no segmento.

60locaweb

ProgramacaoSmartTV.indd 60

9/18/12 11:14 PM

Modelo anuncio:Layout 1 17/09/2012 14:40 Pรกgina 182

lwprogramação Serviço: Prism.js

Nível técnico: Iniciante/Intermediário/Profissional

Muito mais com Prism Conheça um framework crossbrowser leve, composto de um arquivo JS e um CSS, e que tem por finalidade aplicar destaques em sintaxes de códigos Felipe Magalhães SITE Página eletrônica do Prism mostra as diversas vantagens de se recorrer a esse framework; cada vez mais desenvolvedores optam pelo sistema para facilitar seus trabalhos

A

movimentação causada pelo HTML 5 tem resultado em uma lista vasta de novidades no mundo dos desenvolvedores. Inovações no JavaScript, características mais potentes no CSS 3, bibliotecas e frameworks para trabalhar de várias maneiras distintas com

sua solução, seja ela um site, seja uma aplicação. Muita coisa útil apareceu – bem como algumas soluções aparentemente sem tanta utilidade e algumas outras bastante semelhantes entre si. Entre estas novidades, há o Prism.js (http://prismjs. com), um framework crossbrowser leve, composto de um arquivo JS e um

Preocupação semântica e boas práticas de composição de HTML são base do Prism

CSS, que tem por finalidade aplicar destaques em sintaxes de códigos. Criação da “guru” grega de webstandards Michaelia Verou (lea.verou.me), o Prism. js é derivado do Dabblet (dabblet.com). Trata-se de um editor online de CSS que permite a visualização do código produzido na própria página – com um core de aproximadamente 1.5 kb e peso adicional de cerca de 500 bytes para cada nova linguagem na qual se deseja aplicar o realce do Prism.js. Com preocupação semântica, este framework

apoia as boas práticas de composição de HTML. Ele tem sua aplicação somente nos elementos que buscam limitar um trecho de código dentro do documento: <code> (para códigos inline) ou <pre> (para blocos de códigos). Ao ser totalmente desacoplado, ele não força o desenvolvedor a utilizar tags e classes específicas. Caso você queira removê-lo da página, poderá fazer isso sem necessidade alguma de alteração na marcação HTML ou CSS, bastando remover a referência aos arquivos JS e CSS do framework.

62locaweb

ProgramacaoPrismJS.indd 62

9/18/12 11:05 PM

lwprogramação

O Prism.js atua de maneira a colorir e destacar blocos de código de linguagens, bastando que, ao baixar o framework, selecione o suporte a quais linguagens irá estender. Mesmo após o download, é possível definir o suporte de novas linguagens, bastando que se possua certa intimidade com a utilização de regular expressions. Os realces em códigos são realizados não só em blocos de código (como blocos de CSS ou JavaScript, em um exemplo de código HTML), como também em códigos inline (como em um exemplo no qual ações JavaScript ou estilizações CSS estejam dentro de tags HTML). Atualmente, o Prism.js funciona corretamente no Internet Explorer (a partir do 9), Firefox, Chrome, Opera – contudo, ainda apresenta incompatibilidades dependendo do tema que estiver utilizando em seu navegador favorito. A maioria dos browsers de dispositivos móveis (como o Opera Mini) também não se dá muito bem com a solução. Inicialmente, para atuar com o Prism.js, é necessário baixá-lo em sua

página de download. Quando acessar esta página, você notará que existem várias opções disponíveis. Isso permite que você adapte o arquivo que será montado para ser baixado de acordo com seu desejo e real necessidade. Caso você queira produzir em cima do código do Prism.js, poderá realizar o download da versão de desenvolvimento (Development Version). Para quando desejar aplicar os recursos deste framework em seu projeto, utilize a versão “Minified” (que tem seu núcleo com quase metade do peso da versão para desenvolvimento). A partir daí, escolha qual tema irá utilizar – o site disponibiliza três modelos “oficiais”: default, dark e funny – e quais linguagens poderão ser afetadas (HTML, CSS, JavaScript e Java). Você também poderá baixar alguns plugins (serão citados adiante). Todos esses componentes adicionais possuem a informação do tamanho que ocupam, para que você possa verificar o quanto a utilização dos recursos poderá retardar o carregamento da página que o

Atualmente, o Prism.js funciona corretamente no Internet Explorer (a partir do 9), Firefox, Chrome, Opera; em navegadores de portáteis, ele derrapa um pouco

Escolha qual tema irá utilizar. O site disponibiliza três modelos oficiais: default, dark e funny contiver. Lembrando que o download do JavaScript e do CSS da ferramenta é feito separadamente.

O Prism.js na prática O primeiro passo é adicionar os documentos necessários à página que receberá a formatação. Realize o download do Prism.js com os componentes que desejar e os referencie com suas respectivas tags abaixo da <head>. Outro detalhe importante é que a tag <pre> que receberá o código deverá estar contida em um contêiner (div, section, por exemplo) estilizado com a(s) classe(s) referente(s) à(s) linguagem(ns) que se deseja formatar: language-markup, para formatar o HTML; language-css, para formatar os trechos de CSS; e language-javascript, para formatar os blocos de JavaScript. Para melhor ilustrar, será demonstrado como o código abaixo se comporta com as várias possibilidades que este framework permite: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Demonstrando o Prism.js</title> <link href="css/prism.css" rel="stylesheet"/> <link href="css/estilo.css"

locaweb63

ProgramacaoPrismJS.indd 63

9/18/12 11:05 PM

lwprogramação Prism.js

Código ao lado apresenta várias saídas em tela; exemplo mostra Prism sem qualquer plugin adicionado

Quando se monta um pacote com estilização para HTML, itens em JS e CSS são tratados como texto normal rel="stylesheet"/> <script src="js/prism.js"></script> </head> <body> <div class=" class="language-markup language-css language-javascript"> Exemplo de trecho de código formatado com o Prism.js: <pre> <code> <script> alert('Demonstração do Prism.js'); </script> <style> body { font: sans-serif; color:#321AAA; } </style> <div class="setor"> <ul> <li>Item formatado</li> <li>Segundo Item</li> <li>Último Item</li> </ul> </div> </code> </pre> Também é possível

colocar o código a ser formatado na mesma linha que o texto, como <code><html lang="pt-br"></code> neste trecho. </div> </body> </html> O código acima pode apresentar várias saídas em tela (como mostra a imagem no topo da página), montada com o Prism.js sem plugin e nas seguintes configurações: versão minified, tema Funky, linguagens: markup (HTML), CSS e JavaScript.

Já o mesmo código que usa o tema Dark, o plugin “Show Invisibles” (será abordado a seguir) e somente o destaque para markup, fica com a aparência da imagem no rodapé desta página. Note que, como se montou o pacote apenas com a estilização para HTML, os trechos em JavaScript e CSS são tratados como texto normal. O mecanismo de detecção do que deve ser formatado para uma determinada linguagem se dá por meio de expressões regulares. Caso queira criar uma extensão do Prism.js para uma linguagem ainda não suportada, basta ir fundo em regexp, estudar o códigofonte do projeto e elaborar seu plugin. O Prism.js foi arquitetado de maneira a aceitar plugins, possuindo alguns oficiais – porém não disponibilizados nativamente junto do framework, para não afetar no tamanho final do script. Dessa forma, quando necessário, basta acessar o site do projeto e realizar o download dos plugins. Serão demonstrados aqui os mais famosos.

Realce de linhas específicas (prismjs.com/plugins/ line-highlight):

64locaweb

ProgramacaoPrismJS.indd 64

9/18/12 11:05 PM

lwprogramação

Inserir link no código exibido (prismjs.com/plugins/autolinker): Oferece uma maneira mais prática para inserir links em trechos determinados dentro do conteúdo formatado pelo Prism.js. Você tem a possibilidade de embutir links não somente em caminhos de arquivos, mas em qualquer parte de conteúdo que desejar. Isso reflete um resultado como exibido na imagem logo abaixo.

Um determinado plugin permite marcar determinadas linhas com uma cor de background diferente da cor default configurada para o bloco de código

O Prism.js foi arquitetado de maneira a aceitar plugins oficiais – porém não disponibilizados nativamente Permite marcar determinadas linhas com uma cor de background diferente da cor default configurada para o bloco de código. Exibe, à esquerda, o número da linha marcada (ou da inicial e final, se for aplicado em um intervalo). É possível realizar o realce em uma linha, em intercaladas ou em um intervalo delas.

Exibir caracteres ocultos (prismjs.com/plugins/ show-invisibles): Assim como foi apresentado aqui anteriormente, a característica principal deste plugin é simplesmente exibir caracteres invisíveis, como quebras de linha (marcadas como LF) e tabulações (sinalizadas como ►).

Site de apoio ao Prism (goo.gl/cgVnd): sistema prevê uma forma simples e funcional de aplicar destaques em sintaxes de códigos

Mão na massa Ficou com vontade de botar a mão na massa e não apenas utilizar como também contribuir com novos plugins de formatação e suporte a novas linguagens? O Prism.js também está no GitHub. Acesse pelo endereço github.com/LeaVerou/prism.

O Autolinkr provê uma forma prática de inserir links em trechos de documentos

GitHub: para quem deseja colocar a mão na massa, no site GitHUb.com é possível entrar em contato diretamente com o Prism

locaweb65

ProgramacaoPrismJS.indd 65

9/18/12 11:06 PM

lwparceiros //Empresas e profissionais liberais que oferecem serviรงos de desenvolvimento de sites

Devigate

Nethol

AddSite

Cรณdigo 1

devigate.com.br

addsite.com.br

Visรฃo Informรกtica www.visaoinf.com.br

nethol.com.br

www.codigo1ti.com.br

AJRdesigner

ajrdesigner.com

66locaweb

Parceiros.indd 66

9/18/12 11:06 PM

Serviços em Nuvem prontos para crescer Esteja você desenvolvendo ou contratando um serviço de nuvem, pode ter certeza que a infraestrutura do seu centro de dados terá a performance e a segurança perfeitos para o TI de uma empresa em constante evolução. PERFORMANCE ATÉ

ATÉ

ATÉ

MAIOR

MAIS EFICIENTE NO CONSUMO DE ENERGIA

MENOS LATÊNCIA DE REDE

PERFORMANCE

EFICIÊNCIA

L ATÊNCIA

80% 70% 30% 306.74

466

166.75 Média de resultado geométrica

271 Resultados de Benchmark divididos pelo processador TDP

230 nanossegundos 340 nanossegundos Tempo médio para um equipamento I/O ler a memória do sistema local em condição inativa

APRESENTAMOS A NOVA

FAMÍLIA DE PROCESSADORES INTEL® XEON® E5 Saiba mais em intel.com.br/cloud

©

Copyright 2012, Intel Corporation. Todos os direitos reservados. Intel, o logotipo da Intel, Intel Inside, o logotipo do Intel Inside, Intel Apaixonados pelo Futuro, o logotipo do Intel Apaixonados pelo Futuro, Xeon e Xeon Inside, são marcas registradas da Intel Corporation nos Estados Unidos e em outros países.

anuncio-google-adwords-curvas.pdf

C

M

Y

CM

MY

CY

CMY

K

1

9/13/12

1:42 PM