BT

Google Web Fundamentals e Web Starter Kit

por Abel Avram , traduzido por Daniel Viveiros em 23 Jul 2014 |

A Google acaba de publicar uma série de guias e códigos de referência para criação de websites responsivos e multiplataforma.

Ciente dos desafios encontrados por desenvolvedores dada a existência de uma grande variedade de dispositivos, especialmente móveis, a Google acaba de publicar o Web Fundamentals, um conjunto de guias e melhores práticas para desenvolvimentos web modernos. O Web Fundamentals inclui orientações com exemplos de código em HTML, CSS e JavaScript para as seguintes áreas:

  • Ferramentas - Selecionar um editor, configurar ferramentas de desenvolvimento, configurar um processo de build, depuração com Chrome Dev Tools, testar nos dispositivos, no emulador e na nuvem, entre outros.
  • Layout - A Google recomenda projetos de websites responsivos usando CSS3 Media Queries com múltiplos pontos de quebra para diferentes tamanhos de monitores, padrões para websites responsivos - Fluid Layout, Column Drop, Layout Shifter, Off Canvas - além de padrões para navegação e tomadas de ação - App, Tab e Bottom Bars, Navigation Drawer.
  • Formulários e Entrada de dados - Escolher formulários que funcionem em dispositivos móveis, lidar com validações em tempo real, lidar com toques e implementar gestos customizados.
  • Imagens, Áudio e Vídeo - Orientações para usar a tag <img>, fundos CSS, SVG para ícones, problemas de desempenho com imagens, lidar com vídeos, plataforma legadas, problemas com acessibilidade, etc.
  • Performance - Otimizar o Critical Rendering Path (Caminho crítico de renderização), usar o PageSpeed, ajustar o desempenho de conteúdo eliminando downloads desnecessários, otimizar o encoding e imagens, usar o caching HTTP, entre outros.
  • Sensores e Capacidades de Dispositivos - Orientação sobre como acessar localização do usuário, orientação e movimento do dispositivo, fazer chamadas.

Além dos guias, a Google está disponibilizando o Web Starter Kit (WSK), um pacote com códigos prontos e ferramentas para criar websites multi-dispositivos. Inspirado no Mobile Boilerplate, o Web Starter Kit inclui código para páginas HTML de dispositivos móveis, layout responsivo, um guia de estilo de componentes visuais e a ferramenta opcional de build gulp.js.

O WSK funciona nas duas últimas versões do Chrome, Firefox, Safari, Opera, IE 10 e 11, mas também nos navegadores de dispositivos móveis Android, iOS, Windows Phone e Blackberry.

Tanto os códigos relacionados ao Web Fundamentals como os códigos do Web Starter Kit são open source e estão disponíveis no GitHub.

Avalie esse artigo

Relevância
Estilo/Redação

Olá visitante

Você precisa cadastrar-se no InfoQ Brasil ou para enviar comentários. Há muitas vantagens em se cadastrar.

Obtenha o máximo da experiência do InfoQ Brasil.

Dê sua opinião

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

Receber mensagens dessa discussão
Comentários da comunidade

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

Receber mensagens dessa discussão

HTML é permitido: a,b,br,blockquote,i,li,pre,u,ul,p

Receber mensagens dessa discussão

Dê sua opinião
Feedback geral
Bugs
Publicidade
Editorial
Marketing
InfoQ Brasil e todo o seu conteúdo: todos os direitos reservados. © 2006-2016 C4Media Inc.
Política de privacidade
BT

We notice you’re using an ad blocker

We understand why you use ad blockers. However to keep InfoQ free we need your support. InfoQ will not provide your data to third parties without individual opt-in consent. We only work with advertisers relevant to our readers. Please consider whitelisting us.