it-swarm.com.de

Wie kann man anzeigen, dass ein Bild auch ein Link ist?

Ich habe einen Abschnitt auf meiner Website mit dem Namen "Techonology", der nicht Teil des Hauptinhalts ist, in dem ich die Logos jeder auf der Website verwendeten Technologie (PHP, MySQL, Bootstrap usw.) platziere. Aber ich suche nach einer Möglichkeit, den Benutzer darauf hinzuweisen, dass Bilder auch Links sind.

Gibt es eine Technik, die anzeigt, dass ein Bild eine Verknüpfung ist, wenn dies nicht zu offensichtlich sein kann?

14
Renato Dinhani

Es gibt einige gängige Praktiken zu beachten:

  1. Lassen Sie das Bild knopfartig erscheinen, indem Sie es mit Schlagschatten erhabener erscheinen lassen. Dies bedeutet, dass die Taste gedrückt werden kann.
  2. Alternativ können Sie den Schaltflächeneffekt erstellen, indem Sie das Bild in einen Rahmen einrahmen (dies kann ästhetisch schwer zu erreichen sein).
  3. Stellen Sie sicher, dass das Bild einen Schwebezustand hat, der impliziert, dass mit ihm interagiert werden kann. Wenn Sie es weiter von der Seite entfernen oder den Rand auftragen/einfärben, kann dies Wunder wirken.

Wichtig ist jedoch, dass klar ist, wann ein Bild ein Link ist und nicht. Wenn Benutzer bis zum Klicken keine Unterschiede zwischen statischen und interaktiven Elementen feststellen können, führen Sie zu Verwirrung und Frustration - und verhindern, dass Benutzer in Zukunft klicken.

13

Wenn Sie wie in Ihrer Frage einen MySQL-Link mit dem MySQL-Logo haben möchten, könnten Sie schlechter abschneiden als das, was Stack Overflow mit seinem Anmeldebildschirm macht:

enter image description here

6
icc97

Je nach Kontext würde ich mir keine Sorgen um eine visuelle Unterscheidung machen. Wie bereits erwähnt, ist die Zustandsänderung der Maus die beste Anzeige.

In vielen Benutzertests stelle ich fest, wie sie nach der kleinen Hand suchen, und sie müssen nicht einmal auf das Element klicken. Noch weniger technische Benutzer unterscheiden zwischen anklickbaren und nicht anklickbaren Elementen, weil sie unbewusst eine kleine Hand bemerken, die angezeigt wird, wenn sie über einen Link schweben.

2
tripelle

Ein Ansatz für dieses Problem könnte darin bestehen, zu überlegen, was ein Element als "anklickbar" erscheinen lässt. Text? Unterstreichen/Rand? Hover-Effekte? Farben? Tabs? Erhöhte Erscheinung mit Schatten? Ein Text, der darauf verweist und "KLICK!" Sagt? Isolation/Abstand?

Hier sind einige Möglichkeiten, wie andere es tun:

http://v5design.com/

http://erichoffman.me/

2
Gbert90

Beispielsweise sind Links auf Ihrer Website blau und wurden beim Bewegen des Mauszeigers rot. Um zu zeigen, dass Bilder auch Links sind, sollten Sie ihnen einen blauen Rand mit wenigen Pixel Abstand geben. Wenn der Benutzer mit dem Mauszeiger über das Bild fährt, wird anstelle des Pfeilcursors die Hand angezeigt, und der Rand sollte in Rot geändert werden (wie in Links), um anzuzeigen, dass das Bild auch ein Link ist.

1
webvitaly