Logo do siteSilhueta da face do Maujor seguida do texto Maujor o dinossauro das CSS

Menu hamburger Três barras horizontais na cor laranja destinadas a ser clicada para abrir o menu menu do site

Site iMasters adota XHTML e CSS

Publicado em: 2006-04-19 — 27.265 visualizacoes

Logo do imasters

Hoje é um dia que certamente entrará para a história da Internet brasileira.
Acaba de ser lançada há alguns minutos a versão XHTML + CSS do site iMasters.

Meus mais efusivos parabéns ao amigo Tiago Baeta e sua equipe, por essa decisão.
É motivo de grande alegria para nós, divulgadores das Web Standards, poder citar o iMasters como mais um exemplo de site aderindo aos padrões. É um exemplo de peso não só pela grandiosidade do iMasters mas, principalmente, pela audiência e público alvo do site que com certeza levará aos desenvolvedores brasileiros mais uma motivação para aderir aos padrões.

Entrevistei com exclusividade o jovem André Metzen do iMasters, responsável direto pela codificação. Vejamos o que ele tem a nos dizer:

Foto André MetzenAndré, por favor apresente-se aos leitores do meu Blog

Olá pessoal, meu nome é André Metzen, e é um prazer poder participar desta conversa. Sou de Vitória – ES, tenho 20 anos, faço Ciência da Computação na Universidade Federal do Espírito Santo. Sou fascinado por tecnologia em geral, mas me interesso mais pela área de internet, na qual trabalho desde 2001, mais especificamente com analise de sistemas de internet, programação em PHP, codificação XHTML, desenvolvimento de folhas de estilo, Javascript DOM, e continuo com a mesma fome de conhecimento da época em que comecei na área.

Qual é a sua função atual e há quanto tempo você trabalha no iMasters?

Estou no iMasters desde 2003. Hoje trabalho como Gerente de Tecnologia, em conjunto com uma excelente equipe para tornar o projeto do iMasters possível.

Na migração do site do iMasters para as Web Standards qual foi o maior desafio (se é que houve um só!), ou aquele que te demandou maior número de horas insone?

O maior desafio de converter o iMasters para os padrões foi o porte dele. Um portal com o volume de informações do iMasters necessita de um planejamento estrutural bem feito e bem pensado. É necessário um estudo muito mais profundo do que um site não-padrão. Algo que deu muito trabalho também foi converter as matérias antigas, onde ainda há muito por fazer, mas esperamos que no final todas as matérias sejam válidas no XHTML 1.1.

Atualmente qual o número aproximado de páginas do iMasters e quantos templates foram criados para contemplar todo o site?

É quase impossível contabilizar o número de páginas, considerando que cada matéria publicada possui um código HTML que também precisa ser válido. Desconsiderando as matérias, deve ser em torno de 150 a 200 páginas, e para isso foram usados aproximadamente 100 templates, todos eles válidos.

Você conseguiu reproduzir com CSS todos os posicionamentos e layout do site antigo? ou em algum lugar teve que apelar para tabela?

Não houve a necessidade de reproduzir com exatidão o site antigo, pois ele passou por um re-design, mesmo assim houve momentos que deu vontade de jogar tudo pro alto, mas a razão prevaleceu e no final não foi utilizada tabela sequer para compor a estrutura do site. A solução é sempre procurar o modo mais semântico de estruturar o XHTML, a partir disso é possível organizar o código e aplicar as CSS de forma a compor praticamente qualquer layout.

Alguns aspectos das Web Standards são polêmicos e não há um consenso sobre eles. Você se deparou com uma situação destas? Qual(is)?

Dúvidas sempre surgem durante qualquer desenvolvimento, e não foi diferente pelo fato de estar usando os padrões. Felizmente não tivemos muitos problemas quanto a esses assuntos polêmicos, mas houve vários casos em que ficávamos na dúvida da melhor representação da estrutura do documento e, para resolver esses contratempos, nada melhor do que estudar o problema e encontrar a forma mais semântica.

