css - plugin - remove entry title wordpress

display: none vs visibility: oculto versus text-indent: 9999 ¿Cómo se comporta el lector de pantalla con cada uno?

Question

¿Cuál es la diferencia entre estos tres usuarios de lectores de pantalla?

Answer 1

Complete Answere está aquí para asegurarse de que Chrome no autoshow / autofill cuadros de entrada. En mi página web (Nuevo usuario), el campo del teléfono y el campo Contraseña se estaban cargando automáticamente con datos en caché. Para deshacerme de esto, creé dos campos ficticios y les di una clase que los hace invisibles para el usuario. Una función jquery para mostrar y luego ocultarlos después de una fracción.

Función Jquery para mostrar y ocultar:

$().ready(function() {
    $(".fake-autofill-fields").show();
    // some DOM manipulation/ajax here
    window.setTimeout(function () {
        $(".fake-autofill-fields").hide();
    }, 1000);
});

Clase:

.fake-autofill-fields
{ 

     border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; 
}

Campos de entrada:

<input style="display:none" type="text" class="fake-autofill-fields" name="fakeusernameremembered"/>
<input style="display:none" type="password" class="fake-autofill-fields" name="fakepasswordremembered"/>

Answer 2

Existen muchas técnicas para ocultar el contenido visualmente pero lo tienen disponible para lectores de pantalla.

La técnica H5BP funciona en FF, Webkit, Opera e IE6 +

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

Answer 3

Hay un muy buen resumen de cómo los lectores de pantalla interpretan estas propiedades en WebAIM .

En pocas palabras, visibility: hidden y display:none ocultará el texto de los lectores de pantalla como lo hace de los demás. Todos los otros métodos serán ''visibles'' para un lector de pantalla.

Answer 4

Hay una buena explicación sobre esto en A List Apart. http://www.alistapart.com/articles/fir/ Depende del producto.

PRODUCT DISPLAY: NONE VISIBILITY: HIDDEN Hal version 5.20 Does not read Reads IBM Home Page Reader 3.02 Does not read Does not read Jaws (4.02, 4.50, 5.0 beta) Reads Reads OutSpoken 9 Does not read Does not read Window-Eyes 4.2 Does not read Does not read

Answer 5

consulte: http://css-discuss.incutio.com/?page=ScreenreaderVisibility

pantalla: ninguna: no se verá ni escuchará. *
visibilidad: oculta: no se verá ni se escuchará. *
texto-sangría: 9999: no se verá pero se escuchará.

• La mayor parte del lector de pantalla no " mostrará " la pantalla: ninguno y la visibilidad: oculta , pero hay pocos lectores de pantalla como pwWebSpeak y HtReader que leerán incluso estos.