Proposta de standard: Imagens responsivas – resumo 2013

Uma das componentes mais importantes de qualquer projeto responsivo, seja ele implementado segundo uma abordagem “Responsive Web Design”, “Mobile First” ou qualquer outra, é a utilização de uma solução de imagens responsivas, que disponibilize ao utilizador a melhor imagem possível, de acordo com as capacidades do seus dispositivo.

No post “Responsive Images: 2013 Year-End Update” do Filament Group é possível ter acesso a resumo da discussão que está a existir no seio do WHATWG para a definição de um standard HTML para a imagens responsivas.

Recursos para projectos “Responsive”

Palantir - Breakpoints

Breakpoints do site Palantir.net, presente no site mediaqueri.es

Nos últimos 14 meses, parte das minhas responsabilidades na ZON Multimédia têm consistido em criar mockups em HTML/CSS/JS (sobretudo usando JQuery), para diversos portais sobretudo internos, que posteriormente as equipas de desenvolvimento integravam na respectiva solução.

Para além de termos começado a desenvolver todos os nossos projectos em HTML5, nalguns portais (sobre os quais espero poder falar mais detalhadamente em breve) foi tomada a decisão de seguir uma abordagem “Responsive“, de forma a que o interface destes portais se ajuste de uma forma inteligente ao ecrãs em que está a ser visualizado.

Porém, em portais mais complexos a utilização da abordagem “Responsive Web Design (RWD)” traduz-se no aparecimento de alguns problemas de difícil resolução. Algumas das dificuldades mais comuns na utilização desta abordagem estão relacionados com menus de navegação com vários níveis, utilização de imagens (evitando que o utilizador num telemóvel tenha que fazer download de uma imagem que não precisa), formulários complexos e tabelas com várias colunas, entre outros.

Felizmente, em situações mais complexas, através uma pesquisa pela net vai sendo possível encontrar soluções para os nossos problemas, utilizadas por outras pessoas, em situações bastante semelhantes.

Para facilitar esta partilha de conhecimento, Brad Frost (um dos developers que tenho seguido mais de perto, sobre RWD) criou recentemente o site “This is Responsive“, no qual é possível ter acesso a diversos recursos e notícias sobre a abordagem “Responsive” e ainda um banco de padrões para projectos “Responsive“. Definitivamente um importante site a não perder se andarem a trabalhar em projectos “Responsive“.