É sabido que a grande maioria dos CMS (Sistemas Genciadores de Conteúdo) têm se constituido em uma grande dor de cabeça para desevolvedores de sites standards, devido ao código “sujo” (não standard) que geram.
Que mecanismos o iMasters dispõe para tratar deste problema?

Todo o sistema que gerencia o conteúdo do iMasters é exclusivo e desenvolvido internamente por nós mesmos. A mudança no novo site não foi apenas visual, o site foi refeito a partir do zero, para atender a todas as crescentes necessidades do portal, resolver o problema de desempenho, e para que possamos deixá-lo totalmente ajustado a fim de trabalhar com os padrões. Dessa forma ao invés de ser um fator que atrapalha desenvolver seguindo as web standards, o sistema de gerenciamento passou a colaborar e facilitar este desenvolvimento.

Você considera a fase de implementação das Web Standards no site do iMasters plenamente concluida?

Infelizmente não, além de faltar a conversão de grande parte das matérias e de alguns sistemas modularizados para o padrão, a parte essencial e mais trabalhosa já foi convertida. E mesmo que terminássemos tudo, tenho certeza que ao final teríamos novos conhecimentos para refazer certos pontos que precisariam de melhorias. O desenvolvimento web é um contínuo aprendizado de novas técnicas e tecnologias, e é bem provável que ao final de todo o projeto iMasters (que não termina com o lançamento do site) já haja muita coisa a ser re-trabalhada.

Como foram tratadas as questões envolvendo a acessibilidade ao site?

Ainda não trabalhamos os aspectos mais avançados da acessibilidade, que serão implementados com análises e feedback dos nossos visitantes portadores de necessidades especiais, mesmo assim procuramos fazer o código mais semântico possível, trabalhar com fontes visíveis e evitando sempre imagens no lugar de texto.Quando foi indispensável o uso da imagem nós utilizamos image-replacement. Também evitamos ao máximo depender de javascript, sempre que possível utilizamos javascript não-obstrutivo.

Qual a expectativa de ganhos e vantagens para o iMasters com o lançamento da versão standard do site?

Não há duvidas de que as vantagens de utilizar os padrões superam o trabalhoso processo de desenvolvimento de um site deste porte. O ganho em desempenho, consumo de banda, e facilidade de atualização, tornarão o site muito mais ágil e consequentemente trarão mais visitas. Outro ponto que não podemos esquecer é o page rank nos buscadores. Uma página com um código mais limpo e semântico deve ter uma ajuda considerável no ranking do iMasters em buscadores como Google, Yahoo e MSN Search, e isso é fundamental para o aumento de visitas e crescimento do site.

A migração do site para as standards está concluida ou ainda há etapas a cumprir? Se sim, que etapas são estas?

Como eu disse, ainda existem alguns módulos independentes do sistema de gerenciamento de conteúdo do iMasters, que precisam ser convertidos, além de um número considerável de matérias. Com o desenvolvimento do projeto, queremos que o portal seja 100% válidado em XHTML 1.1. Apesar da dúvida de muitos quanto à possibilidade de um portal deste porte ser válido, estamos provando a eles que é possível, independente do volume de informações.

O espaço é seu para comentários ou para dizer algo que não foi perguntado.

Gostaria de lembrar que além de estar no padrão, o novo site traz dezenas de novos recursos, como feeds de seções ou autores específicos, feeds personalizados, interação com as matérias, busca avançada, recursos em AJAX que ajudam na navegação, uma melhor organização de canais e seções, enfim, uma série de vantagens que peço a vocês que dêem uma conferida. Também queria aproveitar para agradecer a várias pessoas que ajudaram a mim e à equipe de desenvolvimento a fazer este site virar realidade: Tiago Baeta, Diretor do iMasters, por ter me dado a oportunidade de mostrar meu trabalho; Rafael Ribeiro, meu companheiro de trabalho que teve paciência comigo nas horas de desespero; Diego Nunes, pela imensa colaboração no desenvolvimento do comportamento do site(javascript); e a você também, é claro, por me apoiar e ajudar quando surgiam os problemas mais sérios. Existem varias outras pessoas a quem sou muito grato, mas acho que não é possível de citar o nome de cada uma delas.

