Um site para americano ver

A criação e o design de sites quase nunca seguem padrões.
Criar para web é saber lidar com limites.
Em internet tudo pode, tudo é possível.
Os padrões (web standards) devem ser respeitados para a melhor performance de um site.
Todas estas afirmações são verdadeiras, apesar de contraditórias.
Ué?!? Mas então qual é a verdade? Todas!
Então, me perdi!

A partir destas verdades e mentiras fizemos uma imersão na linguagem de comunicação dos sites americanos e ingleses do segmento de "plumbing & heating" - encanamento e aquecimento - para elaborar a criação do novo site da empresa DCC Plumbing and Heating, de Danbury, Connecticut, USA, de propridade de Ildo Joseph.
O briefing, bem o briefing foi - "preciso de um site campeão, um site pra brigar de igual pra igual com as empresas do segmento".
Nas grandes nevascas do inverno impiedoso americano, a água congela nos encanamentos e estes se quebram como casca de ovos - o número de chamados para consertos e novas instalações de calefação, aumenta exponencialmente nesta época.

Fizemos uma pesquisa de linguagem de comunicação em mais de 30 sites do segmento. Americanos são objetivos, vão direto ao que interessa, firulas de design que desviam a atenção do foco da comunicação, não cabem neste caso.
Americanos querem saber de tradição e bons serviços, "since 1948" - quanto mais antiga a empresa, mais confiável.
Foi a partir destes conceitos que desenvolvemos um site despojado, com design básico e repleto de objetividade - o que fazemos, quais produtos utilizamos e como falar conosco. Simples assim.

 

O fator "Super Herói"

Somado à simplicidade da comunicação adicionamos o fator "super herói". Como todos sabem, os americanos são chegados em um super herói. Partindo do princípio que os super heróis fazem parte da cultura americana e, sabendo que todo americano gostaria de chamar um Super Herói para resolver seus problemas, foi que criamos o "Super DCC", com óbvias características visuais e cromáticas de Super Homem e feições caricatas ao estilo Simpsons.

Temos fortes convicções de que a imagem deste personagem aliada aos bons serviços prestados pela DCC Plumbing & Heating vai gravar na mente dos clientes uma imagem de solução para todos os problemas com encanamento, aquecimento e ar condicionado central - especialidades da empresa.

Este personagem entrou em contraponto com a imagem do "quebra galho"; na animação que aparece abaixo do cabeçalho do site, com chamadas diretas.

 

Por que chamar qualquer um para resolver seus problemas de encanamento?

Chame DCC Solução Total! Fins de semana, à noite e em feriados. Ligue agora 203-650 3137.

E nas cores da bandeira americana, mais subliminar, impossível!

A foto "royalty free" comprada no Dreamstime de um encanador quebra galho com um desentupidor na mão, foi o mote para a criação do banner animado. Eis que surge o "Super DCC" com sua super chave inglêsa na mão para resolver todos os seus probelmas! Você só precisa ligar.

O bom e velho lápis
O personagem, como sempre, foi esboçado com o bom e velho lápis, teve os traços corrigidos e redesenhados com pilot, depois digitalizado com uma câmera de celular e transferido via Bluetooth para o computador, vetorizado e colorizado no Corel Draw (sim, nós usamos o Corel Draw!).
Acompanhe as etapas da criação do personagem:

 

 

 

O site foi construído com o CMS (Content Management System) Joomla, com tema desenvolvido com exclusividade, sobre a estrutura básica de módulos do Joomla, na versão 1.5.23, a mais recente antes da 1.6 - escolha determinada por conta de algumas extensões utilizadas e que ainda não funcionam na nova versão. Hospedado no GoDaddy, utiliza banco de dados MySQL e linguagem PHP. A utilização do Joomla confere ao site a possibilidade de evolução e atualização imediata.

Mostrando as armas
Por trás desta inocente imagem de um site simples e objetivo se escondem poderosas "armas" para o SEO (Search Engine Optimization). O site DCC Plumbing & Heating conta com a instalação do componente JoomSEF comprado da ARTIO. Este componente se encarrega de exibir um completo painel administrativo com ferramentas para otimizar a performance do site junto aos mecanismos de busca. Uma de suas principais características é transformar os endereços de páginas em URLs amigáveis, substituindo as "strings" de código PHP (endereços de arquivos/páginas) por palavras chave que ajudam na indexação das páginas e melhoram o posicionamento do site. Os resultados deverão ser colhidos nos próximos meses.

 

Com relação a facilitar o contato dos visitantes do site foram instalados um módulo gratuito "Rapid Contact" localizado no topo da coluna da direita e um formulário em PHP com validação de campos na página "Contact". O telefone para chamados de serviços aparece em destaque no banner animado e no rodapé do site.

Flash descomplicado

Para as atualizações do banner animado em Flash, não é necessário utilizar o Adobe Flash, SwishMax ou outros para preparar novos banners. Foi comprado e instalado o módulo Smart Flash Header da ProJoom, que simplifica tudo - bastando criar a imagem na dimensão correta e colocar na pasta do módulo no servidor. Não é necessário nem utilizar um programa de FTP (File Transfer Protocol), o módulo vem com um sistema de "upload" para subir as imagens e um completo painel de controle onde é possível definir velocidade de transição entre slides, dimensões, efeitos de animação e muito mais. 

 

 

Por fim, para garantir a integridade do trabalho foi instalado o componente de backup "Akeeba", que faz uma cópia completa do web design do site e do banco de dados, permitindo que o site seja facilmente restaurado em qualquer eventualidade.

