Revista Locaweb 17 Ed by Locaweb

Capa17:Capa Locaweb 31/7/2009 16:29 Page 2

205 X 275:Layout 1 20/5/2009 16:44 Page 1

205 X 275:Layout 1 20/5/2009 16:44 Page 2

Editorial_Sumario:W2008 31/7/2009 19:16 Page 4

ao leitor Locaweb em Revista Edição 16 VP Comercial: Cláudio Gora Gerente de Marketing: Victor Sebastian Reis da Silva Coordenação de Comunicação: Alexandre Porto Coordenação Editorial: Déborah De Mari 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: Marianna Russo Editor de Arte (projeto gráfico): Alexandre Dias (Nani) Colaboração: Felipe Magalhães, Luciano Delfini e Pedro Claudio de Lima e Silva, Publicidade São Paulo: E-mail: publicidade@europanet.com.br Diretor de Publicidade: Mauricio Dias (11) 3038-5093 Executivos de Negócios: Alessandro Donadio, Angela Taddeo, Flavia Pinheiro, Claudia Alves, Elisangela Xavier e Rodrigo Sacomani. Executivos de Contas: Leandro Blotta, Marcos Roberto e Renata Naomi Criação Publicitária: Rodrigo Barros e João Paulo Gomes 11) 3038-5103 Tráfego: Renato Peron (11) 3038-5097 Circulação e Promoção - Gerente: João Alexandre 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 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

Presença digital Você já sabe que garantir a presença digital de sua empresa ou projeto é essencial para a divulgação de seu negócio e para a comunicação adequada com seus clientes. Mas, após criar o seu endereço virtual, muitas vezes você ainda fica em dúvida sobre qual plataforma (blog ou site) atenderá de forma mais eficiente aos seus objetivos. Nesta edição, conversamos com consultores em mídias sociais e corporativas e relacionamos dicas para que você saiba qual a melhor opção para conquistar espaço na rede. E já que o assunto é ter uma presença digital de sucesso, vamos pensar em design fora da caixa? Conversamos com ilustradores, grafiteiros, cartunistas e tatuadores para compreender como estes profissionais utilizam arte para agregar valor a projetos digitais. Para aqueles que estão sempre antenados as tendências, você sugeriu no Twitter e o entrevistado deste mês é Luli Radfahrer, um dos maiores estudiosos de mídias digitais do Brasil. Conversamos com ele sobre os caminhos da internet no mundo e a revolução da web 2.0. E mais, quer saber quem seguir? A Locaweb em Revista elegeu a sua twittosfera. A cada edição, indicaremos mais de 30 profissionais que ditam tendências e compartilham links relevantes na rede. Quer mais? Então vire a página e divirta-se! Claudio Gora editor@locawebemrevista.com.br

Impressão: Prol Editora Gráfica Somos Filiados à ANER - Associação Nacional dos Editores de Revistas

O que tem nesta edição...

• Capa 30

• Domínios 22

• e-Learning 48

• Design 42

4 locaweb

* Entrevista: Luli Radfahrer ....................06 * E-mails...................................................08 * Notícias .................................................10 * KeepItSimple: Cloud Computing .........18 * Portifólio ...............................................20 * Domínios ..............................................22 * Artigo: Marcelo Tripoli.........................28 * Capa: Site X Blog ..................................30 * Artigo: Joaquim Torres. .......................40 * Design: Fora da caixa...........................42 * Artigo: René de Paula Jr.......................47 * E-learning..............................................48 * Case: AgênciaClick ...............................52 * Artigo: Déborah De Mari ....................54 * CSS.........................................................56 * Adobe Flex............................................60 * Locavip ..................................................66

205 X 275 2:Layout 1 6/7/2009 16:27 Pรกgina 1

Entrevista:W2008 31/7/2009 16:35 Page 6

Entrevista

Banda larga é a alma das mídias sociais Ph.D em comunicação digital, Luli Radfahrer fala do atual momento da internet e diz que a revolução Web 2.0 somente foi possibilitada pela conexão dedicada Por Sérgio Vinícius

uli Radfahrer é um dos maiores estudiosos de mídias digitais no Brasil. Ph.D. em Comunicação Digital pela ECA-USP, é também professor da universidade há mais de dez anos. Trabalha com internet desde 1994, quando fundou a Hipermídia. De lá para cá, trabalhou fora do país e tem clientes em diversos cantos do planeta - como Canadá e Oriente Médio. Escritor, Luli é também autor dos livros Design/web/ design e Design/web/design:2, além de A Arte da Guerra Para Quem Mexeu No Queijo Do Pai Rico, uma análise crítica e bem-humorada do ambiente corporativo. Na entrevista a seguir, Luli fala sobre o passado, o presente e o futuro das redes sociais. E mais: defende que, se não fosse pela banda larga, o mundo não estaria no estágio cibernético em que se encontra.

Locaweb em Revista:: De repente, não se fala mais em outra coisa relativa à web que não mídias e redes sociais. Em especial, sobre o Twitter. Por que as pessoas estão se interessando tanto pelo assunto? Luli Radfahrer:: Foram duas condições que nos levaram ao atual panorama, no qual as mídias sociais, sobretudo o Twitter, estão na moda: a infraestrutura que possibilita a comunicação e a vontade que as pessoas passaram a ter de se comunicarem para se tornarem alguém. 6 locaweb

Escritor \\ O estudioso de mídias e redes sociais é autor dos livros Design/web/design e Design/web/design:2, além de A Arte da Guerra Para Quem Mexeu No Queijo Do Pai Rico

LR:: A que infraestrutura você se refere? Luli:: A internet de banda larga. Tudo o que conhecemos como Web 2.0, com consumidor provendo conteúdo, interagindo plenamente com sites, blogs e com outros semelhantes, foi possibilitado pela conexão dedicada. Na época do acesso por modem, discado, já era possível que houvesse toda essa interação, mas isso não ocorria por conta do modelo de cobrança. LR:: A cobrança de pulso telefônico? Luli:: Exatamente. O usuário de internet se conectava e sabia que, quanto mais tempo passasse na rede, mais pagaria. Por isso, ele não gastava tempo acessando sites alheios ou páginas pessoais desconhecidas. A partir do momento em que a banda larga se popularizou, com conexão

dedicada, o usuário percebeu que poderia fazer o que bem entendesse na rede e que o preço seria o mesmo. As redes sociais foram decorrência disso. A banda larga é subestimada em seu papel de difusora das redes sociais. Ela é um dos agentes mais importantes. LR:: O incremento de velocidade da banda larga é menos importante que o modelo de cobrança? Luli:: As pessoas falam muito sobre o incremento da velocidade, mas é a partir do momento em que o usuário percebeu que pagaria uma taxa fixa que as coisas mudaram. LR:: E como você descreve a vontade das pessoas se comunicarem mais? Luli:: Esse é o segundo fator que garante o sucesso de sites como o Twitter.

Entrevista:W2008 31/7/2009 16:35 Page 7

Hoje em dia, no imenso mundo real, as pessoas manifestam cada vez menos a identidade. Mas na web, é possível reverter isso. Ao ter seguidores no Twitter ou se posicionar em um blog, o usuário deixa de ser “mais um” e se torna “alguém”, com opiniões e ideias. LR:: Fora da web, esse usuário também é alguém, mas com alcance limitado ao círculo de amigos, profissional, familiar. A internet potencializa esse alcance? Luli:: A internet é um meio. As pessoas costumam ter vida social. As redes e mídias sociais apenas transportam essa vida para a tela. Eu não sei se o Twitter vai dar certo, não conheço o modelo de negócios deles, mas ele atrai as pessoas porque, quando você “twitta”, expõe suas ideias a um círculo de pessoas que o seguem. Ele te dá uma identidade e as pessoas querem ter isso. LR:: E nessa busca por identidade, com tantas plataformas sociais, em que o consumidor virou provedor de informação, não há um exagero de conteúdo na web que deveria, de alguma forma, ser filtrada? Luli:: O problema não é o excesso de informação. O problema é justamente filtrar o que se tem contato. A partir do momento em que você não lembra o emissor da notícia, é complicado dar crédito ou rejeitá-la. LR:: Não é porque está na internet que é verdade. A crença do contrário é a origem dos famosos hoax que chegam por e-mail. Luli:: Quando a pessoa não consegue identificar a fonte, as informações podem ficar comprometidas. Por exemplo, você lembra como ficou sabendo da morte do Michael Jackson? LR:: Lembro. Luli:: E quando ouviu falar a primeira vez sobre Barack Obama? LR:: Não. Luli:: Exatamente. Porque as coisas mudaram e há uma série de veículos e

Luli Radfahrer \\ Para o professor da USP, as novas mídias estão mudando as relações entre as pessoas, o que impactará em grandes mudanças de costumes

* Quando você “twitta”, expõe suas ideias a um círculo de pessoas que o seguem. A ferramenta te dá uma identidade e as pessoas querem ter isso mídias bombardeando as pessoas com informações. A partir do momento em que não se identifica a fonte, não se sabe o que é ou não confiável.

LR:: Até lá, a imprensa deve repensar seus modelos? Luli:: Sem dúvida. Daqui a uns anos, um distribuidor de pneus que não saiba o que é um GPS estará atrasado. Por enquanto, é mais fácil aos grupos de imprensa cooptarem blogueiros a concorrer com eles. Um blogueiro pode ganhar mais em um portal ou jornal que tentando manter seu site sozinho. Queira ou não, os grandes grupos de mídia têm dinheiro.

LR:: Esses novos provedores de conteúdo, confiáveis ou não, podem ameaçar as mídias tradicionais? Luli:: Não enquanto não houver um equipamento wireless que receba informações e que possa ser lido e manuseado como uma espécie de papel. O que mais se aproxima disso atualmente é o Kindle, mas mesmo assim é um modelo ruim. Enquanto isso não ocorrer e os jornais tiverem poder para imprimir informações em papel, eles não são ameaçados.

LR:: Então as novas mídias não devem impactar apenas a imprensa? Luli:: Não. As relações sociais foram afetadas e isso muda muita coisa. Por exemplo, os médicos têm hoje a concorrência do Doutor Google. Com isso, as pessoas chegam à consulta já informadas sobre o problema ou desistem da visita realizando algum procedimento lido em algum site. O problema é que os buscadores não usam parâmetros médicos e, com isso, as informações podem não ser confiáveis. locaweb 7

Emails:W2008 18/7/2009 01:16 Page 8

