{"id":816,"date":"2012-05-09T09:36:06","date_gmt":"2012-05-09T12:36:06","guid":{"rendered":"http:\/\/ricardoartur.com.br\/1001\/?p=816"},"modified":"2016-05-03T10:25:59","modified_gmt":"2016-05-03T13:25:59","slug":"anatomia-de-um-grid","status":"publish","type":"post","link":"https:\/\/ricardoartur.com.br\/1001\/2012\/05\/anatomia-de-um-grid\/","title":{"rendered":"Anatomia de um grid: as partes b\u00e1sicas de uma p\u00e1gina"},"content":{"rendered":"

Um grid consiste num conjunto espec\u00edfico de rela\u00e7\u00f5es de alinhamento que funcionam como guias para a distribui\u00e7\u00e3o dos elementos num formato. Todo grid possui as mesmas partes b\u00e1sicas, por mais complexo que seja. Cada parte desempenha uma fun\u00e7\u00e3o espec\u00edfica; as partes podem ser combinadas segundo a necessidade, ou omitidas da estrutura geral a crit\u00e9rio do designer, conforme elas atendam ou n\u00e3o \u00e0s exig\u00eancias informativas do conte\u00fado.<\/p>\n

Construindo uma estrutura adequada<\/strong><\/p>\n

O projeto de um grid depende de duas fases de desenvolvimento. Primeiro, o designer tenta avaliar as caracter\u00edsticas informativas e as exig\u00eancias\u00a0 de produ\u00e7\u00e3o do material. Essa fase \u00e9 de extrema import\u00e2ncia; o grid, depois de pronto, \u00e9 um sistema fechado, e ao constru\u00ed-lo o designer precisa atender \u00e0s especificidades do conte\u00fado, por exemplo os m\u00faltiplos tipos de informa\u00e7\u00e3o, a natureza das imagens e a quantidade delas. Al\u00e9m disso, o designer deve prever eventuais problemas que podem surgir ao diagramar o conte\u00fado dentro do grid, como t\u00edtulos compridos demais, cortes de imagens ou espa\u00e7os vazios em alguma se\u00e7\u00e3o por falta de material.<\/p>\n

A segunda fase consiste em dispor o conte\u00fado de acordo com as diretrizes dadas pelo grid. \u00c9 importante entender que o grid, mesmo sendo um guia precso nunca pode prevalecer sobre a informa\u00e7\u00e3o. Sua tarefa \u00e9 oferecer uma unidade geral sem destruir a vitalidade da composi\u00e7\u00e3o. Geralmente, a variedade de solu\u00e7\u00f5es para a diagrama\u00e7\u00e3o de uma p\u00e1gina com um certo grid \u00e9 inesgot\u00e1vel, mas mesmo assim, \u00e0s vezes \u00e9 melhor transgredir o grid.\u00a0 O designer n\u00e3o pode ter medo de seu grid, e deve test\u00e1-lo at\u00e9 o limite. Um grid realmente bom cria infinitas oportunidades de explora\u00e7\u00e3o.<\/p>\n

Cada problema de design \u00e9 diferente e requer uma estrutura de grid que trate de suas especificidades. Existem v\u00e1rios tipos b\u00e1sicos de grid, e cada qual se destina, em princ\u00edpio a resolver determinados tipos de problemas. O primeiro passo \u00e9 avaliar qual tipo de estrutura ser\u00e1 capaz de atender \u00e0s necessidades espec\u00edficas do projeto.<\/p>\n

\"Diferentes<\/a>
Diferentes tipos de grid<\/figcaption><\/figure>\n

Timothy Samara, Grid: Constru\u00e7\u00e3o e desconstru\u00e7\u00e3o<\/strong>.\u00a0 S\u00e3o Paulo: Cosac Naify,2007 p.24<\/p>\n","protected":false},"excerpt":{"rendered":"

Um grid consiste num conjunto espec\u00edfico de rela\u00e7\u00f5es de alinhamento que funcionam como guias para a distribui\u00e7\u00e3o dos elementos num formato. Todo grid possui as mesmas partes b\u00e1sicas, por mais complexo que seja. Cada parte desempenha uma fun\u00e7\u00e3o espec\u00edfica; as partes podem ser combinadas segundo a necessidade, ou omitidas da estrutura geral a crit\u00e9rio do […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[1],"tags":[25,58],"class_list":["post-816","post","type-post","status-publish","format-standard","hentry","category-aulas","tag-anatomia","tag-grid"],"_links":{"self":[{"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/posts\/816","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/comments?post=816"}],"version-history":[{"count":2,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/posts\/816\/revisions"}],"predecessor-version":[{"id":1153,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/posts\/816\/revisions\/1153"}],"wp:attachment":[{"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/media?parent=816"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/categories?post=816"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ricardoartur.com.br\/1001\/wp-json\/wp\/v2\/tags?post=816"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}