Tópico: ‘web standards’

Um novo site para um velho cliente

novembro 1st, 2013

Imagem em 3 dimensões da estrutura da home page nova da SBEM.

A Sociedade Brasileira de Endocrinologia e Metabologia – SBEM –  é uma das sociedades médicas pioneiras na divulgação da sua atuação e de seus eventos por meio da internet. Com o nome de “Portal Endocrinologia”, o website da sociedade foi inaugurado em meados de 2003. O primeiro registro no Wayback Machine é de 24 de agosto daquele ano.

Em agosto de 2007, fui chamado para assumir a responsabilidade técnica do website. De lá para cá, escrevi diversas vezes sobre os problemas enfrentados no início até os recentes projetos em andamento. Atualmente recebemos 280 mil visitantes por mês (dados de outubro/2013). Isso é mais do que o ano de 2007 inteiro (219 mil). Nada mau. Além disso, a SBEM conta com aproximadamente 8 mil fãs no Facebook e 4.500 seguidores do @endocrinologia.

Recentemente inauguramos um novo layout, cujo código html/css foi todo refeito em um novo grid (Bootstrap 3) concebido para funcionar primariamente em aparelhos móveis (mobile first, um conceito interessante descrito aqui pelo Diego Eis). Agregamos, também, as melhorias no funcionamento do CMS que concentra o trabalho dos editores de conteúdo e das secretarias da SBEM.

Tópicos: , , , , , ,
Publicados em Clientes, Open Source, Redes Sociais, Tecnologia, Web Design, Web Mastering | Comentários (0)

Making Of – Dia Mundial do Diabetes 2012

agosto 22nd, 2012
layout da home page

Dia Mundial do Diabetes 2012

Há alguns anos, fiz uma pesquisa para criar um relógio que contava as mortes relacionadas ao diabetes. Programei para um contador somar 1 óbito a cada 5 minutos. Diabetes é um problema de saúde pública avassalador, que dizima a população desde os tempos da revolução industrial e ainda hoje, em pleno século XXI, ainda não obteve a notoriedade e a importância que merece.

O website do Dia Mundial do Diabetes procura tirar este atraso e promover uma maior conscientização sobre o tema. Junto com as redes sociais e antenado com as ações da IDF – a entidade internacional – conseguimos, ao longo dos anos, agregar toda uma comunidade. Só no Facebook, o DMD tem mais de 4800 simpatizantes, mais uns 2000 seguidores do Twitter e incontáveis colaboradores nas fotos do Flickr e vídeos no Youtube.

Estamos usando Python/Django neste projeto há alguns anos. A cada ano o CMS recebe upgrades do framework (versões novas do Django), das ferramentas administrativas – a interface ‘Grapelli’, o editor de texto, o gerenciador de arquivos, etc; e também a cada ano o site recebe uma roupagem nova. Recriamos o layout com as mais recentes técnicas para a codificação html e css. Neste ano estamos implementando o conceito de design responsivo, em que o site procura se adaptar ao browser do usuário.

Em termos de design, inovamos retirando o tradicional menu vertical da lateral da home page. Os itens do menu que eram realmente necessários e úteis foram transferidos para um menu horizontal que fica bem abaixo da linha de rolagem do navegador. Estamos trazendo o foco da atenção do usuário para a região central da home page. Com isso ganhamos espaço precioso na parte de cima da página, onde podemos brincar com a diagramação das chamadas principais.

O dia mundial do diabetes é 14 de novembro, mas a Sociedade Brasileira de Diabetes começa a promover a campanha sempre com boa antecedência, e os resultados desse empenho prévio são visíveis depois, nos relatórios de visitação do site.

O novo site foi lançado em seu ‘modelo básico’ e melhorias serão adicionadas no decorrer das semanas. A linha do tempo será incrementada, colocaremos um mapa das atividades programadas por todo o Brasil e a manchete contará com um slideshow bonitinho.

 

Tópicos: , , , , , , , , ,
Publicados em Clientes, Web 2.0, Web Design | Comentários (0)

CEBDS – Sustentabilidade na Web

março 21st, 2012
hp antiga

a antiga Home Page

O site do Conselho Empresarial Brasileiro para o Desenvolvimento Sustentável (CEBDS), precisava de uma boa reforma. Os problemas eram vários, a começar pela home page. A imagem ao lado foi capturada dias antes da inauguração do novo layout. Reparem como ela é comprida e assimétrica. A coluna da direita era tomada de anúncios e é um dos bons exemplos de banner blindness que eu conheço.

