Le personnel signale que le positionnement est ambigu

Je commence tout juste à utiliser les avis du personnel, mais j’ai réalisé qu’ils sont confus quant au message auquel ils se réfèrent. Je pense qu’il est très difficile de dire s’il se rapporte au message au-dessus ou en dessous.

Ne serait-il pas plus logique de le placer sous le séparateur qui sépare les messages comme celui-ci ?

3 « J'aime »

Je pense que cela est dû en partie au thème que vous utilisez ? Les coins arrondis en bas de l’avis donnent l’impression qu’il est détaché du message ci-dessous. Je pense qu’il rend mieux ici sur Meta avec le thème par défaut ? (J’ai ajouté quelques avis à ce sujet à titre d’exemple)

3 « J'aime »

Merci David, mais j’ai essayé sans thème et ce n’est toujours pas clair. Les exemples que vous avez mis ici sont évidents car l’un est le premier message et l’autre a la carte du sujet qui le sépare, une fois que vous dépassez, il n’y a aucun moyen de savoir dans quelle direction il va si vous n’êtes pas familier avec. Essayez ceci, supprimez ces notifications, répondez-moi ici et ajoutez une notification à ma réponse.

Je veux participer :slight_smile:

edit : Cela me semble correct

2 « J'aime »

Si quoi que ce soit, le rembourrage est un peu trop petit :
image

Si vous retirez la notification au-dessus du message de David, je pense qu’il est très facile de confondre à quel message il se réfère. J’ai montré cette fonctionnalité à mes modérateurs aujourd’hui et leur réaction immédiate a été qu’elle n’est pas du tout claire.

2 « J'aime »

