New developers are often confused at seeing multiple elements that produce similar results. <em> e <i> são um exemplo comum, uma vez que ambos italicizam o texto. Qual é a diferença? Qual deve usar?
por padrão, o resultado visual é o mesmo. No entanto, o significado semântico é diferente. O elemento <em> representa ênfase de estresse de seu conteúdo, enquanto o elemento <i> representa texto que é retirado da prosa normal, tal palavra estrangeira, pensamentos de personagem fictícios, ou quando o texto se refere à definição de uma palavra em vez de representar seu significado semântico. (O título de uma obra, como o nome de um livro ou filme, deve usar <cite>.)
isto significa que o direito de usar depende da situação. Nem é para fins puramente decorativos, é para isso que serve o estilo CSS.
um exemplo para <em> pode ser: “Basta fazê-lo já!”, ou: “Tínhamos de fazer alguma coisa”. Uma pessoa ou software que lê o texto pronunciaria as palavras em itálico com ênfase, usando stress verbal.
um exemplo para <i> poderia ser:”a Rainha Maria navegou ontem à noite”. Aqui, não há maior ênfase ou importância na palavra “Rainha Maria”. É apenas indicado que o objeto em questão não é uma rainha chamada Maria, mas um navio chamado Rainha Maria. Outro exemplo para <i> poderia ser: “a palavra o é um artigo”.