André, muito grato pela gentileza desta entrevista. Acompanhei ainda que a distância, o teu esforço, dedicação e principalmente o amor que você colocou neste trabalho. Considero este passo que vocês deram uma propaganda sem precedentes para as práticas standards, da qual sou divulgador e entusiasta. A maioria das críticas que virão, serão com certeza construtivas. Finalizando, desejo todo o sucesso na tua vida pessoal e profissional.
Obrigado pelo seu trabalho.

Sou eu quem agradeço. É uma honra para mim poder ter esta conversa com você. Com certeza virão muitas críticas, e estarei receptivo a todas elas. Nada melhor do que a opinião do público para sabermos que caminho tomar. Com o lançamento deste novo site, espero que os desenvolvedores abram os olhos e deixem o medo de usar os padrões de lado, e que possamos incentivar o máximo de pessoas possível a adotar (e adorar) este método de desenvolvimento que traz inúmeras vantagens. Um abraço a todos, e obrigado.

Desenvolvimento com Padrões Web? Adquira os livros do Maujor
Visite o site dos livros.

Esta matéria foi publicada em: 2006-04-19 (quarta-feira). Subscreva o feed RSS 2.0 para comentários.
Comente abaixo, ou link para http://www.maujor.com/blog/2006/04/19/imasters/trackback no seu site.