DCPress foi contratada para analisar e diagnosticar o website antigo, rever as rotinas de trabalho da equipe do departamento de comunicação do CEBDS, e projetar e desenvolver um website www.cebds.org.br novo em folha.

O conteúdo do website antigo foi revisto página a página e sua arquitetura foi reorganizada. O novo layout da home page deverá oferecer um visual contemporâneo sem deixar de focar na boa apresentação das notícias, do material institucional e das publicações do CEBDS.

O código HTML era um emaranhado de tabelas e tags antiquados, característico daquela época em que os conceitos de usabilidade ainda engatinhavam e o CSS Zen Garden ainda era novidade. O sistema administrativo cuidava apenas da publicação das notícias no topo da home page, todo o restante tinha que ser atualizado diretamente no código por um programador. A plataforma ASP.NET em um servidor dedicado cujo contrato serviço de manutenção expirou e um provedor sem suporte técnico completavam o quadro apocalíptico característico daqueles projetos em que é melhor recomeçar do zero do que tentar consertar o que há de errado.

Cristina @fimdejogo Dissat, antiga parceira em inúmeros outros trabalhos bem sucedidos, me chamou para coordenar toda a parte técnica do trabalho e manter consultoria constante para os editores de conteúdo. Foi uma honra e um desafio, ao mesmo tempo. Para começar a produzir um website eu sempre gosto de entender um pouco do assunto. Sustentabilidade não é exatamente um conceito novo para mim, mas o termo desenvolvimento sustentável, dentro do contexto em que as grandes empresas trabalham, é um universo ainda a ser explorado.

rascunhos da home page

rascunhos da home page

Criamos um novo domínio “cebds.dcpress.com.br” para hospedar o novo site enquanto o original continuaria online. O perfil do cliente e as especificações do projeto sugerem a utilização de uma plataforma de programação bastante robusta e ágil, pronta para atender a uma demanda constante de novos serviços e melhorias. A dupla Python/Django se encaixa perfeitamente bem nessa função. O CMS que Andrews Medina e eu desenvolvemos já foi testado em várias aplicações diferentes e se mostrou bastante versátil. O VPS  do Dreamhost, apesar deste provedor  nunca ter sido referência na hospedagem de sites Python/Django, até então estava prestando um serviço satisfatório, quando não excelente.

Instalamos o software básico e uma versão genérica do CMS para que a DCPress pudesse tratar da revisão, rearrumação e transferência do conteúdo do site antigo. Enquanto a equipe de conteúdo trabalhava, eu e minha trupe faríamos um novo projeto gráfico e a programação das templates utilizando o que há de mais novo em HTML, CSS e javascript para tornar as páginas rápidas, atraentes e, acima de tudo, perfeitamente legíveis em qualquer tipo de navegador.

O acúmulo de trabalho em diversos projetos simultâneos e a estranha sensação de estar cansado do meu próprio estilo me levaram a chamar três novos integrantes para a equipe. Decidi não mais fazer sozinho o projeto gráfico, o layout e a programação das templates. O layout, grafismos, estudos de cores e tipologias ficariam a cargo do meu amigo e multi-artista Fabio Darci. Entre outros inúmeros talentos, o carioca Fabio domina como poucos a arte de projetar páginas bonitas e funcionais.

A HP atual

Novas tecnologias estão aparecendo a todo momento para acelerar e incrementar a qualidade do Web Design: CSS frameworksGrids, novas aplicações para o Ajax e também novas e criativas maneiras de utilizar os tags do framework Django que simplificam a comunicação com o banco de dados. Para me ajudar a manter meus sites por dentro das mais recentes inovações, incorporei mais uma fera ao time de desenvolvedores: a matogrossense Mayza de Oliveira passou a cuidar dessa parte espinhosa – de transformar os delírios inventados no Photoshop em um código dentro dos rígidos padrões impostos.

Andrews me apresentou mais um desenvolvedor experiente em Django, o capixaba de criação Francisco Souza, que entrou para a equipe para ajudar na instalação do servidor no Linode e para trabalhar em paralelo com o Andrews na produção e customização dos aplicativos do CMS.

