×
Namespaces

Variants
Actions
Revision as of 07:51, 8 December 2011 by hamishwillee (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Mobile Web Design Pattern: Grid (Português)

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata

Artigo
Tradução:
Por maiconherverton
Última alteração feita por hamishwillee em 08 Dec 2011

Este padrão de projeto é parte de Mobile Web Design Patterns.

Contents

Descrição

Uma série de itens da lista dispostas em uma ou mais linhas horizontais e/ou colunas verticais para formar uma grade 'grid'.

19-Grid.png


Figura: Este é um grid em uma linha no site BBC Proms poderia facilmente ter sido expandida para criar algo mais tradicional como o padrão listas.

Usar quando

  • Use como uma alternativa para uma lista vertical contendo um ícone e um texto. É mais adequada se o texto é curto e não e não se espera que ele seja quebrado.


Fundamentação

Grids tem várias vantagens sobre outros formatos:

  • Muitas vezes, ocupam menos espaço do que as listas verticais puramente vertical.
  • Quando bem implementadas, podem fornecer um agrupamento visual mais interessante.

Dicas de design

  • Certifique-se de testar o seu layout grid em dispositivos com tamanhos de telas diferentes de dpi, revendo o tamanho e facilidade de seleção em cada item do grid. Não se esqueça de ajustar a lista e o espaço entre os itens, se necessário, para facilitar a seleção.
  • Lembre-se que a série S40 e S60 os navegadores tem modelos de interação diferentes. Navegando em um grid pode demorar um pouco mais do que navegar uma lista, especialmente se o item que deseja selecionar exige que você passe por muitos outros itens do grid.
This page was last modified on 8 December 2011, at 07:51.
124 page views in the last 30 days.