18 comentários na matéria: “Site iMasters adota XHTML e CSS”

  1. Joao PrioliNo Gravatar disse:

    Muito boa a entrevista! Muito legal também ver como era as coisas em 2006. Sucesso á vocês.

  2. Ana PaulaNo Gravatar disse:

    Concordo com o Mike.
    O garoto não sabe como atender seus consumidores.
    O flogs é horrível e não tem a menor assistência para seus usuários.
    Faz muito tempo que tento contatar algum suporte para pelo menos excluir a minha página flogs, mas nem isso consigo.

  3. MikeNo Gravatar disse:

    A minha opiniao sobre Andre Metzen e bem diferente.
    Nao sabe gerenciar seu proprio flog, deixando de responder perguntas de membros como eu, que no flog gratuito que ele tem, nao consigo postar fotos e nao recebo respostas.
    Logico, com 20 aninhos, ele precisa aprender muita coisa na vida, especialmente como se relacionar com os consumidores.
    Hoje ele e filho de papai, amanha sera dono da sua propria empresa, ai eu quero ver como ele reage ante a perda de um negocio ou cliente.
    E isso ai

    Abracos
    Mike
    riomikewines@yahoo.com
    http://www.flogs.com.br/mikeriodejaneiro

  4. Luciano SouzaNo Gravatar disse:

    Padronizar é uma palavra que nos leva ao delírio ! Os padrões contribuem em muitos sentidos, esses então! Parabéns à equipe IMasters pela ousadia e coragem. André, você chega longe garoto!

  5. Wellington RodriguesNo Gravatar disse:

    Parabéns pela ótima entrevista e até um futuro próximo.

    []s e sucesso!

  6. Renato CarvalhoNo Gravatar disse:

    Muito bom o trabalho. Parabéns a toda esquipe que participou no projeto.

    Achei meio força-barra dizer no email que recebi do portal Imasters ser o primeiro portal do Brasil a ser válido pela W3C. Acho que não hein.

    Mas de qquer forma, parabéns!

  7. Viche » Imasters Adere aos Padrões disse:

    […] Para conhecer os detalhes de como se deu todo o processo de migração, nada melhor do que visitar o blog do Maujor que publicou, com exclusividade, uma bela entrevista com o jovem André Metzen do iMasters, responsável direto pela codificação. Ambos, o entrevistador e o entrevistado, estão de parabéns. […]

  8. Felipe RanieriNo Gravatar disse:

    Nossa! Com certeza é com grande alegria que eu recebo esta notícia, primeiramente porque sou fã incondicional do iMasters. Foi através dele que eu conheci o trabalho do Maujor, e antes disso, aprendi muito coisa quando fazia minhas pesquisas sem ao menos ter noção de por onde começar. Talvez muitos achem exagero da minha parte, mas para mim, há pouco tempo divulgador e (principalmente) aprendiz de web standards, essa foi uma das melhores notícias que eu tive e um dos maiores insentivos para manter minha postura e continuar neste caminho que escolhi para seguir minha vida profissional.

    Abraços Maujor!
    ps: com certeza esta notícia merece um post.

  9. Hilário Seibel JúniorNo Gravatar disse:

    Algo que passasse pelas mãos do Thiago e do André só poderia ser mesmo um sucesso.

    O Thiago é um garoto prodígio. Desde criança já demonstrava ter uma mente brilhante. E o André é um garoto esforçado, inteligente, e que gosta muito do que faz.

    Os dois têm muito talento. Ainda vão aprontar muito.

  10. Ciro FeitosaNo Gravatar disse:

    Bom trabalho André. A organização das seções, do código, das URLs, deu um resultado final profissional ao site do iMasters. Quem ganha com isso são os usuários e o próprio portal, com economia de banda. Parabéns.

  11. Bruno Dulcetti - Blog » Arquivo » Portal iMasters nos padrões disse:

    […] Venho aqui para falar sobre o Portal iMasters, para onde escrevo alguns artigos. Ele agora está dentro dos padrões e com novo visual na minha opinião bem melhor, mais leve, de bom gosto. Ainda não conferi o código para ver parte da semântica do código do site, mas deixarei isso para depois. […]

  12. MicoxNo Gravatar disse:

    É realmente um grande orgulho poder dizer que sou leitor do imasters. Um site voltado para a comunidade de desenvolvimento web que realmente pratica as novas tendências.
    Seria bom, se no futuro, divulgassem as melhorias que conseguiram após a implantação dos padrões no que se refere a largura de banda (comparação) e facilidade de manutenção.

  13. Lucas AlvesNo Gravatar disse:

    Poxa muito bom mesmo.
    Onde eu trabalho estamos adontando os padroes também mas uma pena é que apenas 1% dos nossos usuarios usam outros navegadores que nao sejam IE.
    É um grande problema ficar fazendo hacks pra funcionar no IE.
    Mas estamos ae nessa grande luta.
    parabens ao pessoal do iMasters

  14. Alexandre Gomes GaigalasNo Gravatar disse:

    Tava na hora de um grande portal de Web brasileiro tomar uma postura assim! Parabéns! IMasters deu um salto gigantesco na frente dos outros..

  15. Pedro RogérioNo Gravatar disse:

    Parabéns André, o site ficou show de bola!!!

  16. TiagoNo Gravatar disse:

    Parabéns pelo sucesso André. Você já merece a algum tempo! Parabéns também ao Rafael!

  17. GeraldoNo Gravatar disse:

    Parabens Andre, o novo site ficou primeira de luxo…Atingiu a excelência em qualidade hehehe

  18. Estevão LucasNo Gravatar disse:

    Parabéns Maujor pela entrevista e parabéns também a todos do IMasters, mostrando que aderir ao padrões web nada mais é do que uma obrigação e que so vem a trazer beneficios!

Comentário:





Teclar "Enter" cria um novo parágrafo. Teclar "Shift + Enter" causa uma quebra de linha.

Subscribe without commenting

topo