(Je suis tombé sur ce vieux message en revisitant une confusion sur les autres avis du personnel…\n\nJ’ai toujours pensé que le placement des avis du personnel était potentiellement ambigu. Comme les thèmes peuvent gérer différemment les couleurs, les bordures et les séparateurs, il est probablement difficile de résoudre le problème de cette façon.\n\nUne alternative qui peut être appliquée globalement à tous les avis de publication aujourd’hui est un CSS personnalisé pour insérer une flèche Unicode, soit avant l’avatar :\n\nimage\n\n\n[details="CSS : avant l’avatar"]\n\n\n.post-notice::before {\n content: '🡇';\n}\n\n\n(Ou peut-être plus correctement) :\n\n.post-notice::before {\n content: \" \\1F847\";\n}\n[/details]\n\n\n\n\n...ou avant le contenu textuel :\n\n![image|343x49](upload://32gz91HvreyaKmmBXR2u0Hubnr4.png)\n\n\n[details=\"CSS : avant le texte\"]\n\n.post-notice p::before {\n content: " \1F847";\n margin-right: .5rem;\n}\n\n[/details]\n\n\nOoo — voici une astuce pour changer la couleur :\n\n![image|326x54](upload://j6383trCHFoWBxS7Hbq8NMOMdDy.png)\n\n\n[details=\"CSS : changer la couleur\"]\n\n.post-notice p::before {\n content: " \1F847\fe0e";\n color: yellow;\n margin-right: .5rem;\n}\n\n\n(L'ajout de `\\fe0e` à n'importe quel caractère Unicode rend une version texte qui accepte la couleur. [Référence](https://stackoverflow.com/a/73570152/16269530).)\n\n[/details]\n\n\nEt j'ai décidé que la flèche vers le bas ne convient pas pour un avis sur le sujet principal, car elle mène plus évidemment le sujet. Ce CSS remplace la flèche par un point juste pour le premier message :\n\n![image|364x51](upload://grMesfRl9eVxBlAg8VF4SXU04sB.png)\n\n\n[details=\"CSS : différent pour le sujet principal\"]\n\n#post_1 .post-notice p::before {\n content: " \29BF\fe0e";\n color: yellow;\n margin-right: .5rem;\n}\n```\n[/details]

1 « J'aime »

Excellente idée Todd ! Je suis content de ne pas être le seul fou :wink:

J’ai eu quelques problèmes avec l’affichage de cette flèche vers le bas, je l’ai donc légèrement modifiée, l’ai aussi un peu nettoyée et j’ai opté pour la couleur tertiaire pour la compatibilité avec le thème.

.post-notice p::before {
  content: "\2B07\FE0E";
  color: var(--tertiary);
  margin-right: .5rem;
}

#post_1 .post-notice p::before {
  content: "\29BF\FE0E";
}
2 « J'aime »

Parce que les messages sont classés dans un sujet et lorsque je fais défiler, il me semble naturel et logique de m’attendre à ce que cela fasse référence au message ci-dessous. la flèche est une belle touche et une bonne solution pour plus d’indication. Vous pouvez également utiliser une référence dans la notification du personnel. :slight_smile:

3 « J'aime »

[citation=“Lilly, post:9, topic:258815”]
puisque les messages sont affichés par ordre du plus récent en haut, l’avis du personnel fait référence au message en dessous.
[/citation]
Sans vouloir vous offenser, cela ressemble à un “Je le sais et j’y suis habitué, donc cela me semble évident”. Je dirais que l’avis du personnel ne peut évidemment être mis en place qu’APRÈS la publication du message. Il semble donc naturel de s’attendre à ce que l’avis du personnel soit après, si les choses se passent “dans l’ordre”.

Personnellement, je pense que @davidkingham a tout à fait raison : c’est ambigu. Il serait préférable que cela apparaisse plus clairement à première vue. Ce qui n’est pas vraiment le cas ici (si on le souhaite en haut des messages, l’avis du personnel sous le nom de l’auteur le rendrait plus clair, par exemple. Cela peut être techniquement plus compliqué, ou désapprouvé pour d’autres raisons).

Pour certains thèmes (comme le thème Meta Branded que j’utilise en ce moment), la note du personnel se trouve sous la ligne qui sépare les messages, il est donc clair à quoi la note se réfère.
Peut-être que d’autres thèmes pourraient adopter cela également ?

1 « J'aime »

cela pourrait très bien être le cas. :thinking:

Je pense que ce que j’essayais de dire (mais mal) c’est qu’il semble logique que lorsque je fais défiler un sujet, il fasse référence au message ci-dessous, malgré l’ordre chronologique logique des messages.

1 « J'aime »

Pourquoi le premier avis du personnel n’a-t-il pas de ligne, contrairement aux autres ?

Personnellement, je n’utilise pas les avis du personnel car le problème abordé ici. J’ai essayé de donner plus de visibilité, mais le déplacement vers la droite est probablement nécessaire.

Salut, comment puis-je afficher les avis du personnel sous la publication au lieu de dessus ?

Excusez-moi, y a-t-il un moyen en CSS ?

1 « J'aime »

Je pense personnellement qu’il serait plus logique de placer les avis APRÈS le message. Je n’ai pas encore trouvé de moyen simple de les déplacer là-bas, et comme solution temporaire, j’ai ajouté ce style CSS :

.post-notice.custom {
    background: linear-gradient(to bottom, rgb(255 0 5) 0%, rgba(255, 137, 139, 0.2) 2%, rgba(255, 137, 139, 0) 70%);
}

maintenant, les avis ressemblent à ceci :

Grâce à la direction du dégradé, il devient intuitivement clair où se trouve sa « continuation logique ».
Notez que j’ai utilisé une règle avec la classe .custom, car cette classe ne s’applique pas aux avis automatiques, qui sont créés par exemple lorsqu’un utilisateur a écrit son premier message ou a écrit après une longue période. Pour de tels cas, nous pouvons utiliser d’autres couleurs de dégradé.

Soit dit en passant, j’aimerais savoir s’il existe un moyen de voir quelles autres classes peuvent exister pour les avis et si la classe .custom s’applique uniquement aux avis du personnel ou ailleurs ?

1 « J'aime »