Criar temas usando um framework como o Foundation é uma prática muito comum nos dias atuais. Eu mesmo já publiquei um curso no qual ensino como criar um layout para um site de farmácia usando este framework.
Porem na primeira etapa da criação do tema, que é feita geralmente em um aplicativo de design (Fireworks ou Photoshop), é complicado ilustrar o posicionamento dos objetos exatamente como eles ficarão após o tema ser passado para o CSS. Pensando nisso alguns frameworks disponibilizam um arquivo .PSD ou .PNG com linhas guia posicionadas no lugar exato do sistema de grid, mas o Foundation não dá esse "help" para nós.
Mas para ajudar você que é webdesigner, estou disponibilizando hoje dois arquivos com linhas guia posicionadas no local exato do grid do Foundation, a fim de facilitar sua criação de temas.
O PSD foi criado originalmente por Jordan Boston, e com base no arquivo dele eu criei o PNG correspondente. Estes arquivos servem para criar layouts dentro do grid padrão de 12 colunas que totalizam 1030 pixels de largura com 15 pixels de padding em cada lado da coluna (logicamente que isso se torna dinâmico de acordo com as configurações do framework).
Compartilhe esse post:
Sou técnico em hardware e desenvolvedor web, e sobre estes dois assuntos comecei a compartilhar aulas e artigos, tornando-me blogueiro em 2008. Em 2010 esse hobby virou profissão, e desde então tenho buscado melhorar e profissionalizar cada vez mais os projetos que mantenho na web.
Atualmente temos 1 comentário para este post. Participe você também, clique aqui e comente sobre o assunto.
© 2008-2023 - RBTech.info | Todos os direitos reservados | Hospedado por Innova Host
É proibida a reprodução total ou parcial de qualquer conteúdo deste site.
Olá Ricardo. Obrigado por mais um artigo, breve mas muito útil... Eu tenho desenvolvido os meus temas usando as guias do fireworks e tenho tido, de facto, muita dificuldade em recriá-lo com o CSS, acabando por ser muito trabalho embora, depois disso, acabo por montar o layout. Na verdade os arquivos GRID são óptimos por que reduzem o tempo de criação do tema, sem falar da elegância que vai proporcionar no visual.
Vai ser mais uma ajuda significativa para quem trabalha com a criação de temas.
Valeu Ricardo. Um abraço