É possível adicionar imagens via o html e via CSS também, mas qual é o mais adequado ? É situacional ? Estou com essa duvida com a pagina que estou montando.
É possível adicionar imagens via o html e via CSS também, mas qual é o mais adequado ? É situacional ? Estou com essa duvida com a pagina que estou montando.
Oi Gabriel!
Geralmente só adicionamos imagens pelo CSS (com background
ou background-image
) quando seu significado é mais relacionado com o design ou quando seu conteúdo não é importante para o conteúdo da página.
Por exemplo, na página inicial da Alura, temos a seguinte seção de header:
A imagem à direita é importante para deixar o design mais bonito, entretanto seu conteúdo não é relevante pra página. Ou seja, se ela fosse removida o design poderia ser prejudicado, mas o entendimento do conteúdo continuaria o mesmo.
Por esse motivo essa imagem foi colocada em um pseudo elemento ::after
como background-image
.
Mais abaixo temos uma seção sobre empresas que já contam com a gente:
Neste caso, o conteúdo de cada imagem (o logo de cada empresa) é importante para o entendimento da seção. Sendo assim, as imagens foram inseridas pelo HTML.
Então na sua página você precisa fazer a seguinte reflexão: essa imagem é relevante para o conteúdo da página? Se sim, coloque ela dentro do HTML. Se o propósito da imagem for apenas de design, coloque ela no CSS.
Espero ter ajudado! Qualquer outra dúvida pode postar aqui! :)
Que explicação fenomenal. Muito obrigado, de verdade!!