Uso correto de BlockQuote, Q e CITE?

StackOverflow https://stackoverflow.com/questions/2205159

  •  18-09-2019
  •  | 
  •  

Pergunta

Este é o uso correto de Blockquote, q e cite?

<p>
<blockquote>Type HTML in the textarea above, <q>and it will magically appear</q> in the frame below.
</blockquote>
<cite><a href="http://stackoverflow.com">refrence url</a>
</p>

É o uso de Blockquote, q semanticamente correto? Ou ambos são elemento de apresentação, então não deve ser usado?

Foi útil?

Solução

Sim. Eles não são elementos de apresentação - blockquote representa uma citação de bloco, q representa uma citação em linha e cite representa uma referência a um nome, trabalho, padrão, URL, etc.

Você tem alguns erros de validação que são bastante comuns com o BlockQuote. Um elemento BlockQuote não pode estar dentro de um parágrafo e no HTML4 realmente precisa conter parágrafos. O ninho do p e blockquote Os elementos do seu fragmento precisam ser revertidos.

o blockquote elemento (também o q elemento) pode opcionalmente ter um cite atributo para especificar um URI de onde veio a citação. HTML5 diz agentes de usuário deve Disponibilize esse link para o usuário e o HTML4 não diz nada. Eu incluiria o URI tanto no cite atributo e como link embutido, pois os navegadores não lidam com isso.

Veja como eu escreveria esse fragmento, com essas revisões em mente:

<blockquote cite="http://stackoverflow.com">
  <p>Type HTML in the textarea above, <q>and it will magically
  appear</q> in the frame below.</p>
</blockquote>
<p>
  <cite><a href="http://stackoverflow.com">reference url</a></cite>
</p>

Validar este fragmento

Outras dicas

As outras respostas nesta página estão desatualizadas, mas a pergunta ainda é válida.

o q O elemento é um elemento embutido e deve ser usado como assim (ou seja, nenhum elemento de bloco dentro dele):

<p>
   In the words of <cite>Charles Bukowski</cite> -  
   <q>An intellectual says a simple thing in a hard way. 
   An artist says a hard thing in a simple way.</q>
</p>

Outro exemplo:

<p>
    <q>This is correct, said Hillary.</q> is a quote from the 
    popular daytime TV drama <cite>When Ian became Hillary</cite>.
</p>

o q elemento não deve ser colocado dentro de um blockquote elemento, como seria redundante - ambos denotam uma citação.

UMA blockquote é um elemento de bloco, permitindo que outros elementos do bloco sejam colocados dentro:

  <blockquote>
    <p>My favorite book is <cite>At Swim-Two-Birds</cite>.</p>
    - <cite>Mike Smith</cite>
  </blockquote>

<cite> é um pouco mais complicado. É um elemento embutido, mas depende de qual especificação HTML você está seguindo. o W3C afirma que pode conter um URL, um título de obra (por exemplo, título do livro, título de filme, etc.) ou o nome de um autor.

o Whatwg afirma que pode conter apenas um URL ou um título de obra, e assim não o nome de uma pessoa.

Este é um uso válido do WhatWG:

<figure>
 <blockquote>
  <p>The truth may be puzzling. It may take some work to grapple with.
  It may be counterintuitive. It may contradict deeply held
  prejudices. It may not be consonant with what we desperately want to
  be true. But our preferences do not determine what's true.</p>
 </blockquote>
 <figcaption>Carl Sagan, in "<cite>Wonder and Skepticism</cite>", from
 the <cite>Skeptical Inquirer</cite> Volume 19, Issue 1 (January-February
 1995)</figcaption>
</figure>

Você poderia considerar BLOCKQUOTE análogo a a DIV e Q semelhante a SPAN.

O uso recomendado é incluir grandes cotações em BLOCKQUOTE e pequenas citações de linha única ou frase em Q.

<blockquote>
    <p>This is a big quote.</p>
    <p>This is the second paragraph with a smaller <q>quote</q> inside</p>
</blockquote>

Cite é um atributo em um que apenas aponta para a fonte.

Usando atributos como o cite atributo do blockquote ou q Não o torna facilmente exibido (sem JS ou CSS complicado) e, portanto, não aborda o objetivo de exibir um link de referência facilmente. Agora está em conformidade incluir cite (e/ou footer) em blockquote Para especificar a fonte, textualmente através de um URL, da citação, como abaixo:

<blockquote>
  <p>Beware of bugs in the above code; I have only proved it correct, not tried it.” </p>
  <cite><a href="http://www-cs-faculty.stanford.edu/~uno/faq.html">Donald Knuth: Notes on the van Emde Boas construction of priority deques: An instructive use of recursion, March 29th, 1977</a>
</blockquote>

Observe que :

  • casos de cite que fazem parte do conteúdo da cotação (não a referência de origem) também são considerados bastante raros e devem ser manuseados através de uma classe diferenciadora sobre o relevante cite sugestão)

  • Em relação a q, de fato, tem como objetivo citar embutido, mas é mais provável que seja usado fora do BlockQuotes (citações em citações são bastante raras).

De acordo com isto, "cite" é um atributo de Q - e não é bem suportado nisso.

O uso semântico (e válido) do <cite> o elemento ainda está em debate mesmo que "No HTML5, o uso desse elemento para marcar o nome de uma pessoa não é mais considerado semanticamente apropriado".

Você encontrará um artigo muito detalhado e útil sobre "<blockquote>, <q> e <cite>" aqui:

http://html5doctor.com/blockquote-q-cite/

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top