Categories: Compêndio HTMLtodas

Os elementos DEL e INS

Esta página integra o Compêndio sobre o uso dos elementos HTML e descreve os elementos:
DEL e INS

DEL é a abreviação para a palavra inglesa DELETE, consagrada na Internet no Brasil pelo verbo “DELETAR”, que traduzido significa: apagar, riscar, anular, cancelar.

O elemento HTML DEL destina-se a marcar conteúdos (em geral textos), que foram cancelados em um documento.

INS é a abreviação para a palavra inglesa INSERT, que traduzida significa: inserir, introduzir, intercalar.

O elemento HTML INS destina-se a marcar conteúdos (em geral textos), que foram inseridos em um documento.

Estes elementos são úteis para marcar documentos que estão em fase de produção e normalmente são usados juntos, um complementando o outro.

Exemplo

Uma ótima exemplificação para seu emprego é na fase de desenvolvimento de documentos normativos onde novas versões são lançadas à medida que o trabalho evolui. Aí se prestam, a marcar as alterações feitas na versão anterior para a versão atual.

A marcação a seguir:


<p>
Testes em laboratório, usando equipamento <del>mecânico</del> <ins>eletrônico</ins>, 
demonstraram a necessidade de adoção de um coeficiente de segurança 
<del>maior que 2 (dois)</del> <ins>igual a 2,13</ins>.
</p> 

Produz a seguinte renderização no navegador:

Testes em laboratório, usando equipamento mecânico eletrônico, demonstraram a necessidade de adoção de um coeficiente de segurança maior que 2 (dois) igual a 2,13.

Na frase acima a versão anterior das normas para determinação do coeficiente de segurança basearam-se em testes de laboratório usando equipamento que permitia ter uma noção da ordem de grandeza. Na versão atual, os testes foram realizados com equipamento mais sofisticado permitindo chegar a um valor mais confiável. Esta é a idéia geral destes elementos. Atualiza o documento, deixando à vista o que foi modificado.

Os navegadores devem renderizar estes elementos de forma diferenciada, de modo a deixar bem claro o que foi anulado e o que foi inserido. Em geral a forma adotada é a de colocar uma linha riscando o que foi anulado e sublinhar o que foi inserido.

Atributos

Estes elementos admitem os atributos ID, CLASS, LANG, TITLE, STYLE e os de eventos de mouse como onmouseover, além de CITE e DATETIME que veremos com detalhes a seguir.

O atributo CITE destina-se a fornecer o endereço para um documento contendo uma explicação detalhada sobre a alteração feita. O atributo DATETIME destina-se a marcar o dia e a hora que a alteração foi feita.
Veja o exemplo a seguir:


<p>
Testes em laboratório, usando equipamento 
<del datetime="2006-07-06T08:15:30-03:00">mecânico</del> 
<ins datetime="2006-07-06T08:15:30-03:00"
cite="http://www.endereco.com">eletrônico</ins>, 
demonstraram a necessidade de adoção de um ...
</p> 

No exemplo acima constatamos que a alteração foi feita no dia 06 de julho de 2006 às 8horas 15minutos e 30segundos em um local cuja zona horária está atrasada de 3horas em relação ao horário GMT. O autor da alteração escreveu um documento detalhando as razões da alteração, documento este que se encontra em: http://www.endereco.com

Palavras finais

É perfeitamente válido e lícito, usar estes elementos em qualquer tipo de documento que você tenha publicado e que tenha feito uma alteração, independente de tratar-se de versões ou fase de produção. Se você julgar conveniente, deixar registrado uma alteração, sem retirar o que foi alterado, vá em frente, use estes elementos.

[ « anterior ]   [ index ]    [ próximo » ]

Maujor

Exerci o magistério paralelamente a minha carreira profissional por toda uma vida e ao longo destes trinta anos aprendi tanto quanto ensinei. Sou um apaixonado por Web Standards e desenvolvo o site de tutoriais CSS para Web Design.

View Comments

  • Cara, muito bom. Nunca havia utilizado essas tags. Bastante interessante conhecer suas funcionalidades.

    Parabéns mais uma vez.

    Abraço!

  • Oi Maurício!
    Nossa, fiquei sabendo por vc que fui uma das vencedoras do concurso da Veerle! Que legal né? Sortuda eu! ;-)

    Obrigada pela dica! Na realidade esse é um dilema que eu tenho, pq não tenho muitos posts, então vivo mudando, coloco pra aparecerem 20, 5, 10…mas como vc é o famoso cara do CSS (já tinha visto seu site!), sua dica é uma ordem! rsss…coloquei 5 só…agora tá rápido? Acho que ficou melhor né?

    Tô estudando CSS por hobby pq amo web design…suas dicas no futuro serão valiosas! Qd eu estiver craque, vou fazer um novo blog, usando a minha nova licença Expression Engine e meus novos conhecimentos de CSS! ;-)

  • Cara, muito perfeito,
    com certeza deconhecia o que foi abordado no post, porém mais uma vez... minutos de leitura para anos de aprendizado ;_)

  • Show de bola,
    Eu pensava que era feito de outra forma, agora ficou bem claro como ultilizar.

    Valeu.

  • Legal, volta e meia via o textos com aquele risco e não sabia o que eram, agora sei :-)

  • Muito legal.
    Ótimo termos artigos deste nível, dando maiores detalhes sobre alguns elementos HTML pouco utilizados.

    Parabéns!

  • Ótima matéria. Acho muito bom saber todos os significados dos elementos e qual o uso certo de cada uma delas. Muito bons exemplos, parabéns!

Share
Published by
Maujor

Recent Posts

Teste seu conhecimento #20

Em 2006 comecei a publicar nesse blog uma série de desafios CSS que consistiam em…

7 anos ago

Teste seu conhecimento #19

Há muito tempo que eu não publico um "Teste seu conhecimento". Esta semana, revendo algumas…

10 anos ago

JavaScript bubbling e capturing

Introdução Elementos da marcação HTML podem ser aninhados uns dentro de outros, criando-se uma cadeia…

10 anos ago

HTML5 – W3C versus WHATWG

HTML5? Web universal? É comum eu me deparar com dúvidas sobre a HTML5 não só…

10 anos ago

Seria esse o futuro das imagens responsivas?

Quem é Tab Atkins Jr? Tab Atkins Jr, um desenvolvedor americano, trabalhou durante muitos anos…

11 anos ago

BrazilJS Conf 2013

Pessoal, a BrazilJS Conf 2013 disponibilizou para o Maujor cupons de desconto para serem oferecidos…

11 anos ago