tamaño - ¿El significado de la etiqueta HTML fieldset tiene un significado que va más allá de la agrupación de formularios?

para que se utiliza la etiqueta fieldset en html

Question

Por lo general, lo he visto con formularios, pero he encontrado que es útil agrupar conjuntos de datos relacionados (por ejemplo, cuando tienes varias tablas en una página, usando un conjunto de campos alrededor de cada tabla o grupo de tablas relacionadas para definir un significado visible y un nombre de grupo (leyenda)). ¿Está abusando de la etiqueta fieldset al punto donde, en mis usos, ya no tiene significado semántico?

Answer 1

El bit de "campo" en el fieldset nombre se refiere a los campos <form> .

El uso de fieldset fuera del form s para agrupar datos aribtrary es claramente un uso indebido semántico.

Sin embargo, su HTML validará y Dios no matará a un gatito.

Answer 2

La etiqueta de campo también es útil para lectores de pantalla y algunas otras tecnologías de asistencia.

Answer 3

Si desea agrupar tablas, considere usar un elemento de encabezado apropiado (h1-h6) para cada grupo. Las tablas individuales pueden describirse utilizando el elemento '' título ''. El atributo ''resumen'' también está disponible para cada tabla.

De la especificación:

Cada tabla puede tener un título asociado (ver el elemento CAPTION) que proporciona una breve descripción del propósito de la tabla. También se puede proporcionar una descripción más larga (a través del atributo de resumen) en beneficio de las personas que usan habla o agentes de usuario basados ​​en Braille.

Y para el registro, el elemento ''fieldset'' no está destinado a ser utilizado fuera de los formularios. Y dentro de los formularios, se pretende agrupar conceptualmente como campos de entrada: cosas como ''información personal'' o ''dirección de facturación'', etc.

Aquí hay un artículo interesante que trata sobre lo que los usuarios de lectores de pantalla escuchan cuando navegan por conjuntos de campo. http://www.rnib.org.uk/wacblog/articles/too-much-accessibility/too-much-accessibility-fieldset-legends/

Answer 4

fieldset trata del grupo de control de forma . Al agrupar los controles de formulario relacionados, los autores pueden dividir un formulario en partes más pequeñas y manejables, mejorando el desastre de usabilidad que puede surgir al confrontar a los usuarios con demasiados controles de forma.

Eso no significa que un fieldset siempre agrupe campos dentro de un formulario , aunque la especificación discuta fieldset solo dentro del contexto del usuario que interactúa con el formulario ...

Por lo tanto, el "abuso" puede provenir del hecho de que las especificaciones HTML 4 y XHTML no requieren que el campo y la leyenda estén contenidos dentro de los elementos del formulario. FIELDSET puede incluso ser el elemento secundario del elemento BODY. Es una sintaxis válida para colocar conjuntos de campos fuera de los formularios.

Pero, cuando describes algo como un fieldset que no es realmente un fieldset, simplemente causas confusión.

Lo mejor es pensar que las etiquetas HTML / XHTML describen el significado de un elemento en lugar de cómo se verá. Luego puede usar CSS para que el elemento se vea como usted lo desee.

Si agrupa los datos para fines de presentación, puede encontrar aquí una buena alternativa de CSS .

Para referencia:

.fieldset {
border-right: 1px solid #75736E;
border-bottom: 1px solid #75736E;
border-left: 1px solid #F2F0EE;
border-top: 1px solid #F2F0EE;
padding: 10px 3px 3px 3px;

}

.outer {
border-left: 1px solid #75736E;
border-top: 1px solid #75736E;
border-right: 1px solid #F2F0EE;
border-bottom: 1px solid #F2F0EE;
width: 200px; /* CHANGE THIS FOR BOX SIZE */
} 

.legend {
float: left;
margin-left: 15px;
margin-top: -8px;
padding-left: 5px;
padding-right: 5px;
font-weight: bold;
background: #FFF;
} 

<div class="legend">Lipsum.com Is The Best</div>
<div class="outer">
<div class="fieldset">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 
Donec congue fermentum metus. Quisque vel ante. 
Cras purus metus, dignissim at, luctus et, sollicitudin eget, urna. 
Maecenas eget lacus. Aenean bibendum risus non erat mattis semper. 
Aliquam placerat nibh eget lacus. Sed blandit eleifend justo. Nam elit. 
Fusce feugiat orci id eros facilisis laoreet. 
Integer vestibulum condimentum purus. 
Proin vehicula congue lacus. Quisque placerat diam nec enim. 
Nunc lorem. Maecenas nec sem sed nulla tristique faucibus.</div></div>

Answer 5

Creo que esto sería abuso. http://www.w3.org/TR/REC-html40/interact/forms.html#h-17.10 establece que "el elemento FIELDSET permite a los autores agrupar etiquetas y controles temáticamente relacionados".

Answer 6

Puedo ver las ventajas semánticas de bloquear el contenido en conjuntos de campo con leyendas.

Aunque el W3C asociaba el uso de conjuntos de campos y leyendas con formularios, permitir el uso fuera de la etiqueta del formulario abre nuevos límites a la experimentación. Potencialmente similar a la lista de definiciones en uso.

Personalmente, no creo que el "campo" en fieldset sea específico para el campo de formulario. Simplemente heredó la relación de su uso dentro de la etiqueta del formulario. campo es en referencia a la agrupación.

Imagina ir a tus parques y recreación locales para jugar softball con tus amigos. Hay 3 campos disponibles. Todos ellos tienen carteles en la valla "BÉISBOL SOLAMENTE"

¿Empacaste tu equipo y te vas a casa?

etiquetar el uso de conjuntos de campo y leyendas fuera del uso indebido de etiquetas de formulario es limitado.

En ningún lugar de la definición menciona formas:

El elemento FIELDSET permite a los autores agrupar etiquetas y controles relacionados temáticamente. Los controles de agrupamiento facilitan que los usuarios entiendan su propósito al mismo tiempo que facilitan la navegación de tabulación para agentes de usuario visuales y la navegación de voz para agentes de usuario orientados a voz. El uso adecuado de este elemento hace que los documentos sean más accesibles.

Considero que el control de formato de las etiquetas xhtml. div p blockquote etc.

<h1>The Big Book about Everything</h1>
<fieldset>
    <legend>Jokes</legend>
    <h2>30 pages of humorous Jokes</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Poems</legend>
    <h2>20 pages of well written poems</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Horror</legend>
    <h2>3 Short and scary stories</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>
<fieldset>
    <legend>Mystery</legend>
    <h2>3 Short and mysterious stories</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p>Cras nec diam eu lectus condimentum faucibus in et odio.</p>
</fieldset>