2010-02-18 5 views
4

Est-il autorisé de cacher quelque chose temporairement ou pour toujours en utilisant display:none? dans un site dynamique où de nombreux composants de la page proviennent de différents plugins etc et beaucoup de temps si le client ne veut rien sur la page, puis j'utilise dispaly:none pour cacher les choses de la page. Je ne supprime pas la chose de la source réelle parce que le client peut revenir demander à activer cette chose à nouveau. Alors, quels sont les avantages et les inconvénients de garder les choses cachées de l'affichage: aucun si je garde un élément cacher en utilisant Display:none pour toujours?Est-il possible de cacher des choses en utilisant display: none?

Y a-t-il des inconvénients en termes de référencement, de lecteur d'écran, d'accessibilité, etc.?

+0

Puis-je ajouter une note: cacher un élément avec 'display: none' cacher l'élément et ** le retirer ** de la mise en page, ce qui pourrait modifier le disposition. Masquer un élément avec 'visilbility: hidden' cachera ** l'élément dans la mise en page, comme si l'élément était toujours présent mais invisible. – Abboq

Répondre

4

Plus: Très facile à faire

Moins:

  • Vous chargez toujours les composants du côté serveur et le client les télécharger. Le navigateur ne les affichera simplement pas. Toute personne utilisant "view source" pourra voir les valeurs qui sont "cachées". Ne l'utilisez jamais pour cacher des informations sensibles.

Vous pouvez simplement « comment » ce côté serveur de section pour enregistrer beaucoup de traitement sur le serveur, bande passante, etc.

12

Si le client le souhaite supprimé, créez une sauvegarde de la page et publiez une page qui l'a réellement supprimée. Ne pas remplacer CSS pour effectivement en supprimant un élément. S'ils décident qu'ils le veulent à l'avenir, alors allez-y et échangez votre sauvegarde pour votre copie en direct. Si vous travaillez avec une sortie dynamique (dans le cas de PHP ou d'une technologie comparable), vous pouvez arrêter cette sortie particulière avec des commentaires afin qu'ils ne soient jamais inclus dans la réponse.

+1

Vous ne perdrez pas non plus de bande passante si vous faites cela. – David

+6

'créer une sauvegarde' Non non, mieux encore ** Utiliser le contrôle de la source !! ** – Earlz

+0

@ David/@ Earlz points positifs. – Sampson

1

Il est logique de cacher/montrer des choses avec 'display: none' lorsque vous faites du Ajax côté client. De cette façon, vous pouvez changer de vue/onglet sans faire l'aller-retour du serveur.

Il est nécessaire de supprimer réellement quelque chose du balisage de page quand il y a des implications de sécurité. Si un utilisateur n'a pas le droit de voir certaines informations sensibles, il ne devrait pas être là lorsqu'il clique sur "Afficher la source".

1

display: none est bon de cacher les choses que vous voulez voir lorsque les gens éteignent css ou utilisent des navigateurs qui ne supporte pas css.

2

Il est probablement utile de mentionner ici que certains moteurs de recherche (Google, par exemple) font faire le point sur le contenu caché.

Cacher d'énormes quantités de texte à l'aide de display:none; est l'une des choses que de nombreux moteurs de recherche considèrent comme du spam.

:)

0

En ce qui concerne l'accessibilité va, il y a une forte chance que quelque chose de caché avec "display: none;" NE sera PAS lu par un lecteur d'écran. Cela peut être acceptable si vous avez l'intention de le faire.

Une alternative possible à cacher le contenu pour les lecteurs d'écran/css-offres est d'utiliser uniquement cette classe:

.offscreen { 
    position: absolute; 
    left: -9000px; 
    width: 0; 
    overflow: hidden; 
} 

Et le code HTML suivant:

<h3 class="offscreen">Site Navigation</h3> 

Pour des informations complètes sur les techniques cacher : http://www.access-matters.com/2005/04/23/screen-reader-test-results/

Questions connexes