Solucionado
Essas duas classes deixa a imagem com o mesmo tamanho, mais semanticamente qual telas utilizar, e porque?
.website-imagem {
max-width: 176px;
color: black;
}
.website-imagem {
max-width: 11em;
color: black;
}
hoje, com a Alura e o Google Gemini
Na realidade, não existe um certo ou errado com px e em. Ambos estão certos. Agora, cada caso é um caso, e é as vezes melhor usar um ao invés do outro.
Com px temos uma informação exata que, por si só, é imutável. A largura é 176 e sempre será 176. Já em não é uma unidade absoluta. A unidade em é relativa ao tamanho da fonte daquela div. Ou seja, você está informando que quer que a largura máxima seja onze vezes o tamanho da fonte.
Por padrão, quando não informamos um tamanho de fonte, a div interpreta que 1em tem o valor de 16px. 11 x 16, você tem o valor de 176px ("mascarados" como 11em) como largura máxima. Experimente mudar o tamanho da font-size no seu .website-imagem para ver as alterações na largura.
Utilizar px, em ou % vai depender de como você quer desenvolver seu site e como pretende dar manutenção. Com "em", alterar o valor do font-size pode facilitar manutenção e ajustes, mas também pode ter consequências catastróficas, dependendo dos lugares afetados.
Recomendo você dar uma olhada no curso de Web Design Responsivo, que trás mais informações sobre as unidades de medida e como utilizá-las pra desenvolver um site responsivo. Em especial, a aula Mais Design Fluído.