Uma equipe como essa exige a utilização de uma ferramenta de trabalho em grupo, um sistema de controle de versões para evitar a todo custo as temíveis “cabeçadas”, em que dois ou mais integrantes fazem a mesma coisa e um sobrescreve o trabalho do outro, ou o ainda mais terrível “deixa que eu deixo” onde todos pensam que alguém vai resolver o problema e ninguém resolve. Optamos por usar o Bitbucket – um serviço de hospedagem de projetos controlados através do Mercurial,  gratuito para pequenas equipes. Apesar do desconforto inicial de ter que aprender e adotar todo um procedimento (Pull -> Update -> Edit -> Save -> Commit -> Push -> Deploy) e de abandonar o bom e velho FTP para atualizar os arquivos diretamente no servidor do site, a solução do Bitbucket tem se mostrado realmente eficiente.

Nesse meio tempo, tivemos que trocar todos os nossos sites feitos em Python para outro provedor, por conta de vários problemas técnicos que começaram a pipocar e não foram solucionados pelo suporte do Dreamhost. Seguindo a recomendação de gente que entende do assunto, contratei um novo VPS no provedor Linode.com. Como num passe de mágica, todos os bugs esquisitos que geravam erros no servidor sumiram e o CMS voltou a funcionar perfeitamente. Além disso, o acesso aos sites ficou bem mais rápido.

Enfim, o novo site foi lançado na véspera do Carnaval 2012 e a resposta do público foi muito boa. Ainda é cedo para tirarmos conclusões a partir das métricas, mas, nessas primeiras semanas, simplesmente duplicamos a visitação média do site.

 

Tópicos: , , , , , , , , , , , ,
Publicados em Casos, Clientes, Provedores, Web Design, Web Mastering | Comentários (0)

O site que eu quero te vender é o site que você quer comprar?

fevereiro 4th, 2010

O site que eu quero te vender deveria ser o site que você gostaria de ter. Se houvesse tempo para termos longas conversas, disponibilidade para aprender novas concepções de marketing, ferramentas de produção de mídia, ações em redes sociais e, principalmente, intenção em informar além de vender produtos e serviços. Leia Mais »

Tópicos: , , , , , , , , ,
Publicados em Casos, Clientes, Tecnologia, Web Mastering | Comentários (2)

A raposa está voltando

dezembro 21st, 2009

Pesquisa recente no site da W3Schools mostrou uma estatística interessante e promissora. Deu vontade de comemorar com uma pizza. Os números mostram que 47% dos  internautas que visitam o w3schools  usam Mozilla Firefox. A soma das percentagens dos usuários de IE8, IE7 e IE6 não chega a 37%.

Pena que esses números aparecem apenas nos relatórios de websites destinados a profissionais de web. Em sites comuns, a prevalência do IE é incontestável, passa fácil dos 80%. O IE 6, que desde 1991 inferniza a minha vida e é o que eu considero o pior navegador do mundo, em várias ocasiões aparece nos relatórios do Analytics como o segundo mais utilizado, atrás apenas do IE8. Mesmo no relatório do W3Schools o IE6 ainda é usado por 10% dos usuários. Essa inércia em atualizar o software, acredito eu, é culpa da pirataria desenfreada que inundou os computadores de cópias ilegais do Windows XP e dos altíssimos custos dos softwares originais.

Esta supremacia do Internet Explorer foi conquistada com política e marketing, e não por mérito. A falta de competência e/ou de interesse dos programadores da Microsoft em seguir os webstandards é notória. A versão 6 do navegador, incluída no Windows XP, é tão divergente dos padrões do W3C, que obriga o bom webdesigner a estudar os “CSS Hacks” para poder criar uma série de estilos aplicáveis unicamente ao IE6 e assim fugir das idiossincrasias do software sem comprometer a performance das páginas em outros navegadores.

A cada nova versão do IE recebemos notícias de que ele está mais próximo dos webstandards. De fato, muita coisa melhorou no IE7 e depois no IE8. Mesmo assim, não é difícil arrancar um bug ou desenhar um layout que funciona em todos os navegadores (Chrome, Safari, Opera, Firefox, Iphone…) mas encrenca no navegador de Bill Gates.

Mas a tendência refletida nos números do site W3Schools é de que o Mozilla retorne ao pódio, de onde nunca deveria ter saído, mas que infelizmente aconteceu quando a Microsoft resolveu nos empurrar o Internet Explorer goela abaixo. Os outros navegadores estão também ganhando mais adeptos, dia a dia.

Eu, aqui, só abro o IErgh para testar os meus sites.  Uso o IE tester para avaliar o funcionamento em diversas versões ao mesmo tempo, e as ferramentas para webmasters fornecida no IE8, que frequentemente explode na nossa cara e fecha o programa. É a Microsoft mantendo o seu padrão de qualidade habitual.