e-mails Barra de rolagem Estou usando o CSS para modificar características de minha página, mas ainda não consegui alterar a cor da setinha que aparece nas barras de rolagem. Qual código eu devo utilizar para isso? Márcia Reis - Por e-mail Para fazer isso, é necessário utilizar a propriedade scrollbar-arrowcolor, indicando o código hexadecimal da tonalidade que você deseja que ela tenha. Para, por exemplo, fazer com que a barra de rolagem de sua página tenha a setinha na cor vermelha, adicione esse código: body {scrollbar-arrowcolor: #FF0000;}

WiMAX Tenho lido algumas coisas sobre WiMAX, um novo tipo de conexão de banda larga sem fios. Sei que há algumas cidades que estão testando a tecnologia, como Ouro Preto e Mangaratiba. Mas ainda não entendi direito como funciona essa tecnologia. Podem me explicar? Diogo Machado Por e-mail O WiMAX é uma tecnologia baseada em padrões que capacitam a entrega de acesso banda larga e sem fio à web. Por isso, trata-se de mais uma alternativa ao uso de cabo e ao DSL. O WiMAX irá fornecer conectividade banda larga fixa, nômade, portátil e, eventualmente,

//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.

móvel sem a necessidade de “visada” com a estação base, ou seja, a conexão funciona mesmo que existam obstáculos entre o transmissor e o receptor. Em um raio de três a dez quilômetros, espera-se que um sistema certificado WiMAX trabalhe com uma capacidade de entrega de até 40 Mbps por canal, para aplicativos de acesso fixo ou portátil. Isso é banda suficiente para suportar centenas de negócios com velocidade equivalente a T1 (conexão telefônica dedicada de alta velocidade) ou milhares de residências com a mesma rapidez do DSL. A Anatel e o Ministério das Comunicações ainda estão definindo como serão negociadas as

concessões das frequências entre 3,5 GHz e 10,5 GHz, um dos últimos obstáculos à entrada da tecnologia no Brasil.

Marcadores personalizados Existe alguma maneira de se modificar os marcadores padrão de uma lista HTML? Eu gostaria de usar uma imagem GIF criada por mim como marcador. Estou resolvendo esse problema usando a tag IMG antes de cada um dos itens da minha lista, mas o resultado não está sendo satisfatório. Dimitrios - Por e-mail Você pode usar qualquer imagem como marcador em uma lista HTML; para isso, basta criar um estilo CSS para a tag UL. Veja como isso pode ser feito no exemplo a seguir: <UL STYLE="list-styleimage: url(imagem.gif)"> <LI>Item 1</LI> <LI>Item 2</LI> </UL>

Site do WiMAX \\ Em www.wimaxforum.org, há informações sobre a tecnologia baseada em padrões que capacitam a entrega de acesso banda larga e sem fio à web. Trata-se de uma alternativa ao cabo e ao DSL

8 locaweb

Para saber mais sobre HTML e demais linguagens de programação, acesse a página eletrônica que é uma das referências no tocante a protocolos e assuntos gerais de desenvolvimento de site ao redor do mundo: www.w3c.com.

VENHA CONHECER DE PERTO A TECNOLOGIA QUE ESTÁ REVOLUCIONANDO A WEB. A Locaweb realiza, pelo segundo ano consecutivo no Brasil, o Rails Summit Latin America. Os mais importantes nomes do mundo reunidos no maior evento de Ruby on Rails da América Latina. São mais de 15 palestrantes debatendo sobre as novidades da programação e as principais apostas para o futuro. Confira alguns dos nomes:

OBIE FERNANDEZ Autor do livro “The Rails Way”, um dos melhores da área. Editor da série “Professional Ruby”, pela Addison-Wesley. Fundador da Hashrocket, uma das mais bem conceituadas e ágeis empresas em Ruby on Rails. Trabalhou pela ThoughtWorks e é membro reconhecido pela comunidade internacional de Ruby.

MATT AIMONETTI Da m|a agile, empresa de consultoria que oferece treinamento, auditoria e desenvolvimento de projetos Ruby, Matt é um dos principais evangelizadores e contribuidores tanto do Ruby on Rails quanto do Merb. Está muito envolvido no desenvolvimento de projetos de ponta, como CouchDB e MacRuby.

CHAD FOWLER

Escritor de livros como “My Job Went to India”, “Rails Recipes”, “Advanced Rails Recipes”, é um dos mais experientes rubistas. Cofundador da Ruby Central, organiza as principais conferências, como RubyConf e RailsConf.

GREGG POLLACK Gregg produz mídia educacional para sua empresa Rails Envy, incluindo podcasts, séries para empresas, como a New Relic Labs e screencasts comerciais para seu outro empreendimento, EnvyCasts. Organizou o BarCampOrlando, o Orlando Ruby User Group e é um dos principais ativistas de Rails.

DAVID CHELIMSKY Mantenedor do famoso projeto RSpec, para suítes de testes de projetos Ruby, autor do livro “The RSpec Book” e desenvolvedor-líder da Articulated Man, Inc., é um dos nomes mais reconhecidos na área de qualidade de software e práticas de desenvolvimento ágil.

SÃO PAULO, 13 E 14 DE OUTUBRO - ANHEMBI - AUDITÓRIO ELIS REGINA INSCREVA-SE JÁ.

www.railssummit.com.br

Realização:

AF An. Locaweb Rails 20,5x27,5.indd 1

7/15/09 12:47 PM

Noticias_Parte1:W2008 18/7/2009 01:21 Page 10

notícias blog.locaweb.com.br Confira as novidades da maior empresa de hospedagem de sites do Brasil

Líder em infraestrutura

de hosting

Estudo do IDC Brasil aponta que a Locaweb ultrapassou grandes companhias e, atualmente, detém 13,9% do mercado Com 13,9% do mercado, a Locaweb, de acordo com o estudo do IDC Brasil, comemora o primeiro lugar no segmento de Outsourcing – Hosting Infrastructure Services, referência no setor de Tecnologia da Informação e Telecomunicações. Segundo a pesquisa, a empresa ultrapassou grandes companhias presentes nessa categoria e, em 2008, registrou crescimento de aproximadamente 45%. À esquerda e acima \\ IDC Brasil realiza diversas análises de mercado no segmento de Tecnologia da Informação À direita \\ Em 2008, a Locaweb registrou crescimento de aproximadamente 45% no setor

10 locaweb

Dessa forma, atingiu um total de quase R$ 100 milhões em receitas de serviços de hosting. O estudo reforça o compromisso da Locaweb com seus clientes, pois usa como base o conhecimento sobre mercado, provedores e consumidores de tecnologia para auxiliá-los no endereçamento de questões estratégicas relativas à oferta e ao uso de soluções tecnológicas. Saiba mais em: www.idcbrasil.com.br.

Noticias_Parte1:W2008 31/7/2009 16:39 Page 11

CURTAS EMAIL MARKETING ULTRAPASSA A MARCA DE 100 MILHÕES DE MENSAGENS

Acima \\ A Locaweb comemora a marca de Ferramenta é contratação de mais de 100 milhões de empregada na mensagens por mês com a ferramenta de criação e no envio de e-mail marketing, email marketing. A solução é empregada na newsletters, boletins criação e no envio de e-mail marketing, e outras peças newsletters, boletins e outras peças com Abaixo \\ baixo custo e alto controle sobre o retorno Os planos variam de ações. O uso é prático, conﬁável, de entre 10 mil simples gerenciamento via web e foi e 1 milhão de emails mensais e adaptado às necessidades dos usuários. custam a partir de O sistema permite o envio de grandes R$ 50 por mês quantidades de mensagens em pouco tempo, por menos de R$ 0,01 por mensagem enviada. Os planos variam entre 10 mil e 1 milhão de e-mails mensais e custam a partir de R$ 50 por mês, com inscrição gratuita por tempo limitado. O serviço de email marketing ainda oferece relatórios online com diversas informações, facilidade de importação e exportação de dados. Fora isso, coloca à disposição formulários de inscrição gerados automaticamente, que podem ser editados conforme a necessidade do usuário, agilizando o cadastro de novos clientes. Para saber mais sobre o produto, acesse locaweb.com.br/emailmkt.

Webcast: Modelagem de dados No blog da Locaweb, é possível assistir à apresentação Modelagem de dados, na qual Caio Spadafora fala sobre como modelar os dados da sua aplicação para obter melhor desempenho e escalabilidade ao utilizar seu Banco de Dados. Assista em blog.locaweb.com.br.

No blog \\ Caio Spadafora fala sobre o uso do Banco de Dados para modelar sua aplicação e obter melhor desempenho e escalabilidade

Locaweb apoia Congresso sobre formas de prevenção de Crimes Eletrônicos Karine Taxmann, procuradora federal norte-americana; Dr. Renato Opice Blum, presidente do Conselho Superior de Tecnologia da Informação da Fecomercio; e outros especialistas em crimes eletrônicos se encontram nos dias 3 e 4 de agosto na Fecomercio para debater questões envolvendo formas de proteção para crimes no mundo virtual. Confira a programação completa e faça o seu cadastro no site www.fecomercio.com.br. A participação é gratuita.

Prevenção \\ Encontro que será realizado nos dias 3 e 4 de agosto na Fecomercio debaterá questões sobre proteções para crimes

locaweb 11

Noticias_Parte2e3_WishList:W2008 18/7/2009 01:22 Page 12

Wishlist

O melhor da cultura digital Nesta seção, você confere o que há de melhor nas prateleiras ao redor do mundo quando o assunto é alta tecnologia, conectividade com a web e diversão eletrônica

Tela wireless A D-Link, que fornece soluções de redes, segurança, armazenamento de dados e vigilância IP, lançou o display digital wireless DSM-210. Trata-se de um equipamento que possui tecnologia Wi-Fi integrada, aliando os benefícios de um porta-retratos tradicional com a conveniência da internet. Outra característica importante do display é a tecnologia Green Ethernet para economizar energia sem prejudicar o desempenho. R$ 1.299. Mais informações: www.dlink.com

Drive Slim O GP08NU20 é um novo gravador e leitor externo de DVD e CD da LG. Na cor branca, tem velocidade 8X (DVD) e conexão USB. Prático e moderno, é ideal para as pessoas que valorizam a portabilidade e já utilizam netbook (sem drive óptico embutido), já que o aparelho pesa apenas 370 g e não precisa ser ligado à tomada. O preço sugerido é de R$ 249. Mais informações: www.lge.com.br

12 locaweb

Noticias_Parte2e3_WishList:W2008 31/7/2009 16:40 Page 13

Wishlist

Nokia E75 com teclado QWERTY Novo smartphone da Nokia, o E75 pode ser habilitado com chip pós-pago ou pré-pago. O modelo tem design side-slide com teclado QWERTY completo, configuração rápida de diversas contas de e-mail com Nokia Messaging, câmera de 3.2 MP com flash integrado, GPS com licença Nokia Mapas de seis meses para navegação assistida e acesso à web via 3G e Wi-Fi. R$ 1.499. Mais informações: www.nokia.com.br

Beat Edition

Ultrafinos

A linha de telefones Beat Edition, da Samsung, tem interface totalmente voltada à experiência musical. Com os aparelhos, é possível fazer scratchs, remixar, inserir efeitos musicais e ainda gravar o seu estilo nos seus hits preferidos. O modelo conta com visor full touch de 2,8 polegadas, que garante cores muito mais vivas, maior contraste e ângulo de visão, menor tempo de resposta, visualização otimizada sob a luz solar e consumo de energia até 50% inferior ao TFT. R$ 1.399. Mais informações: www.samsung.com.br

A recém-lançada linha de monitores ECOFIT combina tecnologia e estilo. Fazem parte dela os modelos SyncMaster P2270 e P2370, de 21,5 e 23 polegadas, respectivamente, que foram apresentados este ano na feira de eletrônicos CES (Consumer Electronics Show) e chamaram a atenção dos participantes por conta da elegância do gabinete ultrafino. Preços a partir de R$ 799. Mais informações: www.samsung.com.br

locaweb 13

Noticias_Parte2e3_WishList:W2008 18/7/2009 01:22 Page 14

Wishlist

Touch screen O celular Samsung Star S5230 é um touch screen que oferece ao usuário acesso a diversas funções com apenas um toque. A navegação intuitiva dispõe ainda dos Online Widgets (pequenas aplicações Web com atualização em tempo real dos mais diversos conteúdos: bolsa de valores, previsão do tempo, notícias, sites de busca). A navegação na internet é otimizada por meio da tela widescreen de 3 polegadas e do teclado QWERTY virtual. Serviços como o Share Pix e o Beat ID NoAr fazem do Star um aparelho ainda mais completo. O preço sugerido é de R$ 699. Mais informações: www.samsung.com.br

Tudo em um A MSI Computer apresentou o Wind Top AE1900, seu primeiro computador tudo-em-um com tela sensível ao toque. Também conhecidos como Nettop, esses equipamentos reúnem componentes e monitor em um único gabinete. Com design ambientalmente correto e pouco consumo de energia, o AE1900 usa recurso touch screen e interface de usuário wind touch da MSI, desenvolvida especialmente para a série Wind Top. R$ 2.699. Mais informações: www.msicomputer.com.

Media center compacto A Daten Computadores colocou nas prateleiras o media center Daten Home PC Slim. O aparelho agrega diversas funcionalidades em um só produto, tais como DVD player, aparelho de som e computador com acesso à internet. Com design compacto, o media center ocupa pouco espaço físico e pode ser conectado a televisores e monitores de computadores. R$ 3.150. Mais informações: www.daten.com.br

14 locaweb

Noticias_Parte 4_Circuito_Twittosfera:W2008 31/7/2009 17:25 Page 16

//CURSOS

Blogs Corporativos

Notícias/Circuito

Sua leitura sobre internet

Confira os principais lançamentos de livros que tratam de temas ligados ao mundo da tecnologia da informação

Blogs Educativos

Free Autor de A Cauda Longa e editor da revista Wired, Chris Anderson acaba de colocar na internet, para download gratuito, seu novo livro, Free. A obra fala sobre o modelo de negócios da era digital. Preço: gratuito Editora: Randon House Inf.: www.wired.com/ techbiz/it/magazine/1707/mf_freer

Use a Cabeça Java Obra que fala sobre uma das linguagens mais populares do mundo. Criado pela Sun, o Java é uma das plataformas mais utilizadas em sites que necessitam de confiabilidade e alto poder de performance. O autor é Kathy Sierra. Preço: R$ 92,70 Editora: Alta Books Informações: www.altabooks.com.br

Undress for Success: The Naked Truth about Making Money at Home Kate Lister e Tom Harnish abordam nesta obra os desafios de se trabalhar em casa. Há relatos de profissionais que apontam os benefícios e dificuldades do sistema de home office. Preço: US$ 24,95 Editora: Wiley Informações: www.wiley.com

TUTORIAIS E VIDEOAULAS ONLINE O ambiente online é bastante propício para videoaulas, já que permite ao aluno acompanhar as lições quando e onde quiser. Aqui, a cada edição da Locaweb em Revista, você vê o melhor em cursos disponíveis na internet 16 locaweb

Como criar e editar arquivos do servidor Duração: 3 minutos e 41 segundos URL: www.youtube.com/watch?v=-L6Q6sABQwU& feature=PlayList&p=FFA3F26F8649BA40&index=3

Polyana Ferrari ministrará o curso “Como Construir e Gerenciar Blogs Corporativos”, no qual abordará técnicas de criação de diários virtuais voltados a empresas. Um dos tópicos de destaque é a aula sobre blogs como ferramenta estratégica para comunicação empresarial. Com oito horas de duração, o curso será realizado no Rio de Janeiro (RJ) em 30 de outubro de 2009, a partir das 9h. Para saber mais informações, ligue para (11) 3662-3990 ou envie uma mensagem para o endereço cursos@aberje.com.br.

Para ajudar os educadores a se saírem melhor com seus alunos o Aprendaki oferece o curso "Blogs Educativos", parte integrante do curso "Informática Educativa" com a autora Andrea De Carli. Durante as aulas, o educador aprende a dominar as técnicas de webquest, webgincana, mapas conceituais e blogs educativos para o uso na educação. Em agosto, mês em que acontecerá a quarta turma do curso, seu valor será integral, de R$ 89. Mais em http://f2link.f2b.com.br/pedido/ FCProduct.asp?cod_form= 15817&c=13552&cod_item=13.

REDES SOCIAIS No próximo dia 25 de agosto, será realizado em São Paulo o curso “Como Inserir sua Empresa em Redes Sociais”, com duração de oito horas. Para se cadastrar e obter mais informações, ligue para (11) 3662-3990 ou envie um e-mail para o endereço cursos@aberje.com.br.

BLOG DO MÊS

TwitterBrasil.org

Descrição: Site que aborda o dia-a-dia de umas das principais redes sociais do mundo. URL: www.twitterbrasil.org

Noticias_Parte 4_Circuito_Twittosfera:W2008 31/7/2009 17:25 Page 17

Notícias/Twitter

TWITTOSFERA

Siga os profissionais web que fazem a diferença na rede Blogueiros, Publicitários, Ilustradores e Marketeiros

André Dahmer é desenhista, autor das tirinhas dos Malvados, http://twitter.com/malvados --------------------------------------------------Bia Kunze escreve no blog Garota sem Fio http://twitter.com/garotasemfio --------------------------------------------------Cardoso escreve no blog Contraditorium, http://twitter.com/Cardoso --------------------------------------------------Carlos Merigo, publicitário, gerente de estratégia e criação digital da Fischer America, escreve no Brainstorm 9, http://twitter.com/cmerigo

--------------------------------------------------Cezar Paz, diretor presidente da AG2, http://twitter.com/cesarpaz --------------------------------------------------Edney Souza escreve no blog do Interney, http://twitter.com/Interney --------------------------------------------------Fabio Seixas, fundador do site de venda de camisetas da moda Camiseteria, http://twitter.com/fseixas --------------------------------------------------Fabio Yabu é desenhista, autor de diversos livros, dentre eles Princesas do Mar, http://twitter.com/fabioyabu --------------------------------------------------Fernando Souza, diretor de Arte da Pólvora! Comunicação e editor do blog Twitter Brasil, http://twitter.com/fernandosouza --------------------------------------------------Guilherme Cherman escreve no blog JT Tecnologia, http://twitter.com/jtecnologia --------------------------------------------------Gil Giardelli, CEO da Permission, http://twitter.com/gilgiardelli --------------------------------------------------Inagaki escreve no blog Pensar Enlouquece, Pense Nisso, http://twitter.com/inagaki --------------------------------------------------Jean Boechat é diretor de criação da JWT, http://twitter.com/jampa

Jonny Ken criador do Migre.me, escreve no blog Decodificando, http://twitter.com/jonnyken --------------------------------------------------Jovem Nerd escreve no blog Jovem Nerd, http://twitter.com/jovemnerd --------------------------------------------------Lili Ferrari, produtora cultural, professora e blogueira, http://twitter.com/lilianeferrari --------------------------------------------------Lu Freitas escreve no blog Lady Bug, é jornalista e consultora de internet, http://twitter.com/lufreitas --------------------------------------------------Marcelo Tripoli especialista em tecnologia e colunista, http://twitter.com/MarceloTripoli --------------------------------------------------Marco Gomes é programador de interfaces e diretor de tecnologia da boo-box, http://twitter.com/marcogomes --------------------------------------------------Nickellis escreve no Digital Drops, http://twitter.com/nickellis -------------------------------------------------Souza Campos é characters art, design and animation, http://twitter.com/souzacampos

Desenvolvedores

Juliano Spyer, consultor de mídias sociais e autor do livro Conectado, http://twitter.com/jasper --------------------------------------------------Luli Radfadher é Ph.D. em comunicação digital pela ECA-USP http://twitter.com/radfahrer --------------------------------------------------Martha Gabriel, especialista em SEO/SEM , http://twitter.com/marthagabriel --------------------------------------------------Raquel Recuero é jornalista, professora e pesquisadora, autora do livro Redes Sociais na Internet, http://twitter.com/raquelrecuero

--------------------------------------------------Renee de Paula, evangelista da Microsoft e fundador do Radinho de Pilha, http://twitter.com/renedepaula

Bruno Dulcetti, webdesigner do Videolog, http://twitter.com/dulcetti --------------------------------------------------Fabio Akita, gerente de produtos da Locaweb e Evangelista de Ruby on Rails, http://twitter.com/akitaonrails

Jornalistas

--------------------------------------------------Guilherme Chapiewski, especialista em Metodologias ágeis da Globo.com, http://twitter.com/gchapiewski --------------------------------------------------Manoel Lemos, fundador do BlogBlogs, CTO da WebCo e Abril Digital, http://twitter.com/mlemos

Pesquisadores de Cibercultura, evangelistas e autores de livros

Alex Primo, pesquisador, professor e blogueiro, http://twitter.com/alexprimo

Bruno Ferrari, repórter de tecnologia da revista Época, http://twitter.com/bferrari --------------------------------------------------Débora Fortes jornalista da Abril, http://twitter.com/deborafortes --------------------------------------------------Gilberto Pavoni Jr, jornalista e escreve no blog Tech Boogie, http://twitter.com/gpavoni --------------------------------------------------Renato Cruz, repórter do Estadão, http://twitter.com/rcruz --------------------------------------------------Sandra Carvalho, jornalista da Abril, http://twitter.com/gpavoni --------------------------------------------------Vanessa Nunes, colunista de Tecnologia do Zero Hora, http://twitter.com/blogdavanessa

locaweb 17

Keep it Simple:W2008 31/7/2009 17:43 Page 18

keepitsimple Plataforma da Locaweb permite que o cliente contrate recursos de acordo com a demanda

ESTE MÊS

Serviço: Cloud Computing Locaweb Site: www.locaweb.com.br/cloud

Benefícios do Cloud Computing Alta performance e baixo custo são algumas das vantagens da plataforma de serviços da Locaweb Por Sérgio Vinícius

ma pesquisa realizada pela consultoria IDC prevê que gastos com serviços de Cloud Computing tripliquem até 2012, atingindo US$ 42 bilhões. Esta alta se deve à necessidade de as empresas reduzirem custos com Tecnologia da Informação sem perder itens como alta performance e poder de escalabilidade. Diante desta realidade do cenário mundial, a Locaweb, desde o final do ano passado, investe

18 locaweb

fortemente em diversos serviços ligados à computação em nuvem. E, além disso, a ideia é continuar expandindo os serviços e as plataformas de Cloud Computing nos próximos meses.

* O Cloud Computing permite que o cliente controle a expansão do serviço sob demanda, alocando recursos de processamento, espaço em disco e muito mais

“A ‘computação em nuvem’ é uma plataforma mais moderna e eficiente que a infraestrutura tradicional de TI”, aponta Andrew de Andrade, PO de Cloud Computing. “O Cloud Computing permite que o cliente controle a expansão do serviço contratado sob demanda, alocando recursos de processamento, espaço em disco, memória e banda de maneira independente e na medida certa para as necessidades das aplicações. São milhares de servidores à disposição para comportar o crescimento de cada cliente.” Até o momento, a Locaweb já conta com três linhas de produto. “Entre os destaques estão o Cloud Mini e o Cloud Server, ofertas

Keep it Simple:W2008 31/7/2009 17:43 Page 19

Keep it Simple

* Private Cloud é a solução robusta, customizada e dedicada para grandes empresas; Cloud Mini é uma plataforma Linux que oferece autonomia total na administração do servidor; Cloud Server é voltado a quem procura serviços dedicados de baixo custo pré-configuradas e contratáveis pelo site”, aponta Andrew. “Há também o Private Cloud, uma solução robusta, altamente customizada e dedicada para grandes empresas.” Além da escalabilidade e da flexibilidade na contratação de recursos, o Cloud Computing Locaweb possui uma arquitetura inteligente, que previne falhas e realoca os componentes da nuvem para garantir que o serviço esteja sempre disponível. “Isto significa que, mesmo que ocorra uma falha de hardware, o sistema realoca rapidamente as aplicações para outro servidor, proporcionando disponibilidade contínua para o cliente”, informa Andrew. “Esta mesma arquitetura reduz o consumo de energia, contribiundo para a preservação do meio ambiente. Outro benefício é a redução de custos, já que os clientes não precisam mais investir em infraestrutura própria e passam a contratar serviços mensais.”

Atualmente, a Locaweb já possui mais de mil clientes ativos na plataforma Cloud e cada oferta é destinada a um público diferente, de acordo com suas necessidades e também aspirações com relação a projetos e plataformas eletrônicas. O Cloud Mini é uma plataforma Linux com autonomia total na administração do servidor. A partir de R$ 59/mês (www.locaweb.com.br/ CloudMini), a solução possui tecnologia de ponta, tem custo baixo e é voltada ao público que possui conhecimento técnico e procura autonomia na administração do servidor Linux (acesso root) e flexibilidade para migrar de plano à medida que necessitar. O Cloud Mini é oferecido em duas configurações. A primeira, chamada Cloud Mini I, conta com 2 cores de 300 MHz, 300 MB de memória, disco de 20 GB, 2 Mbps de banda ou transferência mensal de 300 GB.

Página do Private Cloud \\ Hoje, a Locaweb possui mais de mil clientes ativos na plataforma Cloud e cada oferta é destinada a um público diferente, de acordo com suas necessidades

Já a Cloud Mini II tem 2 cores de 400 MHz, 600 MB de memória, disco de 30 GB, 4 Mbps de banda e transferência mensal de 600 GB. O Cloud Server, por sua vez, é um serviço com recursos exclusivos e custo otimizado. Boa opção para empresas que buscam servidores dedicados de baixo custo, o Cloud Server custa a partir de R$ 149/mês (www.locaweb.com.br/CloudServer) e permite definir capacidades de processamento, disco, memória, banda e ajustá-las a qualquer momento, além de autonomia e recursos de uso exclusivo, dentro de um ambiente de alta performance e tecnologia de ponta. Na hora de contratar o serviço, o usuário pode optar por Gerenciamento pelo Cliente ou pela Locaweb, de acordo com suas preferências ou necessidades. Este último caso é voltado a usuários que desejam administrar o desenvolvimento web, sem a obrigação ou responsabilidade por atualizações, segurança e manutenção do servidor. A Locaweb fica responsável por todas essas atividades. Por fim, o Private Cloud é a solução robusta, altamente customizada e dedicada para grandes empresas. “Por tratar-se de uma solução corporativa, os interessados devem entrar em contato com a nossa equipe comercial para que alinhem suas demandas com nossos especialistas”, diz Andrew. “Para obter mais informações sobre o assunto ou mesmo entrar em contato, basta acessar o endereço www.locaweb.com.br/ PrivateCloud.” locaweb 19

Portfólio:W2008 31/7/2009 17:58 Page 20

portfólio

Todo mês, projetos de destaque de parceiros da Locaweb

byMK A byMK é uma rede social de moda que une pessoas interessadas em novos looks, dicas para combinações e tendências em vestuários, apoiada numa bela infraestrutura tecnológica. www.bymk.com.br

Drimio A Drimio é uma rede inovadora, com ferramentas e aplicações que permitem que consumidores e marcas interajam com opiniões, ideias, conteúdo útil e relevante. www.drimio.com

MIL Casmurros Neste projeto, qualquer internauta pode ler um trecho do livro Dom Casmurro, de Machado de Assis. Trata-se de uma promoção da minissérie da Globo, Capitu. www.milcasmurros.com.br

20 locaweb

205 X 275:Layout 1 15/7/2009 18:09 Pรกgina 1

Dominios:W2008 31/7/2009 17:59 Page 22

22 locaweb

Dominios:W2008 31/7/2009 17:59 Page 23

Domínios

Nos

domínios da web Mudanças recentes, como a transformação em domínio genérico do .net.br, têm ajudado a democratizar o uso de terminologias na web. Hoje, estuda-se até implementar um domínio de primeiro nível a partir de uma marca, o que dispensaria o emprego de nomes tradicionais, como o .com

Por Luciano Delfini

o começo deste ano, em São Francisco, Estados Unidos, especialistas e organizações gestoras da internet discutiram, entre outras pautas, a viabilidade para implementação de domínios diretamente na raiz de uma empresa ou de uma marca, o que tornaria dispensável o emprego de domínios genéricos (conhecidos pela sigla gTLD, como o .com). Profissionais ligados ao assunto, como Frederico Neves, diretor de Serviços e Tecnologia do Registro.br (registro.br), grupo do Comitê Gestor da Internet no Brasil (CGI - www.cgi.br), ressaltam que diversos pontos ainda estão em estudo e que a probabilidade da abertura de domínios diretamente na raiz de um usuário final irá depender de algumas mudanças significativas nos procedimentos e contratos da ICANN (sigla em inglês da Corporação da Internet para Atribuição de Nomes e Números - www.icann.com.br), órgão responsável pela coordenação global do sistema de identificadores exclusivos da web. O diretor do Registro.br se refere, por exemplo, à separação entre registros (registries) e registradores (registrars) estabelecida nesses procedimentos e contratos. Mas não são apenas questões legais e de ordem contratual que pautam a discussão. O advogado Peter Líder \\ O Brasil tomou a dianteira na criação de DPNs por atividade. Eles Eduardo Siemsen, sócio do escritório podem ser consultados em www.cgi.br/regulamentacao/anexo2005-02.htm

locaweb 23

Dominios:W2008 31/7/2009 17:59 Page 24

Domínios

* A abertura de domínios diretamente na raiz de um usuário final irá depender de mudanças significativas nos procedimentos da ICANN, órgão responsável pela coordenação do sistema de identificadores exclusivos da web Dannemann Siemsen, do Rio de Janeiro, lembra que representantes de grandes corporações, em parceria com membros da ICANN, vêm analisando a viabilidade e as Conflito \\ Caso o detentor de um domínio .com.br queira registrá-lo sob o .net.br e já exista um vantagens de usar sua marca como mesmo nome registrado com o novo genérico, a dica é consultar o endereço registro.br/saci nome de domínio de primeiro organização interna da empresa, uma vez que se nível (ou DPN). “Ao adotar esse procedimento, a criaria na internet toda a estrutura organizacional da empresa estará comprando o direito de sua marca ser companhia”, observa. o domínio de primeiro nível. Ou seja, ela [a empresa] se transformará em uma marca dentro da internet”, explica o advogado. .net.br x .com.br Peter acredita que a iniciativa pode ser No ano passado, o CGI transformou a terminologia interessante, sobretudo para corporações com .net.br em um domínio genérico (gTLD) tanto para presença global, detentoras de divisões, subsidiárias e pessoas físicas como jurídicas. Até então, o .net.br era vastas linhas de produtos, os quais poderiam ser restrito a empresas com CNPJ brasileiro prestadoras de usados no nome anterior ao domínio de primeiro serviços de telecomunicações, diferentemente do que já nível. “Isso pode ser vantajoso até na forma de acontecia com o .net em outros países, liberado para registro de usuários de qualquer segmento. A medida do CGI foi vista como uma alternativa ao já consagrado DPN .com.br, além de representar um grande passo na democratização do uso de gTLDs. “Foi um avanço no sentido da liberalização do uso, mas vale ressaltar que foram mantidos os limites da segurança e o nosso comportamento estrito como

Registro.br \\ Responsáveis pelo Registro.br (registro.br), grupo do CGI (www.cgi.br), ressaltam que diversos pontos ainda estão em estudo a respeito da abertura de domínios no País

24 locaweb

Dominios:W2008 31/7/2009 17:59 Page 25

Domínios

Pesquisa de nomes \\ Os serviços Whois do ICANN (www.icann.org.br/ topics/whois-services) oferecem acesso público sobre nomes de domínio registrados

domínio de país. Isso gera mais segurança e mais informação a quem usa o domínio”, diz Frederico. O período de operação do .net.br como DPN começou no dia 6 de abril deste ano. Empresas ou pessoas físicas que registraram o equivalente .com.br antes da data de seu início têm a reserva do novo genérico garantida até 6 de outubro – período de seis meses conhecido como “sunrise”. Isso quer dizer que, se um usuário tem registrado o domínio xyz.com.br e quer manter o registro do mesmo nome no agora genérico .net.br, deve fazê-lo dentro desse limite * O período de operação do .net.br como DPN de seis meses. Caso contrário, a partir começou no dia 6 de abril deste ano. Quem registrou o de 27 de outubro, o novo gTLD fica equivalente .com.br antes da data de seu início tem a livre para um usuário registrar, por exemplo, o nome xyz.net.br. reserva do novo genérico garantida até 6 de outubro Caso o detentor de um domínio .com.br queira registrá-lo sob o .net.br e já exista um que o .com.br acabou se consolidando no Brasil como o mesmo nome registrado com o novo genérico, a dica é mais importante domínio de primeiro nível, até pelas recorrer ao Sistema de Arbitragem de Conflitos de Internet restrições que existiam no .net.br”, explica o advogado. (SACI), cujo regulamento está em registro.br/saci. Mas será Peter lembra ainda que o Brasil já tomou faz tempo a dianteira na criação de DPNs por atividade. São que essa necessidade em garantir o novo domínio é diversos e podem ser consultados em www.cgi.br/ importante para todos? Em um universo que abrange interesses e objetivos tão regulamentacao/anexo2005-02.htm. O advogado afirma diferentes, certamente a resposta é não. Peter conta que as que essa variedade de domínios de primeiro nível ajuda consultas e os processos de registro não se deram em a reduzir conflitos entre empresas com mesmo nome, grande escala em seu escritório. “É uma vantagem [registrar mas com atividades distintas. Porém, ter uma gama de o novo genérico], mas que não atinge a muitos, uma vez DPNs não é só para amenizar conflitos. Muitas vezes, o genérico específico de uma área pode dar mais identidade a quem atua nela. Por exemplo: art.br para instituições dedicadas às artes, artesanatos e afins – dentro da categoria exclusiva a pessoas jurídicas, mas que não exige apresentação de documentos. Mas se a sua empresa não se enquadra em nenhuma categoria da Resolução 002/2005, você pode optar pelo registro do etc.br, dedicado aos “outsiders”. Se achar estranho, fique com o bom e velho .com.br.

Nos domínios de um país

Disputas \\ O ICANN segue uma política uniforme para resolução de disputas. O documento pode ser consultado em www.icann.org/en/udrp

Ainda que os mercados estejam sempre correndo atrás da internacionalização de produtos e suas marcas, o diretor do Registro.br aponta que domínios com códigos de um país (também chamados de domínios de alto nível, ou ccTLDs) – como o .br – têm sido mais procurados que os domínios genéricos. “A associação geográfica é um locaweb 25

Dominios:W2008 31/7/2009 17:59 Page 26

Domínios

* Ainda falta ao Brasil adotar um procedimento mais rápido para a solução de disputas de nomes de domínio, como a criação de um procedimento semelhante ao sistema de marcas para estabelecer quem tem prioridade sobre determinado nome apelo muito grande, muitas vezes visto como um diferencial na concorrência internacional. Isso sem falar que proporciona mais segurança e controle”, explica Frederico. Além disso, do ponto de vista funcional, não há diferença entre os domínios. “Não existem indícios de diminuição de procura dos domínios de país em face aos domínios genéricos”, completa. Peter concorda que o .br não deixará de ser usado, seja por tratar-se de um domínio de baixo custo ou até mesmo pela posição em que o Brasil vem aparecendo no cenário econômico mundial. O advogado cita, inclusive, o .asia, mais recente domínio de alto nível por localização geográfica (ccTLD) criado para empresas do continente asiático. Mas ele lembra que muitas empresas brasileiras buscam domínios internacionais que não estejam limitados à sigla de um país, podendo facilitar a internacionalização de um produto, caso seja mesmo esse o objetivo do detentor. “É normal buscar soluções para acessar o mercado, o que inclui ir atrás de domínios que não se restrinjam ao aspecto geográfico”, defende o advogado.

Disputas De acordo com Peter, ainda falta ao Brasil adotar um procedimento mais rápido para a solução de disputas de nomes de domínio. Ele defende a criação de um procedimento semelhante ao sistema de marcas para estabelecer quem tem prioridade sobre determinado

Pacotes \\ A Locaweb (locaweb.com.br/registro) oferece o serviço de registros de domínios por pacotes que custam a partir de R$ 15

nome. É o caso, por exemplo, de conflitos entre o proprietário de uma marca e o detentor do domínio registrado na web com o mesmo nome, porém com DPN diferente ou uma pequena variação no nome. Peter explica que a solução pode estar em uma notificação extrajudicial ou, com mais sorte, um acordo amigável – os serviços Whois do ICANN oferecem acesso público sobre nomes de domínio registrados, incluindo informações para contato com detentores de nomes registrados (www.icann.org.br/topics/whois-services). “Se de nada adiantar, entram os caminhos judiciais, em geral Ao lado \\ O DNSSEC (registro.br/faq/index. html#8) é um padrão internacional que estende a tecnologia do Sistema de Nomes de Domínios (DNS, em inglês)...

...Abaixo \\ A tecnologia pode ser usada por registros que estão abaixo dos domínios de primeiro nível indicados em registro.br/info/dpn.html

26 locaweb

Dominios:W2008 31/7/2009 17:59 Page 27

Domínios

caros, demorados e problemáticos”, avalia o advogado. O diretor do Registro.br lembra que o ICANN segue uma política uniforme para resolução de disputas, estabelecida no processo UDRP (da sigla em inglês para Política de Solução de Disputa de Nomes de Domínio). O documento pode ser consultado em www.icann.org/en/udrp - infelizmente, na versão em inglês. Mas é importante deixar claro que o UDRP é obrigatório somente para registro de domínio genérico com o mesmo nome disputado por duas partes distintas. “Até porque, no caso dos gTLDs, não há um foro jurídico definido”, explica Frederico. Segundo ele, o uso da arbitragem, Totalmente liberado \\ Desde o dia 6 de abril de 2009, pessoas físicas e jurídicas podem ainda que crescente, é uma prática usar o domínio .net.br como DPN. É o caso do site de imóveis www.clickcerto.net.br relativamente recente no Brasil e “ainda estamos muito pouco ‘aculturados’ com isso”. * O .br não deixará de ser usado, seja Mesmo que se fale de disputas, Peter afirma que a por tratar-se de um domínio de baixo preocupação em proteger uma marca em relação ao nome custo ou pela posição em que o Brasil de domínio na web (disputa de reserva ou de defesa) vem caindo recentemente. Para o advogado, a explicação está vem aparecendo no cenário mundial no fato de que “é quase impossível criar um programa que (endereços IP), e do CGI, que gerencia o assunto no Brasil funcione, uma vez que as variações para registrar marcas e conta com grupos de trabalho, como o Registro.br, para ou nome, acrescidas de uma letra ou de outra combinação procedimentos que envolvem o processo de registro sob o de palavra ou número, são praticamente ilimitadas”. domínio .br – registro.br/contrato/contrato.html. O processo de registro de nomes de domínio no Brasil é considerado seguro e ágil por especialistas. Na própria Frederico destaca o surgimento de novas ferramentas web, é fácil encontrar prestadores deste tipo de serviço e tecnológicas adotadas por alguns prestadores de serviço, conhecer os procedimentos e normas de resoluções as quais beneficiam, em longo prazo, os usuários disponíveis nos sites de órgãos gestores. É o caso da do sistema de registro. Uma delas é o DNSSEC ICANN, responsável no âmbito internacional pela alocação (registro.br/faq/index.html#8), um padrão internacional do espaço de endereços de Protocolos da Internet que estende a tecnologia do Sistema de Nomes de Domínios (ou DNS, em inglês). Visto como um mecanismo mais seguro de resolução de nomes, que pode ajudar a reduzir o risco de manipulação de dados, o DNSSEC roda com tecnologia de criptografia de chaves públicas, provendo autenticidade e integridade das respostas do sistema de nomes de domínios. Por outro lado, o padrão não garante confidencialidade e não protege contra ataques de negação de serviço. A tecnologia pode ser usada por registros que estão diretamente abaixo do domínio .br e registros que estão sob os domínios de primeiro nível indicados em registro.br/info/dpn.html. O diretor do Registro.br lembra ainda que é sempre bom procurar referências e dicas na hora de buscar um prestador de serviço eficiente de registro de domínio. “O prestador de serviço ganha sua clientela pela qualidade e não pelo diferencial de preço, principalmente em Restrito \\ Registro .net.br era restrito às empresas de telecomunicações, mercados como o de nomes de domínio”, finaliza. como a Associação Brasileira de Recursos em Telecomunicações locaweb 27

artigo_marcelo_mercado:W2008 18/7/2009 02:44 Page 28

opinião/articulista

e-business Marcelo Trípoli Presidente da agência de marketing digital iThink e autor do blog ifound.com.br @marcelotripoli marcelo.tripoli@ithink.com.br

A consolidação do brand utility Se o consumidor não enxerga a mensagem publicitária como um entretenimento, dificilmente irá consumi-la e propagá-la As estratégias online de marketing já não devem se limitar a banners, Twitter, Facebook, MySpace, YouTube e mobile. O desafio agora está em proporcionar aos usuários e consumidores uma experiência útil com a “face” digital das empresas. Esse conceito, chamado de brand utility, ganha cada vez mais força porque diversas iniciativas já provaram que não adianta as agências criarem campanhas brilhantes se a experiência final com o produto/serviço não for útil. O “útil”, neste caso, se refere à informação e ao conteúdo. Ou seja, se o consumidor não enxerga a mensagem publicitária como lazer, dificilmente irá consumi-la e propagála. Neste contexto, o branding tradicional – usado para divulgar marcas e para que elas sejam fixadas na mente dos consumidores - é substituído por um branding focado na real funcionalidade do serviço e do produto. Aos poucos, se bem aplicado, o brand utility cria um relacionamento muito mais próximo da empresa com seu público-alvo, pois a mensagem divulgada contribui com a vida do consumidor e do usuário, interagindo com os melhores momentos das pessoas. Alguns cases, realizados nos últimos dois anos, comprovam o sucesso dessa estratégia. Um case premiado em Cannes este ano é o Fiat Ecodrive, software que ajuda o usuário a dirigir de forma mais eficiente. Ele analisa o jeito de dirigir do motorista e o 28 locaweb

ajuda a usar menos combustível, reduzindo a emissão de CO2 e o consumo de combustível em até 15%. O consumidor simplesmente baixa o software EcoDrive da internet e coloca um pendrive no seu carro – os carros da Fiat na Europa têm porta USB. Automaticamente, a informação é armazenada e, quando o pendrive volta ao computador, o aplicativo converte os dados de forma gráfica e lúdica e analisa a técnica de direção da pessoa, usando como base medidas como aceleração, mudanças de marcha e velocidade. A partir do resultado, o software dá dicas de como ser um motorista mais eficiente. O consumidor também fará parte da Fiat Ecoville, uma comunidade online de todos os EcoDrivers. Lá, é possível saber o quanto de dinheiro e combustível está sendo economizado, e quanto a emissão de carbono já foi reduzida. Outro case interessante foi protagonizado pela Kraft Foods, que criou um aplicativo para iPhone, o iFood Assistant. Ele oferece um mix de receitas culinárias que envolve produtos da marca, comentários e vídeos com instruções sobre nutrição e saúde alimentar. Em pouco tempo, o aplicativo, que custa apenas US$0,99, virou um sucesso. Esses dois exemplos consolidam a importância do brand utility. Os consumidores exigem cada vez mais a experiência com o produto. E as empresas já perceberam que terão de aplicar esta estratégia para não ficar de fora do jogo!

205 X 275 2:Layout 1 20/7/2009 15:55 Pรกgina 1

Blog X Site:W2008 31/7/2009 18:16 Page 30

Blog X Site:W2008 31/7/2009 18:18 Page 31

SiteXBlog

Antes de criar um endereço na internet, especialistas aconselham que se leve em conta pelo menos duas questões importantes: qual o objetivo da página e que tipo Por Luciano Delfini de conteúdo ela tornará disponível para os usuários. velocidade com que a web propaga informação, Na reportagem a seguir, praticamente livre de barreiras consultores em mídias como distância, fronteiras e até custos elevados (dependendo do projeto), faz surgir sociais e corporativas dão todos os dias, e em todas as partes do mundo, dicas para acabar com inúmeros endereços virtuais. Pessoas físicas ou jurídicas – não importam os objetivos e interesses de as dúvidas na hora de cada um – recorrem à grande rede para dar seu recado escolher a plataforma ou “vender seu peixe”. Até pouco tempo atrás, o site

predominava como opção. Mas o problema é que ele exige um projeto elaborado, que envolve contratação de profissionais e, consequentemente, gastos que muitas vezes não estão no orçamento. O advento do blog, por sua vez, trouxe uma alternativa para propostas menos ambiciosas e proporcionou mais equilíbrio entre conteúdos corporativos e pessoais dentro da web. Só que aí, surgiu uma grande dúvida na cabeça de muitos usuários: qual plataforma escolher na hora de criar um novo endereço na internet? O jornalista Alexandre Inagaki, consultor de mídias sociais e autor dos blogs “Pensar enlouquece, pense nisso” (www.pensarenlouquece.com) e “Pop cabeça” (mtv.uol.com.br/popcabeca), observa que é preciso conhecer as diferenças e semelhanças dessas duas mídias – site e blog – que compõem o arcabouço da internet. Segundo sua definição, blogs são sites com estrutura locaweb 31

Blog X Site:W2008 18/7/2009 01:58 Page 32

SiteXBlog

mais enxuta, que dispensam maiores conhecimentos de programação e de elaboração prévia de uma arquitetura de informação. Essa arquitetura, necessária na construção de um site, antecipa como funcionará o posicionamento das seções em uma homepage ou a navegação por meio de diversas páginas de conteúdo. “Os blogs possuem atualização mais dinâmica, seus textos são mais informais e opinativos, dispensando o crivo e a supervisão de um editor de conteúdo”, explica. Na opinião de Alexandre, essas características fazem do blog a solução ideal para um Diferentes \\ Blog do consultor empresarial Fabio Cipriani, autor do livro Blog corporativo, projeto que não requeira organização que costuma dizer que o site é uma vitrine, enquanto o blog é uma conversação formal de conteúdo separada por textos, fotos e vídeos, * Há empresas que além de permitir uma fazem do blog o seu comunicação menos rígida com os website, ou seja, internautas, “sem que combinam burocracias referentes à posts do blog com livre expressão de opiniões e comentários”. páginas estáticas Ao contrário do blog, com mais Alexandre diz que o site informações sobre a demanda um planejamento prévio companhia, tendo o antes de entrar no ar. Não blog como meio que o blog dispense principal dessa qualquer tipo de Grátis \\ Blogspot (www.blogspot.com) e WordPress (pt-br.wordpress.com), elaboração, mas ela se dá comunicação duas das ferramentas gratuitas de blogs mais procuradas da web em escala bem diferente. “O site possui uma homepage, na qual seus diversos conteúdos devem ser destacados e organizados, e que necessariamente precisa ser desenhada e estudada, de modo a catalogar da melhor maneira possível todos os conteúdos que serão disponibilizados no endereço na web.” Diante desse modelo de demandas, Alexandre aponta o site como solução mais apropriada, por exemplo, para empresas que dispõem de um portfólio extenso de produtos ou serviços e pessoas físicas que desejam apresentar seu currículo e trabalhos pessoais – na forma de textos, vídeos, áudios, fotos, desenhos. “É um projeto mais custoso, uma vez que a criação de um site demandará a contratação de profissionais que dominem linguagens de programação como HTML, que criem layouts e que elaborem a arquitetura de informação.” 32 locaweb

Blog X Site:W2008 18/7/2009 01:58 Page 33

Dica de quem também é blogueiro

CULTURA

Pensar enlouquece, pense nisso

PSICOLOGIA

De Alexandre Inagaki (www.pensarenlouquece.com)

Não posso evitar

INTERNET

De Rodolfo Araújo (www.rodolfo.typepad.com)

Não zero – remix colaborativo De Juliano Spyer (naozero.com.br)

TECNOLOGIA E MARKETING

O consultor empresarial Fabio Cipriani (www.blogcorporativo.net), autor do livro Blog corporativo. Aprenda como melhorar o relacionamento com seus clientes e fortalecer a imagem da sua empresa, costuma dizer que o site é uma vitrine e, portanto, tem um funcionamento monodirecional, enquanto o blog é uma conversação, operando de modo bidirecional. A partir dessa perspectiva, Fabio defende a ideia de que toda pessoa jurídica tenha os dois tipos de endereço na web. Ele conta que existem empresas que já fazem do blog o seu website, ou seja, que combinam posts do blog com páginas estáticas com mais informações sobre a companhia, tendo o blog como meio principal dessa comunicação. “Se olharmos a facilidade de se colocar o blog no ar e suas vantagens, como bom posicionamento em ferramentas de busca, o blog pode ser adotado como primeira opção para o lançamento de uma marca na internet”, defende o consultor. Ao mencionar empresas que já voltaram seus olhares para o potencial do blog, Fabio traz para a realidade o pensamento de que esse tipo de endereço vai além dos limites pessoais, podendo oferecer um caráter profissional para quem está atrás de projetos corporativos mais ambiciosos. Alexandre também reconhece o potencial do blog no mundo das corporações, mas adverte que a empresa deve recorrer apenas à hospedagem em servidor pago, usando URL própria para melhorar seu posicionamento em ferramentas de busca e com acesso livre ao Sistema de Gerenciamento de Conteúdo (ou CMS). “Em serviços gratuitos, o blog pode sair do ar a qualquer hora e o autor não tem o menor controle sobre isso. Também oferecem pouco em termos de customização da ferramenta.”

Confira alguns blogs apontados pelo consultor Fabio Cipriani que se destacam em meio ao enorme arcabouço disponível na web

Techboogie De Gilberto Pavoni (techboogie.blogspot.com)

SiteXBlog

Mas a hospedagem gratuita ainda é a opção mais procurada por aqueles que querem construir um endereço de caráter descompromissado, como blogueiros iniciantes que publicam posts mais informais – e sem dúvida alguma, o serviço gratuito é responsável por possibilitar que todos tenham seu espaço na web. Nesse contexto, Alexandre indica o Blogspot (www.blogger.com/start e www.blogspot.com) e o WordPress (pt-br.wordpress.com), já velhos conhecidos dos blogueiros espalhados pelo mundo, como boas ferramentas. Alexandre explica que um site também pode ser construído usando o CMS de um blog, mas sempre levando em conta as limitações de customização de um serviço não-pago. Para isso, ele cita novamente a plataforma gratuita WordPress, que, segundo ele, conta com comunidade ativa de desenvolvedores que criam constantemente soluções de layout e novos plugins – aqueles programas instalados no navegador que permitem o uso de recursos que não estão presentes na linguagem HTML, com a qual são criadas as páginas. Nessa busca pelo endereço ideal, Fabio inclui a questão do registro de domínio (leia mais na página 22). Com relação ao endereço de um site, ele lembra que o nome do domínio desempenha importante função, sobretudo em ferramentas de busca, “daí a vantagem em ter um nome bem elaborado, curto e facilmente escrito”. Fabio ressalta, porém, que o nome de domínio não precisa necessariamente estar relacionado à empresa ou à pessoa física. Por outro lado, se o objetivo é registrar o nome da própria empresa, isso facilita a fixação da marca em visitas via web e encurta a busca na rede. E sugere: “independentemente do ramo ou do segmento de uma empresa, a presença na web com seu próprio domínio é bem vista pela percepção do cliente”. locaweb 33

Blog X Site:W2008 18/7/2009 01:58 Page 34

SiteXBlog

Análise \\ A “taxa de rejeição” é um dos critérios de métrica que podem ajudar no processo de melhorias de um endereço na web, também conhecido pela sigla em inglês SEO

Para ele, definir os critérios de métrica para avaliar esse sucesso só terá validade a partir da compreensão exata desse público a ser atingido e do segmento em que o produto atua. A partir desse esclarecimento, Alexandre enumera os critérios de métrica que podem ajudar no processo de melhorias de um endereço na web, também conhecido pela sigla em inglês SEO (Search Engine Optimization):

Relativizando o sucesso de um endereço na web

* O blog é a solução ideal para projetos que não requeiram organização formal de conteúdo separada por textos e fotos, além de permitir uma comunicação menos rígida com os internautas, sem grandes burocracias

Uma das questões discutidas no processo de elaboração de um endereço na web, e que terá maior ou menor relevância à medida que os objetivos e interesses vão se delineando após a URL entrar no ar, está vinculada ao fato de como medir e alinhar o blog ou o site para que ele tenha sucesso. Na opinião de especialistas, medir o êxito de um endereço e alinhá-lo para que ele alcance o sucesso são fatores bastante relativos. Claro que os interesses de cada um nem sempre podem ser colocados nesse patamar da relatividade, sobretudo quando se trata de projetos ambiciosos, envolvendo o mundo corporativo e algumas centenas de cifras investidas. O que os profissionais se esforçam para deixar claro, no entanto, é que diferentes fatores devem ser levados em conta num universo que, assim como pode atingir centenas ou milhares de pessoas, também pode não despertar a atenção de ninguém. Aí está a relatividade ressaltada pelos profissionais do setor. Alexandre, por exemplo, acredita que, na verdade, diversas perguntas devem anteceder à questão de como mensurar o êxito de uma URL e alinhá-la para alcançar o topo dos rankings. “Medir o sucesso de um blog ou de um site dependerá do púbico-alvo e do nicho em que atua. Um blog dedicado a falar exclusivamente sobre temas como música dodecafônica ou biologia molecular certamente terá parâmetros de avaliação muito diversos de um site ou blog que discuta humor ou política”, esclarece. 34 locaweb

• Número de pageviews, ou número de acessos, quantidade de vezes que uma página na internet é visualizada em um navegador (não confundir com o termo “hit”, número de vezes que um elemento – foto, por exemplo – de uma página na web é visualizado); • Sessão de visitante único (ou unique visitor), que consegue monitorar a interação de um só visitante com um site ou blog no período analisado;

• Bounce rate (cuja tradução é incerta, mas alguns profissionais chamam de “taxa de rejeição”; ver www.mundoseo.com.br/blog/seo/bounce-rate-seo-popularidadeusabilidade-taxa-rejeicao/), análise em porcentagem do número de visitantes que saíram do endereço antes mesmo de terminar de carregar a primeira página. Nesse caso, especialistas costumam afirmar que é muito difícil uma URL ter taxa de rejeição inferior a 20%. Dependendo do objetivo de cada endereço, se o índice de rejeição chegar a 35%, é aconselhável prestar atenção em pontos que podem estar causando essa debandada; se a bounce rate atingir 50% ou mais, então, o melhor a fazer é repensar todo o conteúdo do site ou do blog, sempre levando em conta, claro, o tipo de público a ser alcançado; • Tempo de visitação, o qual mede o período gasto pelos usuários em um site ou blog; • Quantidade de comentários; • Trackbacks (também de tradução incerta, mas conhecidos como “links de retorno” ou “links de notificação”), métodos que notificam o

Blog X Site:W2008 18/7/2009 01:58 Page 35

SiteXBlog

autor de um blog caso seu post tenha sido mencionado ou comentado em outro endereço, desde que o blog que receberá a notificação suporte os trackbacks. Normalmente, os sistemas que hospedam blogs dispõem desse tipo de ferramenta examinando os links que foram colocados em um post e enviando a notificação para cada um desses links. Aqui, vale lembrar que alguns blogueiros experientes preferem método de pingback por considerá-lo menos suscetível a spams, uma vez que o endereço que possui esse tipo de recurso, ao receber o pingback, pode conferir se foi feito de fato um link para o post comentado por outros blogs. A plataforma WordPress, por exemplo, tem serviço de trackback;

• Citações em outras mídias fora da web. Esses e outros indicadores podem ser conseguidos no Google Analytics (www.google.com/analytics), mencionado por Alexandre Inagaki e por Fabio Cipriani como uma ferramenta gratuita eficiente até para medir acessos a grandes portais, com diferentes possibilidades de análise e estatísticas, incluindo manuais em português (www.google.com/intl/pt-BR_ALL/analytics/). Alexandre destaca ainda a diversidade e a facilidade de se encontrar na internet serviços de monitoramento online que ajudam a aferir citações em blogs. Fabio, por sua vez, lembra os indicadores internos oferecidos pelos sistemas que hospedam blogs. Como se pode ver, não faltam serviços e ferramentas que proporcionam esse retorno quantitativo a um endereço na web. Mas esse aspecto quantitativo traz de volta a reflexão sobre o quanto é relativo medir o sucesso de um blog, como ressalta o consultor empresarial.

* O site é mais apropriado para empresas que dispõem de um portfólio extenso de produtos ou serviços e pessoas físicas que desejam apresentar seu currículo e trabalhos pessoais – na forma de textos, vídeos, fotos e por aí vai É que Fabio deixa claro que toda essa preocupação acaba passando ao largo da questão qualitativa. Para ele, um blog corporativo de sucesso é “aquele que consegue responder aos comentários de clientes e cria uma comunidade de interessados nos bons e transparentes conteúdos gerados por um profissional que vive o dia-a-dia das operações de uma empresa, independentemente do número de acessos”. Alexandre também defende a ideia de que todos os indicadores acima mencionados correm o risco de perder sua relevância ou, ao contrário, ganhar mais importância de acordo com o perfil do projeto. Ele cita, por exemplo, que um blog criado com fins promocionais, com direito a divulgação em comerciais de TV, certamente terá um número bem mais expressivo de visitantes únicos do que um blog de música feito por alguém que já seja conhecido na blogosfera brasileira. “Em contrapartida, esse blog musical, por ser mantido por alguém que já tenha relevância na web brasileira, por certo terá presença mais expressiva em rankings de ferramentas de busca de blogs como o Technorati ou o BlogBlogs.” Google Analytics \\ Ferramenta gratuita é, segundo especialistas, eficiente até para medir acessos a grandes portais, com diferentes possibilidades de análise e estatísticas

Abaixo \\ Em www.google.com/intl/ptBR_ALL/analytics, é possível consultar manuais em português para melhor utilização do Google Analytics

locaweb 35

Blog X Site:W2008 18/7/2009 01:58 Page 36

SiteXBlog

um blog isolado é como uma mensagem dentro de uma garrafa jogada no oceano. Só que o oceano é finito, enquanto o universo de informações correndo na web parece não ter fim. Levando em conta essa perspectiva, Alexandre aponta algumas dicas que podem ajudar a transformar um blog em referência dentro de uma comunidade.

• Deixe comentários relevantes em outros blogs. Mas comece selecionando adequadamente esses endereços. Se você escreve sobre gastronomia, por exemplo, comente posts de outros endereços que tratam do mesmo assunto. E, definitivamente, deixe comentários que Ganhe dinheiro \\ O AdSense exibe anúncios relacionados com o conteúdo de determinado site. acrescentem algum conteúdo relacionado ao Cada vez que esses anúncios são clicados, o Google paga ao autor da página que o hospeda post visitado, demonstrando genuíno interesse em vez de copiar e colar frases como “muito bom seu blog, Qualquer blog com conteúdo adulto com um mínimo vamos fazer parceria?”. de divulgação chega a dez mil visitas únicas diárias em questão de semanas. Se um post meu que fala de política ganha link na homepage do iG ou do Yahoo, recebe centenas de comentários de pessoas indignadas que sequer voltarão na semana seguinte.

Referência na comunidade Nem sempre o sucesso quantitativo de um blog se traduz em referência dentro de uma determinada comunidade. Como Fabio havia definido anteriormente, Alexandre também enxerga o blog como uma ferramenta de conversações. “Os blogs dialogam por intermédio de links, trackbacks e, principalmente, de comentários. Só assim ganham força.” Para o consultor em mídias sociais,

• Crie uma lista de links para blogs e sites que você mais aprecia e costuma visitar. Mas sem incorrer no erro de querer “trocar links”, exigindo recíproca. Esse tipo de prática é condenado e punido pelo Google PageRank (www.googlando.com.br), que ajuda a determinar a relevância de um endereço e mantém uma lista com bilhões de páginas em ordem de importância. Essa troca não é aconselhável porque, caso seu blog linke blogs sem qualidade, isso acaba minando a confiança e a credibilidade diante de seus visitantes. É como desconfiar da indicação de um amigo se ele recomenda fazer compras em uma loja de péssimo atendimento ou com preços extorsivos.

• Inscreva seu endereço nos principais diretórios de blogs do Brasil e do exterior. Esses serviços são

AdWords \\ Sistema permite que o anúncio de um serviço seja exibido tanto no Google como na rede de publicidade da ferramenta de busca

36 locaweb

ferramentas de busca de blogs cuja inscrição é gratuita. Os mais populares são: BlogBlogs, restrito à busca de blogs brasileiros (blogblogs.com.br); Technorati (technorati.com); MyBlogLog, que pertence ao Yahoo! (mybloglog.com); e BlogCatalog (www.blogcatalog.com), estes três últimos para buscas em âmbito internacional.

Blog X Site:W2008 18/7/2009 01:58 Page 37

Dica de quem também é blogueiro

GRAMÁTICA

MODA

Oficina de estilo

Objetivando disponibilizar

De Fernanda Resende e Cristina Gabrielli (oficinadeestilo.com.br/blog)

VARIEDADE

Anônimo (objetivandodisponibilizar.wordpress.com)

online gratuitos que tornam disponíveis seus favoritospara facilitar acessos e compartilhar com usuários deste tipo de serviço. Alexandre cita alguns bookmarkings interessantes: Uêba (ueba.com.br/Blogs); diHITT (www.dihitt.com.br); e Linkk (www.linkk.com.br).

Hedonismos

O biscoito fino e a massa

De Marcos Donizetti (interney.net/blogs/hedonismos)

De Idelber Avelar (www.idelberavelar.com)

HUMOR

• Divulgue seus posts em sites de social bookmarking. Eles são sistemas

Alexandre Inagaki, consultor de mídias sociais e autor de dois blogs de sucesso, lista alguns endereços que considera interessantes na rede mundial

VARIEDADE

* Para quem deseja ter retorno financeiro com o blog a partir do número de visitas, existem algumas ferramentas no Google que fazem essa ponte por meio de anúncios colocados na página

SiteXBlog

Ressaca moral

Ao mirante, Nelson!

Blog coletivo de humor (www.gardenal.org/ressacamoral)

OPINIÕES

De Nelson Moraes (interney.net/blogs/aomirante)

VARIEDADE

Para quem deseja ter retorno financeiro com o blog a partir do número de visitas, existem algumas ferramentas no Google que fazem essa ponte por meio de anúncios colocados na página. O AdSense, por exemplo (www.google.com/AdSense), exibe anúncios relacionados com o conteúdo de determinado site. Cada vez que esses anúncios são clicados, o Google paga ao autor da página que o hospeda. Já o GoogleAdWords (www.adwords.google.com.br) permite que o anúncio de um serviço seja exibido tanto no Google como na rede de publicidade da ferramenta de busca. O prestador do serviço paga somente quando os visitantes clicarem no seu anúncio.

Rafael Galvão De Rafael Galvão (www.rafael.galvao.org)

Escreva Lola, Escreva De Lola Aronovich (escrevalolaescreva.blogspot.com)

locaweb 37

Blog X Site:W2008 31/7/2009 18:13 Page 38

SiteXBlog

* Os rankings são baseados fortemente em números de páginas que citaram um determinado blog, mas nem sempre esse endereço altamente citado representa conteúdo de qualidade Comprovado o sucesso, muitos autores de blog acabam optando por transformar o endereço em site. Fabio desconstrói qualquer tipo de Hospedagem \\ Na hora de criar um site, é importante levar em consideração a hospedagem. vantagem que essa iniciativa A Locaweb oferece o serviço com alta confiabilidade em planos a partir de R$ 18 por mês possa trazer ao afirmar que “blog é blog e site é site”. Para ele, se um blog está No entanto, Alexandre alerta que esse mecanismo pode trazendo bons resultados e até aumentando a receita não surtir qualquer efeito caso não seja feito um trabalho de seu autor, em hipótese alguma ele deve ser eficiente e eficaz com o objetivo de otimizar e melhorar o substituído por um website. “Faça os dois!”, exclama. endereço na web (o SEO já citado acima). No caso de Numa situação inversa, ou seja, se o blog consome blogueiros cuja maior parte dos rendimentos venha do muito tempo, tem baixos índices de visitação e não AdSense, por exemplo, a preocupação com a otimização da está gerando nenhum benefício perceptível, o URL se torna ainda mais importante, levando-se em conta conselho de Fabio é rever a estratégia e mudar a que visitantes regulares não costumam clicar em anúncios. forma de blogar ou mesmo criar um website comum, “Em média, visitas oriundas do Google e outros sites de com informações do tipo “quem somos, nossos busca representam cerca de 60% da audiência de um blog. produtos e serviços, contatos e testemunhos”. Porém, a médio e longo prazo, um blogueiro profissional deve se preocupar mais em produzir conteúdo de qualidade, sem o qual será incapaz de conquistar Rankings credibilidade, angariar visitantes fiéis e atrair a atenção de A presença do blog em um ranking de acessos pode anunciantes para sua página”, esclarece. trazer a seu autor um bom retorno do trabalho realizado na web. Pode também medir sua popularidade. No entanto, é importante que cada um tenha consciência do tipo de exposição que está buscando. Para Fabio, os rankings são baseados fortemente em números de páginas que citaram um determinado blog, mas nem sempre esse endereço altamente citado representa conteúdo de boa qualidade. “Isso para mim é uma questão de aderência ao gosto pessoal.” O consultor empresarial cita um exemplo: “pegue os primeiros colocados no ranking do BlogBlogs e veja que assunto eles cobrem – internet e tecnologia –, ou seja, blogs sobre blogs. Se é esse o conteúdo que você procura, então está no lugar certo”, polemiza. Alexandre também não vê com bons olhos essas listas. Na opinião dele, rankings são supervalorizados, “mas incapazes de SEO \\ Para obter retorno financeiro, é importante fazer um trabalho refletir a real relevância de um blog”, completa. eficiente e eficaz com o objetivo de otimizar e melhorar o endereço na web 38 locaweb

205 X 275:Layout 1 19/3/2009 17:19 Page 1

artigo_joca:W2008 18/7/2009 04:22 Page 40

opinião/articulista

e-business Joaquim Torres Diretor de Produtos da Locaweb @jocatorres joaquim.torres@locaweb.com.br

Fixe no tempo e nos custos e reduza o escopo Reduzir o escopo sem perder qualidade na hora de entregar um projeto é mais importante do que ampliar prazos Recentemente, Dov Bigio, gerente de produtos de Telecom da Locaweb, postou em seu blog o artigo O triângulo dos projetos, que explica que, dadas as variáveis de um projeto (qualidade, custo e prazo), é possível fixar no máximo em duas delas, enquanto a terceira irá variar. Ou seja, se fixarmos em prazo e custo, a qualidade poderá ser menor que a esperada. Ou se fixarmos na qualidade e no custo, o prazo poderá ser maior que o esperado. Nunca conseguiremos fixar nas três variáveis de um projeto. O pessoal da 37signals prefere manter a qualidade sempre fixa (num patamar alto) e a substituiu pelo escopo no triângulo dos projetos. Eles também recomendam fixar em prazo e custo de um projeto e sempre flexibilizar o escopo. Vou explicar como isso faz sentido com um projeto recente que tivemos aqui na Locaweb, o projeto de reescrever o site. Em novembro de 2008, decidimos que já havia passado da hora de termos um novo site que estivesse mais em linha com tudo o que temos estudado sobre experiência do usuário, design, arquitetura da informação, design de interação e conceitos de Web 2.0. Decidimos também que na primeira quinzena de março de 2009 esse site deveria estar no ar. E o custo também estava fechado: não íamos contratar ninguém de outra equipe. Assim, começamos a desenhar o escopo do projeto. Dentre os vários requisitos do projeto tivemos: navegação simples e intuitiva; manter o código bem enxuto; aplicar SEO em todo o site; minimizar o uso de flash; design visual 40 locaweb

leve; rever a arquitetura de informação de todo o site, revisando todo o conteúdo. Fizemos o planejamento para seis sprints de duas semanas cada. Depois, percebemos que o prazo não poderia ser cumprido e pensamos em aumentá-lo ou cortar algo do escopo. Como a entrega de um projeto é importante para desenvolvedores e clientes, decidimos diminuir o escopo, descobrir alguma coisa que pudéssemos cortar a fim de entregá-lo no prazo. Escolhemos não rever a arquitetura de informação de todo o site, mas apenas das áreas mais importantes. Com isso, conseguimos entregar a tempo e os visitantes do site puderam usufruir de seu novo layout e de sua nova organização. De uma certa forma, redução de escopo e de qualidade são parecidos, mas têm uma diferença fundamental. Podemos reduzir qualidade de duas formas: fazer tudo o que foi planejado, só que fazer malfeito, ou fazer menos do que foi planejado, só que bem-feito. Já a redução de escopo não dá margem para interpretação: é sempre fazer menos do que foi planejado, mantendo o trabalho bem-feito. E muitas vezes percebemos que o menos que entregamos já é suficiente e que o produto final de nosso projeto ficou melhor com menos do que previsto originalmente. Então, da próxima vez que você pensar em reduzir a qualidade de seu projeto para poder entregá-lo no prazo e dentro do orçamento, pense se não seria melhor reduzir o escopo. Você e seu cliente poderão sair ganhando!

205 X 275:Layout 1 19/3/2009 17:16 Page 1

Design:W2008 18/7/2009 02:00 Page 42

designweb O design “dentro

e fora da caixa” Veja como ilustradores de jornais e revistas, grafiteiros, cartunistas e tatuadores enxergam o design dentro do ambiente web Por Luciano Delfini

eus trabalhos ilustram revistas, jornais, livros, campanhas publicitárias, dão vida à interminável palidez dos muros urbanos, contam histórias por meio dos desenhos e até satisfazem a vaidade alheia estampando seu talento em corpos humanos. Assim, ilustradores, grafiteiros, cartunistas e tatuadores transformam sua criatividade e habilidade em arte. Arte que não só explora as mais variadas linguagens, mas que transpõe ambientes; sai do papel, do concreto e vai para a tela do computador. Mas essa mudança de ambiente interfere no processo de criação de um desenho? Tempo e espaço diferem conforme a linguagem? Entre os artistas, as experiências divergem. Alguns já “experimentaram” a web, outros apenas flertam com a linguagem dessa tecnologia. É o caso do pintor e grafiteiro André da Silva Monteiro, o Pato (www.foto log.com/patologico). “Gosto muito da ideia da linguagem da web, mas ainda não tive vontade de criar um trabalho específico para ela. O máximo que faço 42 locaweb

Design:W2008 18/7/2009 02:00 Page 43

Design

é postar fotos ou scanners de meus trabalhos no meu blog.” Representado pela galeria Arterix (www.cavalera. com.br/blog/ 2009/06/12/arterix), de São Paulo, Pato reconhece que se sente atraído pela possibilidade que a web oferece de interação entre desenho, som e movimento, mas ainda procura manter-se afastado das novas tecnologias. “Prefiro me concentrar em coisas palpáveis, como a pintura, a escultura e a fotografia analógica.” Com vasta experiência em trabalhos realizados para a web e para mídias tradicionais, como publicações e campanhas publicitárias, a ilustradora Fabiana Shizue (www. fshizue.com) aponta o tempo, ou melhor, a falta dele, como uma das dificuldades no processo de criação de um desenho para a internet. “Na minha experiência, quando trabalhei em uma empresa de conteúdo, a diferença maior era o prazo. As ilustrações eram feitas na correria e em grande quantidade, o que deixava o trabalho mais simplificado.” Fabiana, porém, destaca que nem todo desenho feito para a web padece da pressão de ter de ser postado imediatamente. “Hoje em dia, tenho recebido propostas para a web que oferecem um tempo maior para eu me concentrar na criação.” As limitações da plataforma lá pelos “primórdios” da web e a pouca experiência dos profissionais de programação, que ainda tinham dificuldade em reproduzir exatamente o que havia sido desenhado, fizeram com que o designer Ivan Neto, sócio e diretor de arte da Incomum Design & Conceito (www.incomumdesign.com), com sede no Rio de Janeiro, olhasse com certo preconceito às primeiras propostas para desenvolver trabalhos para a web. Hoje, sua opinião é outra. “De um tempo pra cá, os profissionais

Avanço \\ Site do designer e ex-tatuador Ivan Neto. Ele acredita que, ultimamente, os profissionais de web estão mais qualificados e as ferramentas permitem mais fidelidade ao design projetado

* A mudança de ambiente interfere no processo de criação de um desenho? Entre os artistas, as experiências divergem. Alguns já experimentaram a web, outros apenas flertam com a linguagem dessa tecnologia estão mais qualificados e as ferramentas permitem mais fidelidade ao design projetado, oferecendo uma gama enorme de possibilidades”, elogia. Para Ivan, depois de tanto aprimoramento, o designer que ainda torce o nariz para a web o faz por medo ou por puro romantismo. “Hoje, design e tecnologia caminham juntos”, acredita. Ivan, que foi tatuador antes de se tornar designer

profissional, também lida com as diferenças no processo de criação de um desenho para a internet e para outros ambientes, sobretudo no que diz respeito ao desenvolvimento e à programação - aspectos, segundo ele, fundamentais quando o projeto é voltado à web. “No caso da internet, a etapa é mais complexa por causa de variáveis como sistemas, navegadores e comportamento dos usuários, o que exige toda uma demanda de testes e de controle da qualidade.”

Interação \\ Trabalho do grafiteiro Pato, que vê na web um local onde desenho, som e movimento podem se encontrar

locaweb 43

Design:W2008 18/7/2009 02:00 Page 44

Design

Correria \\ Ilustrações de Fabiana Shizue, que aponta a falta de tempo como uma das dificuldades no processo de criação para a internet. Segundo ela, muitas ilustrações são feitas na correria

Por outro lado, o designer aponta semelhanças, principalmente quando se está definindo a proposta e a linguagem do trabalho logo no início do processo de criação, o qual, para ele, começa de maneira idêntica tanto no ambiente impresso/analógico quanto no digital. “Definido esse panorama, o desenho vai tomando forma. Se é para ilustrar um site que já tem uma marca, por exemplo, começo a trabalhar o design das telas e a adequação da minha criação a essa marca.” Ivan conta que usa miniaturas (chamadas thumbnails) em criações de layouts para ter mais agilidade e liberdade nos testes de funcionalidade dos desenhos. “Só depois dessa etapa o layout passa a ser desenhado no computador. Aí, recorro ao InDesign, que me permite controlar a composição do que foi criado.” Quem também já desenvolveu trabalhos de design para a internet é o grafiteiro Thiago da Cruz Vasconcelos, o Bravos (www.merchan house.com.br e www.flickr.com/ bravos_ad), que, antes de qualquer manifestação sobre a web, faz questão de deixar claro que nada supera o prazer de desenhar ao vivo nas ruas. É a palavra de quem tem 44 locaweb

* É justamente o prazer pelo grafite e o domínio dessa técnica que Bravos tenta levar para suas criações voltadas à web. Alguns trabalhos o deixam livre para transferir sua habilidade das ruas para as telas

experiência no assunto. No espaço urbano, Bravos participou da criação dos desenhos do túnel da Avenida Paulista para as comemorações dos cem anos da imigração japonesa no Brasil, além da exposição Tipografia Urbana, também em São Paulo, e das comemorações dos 40 anos da torcida Gaviões da Fiel. E é justamente o prazer pelo grafite e o domínio dessa técnica que Bravos tenta levar para suas criações voltadas à web. “Dependendo do cliente e do tipo de trabalho que me solicitam, fico meio livre para usar minhas técnicas de grafiteiro nos desenhos para a internet”, revela. Quando o assunto é o espaço que a web oferece para o design, as opiniões são muito parecidas, ainda que cada um interprete esse espaço a partir de suas próprias experiências. Fabiana acredita que, assim como o texto, a ilustração tem um campo ilimitado nesse universo virtual. “É uma leitura de modo visual. Qualquer pessoa pode acessar seu site ou conhecer suas ilustrações apenas com um clique”, diz a ilustradora, que já vivenciou esse tipo de intercâmbio em sua vida profissional. Fabiana conta que, certa vez, a redatora de uma revista de arte de Taiwan encontrou

Graﬁte \\ Obra do grafiteiro Bravos: “dependendo do cliente e do tipo de trabalho que me solicitam, fico meio livre para usar minhas técnicas de grafiteiro nos desenhos para a internet”

Design:W2008 18/7/2009 02:00 Page 45

Design

Ferramentas virtuais \\ Comunidades virtuais, como o Orkut (ao lado), e sites de fotos, como o Flickr (abaixo), são usados por artistas novatos para divulgarem seus trabalhos e se aproximarem do mundo da internet

seu site fazendo uma pesquisa na internet. “Acabei dando uma entrevista à jornalista taiwanesa para falar do meu trabalho e da minha vida como ilustradora em São Paulo. Logo, percebi que as visitas daquele país ao meu site aumentaram bastante.” Do ponto de vista da arte urbana, Bravos enxerga a web como uma ferramenta para contatos e divulgação de trabalhos, que se torna ainda melhor com a possibilidade de poder usar gratuitamente serviços como Orkut, MSN, Flickr, Fotolog, e-mails e por aí vai. Mas deixa claro: “Grafite mesmo é na rua”. Segundo ele, o ambiente virtual é muito mais importante para o designer que para o grafiteiro. “A web é fundamental para um designer pegar referências, ideias e outras informações na hora de desenvolver seu trabalho.” Mas nem todos concordam com essa afirmação, uma vez que as referências podem vir de diferentes ambientes e linguagens, independentemente ao que a obra se propõe. Contrário ou não, o ponto de vista de Bravos ganha reforço se voltarmos um pouco no texto, mais precisamente quando Ivan afirma que “design e tecnologia

caminham juntos”. Pato complementa o raciocínio ao observar que o espaço existe para quem se adequar às necessidades da web. “Posso postar vídeos ou desenvolver trabalhos com a linguagem específica exigida pela web”, explica o pintor.

* Para o designer Ivan Neto, que já foi tatuador, há semelhanças no processo de criação para os ambientes analógico e digital, como a definição da proposta e a linguagem do trabalho inicial Nos caminhos percorridos dentro da grande rede por artistas acostumados a criar para outros ambientes, nota-se que a atração que a web pode exercer tem muito mais a ver com os diferentes serviços oferecidos pela internet – divulgação, pesquisa, intercâmbio de informações – e com as facilidades que ela pode trazer no contexto profissional, e pessoal, de cada um. Fabiana, por exemplo, assim como profissionais de

outras áreas, conta que a internet ajudou na sua atuação como ilustradora freelancer. “Consigo trabalhar a distância e participar de reuniões por e-mail ou usando programas de chat.” Pato também reconhece esse potencial como meio de comunicação, mas se mantém incrédulo quanto ao conteúdo encontrado na internet. “Acredito que a web possibilita mais intercâmbio de informação, mas tenho consciência de que muitas dessas informações podem estar equivocadas, já que não há como controlar sua procedência. Nesse sentido, evito usá-la para pesquisas mais profundas”, observa o grafiteiro. A essa desconfiança de Pato é possível fazer um link com as críticas de Fabiana sobre o uso indevido de imagens e ilustrações na internet. Um problema, claro, que não se restringe apenas aos desenhistas, mas que se estende a todos os profissionais que geram conteúdos para a web, como a própria ilustradora reconhece. “As pessoas captam as ilustrações e imagens da web e usam para outros fins, sem dar os devidos créditos ou pagamentos ao ilustrador. Mas isso é um problema geral que atinge fotos, ilustrações e textos”, lamenta Fabiana. locaweb 45

Design:W2008 18/7/2009 02:00 Page 46

Design

O uso indevido e a apropriação de obras autorais são problemas que ainda está longe de ser solucionados e devem sempre pautar as discussões quando o assunto é internet. Ao lançar um trabalho na grande rede, a sensação é que se está soltando um filho ao mundo e que, a partir daquele momento, ele não mais “pertence” única e exclusivamente a seus pais – na verdade, ninguém pertence de fato a ninguém, mas isso é outra história. O que realmente supera uma questão tão delicada como essa, sobretudo para os autores, é o fato de a web ter se tornado um dos melhores veículos para se propagar um trabalho, como lembra Ivan. “A web tem vencido o preconceito dos ‘artistas analógicos’. Fora isso, sites como Flickr, DeviantArt e outros similares se transformaram em grandes celeiros de artistas e em ferramentas baratas ou gratuitas de divulgação. Soma-se a isso o poder das comunidades nessas plataformas, o que vem ajudando a melhorar o nível dos ilustradores e profissionais da área, que agora podem trocar informações, técnicas e referências com colegas do mundo todo”, analisa o diretor de arte da Incomum.

* Sites como Flickr, DeviantArt e outros similares, inclusive comunidades virtuais, se transformaram em grandes celeiros de artistas e em ferramentas baratas ou gratuitas de divulgação Artistas e as suas obras Depois de tantas opiniões e pontos de vista, é a vez de falar um pouco sobre o estilo desses artistas. Pato, por exemplo, diz que seus trabalhos têm como características principais o humor e o universo fantástico. “A diferença”, ressalta ele, “está em diversos aspectos ligados ao processo de criação e à contemplação”. Já Fabiana, que teve trabalhos expostos em Bialystok, na Polônia, e na Sardenha (Itália), gosta de segmentos como moda, publicações femininas e o público infanto-juvenil. A ilustradora conta que já realizou trabalhos para o site feminino Paralela, que pertencia ao Grupo Abril, além de ilustrações para revistas como Criativa, Capricho, Saúde, Superinteressante e Costura

Perfeita. Também ilustrou capas de cadernos, coleções de livros juvenis e romances para o público adulto. Na publicidade, a ilustradora participou de campanhas da Drogasil, Ajinomoto, Feira Cosmética e cartilhas internas da American Express. Na web, por sua vez, suas criações podem ser vistas no site da Masterfoods (www.masterfoods.com.br) e no interessante portal TheSaltoAlto (www.thesaltoalto.com). Bravos também já trabalhou para agências de publicidade, em campanhas da Philips, Walita, Serglobal, Saraiva e Grupo Carlos Massa (o Ratinho, do SBT). Desenvolveu desenhos para marcas de skate, como Crail, Vans e CBSK. Pela empresa Incomum, que atua no segmento de cross media desenvolvendo designs analógicos e digitais, Ivan destaca trabalhos impressos, como o cartaz das palestras do The Alchemists em Cannes, na França, e para a web, como o projeto Wikimapa (www.wikimapa.org.br), o qual considera um importante caso de projeto que integra marca (brand), material impresso, web e mobile. Ao lado \\ Criações de Fabiana Shizue podem ser vistas no site da Masterfoods (www.masterfoods.com.br) e no interessante portal TheSaltoAlto (www.thesaltoalto.com)

Abaixo \\ Ivan Neto tem trabalhos impressos, como o cartaz das palestras do The Alchemists em Cannes, na França, e para a web, como o projeto Wikimapa (www.wikimapa.org.br)

46 locaweb

artigo_rene_design:W2008 18/7/2009 04:37 Page 47

opinião/articulista

design René de Paula Jr. User Experience Evangelist Microsoft Brasil @marcelotripoli rene.de.paula@microsoft.com Blog: O UAU Nosso De Cada Dia http://blogs.msdn.com/ renedepaula

Corra, Forest, Corra Você não trabalhará com teclados e mouses, mas sim com maneiras de interação que usam voz, gestos, multitoque... Quando? Agora mesmo Talvez a gente tenha se visto. Será? Se você foi ao encontro Locaweb de Porto Alegre, Rio ou São Paulo, é bem possível que sim. Fiquei no estande interagindo e demonstrando, fiz minha apresentação no palco e depois participei dos painéis de debate. Ano que vem quero ir de novo. Essa oportunidade de contato direto no estande, cercado de gente querendo ver novidade, é genial. Em cada cidade, panelistas diferentes, perguntas diferentes da plateia. Em todas as cidades, a chance de fazer diferença na carreira e na vida de profissionais iniciantes. Isso não tem preço. Se a gente se viu lá, você deve se lembrar que falei de um professor meu de faculdade. O cara teve a ousadia de dizer, nos idos de 1990, que nós ali, alunos de Rádio e TV da ECA, não seríamos radialistas, mas sim profissionais de mídia interativa. Em 1990, isso era coisa de ficção científica. Quando que pessoas comuns teriam acesso a computadores? Nunca. Well, bem-vindo ao nunca. O cara tinha toda razão. Trabalhei em TV por uns 5 anos e faz uns 13 que “mexo com internet”. Mordi a língua. Eu contei lá e conto aqui esse caso porque acho que preciso. Os sinais estão em toda parte e tem gente que não percebe. Vou dar um exemplo: ontem entrei no site sobees.com. Eu já o conhecia, mas não sabia qual era sua última criação, um cliente web de Twitter e Facebook. A página carregou, o aplicativo rodou, configurei minhas contas e, pronto: tinha no browser um belo cliente de Twitter.

Gostei tanto que resolvi desencanar de outros clientes. Eu disse que era um cliente web-based, não? Basta eu adicionar o site aos favoritos e pronto, não? Well, não. Eu apenas dei um right-click no aplicativo e pedi pra instalar local. No Start Menu e Desktop? Sim. A aplicação abriu como uma aplicação, sem browser nenhum em volta. Falando assim parece fácil. Mas foi fácil. Tão fácil que você talvez não tenha se dado conta de que quem criou o sobees não criou apenas uma web app, mas sim uma aplicação, com armazenamento local e seguro, capaz de saber se está online ou não e que nem precisou pedir licença para o administrador da máquina. Mais: ele criou uma aplicação que roda em Mac e PC igualzinho. Peraí: quer dizer que quem criava 100% pra web agora pode criar aplicativos? Sim. Quer dizer que o que está num browser pode ser instalado localmente? Sim. Mas aplicações locais não são outra praia, uma praia diferente de web e nuvem e browser e performance chinfrim? Not anymore, baby. Como diria meu professor, vocês não vão ser profissionais de web, vão trabalhar com experiências digitais ricas. Mais do que isso: o que espera vocês não são só mouses e teclados, mas sim maneiras naturais de interação usando voz, gestos, multitoque, movimentos do corpo... Você pode argumentar que essas coisas não vão acontecer nunca, mas elas já estão batendo à sua porta. Máquina pra isso já tem no mercado e... já tem mercado pra isso. Sabe o que falta? Quem faça. Corra. locaweb 47

e-learning:W2008 18/7/2009 04:12 Page 48

e-Learning

via wikis e Conceitos de Web 2.0 impulsionam o ensino a distância no Brasil. Agora, a participação dos usuários faz parte da construção do conhecimento Por Sérgio Vinícius

e-learning no Brasil é marcado por uma trajetória de sucessos diante da existência de alguns momentos de estagnação provocados pela ausência de políticas públicas para a educação a distância. A popularização da banda larga propiciou a inclusão digital (e social), a internet democratizou o acesso à informação, e a web conferiu à educação a distância a força de disseminar o aprendizado para um maior número de pessoas em áreas geográficas diferentes. Governos, universidades e empresas de todo o mundo investem em e-learning para treinamento e capacitação por meio de cursos totalmente online com o auxílio de ferramentas de interação baseadas na web. O Brasil sempre acompanhou a evolução do e-learning pelo

48 locaweb

mundo e hoje é um exportador de conteúdo, metodologia e tecnologia. Diante deste panorama, cada vez mais aparecem novas ferramentas para o ensino a distância. E mais: essas aplicações podem não ser, necessariamente, voltadas ao e-learning, mas apropriadas para tal função. É o que ocorre com diversas plataformas de Web 2.0, usadas para ensinar alunos ao redor do mundo por meio da internet. “Entre as ferramentas informais que podem ser utilizadas além dos tradicionais ambientes de aprendizagem, podemos fazer um mix de softwares como

* O brasileiro, em tempos de crise mundial, procurou cada vez mais cursos e-learning porque esse método de ensino permite qualificação de profissionais onde quer que eles estejam

e-learning:W2008 18/7/2009 04:13 Page 49

s e blogs e-mails baseados na web, blogs, wikis e mensagens instantâneas”, diz André Akagi, do Portal Educação (www.portaleducacao.com.br), empresa que utiliza ferramentas 2.0 voltadas para o resultado final do processo ensino-aprendizagem dos cursos e-learning. “VoIP, redes sociais, pacotes de escritório online, compartilhamento de arquivos, notícias, imagens, vídeos e podcasting, RSS, widgets, socialbookmarking, mapas mentais, mashups e até ambientes virtuais 3D como Second Life podem ser usados.” De acordo com Akagi, o e-learning passou pelas mesmas transformações que a web. O e-learning 2.0 aproveita o que a Web 2.0 tem de melhor para o ensino e alia às propostas pedagógicas dos projetos de EaD (Educação a Distância). Os softwares usados na experiência educacional passaram a ser todos serviços, partes dos materiais dos cursos são reaproveitadas (são os Objetos de Aprendizagem) e os sistemas e cursos usam a nova natureza social da internet para potencializar o aprendizado. “A interação e a colaboração da era 2.0 de blogs e wikis têm tudo a ver com o e-learning, no qual a

//VANTAGENS DO E-LEARNING participação faz parte da • Menor custo; construção do • Flexibilidade de tempo; conhecimento”, analisa • Flexibilidade de lugar; • Flexibilidade de ritmo de estudo; Akagi, que escreveu • Diversidade de cultura ratado sobre o assunto entre os participantes; em tinyurl.com/lg9yjf. • Pedagogia inovadora; • Acompanhamento individual; O brasileiro, em • Estímulo de auto-aprendizagem, tempos de crise desenvolvimento da iniciativa, de mundial, procurou atitudes, interesses, valores e hábitos educativos; cada vez mais cursos • Apoio de conteúdos e-learning devido a dois digitais adicionais. pontos importantes. O primeiro são as vantagens de educação à distância. E o segundo é que esse método de ensino permite qualificação de profissionais onde quer que eles estejam. Assim, se em alguma cidade não há uma escola física que ofereça tal curso, o morador interessado em determinado assunto pode se especializar via web. “O e-learning é uma ferramenta que democratiza o ensino no Brasil. Uma análise com o Google Trends mostra o volume de buscas por

locaweb 49

e-learning:W2008 18/7/2009 04:13 Page 50

e-Learning

* O e-learning democratizou o ensino no Brasil. A área, antes ocupada em grande parte por cursos de idiomas e informática, já se estendeu para cursos livres de atualização, graduação e pós-graduação que em inglês se refere a Learning Management System, ou, em português, Sistema de Gerenciamento de Aprendizagem ou Ambiente Virtual de A nova cara do ensino a distância \\ Saiba como a interação e a colaboração da era 2.0 Aprendizagem. Trata-se de um de blogs e wikis se relacionam cada vez mais com o e-learning em tinyurl.com/lg9yjf conceito que surgiu para dar nome a um conjunto de ferramentas que integra palavra-chave e aponta que, nos Estados onde a oferta um sistema responsável pela gestão de cursos e de cursos presenciais é menor, há mais procura de treinamentos a distância. O conjunto de ferramentas ensino a distância ”, conta Akagi. “É por isso que o essa tem o objetivo de simplificar a administração em área, antes ocupada em grande parte por cursos de uma organização. idiomas e informática, já se estendeu para cursos livres “O sistema deve ser capaz de personalizar perfis de atualização, graduação e pós-graduação.” de administração para facilitar o acesso, de acordo com o mapeamento de competências dos Estrutura e ferramentas participantes do projeto de e-learning, como: Como se trata de um mercado com amplo administradores de cursos, designers instrucionais, potencial no Brasil, o e-learning atrai cada vez mais tutores, suporte técnico e alunos”, aponta Akagi. empresas. E não só do lado dos consumidores, mas “A empresa ou instituição pode optar por um LMS também como provedores de conteúdo. Entretanto, pago comercial ou um software livre, gratuito. do ponto de vista de infraestrutura, é necessário Também há a escolha de desenvolvimento próprio.” adquirir alguns softwares específicos para que o As ferramentas variam de acordo com o LMS. As sistema funcione corretamente. O principal programa mais comuns são recursos de fórum, chat, quadro para gestão do e-learning é conhecido como LMS, de avisos, videoconferência, repositório de arquivos, avaliações, diário de anotações, formação de grupos e calendário do curso. Para o gestor, são indispensáveis ainda recursos como relatórios,

Para fazer seu e-learning

Eu vou passar \\ Quem se interessa por aprendizado a distância encontra bons cursos à disposição no site www.euvoupassar.com.br

50 locaweb

Para montar um projeto e-learning, a dica é cumprir um processo que compreende as etapas de viabilidade, planejamento, desenvolvimento, implantação e monitoração. Tudo vai depender do objetivo a ser alcançado pelo curso. Você deverá promover uma mudança cultural na instituição, conhecer as tecnologias disponíveis, gerir e desenvolver conteúdos e designar uma equipe multidisciplinar de tutores, gestores, designers instrucionais, conteudistas e programadores. O sucesso sempre estará relacionado com o resultado do processo ensino-aprendizagem, se o aluno realmente aprendeu com o curso e-learning. E usar a tecnologia sempre como meio, e não como foco da aprendizagem.

e-learning:W2008 18/7/2009 04:13 Page 51

e-Learning

registro de presença, caixa de mensagens e enquetes de opinião. “Uma dica importante é que os cursos que serão desenvolvidos e oferecidos no LMS devem estar em conformidade com o padrão SCORM, o protocolo mais conhecido de especificações baseadas na web (XML) para cursos e-learning”, aponta Akagi. “Existem diversos softwares de autoria, também chamados de LCMS, Learning Content Management System, para desenvolvimento de cursos em pacotes SCORM.” Do ponto de vista dos recursos de hardware, isso dependerá da escalabilidade do projeto, como previsão de número de alunos e utilização de recursos. “Como trata-se de uma questão ampla, é difícil generalizar”, diz Akagi, que assina um artigo sobre o assunto tinyurl.com/mpacgs.

//DESVANTAGENS Nem tudo são flores no que diz respeito ao e-learning. A impossibilidade de aulas práticas e a falta de contato são as desvantagens do método. “Porém, não há diferença significativa nos resultados da aprendizagem. O e-learning não é inferior ao ensino presencial. E apenas estudar a distância não garante melhores resultados para o aluno”, aponta Akagi. “Algumas estatísticas indicam que o aluno do e-learning pode ter um melhor aproveitamento, mas, para isso, é preciso que ele tenha um perfil habilitado para o estudo autônomo, mais exigido pelos cursos online.” O e-learning não substituirá as salas de aula. O ensino presencial continua com um papel importante, embora modificado por um meio em que equipes colaborativas possam descobrir e solucionar questões mais complexas.

* Como se trata de um mercado com amplo potencial no Brasil, o e-learning atrai cada vez mais empresas. E não só do lado dos consumidores, mas também como provedores de conteúdo Para estudar via e-learning Para quem está interessado em estudar via e-learning, o ideal é analisar se o perfil se encaixa com o do aluno que aprende a distância. Capacidade de se automotivar, responsabilidade pelo percurso durante o curso, facilidade para cumprir prazos, administração do tempo, ser autodidata para construção autônoma do conhecimento e ser social para transmitir as dificuldades e ansiedades aos colegas e tutores de curso são características desejáveis do aluno de e-learning com mais chances de gostar e ter sucesso com o aprendizado. Por fim, procure uma instituição reconhecida, com uma equipe de tutores qualificada, recursos tecnológicos suficientes e que use formas de avaliação eficientes.

Material na web \\ Confira mais detalhes sobre e-learning, como a realização de workshops e congressos, no site www.elearningbrasil.com.br

Especialista \\ O Portal Educação conta com mais de 350 cursos a distância e já treinou milhares de pessoas do Brasil e de outros 60 países

Portal Educação O Portal Educação (www.portaleducacao.com.br) é uma empresa que trabalha com e-learning desde 2001. Já treinou e atualizou a distância milhares de pessoas do Brasil e de outros 60 países (em especial Portugal, EUA, Angola e Japão, por meio de seus cursos pela internet). Atualmente, a empresa possui mais de 350 cursos livres online nas mais variadas áreas. O objetivo de cada um deles é criar um ambiente segmentado, com cursos direcionados aos segmentos de farmácia, enfermagem, pedagogia, biologia, fisioterapia, gestão e liderança, odontologia, veterinária, esporte, medicina, nutrição, psicologia, turismo e hotelaria, estética, tecnologia, direito, fonoaudiologia, idiomas e medicina alternativa. O site recebe atualmente mais de 2 milhões de visitantes únicos por mês, o que o torna uma das empresas mais visitadas do Brasil. Possui uma estrutura física de aproximadamente 3,1 mil m2 divididos em 15 departamentos apenas para educação a distância. Ganhou diversos prêmios relacionados ao ensino a distância e tornou-se referência do mercado no País. A empresa ainda oferece soluções corporativas para instituições com o desenvolvimento de cursos online sob medida, utilização de material didático, consultoria de projetos com diagnóstico, implantação e formulação de soluções em e-learning. locaweb 51

Case:W2008 18/7/2009 02:02 Page 52

caseslocaweb Isotônicos e jogos AgênciaClick usa expertise em hospedagem e Cloud Computing da Locaweb para criar site altamente interativo para bebidas Gatorade

A AgênciaClick (www.agencia click.com.br) criou sua primeira grande campanha online para a Gatorade, representante do mercado de bebidas isotônicas no Brasil. Com a estrutura e o expertise em cloud computing da Locaweb, a maior empresa de hospedagem do Brasil, a AgênciaClick colocou na rede a versão eletrônica do conceito "Sinta essa nova pegada". As ações, que se centralizam no site www. testeasuapegada.com.br, têm como principal foco a nova garrafa, mais anatômica, que promove a redução no consumo de plástico. 52 locaweb

O projeto online utiliza diversos formatos de mídia gráfica, links patrocinados, além de peças criativas que circulam em portais. O destino, entretanto, é um só: o site hospedado na Locaweb. A assinatura "Com Gatorade você mais longe" é marca de toda a campanha. Com o intuito de integrar as plataformas digitais, o hotsite interativo www. testeasuapegada.com.br estimula a participação dos usuários. Ao acessar o endereço virtual, internautas podem se divertir com dois games inéditos; basta uma webcam ou o mouse do computador para jogar. No game "Arremesso", o objetivo é agarrar todas

as garrafas que aparecem na sua tela. Quanto mais garrafas, maior a pontuação; a cada mil pontos, a dificuldade aumenta. Já no "Escalada", os internautas devem subir uma montanha segurando-se nas garrafas de Gatorade. A pontuação é contada em metros. Depois de jogar os games, os participantes podem colocar sua pontuação no próprio site e no Twitter. "Gatorade tem um público online descolado. Por isso, a AgênciaClick criou uma ação criativa e ousada, com jogos que despertam o interesse e a interação dos usuários", diz Juliana Constantino, diretora de criação da agência.

A campanha online reforça a comunicação do design da nova garrafa, que deixa em evidência o raio e a palavra "Gatorade" em alto-relevo, além de mais espaço de exposição para o líquido. A bebida continua com a mesma fórmula e o mesmo sabor, características que a tornaram líder no setor. Com um formato mais anatômico, a nova garrafa tem uma melhor pegada, proporcionando maior sensação de segurança e firmeza para o consumidor. Ao lado, você confere mais detalhes da nova página da Gatorade, que esbanja itens como interatividade e conceitos multimídia. Acompanhe:

Site da AgênciaClick \\ Empresa foi responsável por criar o novo site da Gatorade; plataforma utiliza tecnologia Cloud Computing Locaweb

Case:W2008 18/7/2009 02:02 Page 53

O site

2 3

1 PRINCIPAL J Página principal do site “Teste a sua pegada” é bastante simples. Há apenas quatro áreas, que levam às demais seções do site. São dois jogos oferecidos na homepage, que foram desenvolvidos para atrair o público jovem, reconhecidamente o maior consumidor de Gatorade no Brasil. Além dos games online, a página principal funciona como vitrine, permitindo ao visitante visualizar o novo formato da garrafa da bebida e também variar os sabores, reconhecendo as 11 versões da bebida isotônica.

AgênciaClick. Com rápido carregamento, os títulos também remetem a situações esportivas já que isotônicos são bebidas criadas para reidratar corpos que realizam esportes. Em “Arremesso”, por meio do mouse, o usuário deve agarrar as garrafas da Gatorade que surgem na tela. Em “Escalada”, a ideia é subir uma montanha com diversas garrafas de Gatorade nas mãos. Ao criar os jogos, a AgênciaClick teve a preocupação de incluir as garrafas como protagonistas dos games.

2 GAMES

3 GARRAFAS

J Essa área é o principal chamariz do site. Ao clicar nesses botões, o usuário é direcionado aos games especialmente desenvolvidos pela

J Eis o principal motivo do site existir. Essa área leva o usuário a uma página em que a garrafa é apresentada de forma visual e por

texto. A imagem gira na tela, mostrando em todos os ângulos a novidade. Um texto resumido conta que a garrafa é mais fácil de ser manuseada, além de necessitar de menos plástico para ser criada.

4 VITRINE J Por fim, na parte inferior do site, há um menu em que o usuário confere os diversos sabores de Gatorade, bem como vê as cores que as bebidas têm. locaweb 53

artigo_deborah_mercado:W2008 31/7/2009 19:32 Page 54

opinião/articulista

e-business Déborah De Mari é jornalista, coordenadora editorial da Locaweb em Revista e trabalha com Estratégias de Mídias Sociais na empresa. deborah.mari@ locaweb.com.br

Você sabe qual é a sua marca digital? Eles sabem Com o uso de ferramentas corretas, sua presença online pode e deve ser utilizada a seu favor. Portanto, não perca tempo Nesta tarde chuvosa de inverno, a operadora de cartões de crédito já sabe que almocei há duas horas e comprei um chocolate no café da esquina. Assim como fiz no dia anterior, quando passei no mercado para pegar chocolates, antes de comprar um filme para assistir que a empresa de TV a cabo que contratei sabe que desliguei antes do final. Neste concorrido edifício comercial na zona Sul de São Paulo, a operadora do meu celular consegue me localizar, com uma mínima margem de erros. E não vamos falar muito das horas que passei navegando, do colega que recomendei no Linkedin ou no RT que dei em uma música que depois ouvi repetidamente no Blip.fm antes de dormir. Esse sucinto dossiê digital que produzi em pouco mais de um dia foi baseado nas reflexões de Stephen Baker feitas no livro Numerati, que fala sobre como membros de uma elite da ciência da computação e da matemática analisam todos os nossos passos em busca de padrões de comportamento. Todos os dias produzimos milhares de informações e a possibilidade de reunir estes dossiês digitais e organizá-los não empolga apenas os profissionais de marketing. Faz brilhar os olhos também dos recrutadores, os “temidos” profissionais de RH. Enquanto os “Numerati” ainda não chegam aos seus algarítimos perfeitos para determinar padrões de comportamento e os profissionais de marketing buscam tentativas para mensurar resultados nas redes sociais, os 54 locaweb

recrutadores têm usado o tempo - antes dispensado em bancos de dados com milhares de currículos - em seleções online e triagem prévia em redes sociais específicas. Você sabe qual é a sua marca digital? Eles já sabem. A sua marca digital é a sua presença online, os rastros eletrônicos que você deixou em redes sociais e mecanismos de buscas, a sua rede de amigos, colegas de trabalho (networking). Tudo bem, você não se preocupa com isso, está tranquilo porque acredita que não precisa profissionalmente fazer parte dessas redes. Então, você não é quem eles procuram, eles não te conhecem. Mas não se assuste, a sua presença online pode e deve ser usada a seu favor. Você não precisa ser um “social media addicted” e ficar sobrecarregado de redes para atualizar. Preocupe-se em manter uma presença online coerente. Em primeiro lugar, escolha as redes que você realmente têm presença ativa. Depois, eleja as que têm mais valor de acordo com os seus objetivos e garanta o bom uso das configurações de privacidade. Deixe claro os planos aos seus contatos e adicione-os de acordo com a rede. E, sobretudo, crie relevância para o perfil profissional: twitte os bons artigos que você lê, interaja com profissionais que admira, compartilhe os posts do seu blog, agregue valor às comunidades. Construa a sua marca digital e mostre o profissional que você é. A sua marca digital será o cartão de visitas para grandes oportunidades sem que você ao menos procure por elas.

Projeto1:Anuncio_livros 16/7/2009 17:07 Pรกgina 1

CSS:W2008 18/7/2009 02:03 Page 56

Programação CSS

Remodele sua homepage por meio de folhas CSS Esqueça o uso de tabelas para criar páginas eletrônicas: utilize as folhas de estilo e garanta velocidade na renderização e conformidade com padrões web para seu site Por Felipe Magalhães

á faz algum tempo que se fala muito sobre webstandards, tableless – e, infelizmente, não se usa na mesma proporção – para a arquitetura de páginas web. As vantagens de usar cada tag fazendo o que realmente se deve fazer são nítidas quando se compara a velocidade de renderização de uma versão “tableYes” (cheio de tabelas, bem à moda anos 90) com uma versão tableless. Para quem está acostumado a montar páginas com tabelas, pode parecer impossível passar a montá-las com div, ul/li, entre outros. Mas a grande jogada por trás disto tudo é o uso do CSS – as folhas de estilo em cascata, do inglês Cascading Style Sheets. O CSS manipula a formatação dos elementos HTML na página, permitindo agrupar tudo isso em arquivos separados do HTML, para auxiliar numa melhor separação entre conteúdo (HTML), formatação (CSS) e

interação dinâmica (Javascript). O CSS pode manipular elementos HTML de três maneiras: 1. Class: quando, no CSS, você declara o estilo começando com “.” (ponto), cria uma class, que será aplicada a qualquer elemento que possuir o atributo class apontando para o nome da class criada. Por exemplo, no CSS há a seguinte class: .texto{...}; para atribuir a formatação existente na class, faríamos o seguinte no HTML: <p class=”texto”>. 2. Id: quando, no CSS, for declarado um estilo começando com “#”, cria-se um identificador. Este identificador aplicará a formatação ao elemento do HTML que possuir o nome dele em seu atributo id. Por exemplo, no CSS há o seguinte identificador: #texto{...}; para atribuir a formatação existente na class, faríamos o seguinte no HTML: <div id=”texto”></div>. 3. Tag: é possível fazer com que o CSS formate todos os elementos do HTML que possuam a mesma tag. Para isso, o nome do estilo é declarado sem nada antes. Quando se faz isso, todas as ocorrências da tag na página serão formatadas conforme o estilo. Por exemplo, no CSS há o seguinte seletor: ul{...}; com isso, toda vez que for encontrado um <ul></ul> em nossa página, o estilo será aplicado a ele.

W3C \\ Na página oficial sobre Cascading Style Sheets (http://www.w3.org/Style/CSS), há muita documentação para usuários que desejam esquecer o uso de tabelas e criar sites padronizados

56 locaweb

Quando usar cada um deles? Bem, o ideal é usar o id quando houver apenas uma única ocorrência no documento (até porque não é correto haver ids duplicados); quando precisar aplicar um estilo a mais de um lugar, usa-se a class; e quando necessitar formatar todas as ocorrências de uma tag, use o seletor para tags. É possível também usar estes seletores de forma aninhada. Por exemplo, se desejar aplicar um estilo

CSS:W2008 18/7/2009 02:03 Page 57

CSS Programação

somente aos parágrafos existentes dentro de uma div com o id “exemplo”, pode-se criar um estilo com o seletor #exemplo p {...}. Para atrelar um arquivo CSS à sua página, usa-se entre as tags <head></head> o seguinte comando: <link href="../css/estilos.css" rel="stylesheet" type="text/css" media="screen"/>

Uma boa dica é, também visando a organização, separar os arquivos em pastas, dividindo-os por suas características. Por exemplo: pasta page para páginas HTML, ASP, CFM, PHP, scripts ou js para os arquivos Javascript. Pasta images ou imagens para as imagens existentes e css ou styles para as folhas de estilo. Quando for referenciar este arquivo, basta passar o caminho relativo (../css/arquivo.css). Deste ponto em diante, serão dadas algumas dicas sobre como pegar o que está feito em HTML e se organizar, separando o que for possível no CSS.

Esqueça de vez a tag <font> Se em seu código você ainda encontra algo como <p><font size="2" face="Verdana">texto</font></p>, você pode adaptar este trecho para o CSS de maneira simplificada. O arquivo CSS fica assim: .texto{ font-family:Verdana, Geneva, sans-serif; font-size:12px; }

E, na página, troque para o seguinte: <p class="texto">texto</p>. Com esse exemplo, é possível reparar como o código ficou enxuto e organizado.

Repense os menus Muitos sites fazem menus horizontais/verticais em swf ou em tabelas. Será que sua página precisa mesmo de um menu feito com a ferramenta multimídia Adobe Flash? Se você quiser algo de mais impacto visual, deixe o menu lá. Porém, não há mais justificativa mais para se usar uma tabela para manter um menu. Como exemplo, faça o seguinte no seu CSS: #hMenu ul{ padding:0px; margin:0px; float: left; width: 100%; background-color:#ccffcc; list-style:none; font-family:Verdana, Geneva, sans-serif;

* Visando a organização, uma boa dica é separar os arquivos em pastas, dividindo-os por suas características. Por exemplo: use pasta “page” para páginas HTML ou, ainda, use pasta “image” para imagens e demais figuras font-size:12px; } #hMenu ul li{ display: inline; } #hMenu ul li a{ padding: 3px 5px; float:left; background-color:#ccffcc; color:#000000; text-decoration:none; border-bottom:3px solid #ccffcc; } #hMenu ul li a:hover{ background-color:#00cc00; color:#003300; border-bottom:2px dashed #666666; } E no seu HTML faça o seguinte (não se esqueça de referenciar o CSS com a tag <link> na página): <div id="hMenu"> <ul> <li><a href="m1.cfm">Menu Um</a></li> <li><a href="m2.cfm">Menu Dois</a></li> <li><a href="m3.cfm">Menu Três</a></li> </ul> </div>

É possível também conseguir outros efeitos interessantes para menus em CSS, como reposicionar uma imagem mudando o background-position. Por exemplo: a:link.menu, a:visited.menu{ backgroundimage:url(../images/menu/sobre.gif); background-repeat:no-repeat; background-position:0px 0px; display:block; } a:hover.menu{ background-position:0px -28px; }

locaweb 57

CSS:W2008 18/7/2009 02:03 Page 58

Programação CSS

No exemplo acima, quando o menu está em um estado normal (link ou visited/visitado), ele exibe a imagem como fundo; a imagem posicionada em pixels de deslocamento à esquerda e no topo. Quando o cursor do mouse estiver sobre o elemento, a imagem é reposicionada em relação ao topo. Isso ocorre para exibir uma parte dela que inicialmente estava oculta, o que causa um efeito de mudança de imagem, sem a necessidade de carregar uma nova figura quando o cursor fica sobre o menu. Isso facilita o processo uma vez que a imagem já estava previamente carregada (o que foi realizado somente o reposicionamento dela). Um exemplo de aplicação desse efeito pode ser vista tanto no menu da lateral direita, quanto no menu superior da página http://migre.me/3mZT.

Exemplo\\ Na página acima (http://migre.me/3mZT), há um efeito de imagens criado em CSS tanto na lateral direita quando no menu à direita

Substitua tabelas por divs Esse é o item que mais assusta webdesigners. De tanto trabalharem com tabelas, criou-se uma dependência tão grande que chega a ficar complicado para alguns designers imaginar como diagramar uma página usando divs. Não é tão complicado quanto parece ser. Entenda que todo elemento HTML funciona semelhante a uma caixa em formato de retângulo. Estes elementos são empilhados um após o outro e podem ter suas margens, bordas e espaçamentos manipulados via CSS. Esta composição formada por conteúdo, espaçamento, borda e margem é a Box model. Assim como uma tabela, uma div também é um elemento HTML. Ambas possuem primeiramente um conteúdo a ser exibido, quatro bordas que decoram as extremidades do elemento, uma distância entre a borda e o conteúdo (espaçamento) e uma distância entre uma caixa (ou box) e outra (margem). No caso da tabela, a distância entre as caixas serve para distanciar uma célula da outra. Vamos a uma comparação de uma tabela montada com table e uma com divs: Exemplo com tabelas: <table width="400" border="1" cellspacing="1" cellpadding="1" bordercolor="#000000"> <tr> <td>texto1</td> <td>texto2</td> </tr> <tr> <td>texto3</td> <td>texto4</td> </tr> </table>

Exemplo com divs, no arquivo CSS: div{ width:185px; border:#000 1px solid; padding:2px 2px 2px 2px; margin:2px 2px 2px 2px; float:left; } div#geral{ width:390px; border:#000 1px solid; }

No HTML, temos o seguinte: W3Schools \\ Um dos maiores repositórios sobre CSS, com quizes, tutoriais e referências sobre o assunto é a página ligada aos padrões web de desenvolvimento http://www.w3schools.com/css

58 locaweb

<div id="geral"> <div>texto1</div>

CSS:W2008 18/7/2009 02:03 Page 59

CSS Programação

Ao lado \\ Em http://migre.me/3pEI, é possível conferir tutoriais completos sobre CSS; nesta página, em especial, há vasta documentação sobre como desenvolver cabeçalhos

Abaixo \\ O site do Maujor (www.maujor.com) foi um dos primeiros a abordar o desenvolvimento de páginas eletrônicas com folhas de estilo no idioma português

<div>texto2</div> <div>texto3</div> <div>texto4</div> </div>

Se você carregar esta página, verá que, com 40% a menos de código, conseguimos produzir o mesmo efeito. Então, por que tanto medo? Quando você desejar posicionar uma div ao lado da outra, deverá usar a propriedade “float”. Ela faz com que as divs flutuem uma ao lado da outra. Caso uma div tenha uma largura (width) menor que o elemento no qual ela está inserida (body, outra div), se desejarmos posicionar a div seguinte ao lado desta, basta aplicar às duas um float:left (ou right, dependendo da direção que desejar). Caso a soma dos espaços ocupados (largura, borda, espaçamento e margem) das divs caiba dentro do elemento pai, elas serão posicionadas lado a lado, caso o tamanho estoure o limite, a div seguinte é posicionada abaixo da anterior. O importante para se montar um layout usando CSS é arquitetar tudo antes, medir, saber o espaço que será ocupado, para não ter dores de cabeça na hora de botar a mão na massa e fazer os testes.

Organize seu conteúdo em título e subtítulos Entre as tags mais “mal usadas” do HTML estão as de cabeçalho: Heading (do <h1> ao <h6>). O intuito real destas tags é permitir uma melhor organização do texto, separando as possíveis seções dele em títulos (<h1>) e subtítulos (do <h2> ao <h6>). Além de ter um

conteúdo bem mais apresentável, é possível manipular a aparência deles por meio do CSS, usando o seletor de tags h1{...} até h6{...}. Para se ter ideia de alguns efeitos possíveis, confira o que há na página do Maujor (especialista e um dos pioneiros do CSS) sobre cabeçalhos: http://migre.me/3pEI.

Organize seus arquivos CSS Caso você possua vários arquivos CSS, existe a possibilidade de chamá-los previamente em outro arquivo CSS, para que depois este seja chamado na página, por meio da tag <link>. Por exemplo, vamos supor que sua página utilize os arquivos topo.css, lateral.css, conteudo.css, rodape.css. Dentro de sua página HTML, você pode chamar um único arquivo (vamos chamá-lo de estilos.css) com: <link href="../css/estilos.css" rel="stylesheet" type="text/css" media="screen"/>

E dentro deste arquivo estilos.css, deve existir o seguinte comando de importação: @import @import @import @import

url(topo.css); url(lateral.css); url(conteudo.css); url(rodape.css);

Este tipo de comando tem somente o intuito de organização, não é obrigatório. Caso queira, você pode referenciar todos os seus CSSs necessários por meio da tag <link> sem grandes problemas. locaweb 59

Flex:W2008 18/7/2009 02:05 Page 60

Programação Flex

Os primeiros passos com o poderoso Adobe Flex Entenda como funciona a ferramenta criada pela Macromedia e aprenda a utilizá-la para trabalhar com as aplicações ricas de internet - chamadas de RIA Por Pedro Claudio de Lima e Silva s aplicações de redes internas em empresas (intranet) têm migrado para plataforma web, aliando baixo custo, rápido desenvolvimento, alta performance, riqueza de facilidades e grande quantidade de informações ao usuário final, sem requisições excessivas ao servidor. Isto vem acontecendo sob o parâmetro de aplicação ideal: aplicações desktop, com recursos "drag and drop", em que você pode arrastar elementos gerando alterações em dados, informes e sugestões nas validações, integração Página do Flex \\ Pacote Flex SDK contém as bibliotecas necessárias para integração com o com ambientes legados. É possível Eclipse, um ambiente de desenvolvimento baseado em Java e também open source ainda interagir com plataforma baixa (Hypertext Mark-up Language), XHTML (Extensible ou plataforma alta, na utilização de protocolos variados Hypertext Markup Language), e as linguagens scripting como SOAP (Simple Object Access Protocol), AMF (Action como VBScript, JavaScript, até chegarmos ao ActionScript, Message Format), RMTP (Reliable Multicast Transport que roda no Flash Player em navegadores com cada vez Protocol), HTTP (Hypertext Transfer Protoco), entre outros. mais plugins, os navegadores ricos, origem do termo RIA. A Web 2.0 tem tentado levar estes recursos para o Para falar do Flex, é preciso descrever o compilador, o ambiente WWW (internet) com grande êxito, com ajuda Flex Builder, AIR, a linguagem. das linguagens e dos plugins contidos nos navegadores. Esta descrição de software caracteriza uma Aplicação de Internet Rica (RIA - Rich Internet Application), termo O Compilador nascido dentro da Macromedia, empresa que lançou o (http://opensource.adobe.com/wiki/ display/flexsdk) Flex, juntamente com o protocolo AMF. Logo depois, a Baseado no SDK caracterizado pelo termo de uso open Adobe comprou a Macromedia carregando todos os source, portável para todos os sistemas operacionais que o profissionais envolvidos nos projetos RIA, que tornou o seu Java seja portável, recebe arquivos codificados com MXML, compilador open source, com objetivo do RIA ideal. ActionScript e CSS (Cascading Style Sheets), resultando em Quando falamos de conceito RIA, devemos resgatar o arquivos SWF para Flash Player (presente em 98% dos histórico da internet, que nasceu com transferências de computadores), ou arquivos AIR para máquina virtual AIR texto com o mínimo recurso ao usuário, sem renderização (como será visto mais à frente). Este pacote Flex SDK gráfica, os chamados navegadores magros, passando pelo contém as bibliotecas necessárias para integração com o nascimento das linguagens de marcação como HTML Eclipse, um ambiente de desenvolvimento baseado em Java

60 locaweb

Flex:W2008 18/7/2009 02:05 Page 61

Flex Programação

* O compilador do Flex é baseado no SDK; open source, portável para todos os sistemas operacionais compatíveis com o bom, velho e robusto Java e também open source, e mais o Dreamweaver, o Flash Professional, o Visual Studio, possibilitando identificação da linguagem MXML na IDE.

O Flex Builder (www.adobe.com/products/flex/flexdownloads/)

extensão do instalador e da aplicação gerada pelo Flash Builder. Basicamente, o que diferencia uma aplicação AIR de uma aplicação Flex é o tipo do projeto e as tags mx:WindowedApplication, usada para AIR, e mx:Application usada para Flex. As demais tags são usadas para ambos os projetos.

Linguagem

A atual versão é a 3, mas na versão 4 que está em beta público (http://labs.adobe.com/ technologies/ flashbuilder4/), será chamado de Flash Builder, baseado em Eclipse. É dividido em modo Source e Design. No primeiro, o desenvolvedor manipula diretamente o código com a ajuda de code hints de todos os pacotes e classes adicionados ao projeto. O modo Design dispõe de wizards variados, painéis para manipulação gráfica de componentes, de propriedades e aparências dos componentes, de charts, de estados da aplicação, gerenciamento de serviços de dados. O Flex Builder conta com debugging integrado ao compilador SDK do próprio Flash Builder, recursos que não estão disponíveis na versão SDK Open Source.

AIR (http://labs.adobe.com/downloads/air.html) É uma runtime, disponível para Windows, Linux e MacOS, que possibilita executar aplicações HTML, Ajax, Flash e Flex, no formato de RIA em desktops. Permite uma navegação online ou offline na aplicação, com uma sincronização de dados com o servidor quando online, sem utilização de navegadores. Isso permite gerenciamento de banda ou mesmo uma prevenção a falhas na comunicação cliente e servidor. AIR também é a

É dividida em três partes. A primeira são as folhas de estilo (CSS), que podem ser inseridas entre o MXML ou em arquivos separados. Há o ActionScript 3, com um número de pacotes bem maior na versão 4. E o MXML, que é uma abstração do ActionScript no formato de tags. Para detalhar a linguagem, implementei um formulário de contato para envio de e-mail utilizando apenas serviços, tags MXML e classes ActionScript disponíveis no ColdFusion 9 e no Flex 4, sem qualquer codificação no servidor. Para começar, crie um projeto Flex no Flash Builder 4, e o arquivo index.mxml com o seguinte conteúdo: <?xml version="1.0"?> <!--

locaweb 61

Flex:W2008 18/7/2009 02:05 Page 62

Programação Flex

Com o aumento de classes, e para permitir compatibilidade com versões anteriores, houve um acréscimo de namespaces, dispostos da seguinte forma:

fx: definição MXML da versão 4, com core, skinning, layout; s (MXML 2009 - Spark): baseado no Halo (MXML 2006) encontramos os componentes; mx (MXML 2006): permite scripts MXML 2006 ; cf (ColdFusion): pacote implementado no ColdFusion 9, permitindo acesso direto a serviços ColdFusion, para que não seja necessário script no servidor. A tag Application define este script como mãe e creationComplete é um evento disparado após a construção dos componentes no qual atribuí a ação creationComplete Handler e, como parâmetro, o evento creationComplete. --> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" xmlns:cf="coldfusion.service.mxml.*" creationComplete= "creationCompleteHandler(event)">  <fx:Script source="script.as" />  <fx:Style source="style.css" />  <s:Panel title="Contato" horizontalCenter="0" verticalCenter="0"> <mx:Form> <mx:FormItem label="Nome:">  <s:TextInput id="txt_nome"/> </mx:FormItem> <mx:FormItem label="E-mail:"> <s:TextInput id="txt_email"/> </mx:FormItem> <mx:FormItem label="Mensagem:">

* As aplicações de redes internas em empresas têm migrado para plataforma web, aliando baixo custo, curto desenvolvimento, alta performance e grande quantidade de informações 62 locaweb

<s:TextArea id="txt_msg"/> </mx:FormItem>  <mx:FormItem styleName="cssFormItemButton" > <s:Button id="enviar" label="Enviar" /> </mx:FormItem> </mx:Form> </s:Panel>  <fx:Declarations>  <mx:StringValidator id="Vnome" source="{txt_nome}" property="text" requiredFieldError="{_mensagens.getItemAt(0)}" />  <mx:EmailValidator id="Vemail" source="{txt_email}" property="text" requiredFieldError="{_mensagens.getItemAt(1)}" invalidCharError="{_mensagens.getItemAt(2)}" missingAtSignError="{_mensagens.getItemAt(2)}" />  <mx:StringValidator id="Vmensagem" source="{txt_msg}" property="text" requiredFieldError="{_mensagens.getItemAt(3)}" />  <cf:Mail id="cfMail" cfServer="localhost" cfPort="8500" servicePassword="service" serviceUserName="service" from="{txt_email.text}" to="pcsilva@gmail.com" subject="[Site] Contato" type="html" content="{txt_nome.text+' escreveu: '+txt_msg.text}" /> </fx:Declarations> </s:Application>

Agora, crie um arquivo style.css bem simples: /* definição de uma classe CSS */ .cssFormItemButton { padding-left:118;

}

Flex:W2008 18/7/2009 02:05 Page 63

Flex Programação

Neste próximo arquivo que iremos criar (será o script.as), ele deve acompanhar o seguinte script para ser validado: /* trago para aplicação classes que serão necessárias no script */ import coldfusion.service.events.ColdFusion ServiceFaultEvent; import coldfusion.service.events.ColdFusion ServiceResultEvent; import mx.collections.ArrayCollection; import mx.controls.Alert; import mx.events.FlexEvent; import mx.managers.CursorManager; import mx.validators.Validator; /* definição da variável que armazenará os validarores */ private var _validadores:Array; /* definição da variável que armazenará as mensagens de erro,como seu valores são usados em BINDs, ou seja entre chaves,devo declarar a metadata com a tag Bindable */ [Bindable] private var _mensagens:ArrayCollection; /* este método será acionado quando a aplicação for carregada no browser */ protected function creationCompleteHandler(event:FlexEvent):void { /* atribuição de ação ao evento CLICK do botão Enviar, declarado no MXML */ enviar.addEventListener (MouseEvent.CLICK,EnviarEmail); /* atribuição de ação ao evento FAULT, este evento só é disparado pelo servidor ColdFusion, e repassado a aplicação Flex */ cfMail.addEventListener(ColdFusionService FaultEvent.FAULT, faultEventHandler); /* atribuição de ação ao evento RESULT, este evento só é disparado pelo servidor ColdFusion quando o e-mail é enviado com sucesso, e repassado a aplicação Flex */ cfMail.addEventListener(ColdFusionService ResultEvent.RESULT,resultEventHndler); /* armazenagem, pelos IDs, dos validadores declarados no MXML */ _validadores = [Vnome,Vemail,Vmensagem]; /* criação das mensagens de erro */ _mensagens = new ArrayCollection([ 'Preencha com seu nome por favor', 'Preencha com seu e-mail por favor', 'Seu e-mail não é válido', 'Você deve escrever uma mensagem' ]); } /* método que será executano no CLICK do botão Enviar, declarado no MXML */ protected function EnviarEmail(event:MouseEvent):void {

Página do AIR \\ Runtime, disponível para Windows, Linux e MacOS, possibilita executar aplicações HTML, Ajax, Flash e Flex, no formato de RIA

/* com o método validateAll da classe Validator, executo inline, e testando o tamanho do array de retorno, que em caso de erro será preenchido, passando por parâmetro os validadores */ if(Validator.validateAll(_validadores).length = 0){ /* desabilita o botão Enviar */ (event.currentTarget as Button).enabled = false; /* força a exibição do cursor no formato de relógio, para informar ao usuário que a aplicação está trabalhando */ CursorManager.setBusyCursor(); /* envia o e-mail */ cfMail.execute(); } } /* método será executado quando houver falha de envio de e-mail */ protected functionfaultEventHandler (event:ColdFusion ServiceFaultEvent):void{ /* remove o cursor em formato de relógio*/ CursorManager.removeAllCursors(); /* habilita o botão enviar */ enviar.enabled = true; /* informa ao usuário que houve uma falha*/ Alert.show('Não foi possível enviar sua mensagem'); } /* método será executado quando sucesso do envio de e-mail */ protected functionresultEventHndler (event:ColdFusion ServiceResultEvent):void { /* remove o cursor em formato de relógio*/ CursorManager.removeAllCursors(); /* limpa todos os campos */ txt_email.text = txt_msg.text = txt_nome.text = ''; /* habilita o botão enviar */ enviar.enabled = true; /* informa ao usuário do sucesso*/ Alert.show('Enviado com sucesso'); }

locaweb 63

Flex:W2008 18/7/2009 02:05 Page 64

Programação Flex

O resultado final da aplicação será este abaixo:

Para converter esta aplicação Flex em AIR, enviando e-mail direto do desktop do usuário, precisamos criar um outro projeto do tipo AIR. Ele deve ter todos estes códigos com uma pequena alteração no index.mxml. A tag WindowedApplication define o script como mãe de uma aplicação (linhas 15 e 85), os arquivos CSS e ActionScript e o restante do MXML não é alterado. <?xml version="1.0"?>

Com o aumento de classes, e para permitir compatibilidade com versões anteriores, houve um acréscimo de namespaces, dispostos da seguinte forma:

fx: definição MXML da versão 4, na qual encontramos core, skinning, layout; s (MXML 2009 - Spark): baseado no Halo (MXML 2006) encontramos os componentes; mx (MXML 2006): permite scripts MXML 2006; cf (ColdFusion): pacote implementado no ColdFusion 9, permitindo acesso direto a serviços ColdFusion, para que não seja necessário script no servidor. A tag Windowed Application define este script como mãe de uma aplicação e creation Complete é um evento 64 locaweb

disparado após a construção de todos os componentes, no qual atribuí a ação creationCompleteHandler, e passei como parâmetro o próprio evento creationComplete. -> <mx:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo" xmlns:cf="coldfusion.service.mxml.*" backgroundAlpha="0" creationComplete="creationCompleteHandler(event)"> <!-Todo conteúdo do index.mxml deve ser replicado aqui --> </mx:WindowedApplication>

Abaixo, você confere o resultado final de nosso formulário criado com o Flex, de forma rápida e simples e sem grandes complicações. Observe:

Project1:Anuncio 10/7/2009 18:03 Page 1

Locavip17:W2008 18/7/2009 02:05 Page 66

parceiros/locaweb

locavip Conheça aqui alguns dos principais clientes vips da Locaweb * “Nossa história começou junto à Locaweb em 1999. Desde então, não a trocamos por nada, porque o mais importante é ter a certeza de que nosso site estará sempre no ar. Recentemente, tivemos uma proposta de um dos grandes portais do Brasil para ter hospedagem de graça. Não trocamos a Locaweb.” Roberto Discher, diretor comercial do Guia de Moteis

J Noblesse J www.noblesse.com.br

* “A Jocar é cliente da Locaweb desde que abrimos o nosso site. O bom é que a empresa nos atende na medida certa, ou seja, em todas as fases do crescimento. Começamos pequenos com um servidor compartilhado e fomos crescendo e nos atualizando, sempre de acordo com as nossas necessidades.” Moisés, Diretor Executivo da Jocar 66 locaweb

J Guia de Motéis J www.guiademoteis.com.br

* “Quando falamos em segurança da informação, temos a certeza de que a Locaweb supre todas as nossas necessidades nesse quesito. A Locaweb sempre tem soluções que satisfazem a nossa demanda de tecnologia. Fora isso, o atendimento por parte da equipe técnica é superprofissional.” Lucio Messias Terres de Azevedo, Técnico TI da Noblesse

J Jocar J www.jocar.com.br

525558_205x275_327_DL.pdf

May 5, 2009

18:26:34

1 de 1