Gap

Olá Rodrigo!

O uso de pixels é comum quando se deseja um valor fixo e preciso, independente do tamanho da tela.

Por exemplo, se a Rafa queria que o gap tivesse sempre exatamente 82 pixels, independentemente do tamanho da tela do dispositivo, ela optou por utilizar essa medida. Isso pode ser útil em casos em que se deseja manter um espaçamento específico entre elementos, independentemente do tamanho da tela.

Já o uso de "rem" ou "%" seria mais adequado quando se deseja um valor relativo ao tamanho da fonte ou ao tamanho do elemento pai, respectivamente. No caso do gap, se a intenção era ter um espaçamento proporcional ao tamanho da tela ou ao tamanho de algum outro elemento, essas medidas poderiam ser mais apropriadas.

No entanto, é importante lembrar que a escolha da medida depende do contexto e dos objetivos do projeto. Cada medida tem suas vantagens e desvantagens, e cabe ao desenvolvedor decidir qual é a mais adequada para cada situação.

Espero ter ajudado, qualquer dúvida, me coloco à disposição! Bons estudos!

Sucesso ✨

Um grande abraço e até mais!

Mas nesse caso, já que todo texto e todos elementos estão se ajustando proporcionalmente ao tipo de dispositivo, não seria mais adequadro todo resto acompanhar a proporção? Deixar algo com valor fixo não pode gerar um interface desajustada?

Oi Rodrigo, blz?

A abordagem de usar unidades proporcionais, como porcentagem (%), em media queries e no dimensionamento de elementos, é realmente importante para permitir que o conteúdo se ajuste adequadamente a diferentes tamanhos de tela. Com a variedade de dispositivos utilizados atualmente, é fundamental garantir que a interface seja flexível o suficiente para proporcionar uma boa experiência em todos eles.

Embora o uso exclusivo de unidades proporcionais seja considerado uma prática recomendada, é importante reconhecer que o uso de valores fixos em pixels (px) também tem sua relevância. Embora possa não ser a melhor prática em todos os casos, o uso de valores fixos em pixels pode ser útil em certas situações.

Por exemplo, ao definir o tamanho de elementos como caixas de texto, botões ou imagens, o uso de valores fixos em pixels pode garantir uma consistência visual e uma experiência de usuário satisfatória. Se todos os elementos fossem dimensionados apenas de forma proporcional, correríamos o risco de ter elementos muito pequenos ou grandes demais, comprometendo a legibilidade e usabilidade.

Portanto, é importante encontrar um equilíbrio entre a flexibilidade oferecida pelas unidades proporcionais e a consistência visual proporcionada pelos valores fixos em pixels. Cada unidade de medida tem sua utilidade e deve ser considerada com base nas necessidades do design e na melhor experiência do usuário.

No exemplo que você mencionou sobre a Rafa, o uso de valores fixos em pixels para criar espaços entre os elementos se mostrou consistente e eficaz. Porém, é importante destacar que unidades como porcentagem (%), 'rem' podem ser utilizadas com sucesso em diferentes situações como foi utilizado na maior parte das class.

Espero ter ajudado Rodrigo, um grande abraço e até mais!

Sua explicação já deu uma melhorada no entendimento, acerca disso, existe uma norma para questões que deveriam ficar em pixel( por exemplo o gap)? Se puder me ajudar também com outra questão, gostaria de saber sobre uma outra abordagem que vi na internet sobre o media, em que na tag o desenvolvedor também preenche o media, com "print", entre outros para cada título de style css. Isso caiu em desuso ou devo usar em uma situação específica?

Outra dúvida que me ocorreu agora, se eu tenho o header e dentro dele apenas o <nav>, por que adicionar uma classe que dê um gap apenas no nav e não no próprio header? Estar dentro do header não faria que todos "filhos" dentro do header tivessem o gap?

Opa Rodrigo, tudo certo contigo?

Vou responder em partes

Quanto a primeira pergunta no que diz respeito às normas para questões que devem ficar em pixels, como o "gap" (espaçamento), não existe uma regra rígida e universalmente aceita isso pode variar muito, dei alguns exemplos como de botõe, caixa de texto que às vezes e a depender do design e do front é necessário medidas fixas, mas não é uma regra. Portanto, é importante considerar a responsividade e a adaptabilidade do layout ao escolher valores em pixels.

A segunda pergunta da sua terceira inteiração, sobre a abordagem que envolve preencher a propriedade "media" com "print" ou outros valores para cada título de estilo CSS, essa prática não é amplamente adotada e pode não ser necessária em muitos casos, já que seu uso é "ativado" quando há uma visualização ou a própria impressão, acredito que cada dia mais vamos ter um certo desuso, mas é valido, sim, aprender sobre, e é claro alguns sites podem, sim, ser necessários o uso do mesmo, mas em grande maioria acredito que não.

Em ralação a sua última dúvida, não necessariamente, pois pense em uma fileira de carros, quero aumentar os espaços dentre esses carros, para ajudar esses carros a saírem da vaga, exemplo, se eu dar um "gap" em 1 carro, ele não se move pois ele precisa de outro carro para ser dado o espaçamento se ele não tem outro veículo para se afastar ele permanece no lugar afinal a ideia do gap é espaçamento entre os elementos(filhos desse elemento) ou mais mais de um e não 1 filho, é necessário ter essa visão sobre o gap, pois ele é um respiro(espaçamento) entre os seus filhos e nesse caso não se aplica ao seus netos.

Espero ter ajudado a esclarecer suas dúvidas, um grande abraço e até mais!

Entendi, mas ainda estou encucado com uma das dúvida que lhe propus, botando em um exemplo prático, em que eu programo no meu computador e mando para um comerciante ver no seu celular, imaginando (em uma situação completamente hipotética) que eu coloque o gap entre as imagens, para ser 82 px horizontal e vertical, caso o cidadão tenha um celular com 50pixel no eixo x e + 50 no y, possivelmente ele veria somente o fundo da página. Seria essa a ideia que tenho na cabeça, mesmo que a situação seja exagerada e irreal, mas que talvez em um contexto diferente poderia causar algum prejuízo.

Oi Rodrigo!

Na situação mencionada, realmente não é apropriado utilizar medidas fixas. É importante calcular onde nosso produto se encaixará e as medidas responsivas são ideais para atender a uma ampla variedade de dispositivos. Utilizar uma medida fixa de 82 pixels de espaçamento, como no exemplo citado, seria muito difícil mesmo, no caso significaria deixar de atender esse cliente. No entanto, em certos projetos feitos para dispositivos móveis, a maioria dos celulares possui telas com mais de 5 polegadas, então um espaçamento de 82 px seria considerável. Porém, se o projeto for desenvolvido para um smartwatch, é necessário repensar as medidas, pois se for um aplicativo de medição cardíaca, por exemplo, qualquer coisa que use 82px seria um espaço exagerado. No caso de um portfólio, que será dificilmente visto em um relógio, a medida em pixels é válida. Embora o uso de medidas fixas seja menos comum, como mencionei anteriormente, elas ainda existem e são utilizadas em alguns casos específicos.

Em resumo Rodrigo, é importante destacar que px não deve ser usado como substituto de "%" ou "rem", mas sim em situações em que sua utilização seja mais adequada ou vantajosa, no caso do portifólio o uso de % também, poderia ser utilizado assim como o px, dando valores corretos teríamos um resultado satisfatório, mas no caso de certos dispositivos aí, sim, o uso de px ou pela quantidade de pixeis imposta pode de fato quebrar o projeto.

Espero esclarecer mais um pouco, lhe desejo sucesso nos seus projetos e na sua carreira, abraços!