Tópicos: , , , , , ,
Publicados em Open Source, Tecnologia, Web Design | Comentários (0)

Eu quero um site (parte 2)

outubro 22nd, 2009

Olá, fulana

Será um prazer ajudá-la a montar o seu website.

Meus sites têm, de fato, propostas e layouts bem diferentes um do outro, essa é uma das vantagens da minha profissão: a diversidade – aparecem clientes com fábricas artesanais de chocolate (do Helio – www.chocomundo.com.br), acompanhamento de jogos no maracanã (fimdejogo.com.br), designers de jóias (www.brunoguidi.com.br), sociedades médicas (www.endocrino.org.br) e assim por diante. Cada projeto me ensina muito. Leia Mais »

Tópicos: , , , , , , , ,
Publicados em Clientes, Tecnologia, Web Design | Comentários (0)

Eu quero um site, você faz para mim?

agosto 28th, 2009

Sim,… quer dizer, não… ahn… sim e não. Eu faço o site, mas não sou eu quem faço TODO o site. Para que vocês entendam como eu trabalho:

Um website nada mais é que um conjunto de páginas com textos, fotos, desenhos, mapas, vídeos e áudios e alguns formulários para o leitor preencher. Portanto, a equipe envolvida tem que dividir as tarefas e criar, publicar e atualizar todo esse material. Uma equipe básica se compõe de: Leia Mais »

Tópicos: , , , , , , , ,
Publicados em Clientes, Web Mastering | Comentários (5)

Diabetes 2009

fevereiro 5th, 2009

Diabetes 2009Seguindo a linha do “maquiar para não refazer” estamos lançando o site do próximo congresso da Sociedade Brasileira de Diabetes – SBD que vai ocorrer em novembro, em Fortaleza.

O layout é um remake do site do congresso de 2007. Pouca coisa foi alterada na arquitetura, o que mostra que o site do ano passado cumpriu bem as espectativas.  O problema do “english version” está definitivamente aniquilado pelo Google Tradutor, um gadget que executa a tradução para trocentos idiomas com um simples clique.

A produção do evento é da ARX Eventos. O site é mais uma parceria com a Informed Jornalismo, a programação em PHP/MySQL é do brother Andrews Medina.

Tópicos: , , , , , , ,
Publicados em Web Design, Web Mastering | Comentários (0)

CSS Naked Day

abril 26th, 2008

Soube com atraso que dia 9 de abril é o dia CSS Naked Day, onde os desenvolvedores do mundo inteiro retiram os links dos CSS e os sites ficam nús, apresentando apenas o seu conteúdo, como se estivesse sendo visto por um daqueles navegadores da idade pré-web. Ano que vem prometo fazer parte desse jogo, com o meu site pessoal, claro. Se fizer isso com algum site de algum cliente, serei um webmaster morto no dia seguinte.

A idéia do evento é promover os  Web Standards. Isso inclui o bom uso de vários elementos tais como (X) HTML, semântica, estrutura hierárquica e, obviamente, um texto muito bem escrito.  ” It’s time to show off your <body>! “

Tópicos: , , , ,
Publicados em Sem categoria | Comentários (0)

SBEM – reformulação aprovada

março 4th, 2008

Em uma sala de frente para a praia de copacabana, em uma animada reunião da Comissão de Comunicação Social da SBEM, foi aprovada minha proposta de reformular o site da SBEM por completo, começando pela mudança para a plataforma python/django, passando por uma revisão na arquitetura de informação, fazendo também mudanças drásticas no layout das páginas.

A minha apresentação foi feita no Google Docs. Boa parte dela foi produzida no saguão de embarque do aeroporto de Brasília, com uma lixeira servindo de base para o notebook. Quem quiser ver e entender melhor o projeto, pode acessar a apresentação aqui.

Tópicos: , , , , , , ,
Publicados em Sem categoria | Comentários (0)

  • Eduardo Frick

    Atualmente em versão 4.6, Eduardo é Webmaster, webdesigner, web-consultor, web-coordenador de projetos. Tem longa experiência em produção gráfica e é fluente em diversas mídias.

    É carioca da gema, mas mora em Mogi das Cruzes, São Paulo. De seu escritório/estúdio, projeta e cria websites, coordena equipes de desenvolvimento e de conteúdo, recruta e supervisiona o trabalho de analistas, programadores, fotógrafos, ilustradores, animadores, redatores e demais especialistas que garantem serviços de qualidade aos seus clientes espalhados por todo o Brasil.

  • Todos os artigos, por Mês.

  • Temas