O reconhecimento pelo trabalho bem feito veio de imediato, nas palavras do diretor da DCC Plumbing & Heating, Ildo Joseph:

Por tudo isso, podemos afirmar que nossos sites não são simples páginas de exibição de conteúdo, são poderosas ferramentas de relacionamento web, preparadas para evoluir de acordo com as necessidades de crescimento das empresas.

Por último, mas não menos importante, para confirmar uma das verdade do início deste post, o site DCC Plumbing & Heating passou na validação de código XHTML do W3C Markup Validation Service - Veja aqui o resultado.

Para saber mais sobre criação de sites com Joomla visite w3maker

Do layout ao site pronto

Em geral quando se vê um site pronto é muito difícil imaginar quantos "pulos" o web designer e o programador deram para chegar ao resultado final.

Normalmente muitas pessoas são envolvidas na aprovação do site e com isto, a etapa de criação é a fase mais complexa de todo o desenvolvimento web, pois o resultado tem que ter consenso.

Em alguns casos aqui na w3maker, recebemos o layout definido, seja por agências de comunicação, publicidade ou mesmo por nossos clientes. Para estas situações, muitas adaptações são necessárias, pois nem sempre quem cria do outro lado, conhece as limitações do web design. Não que o web design tenha limites, mas para que tudo funcione dentro dos web standards, algumas regras precisam ser observadas.

Nosso mais recente desafio, com o layout fornecido, foi o desenvolvimento do novo site para a Kraftweb, empresa de soluções de tecnologia. Recebemos do diretor Mauro Zaide o layout a seguir, com a liberdade de modificar aquilo que fosse importante para a melhoria visual e operacional do projeto.

Layout fornecido para a Página Inicial

Layout fornecido para as páginas internas

Optamos pelo uso do Joomla como sistema de gerenciamento de conteúdo, devido à necessidade manifestada pela equipe da Kraftweb de atualizar periodicamente tanto o conteúdo como a estrutura do web site.
O layout final foi resultado de duas etapas de design e ajustes para adequação do conteúdo ao formato proposto. Desenvolvemos um template (tema) exclusivo para Joomla, respeitando a diagramação do layout fornecido, porém adaptando-o à estrutura de módulos deste CMS (Content Management System).
Usamos os recursos de "mod_custom" (módulo personalizado que permite a edição de textos, imagens e inclusão de HTML) e estrutura de blog para criar os conteúdo para as quatro caixas da home, permitindo assim, que possam ser editadas com extrema facilidade.

Fotos? A gente pega na Internet, certo?

Errado! Usamos o Dreamstime, banco de imagens royaltyfree, onde adquirimos fotos de qualidade que atendessem aos conceitos de cada produto da Kraftweb.

Texto? O web designer dá um jeitinho!
Errado! Muitos clientes pensam que é atribuição do web designer fazer o conteúdo se encaixar no layout, mas em 101% dos casos, o texto precisa ser escrito com o número certo de caracteres para que fique em harmonia com o design.
Para que tudo ficasse equilibrado, layout e forma, foi necessário o tratamento do conteúdo (textos) - ciente disto, a Kraftweb contratou os serviços de criação e edição de textos da empresa Ventana Projetos em Comunicação para o desenvolvimento dos conteúdos.

O resultado para a página inicial (home) e para as páginas internas, a partir do layout proposto, foi novamente trabalhado pela equipe da Kraftweb e o resultado final desenvolvido pela w3maker e aprovado pode ser visto a seguir.

Web Design da Página Inicial (Home)

Web Design das Páginas Internas

Foi necessária a integração de formulário de contato que enviasse dados diretamente para o servidor da Kraftweb e para isto utilizamos a estrutura de "wrapper" oferecida pelo Joomla que é uma especie de "janela" (iframe para os íntimos) que "carrega" um formulário externo dentro da página "Fale Conosco".

O novo site da Kraftweb é "cross browser" ou seja, funciona com mínimas variações nos principais navegadores: Firefox, Chrome, Opera, Safari, Internet Explorer 7, 8 e 9. Para o Internet Explorer 6 que já foi descontinuado pela Microsoft, mas que alguns ainda insistem em usar (por comodidade, hábito, preguiça ou desconhecimento de como atualizar), apesar das falhas de segurança e falta de suporte para atualizações. Instalamos um plug-in no Joomla que detecta se o usuário faz uso deste navegador e apresenta um alerta informando sobre a versão desatualizada e oferecendo opções de atualização.

O menu de navegação do site recebeu submenus comandados por CSS com transparência, utilizando a estrutura padrão de menus do Joomla.



Uma solicitação especial para a seção FAQ - Perguntas frequentes, foi de que as respostas ficassem ocultas e só fossem exibidas a partir do clique do usuário em cada uma delas. Para solucionar este item, recorremos à instalação e configuração do módulo Ice Accordion, disponível para download gratuito no site de extensões do Joomla.

Site no ar!

Por fim veio o reconhecimento pelo nosso trabalho, nas palavras do diretor da Kraftweb:

“O desenvolvimento do novo site da Kraftweb com a w3maker foi uma experiência muito interessante. Desejávamos um site moderno e ágil, com padrão dos sites das empresas de soluções de TI atuais. Com a indicação da w3maker optamos pela plataforma Joomla, para conseguirmos a agilidade de atualização necessária. O resultado final foi muito bom, com plena aprovação de clientes e parceiros.”
Mauro Cohen Zaide

Para saber mais sobre criação e desenvolvimento de sites com Joomla, viste: w3maker