X

Design Responsivo: Grids e Texto

Nessa postagem falaremos um pouco mais sobre Design Responsivo, abrangendo assuntos como grids e textos, alguns sistemas prontos, a medida EM e layout liquido.

Continuando a postagem anterior Design Responsivo: o que é e por que usar, falaremos um pouco mais sobre Design Responsivo. Retiramos do blog PopUp uma postagem que fala sobre efeitos responsivos em grids e textos, em diferentes dispositivos e telas, e alguns sistemas responsivos prontos para serem usados sem muita complicação. Falaremos também sobre a medida tipográfica EM e a diferença entre design responsivo e layout liquido.

A equipe da Turbosite compartilha esse conhecimento com a postagem abaixo.

 

A medida tipográfica EM

O EM, também chamado de quadratim, é uma medida tipográfica. Antigamente, quando as fontes eram feitas de prensas de metal, 1 EM correspondia a largura de corpo quadrado da letra M maiúscula. O nome é derivado da pronúncia fonética, em inglês, dessa letra.

EM é uma unidade de medida relativa, ou seja, que varia proporcionalmente de acordo com o contexto. É muito útil em CSS por que é possível definir as margens e espaçamentos também em um tamanho proporcional. O que já não funciona com medidas fixas como pixels ou pontos. Quando você define a tipografia de um site no padrão EM, conforme o tamanho da letra aumenta o mesmo acontece com os elementos afiliados ao texto. 1 EM normalmente equivale a 16 pixels, ou seja, a medida que o browser considera como padrão para textos. Utilizar EM é uma questão de acessibilidade, pois pessoas com dificuldade de leitura podem aumentar e diminuir livremente o tamanho do texto de maneira proporcional. O que dá mais liberdade para o usuário, sem quebrar o seu layout! Para quem preferir trabalhar em pixels, tem uma linha simples de CSS que vai facilitar a sua vida.


This post was last modified on 1 de maio de 2018 15:20

Turbosite:

This website uses cookies.