{"id":2856,"date":"2022-02-09T08:00:00","date_gmt":"2022-02-09T11:00:00","guid":{"rendered":"https:\/\/coodesh.com\/blog\/?p=2856"},"modified":"2024-01-05T07:43:51","modified_gmt":"2024-01-05T10:43:51","slug":"o-que-e-responsive-design","status":"publish","type":"post","link":"https:\/\/coodesh.com\/blog\/dicionario\/o-que-e-responsive-design\/","title":{"rendered":"O que \u00e9 Responsive Design?"},"content":{"rendered":"\n

Em meio a tantas telas, entender o que \u00e9 Responsive Design e aplicar o conceito no front-end far\u00e1 toda a diferen\u00e7a no neg\u00f3cio. <\/strong><\/p>\n\n\n\n

O termo \u00e9 relativamente recente, fruto de um novo per\u00edodo em que n\u00e3o se valoriza apenas o desktop. Mas para compreender sua import\u00e2ncia tamb\u00e9m \u00e9 necess\u00e1rio ter o olhar do Design Thinking<\/a> e pensar nas estrat\u00e9gias de SEO (Search Engine Optimization) do website.\u00a0<\/p>\n\n\n\n

Devido \u00e0 import\u00e2ncia do conceito, trouxemos ele hoje no Dicion\u00e1rio Tech da Coodesh. A se\u00e7\u00e3o apresenta termos t\u00e9cnicos usados no dia a dia do desenvolvedor e at\u00e9 mesmo do tech recruiter. <\/p>\n\n\n\n

Defini\u00e7\u00e3o <\/h2>\n\n\n\n

Voc\u00ea vai encontrar o termo Responsive Design, Design Responsivo e Web Responsive Design para designar o mesmo conceito. <\/p>\n\n\n\n

Sendo assim, ele \u00e9 uma t\u00e9cnica de estrutura\u00e7\u00e3o HTML e CSS que resulta na adapta\u00e7\u00e3o do site ao browser do usu\u00e1rio. <\/strong><\/p>\n\n\n\n

Dessa forma, o layout fica mais fluido e agrad\u00e1vel. Isso impacta diretamente na usabilidade da aplica\u00e7\u00e3o, aumentando as visualiza\u00e7\u00f5es e o tempo de perman\u00eancia do usu\u00e1rio. <\/p>\n\n\n\n

Esse tipo de abordagem teve origem em meados de 2010. O que \u00e9 Responsive Design foi um termo criado por Ethan Marcotte<\/a> para se referir \u00e0 pr\u00e1tica de ajustar automaticamente o conte\u00fado de um site \u00e0 tela em que ele ser\u00e1 exibido.<\/p>\n\n\n\n

Afinal, quando o desktop deixou de ser a fonte principal de conex\u00e3o \u00e0 internet, a nova concep\u00e7\u00e3o foi essencial. Hoje em dia, temos de rel\u00f3gio \u00e0 geladeira conectados na internet. Por\u00e9m, o consumo de dispositivos com telas ocorre principalmente em smartphones. <\/p>\n\n\n\n

Mobile First <\/h2>\n\n\n\n

Ali\u00e1s, segundo a Anatel (Ag\u00eancia Nacional de Telecomunica\u00e7\u00f5es), o levantamento mais recente (de 2021) mostra que s\u00e3o 251,3 milh\u00f5es de celulares no Brasil<\/strong>. Al\u00e9m disso, 82,7% dos domic\u00edlios brasileiros t\u00eam acesso \u00e0 internet, conforme o Instituto Brasileiro de Geografia e Estat\u00edstica (IBGE). <\/p>\n\n\n\n

E todo esse montante de brasileiros conectados utilizam o smartphone como principal ferramenta de uso da internet. Afinal, o celular foi encontrado em 99,5% dos domic\u00edlios com sinal de internet.<\/strong> O computador vem em segundo lugar, com 45,1%. <\/p>\n\n\n\n

Com a evolu\u00e7\u00e3o dos dados m\u00f3veis, e o consequente uso da rede 5G, esse \u00edndice tende a crescer ainda mais. Mas o que o Responsive Design tem a ver com isso? Tudo! <\/p>\n\n\n\n

Afinal de contas, os desenvolvedores Front-end e designers UX\/UI<\/a> t\u00eam que se preocupar cada vez mais com a oferta de design responsivo nas suas aplica\u00e7\u00f5es visando proporcionar uma excelente experi\u00eancia a todos aqueles que se conectam via celular ou TV Smart, por exemplo.<\/p>\n\n\n\n

Dicas para deixar o site responsivo <\/h2>\n\n\n\n