Alle Beiträge mit dem Schlagwort „externe Links”
11. Februar 2009 von Dieter | 18 Kommentare
Externe Links in neuem Fenster öffnen?
Ab heute werden hier externe Links W3C-konform im aktuellen Browser-Fenster geöffnet, also nicht mehr in einem neuen Fenster.
Warum?
- Zum einem weil ich meine Webseiten möglichst unter Beachtung von Webstandards erstellen und betreiben will.
- Zum anderen weil ich nun eine Lösung gefunden habe, den Besuchern dieser Webpräsenz als Alternative das Öffnen externer Links in einem neuen Fenster gut sichtbar anzubieten, also dem Besucher die Wahl überlasse.
Zwar kann der Nutzer auch über die rechte Maustaste einen Link in einem neuen Browser-Fenster beziehungsweise -Tab öffnen lassen. Dies ist jedoch vielen Nutzern nicht bekannt (siehe auch mein diesbezüglicher Kommentar zum Blogbeitrag “Plugin FV Code Highlighter“).
Nun hat er hier zudem die Möglichkeit oben in der rechten Spalte (Sidebar) die Checkbox “Externe Links in neuem Fenster?” durch einen Mausklick mit einem Haken zu versehen. Dadurch werden dann angeklickte externe Links in einem neuen Fenster geöffnet.
Auf dieses JavaScript bei Dr. Web bin ich über den Blogbeitrag “Externe Links in neuem Fenster öffnen” im Blog von Webdesign Weisshart gestoßen.
Und hier nun
- der in der Sidebar von mir eingebaute XHTML-Code,
1
2
3<form action="extern"> <label class="skip" for="linksnewwin">Auswahl: </label>
<p class="extern" title="Funktioniert nur mit aktiviertem JavaScript"><input id="linksnewwin" onclick="linkopener(this.checked)" type="checkbox" /> Externe Links in neuem Fenster?</p>
</form>
- das zugehörige JavaScript externe-links.js, das von meiner Website heruntergeladen werden kann,
- und ich grundsätzlich wie folgt in den Kopfbereich (Header) eingebunden habe, sowie
1<script src="http://www.webseiten-infos.de/externe-links.js" type="text/javascript"></script>
- die von mir verwendete CSS-Anweisung (nur der Vollständigkeit halber).
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18.skip, .hideme, .print {
position: absolute;
top: -1000em;
left: -1000em;
height: 1px;
width: 1px;
}
.skip:focus, .skip:active {
position: static;
top: 0;
left: 0;
height: auto;
width: auto;
}
.extern {
padding-bottom: 5px;
border-bottom: 1px #BFB49B dotted;
}
Ein ganz herzliches Dankeschön an
- Ute für die Diskussion, die letztendlich mich zur Suche nach dem Skript und dieser Änderung bewegte,
- Webdesign Weisshart für den Blogbeitrag “Externe Links in neuem Fenster öffnen” und
- Dr. Web für die Veröffentlichung des Skripts im Blogbeitrag “Im gleichen oder im neuen Fenster?”.
Bleibt das Manko, dass ich nicht programmieren kann. Gerne würde ich nämlich das JavaScript so ausbauen, dass dessen Aktivierung für die ganze Webpräsenz gelten würde und dann auf allen Seiten der Haken in der Checkbox aktiviert wäre.
Noch besser wäre meiner Meinung nach eine PHP-Lösung, weil diese dann auch bei fehlendem beziehungsweise deaktiviertem JavaScript funktionieren würde.
Nachtrag:
Das JavaScript habe ich zwischenzeitlich mit einem anderen JavaScript
- zwecks Verringerung der HTTP-Anfragen (HTTP-Requests) zusammengelegt,
- ist dort in der
letztenZeile 13 zu finden und - die zusätzliche Einbindung im Kopfbereich (Header) von externe-links.js konnte ich deshalb entfernen.
Nachtrag vom 23. Januar 2010:
Das JavaScript wurde von Fritz Weisshart dahingehend ergänzt, dass es für alle Seiten einer Website gilt (siehe hierzu den Blogbeitrag “Neues Fenster für alle Seiten?“).
Infos
Webseite veröffentlicht am Mittwoch, den 11. Februar 2009, um 23:17 Uhr, zuletzt geändert am
Donnerstag, den 25. November 2010, um 15:43 Uhr.
Kategorie: Webdesign
Schlagworte: Benutzerfreundlichkeit, externe Links, neues Fenster, W3C-konform, Webstandards, WordPress, Zugänglichkeit
1. Ute
Kommentar vom 13. Februar 2009 um 11:05
Danke.
Das ließe sich wohl am besten über Cookies lösen, vielleicht hilft der Hinweis darauf, mal nach was zu suchen, was das kann?!
2. Dieter
Kommentar vom 13. Februar 2009 um 11:29
Das habe ich mir auch schon gedacht.
Das Problem ist, dass ich von JavaScript keine Ahnung habe.
Und in meiner ToLearn-Liste stehen davor noch Grafikbearbeitung mit Fireworks und PHP.
3. Ute
Kommentar vom 13. Februar 2009 um 11:48
Ich finde es in diesem Fall auch nicht ganz so dringend. Denn meist sind Nutzer ohne JS, sowieso erfahrener, weil sie ja bereits den Knopf gefunden haben JS zu deaktivieren. Es dürfte dann kaum mal jemand treffen, die dadurch völlig irritiert sind…
Grafikbearbeitung ist sicher nicht schlecht, warum grad Fireworks? Ich nutze ja sowieso keine lizenzpflichtigen Programme, aber ich hatte bislang noch nie den Bedarf mehr als entweder Scribus (ist mir für Vektorgrafiken meist lieber als Inkscape, da es auch direkt als Layoutprogramm funktioniert) oder eben Gimp (für alles andere, wie Bildle bearbeiten und so) zu nutzen.
Oder ist Fireworks statt der einzelnen Photoshop und Illustrator gedacht?
Ein bisschen PHP ist gerade auch für WP und andere Systeme, die das einsetzen natürlich praktisch.
4. Dieter
Kommentar vom 13. Februar 2009 um 13:24
Gute Schlussfolgerung. Dann muss ich wenigstens meine ToLearn-Liste nicht umstellen.
Dafür gibt es einige Gründe. Die Wichtigsten sind:
1. Fireworks habe ich schon.
2. Fireworks beherrscht PNG 8 mit Alphatransparenz und das sieht dann auch noch halbwegs akzeptabel beim IE 6 aus.
3. Fireworks kann jpg-Dateien besonders gut komprimieren.
4. Fireworks beherrscht Vektor- und Pixelgrafiken. Ich muss dann nur die Bedienung eines Programms für beide Grafikarten lernen.
5. Ute
Kommentar vom 16. Februar 2009 um 12:28
Ok, das sehe ich ein.
Bilder für den IE6 werden hoffentlich täglich weniger nötig. Im Zweifel bekommt der von mir zur Zeit ein nicht so hübsches, aber akzeptables *.gif…
6. Dieter
Kommentar vom 16. Februar 2009 um 13:26
Ich befürchte der IE6 bleibt uns noch eine Zeit lang erhalten, auch wenn ich Anhänger der Initiative IE Death March (2009) bin.
Wenn es sich irgendwie vermeiden lässt, bekommt der IE 6 bei mir keine andere Grafikdatei. So habe ich den Beta-Button für IE 6 und kleiner einfach mit display:none ausgeblendet.
Gleichwohl bin ich an der Technik eigene Grafikdatei für den IE6 interessiert. Hast Du da einen Linktipp?
7. Dieter
Kommentar vom 16. Februar 2009 um 13:57
Nachtrag: Nach meiner chCounter-Statistik für diese Website, verwenden die meisten Nutzer des Internet Explorers (IE) immer noch den veralteten IE 6!
Hier zur Veranschaulichung mal die bisherige Verteilung im Februar.
IE 6: 45,16%
IE 7: 40,86%
IE 5.5: 9,68%
IE 5: 3,23%
IE 8: 1,08%
8. Ute
Kommentar vom 17. Februar 2009 um 17:07
Ich glaub ich steh auf der Leitung.
Technik?
Was du mit display:none machst, kannst du genausogut mit einem anderen Bild tun:
Du definierst irgendwo im CSS dein Bild für alle Browser. Der IE soll was anderes bekommen:
ie_stylesheet.css eingebunden mit Conditional Comments
Zum Beispiel anderes Hintergrundbild für den body:
body{
background:transparent url(/images/logos/bild_fuer_den_ie.gif) no-repeat left center;
}
Das ist alles, mehr ist da nicht dran.
Oder habe ich dich jetzt falsch verstanden?
Zur Statistik:
Es kommt darauf an über welche Seiten wir reden, auf manchen Kundenseiten habe ich auch noch hohe Zahlen mit alten IEs, allerdings nicht so heftig wie bei dir.
Auf miradlo bloggt allerdings:
IE 6 0,4%
IE 7 0,6%
Klar, wir haben sowieso selten mehr als 10% Windows-Nutzer…
9. Dieter
Kommentar vom 17. Februar 2009 um 17:19
Also hier habe ich aktuell 67,89% Windows-Nutzer und 27,42% Internet Explorer-Nutzer.
Führend ist mit 43,08% der Firefox, was für die Mehrheit der Besucher meiner Website spricht!
10. Dieter
Kommentar vom 17. Februar 2009 um 18:48
@Markus
Natürlich nicht!
Deswegen dürfen auch alle Besucher mit dem Internet Explorer Folgendes auf dieser Seite lesen:
“Diese Webseite sieht mit einem modernen Browser besser aus. Warum solltest Du und wie kannst Du wechseln?”
Kannst Du ja mal selbst testen, indem Du mit dem Internet Explorer bis einschließlich Version
76 diese Website aufsuchst.Darüber hinaus empfehle ich jedesmal, wenn ich über Sicherheitslücken im Internet Explorer berichte, auf einen modernen Browser zu wechseln.
Jepp! Auch diese Seite sieht im Internet Explorer nicht so gut aus, wie in modernen Browsern. Am Besten kommen die CSS3-Effekte einschließlich Schatteneffekt um manche Boxen beim Safari und Google Chrome wegen der WebKit-Engine zur Geltung. Aber mit dem Firefox 3.1, der ja in diesem Jahr veröffentlicht wird, sollte auch dieser den Schatteneffekt zeigen.
11. Markus
Kommentar vom 17. Februar 2009 um 17:52
Echt krass wie viele noch den IE6 verwenden, ist ja auch aus Sicherheitssicht nicht gerade empfehlenswert, oder?
Und wahrscheinlich sehen viele Seiten etwas komisch aus wenn das CSS mal wieder nicht richtig interpretiert wird…
12. Ute
Kommentar vom 17. Februar 2009 um 18:05
Ja, funktioniert bei mir problemlos.
Bei dir wär’s als größter Firefox-Fan ja auch besonders bitter, wenn er nicht führen würde. Hm, ob ich in Zukunft nur mit dem Konqui komme, ändert das die Statistik?
13. Dieter
Kommentar vom 17. Februar 2009 um 18:36
Bestimmt, aber ich denke nicht, dass Du alleine so den Firefox vom Thron stoßen kannst. Da musst Du schon auch immer mit dem Internet Explorer vorbeikommen.
14. Fritz
Kommentar vom 22. September 2009 um 11:38
“Gerne würde ich nämlich das JavaScript so ausbauen, dass dessen Aktivierung für die ganze Webpräsenz gelten würde und dann auf allen Seiten der Haken in der Checkbox aktiviert wäre.”
15. Dieter
Kommentar vom 22. September 2009 um 13:21
@Fritz
Wow!
Ein ganz, ganz großes Dankeschön.
Dein neuer Artikel liest sich gut.
Ich hoffe, ich bekomme es, obwohl ich nicht programmieren kann hin, zumal ich den JavaScript-Code auch noch in eine externe JavaScript-Datei ausgelagert habe.
Aber bekanntlich wächst man ja mit seinen Aufgaben.
16. Fritz
Kommentar vom 22. September 2009 um 13:50
Wozu gibt es copy & paste?
17. Dieter
Kommentar vom 22. September 2009 um 14:12
@Fritz
Werde ich auch wieder (!) machen.
Inzwischen gibt es auf Webseiten-Infos.de auch den Smooth Scrolling-Effekt von Deiner Seite.
18. Dieter
Kommentar vom 23. September 2009 um 16:04
Super! Copy & Paste hat funktioniert. Einen eigenen Blogbeitrag gibt es dazu mit dem Titel “Neues Fenster für alle Seiten?“.