targetBlank
Skript, pomocou ktorého sa automaticky pridáva ikonka na otvorenie nového okna u odkazov, ktoré smerujú na externé stránky.
o čo vlastne ide?
Kedysi dávno, kedy vody WWW brázdili predpotopné obludy typu IE3 a NN4, sa zaviedol taký zaujímavý zvyk – otvárať odkazy do nového okna pomocou atribútu target="_blank". Bolo to veľmi praktické a užitočné a vôbec proti tomu nikto nič nemal. Neskôr sa táto technika zapáčila aj ľuďom od marketingu, pretože vďaka tomu bola menšia pravdepodobnosť, že návštevník nedopatrením odíde z ich stránky. A trvá to dodnes.
Lenže dni sa menia (zajtra dovidenia) a v súčasnosti máme k dispozícii vyspelé browsery, ktoré podporujú tabed browsing a podobne. Užívatelia sú tiež vyspelejší a väčšina z nich už vie, ako sa používa stredné tlačítko alebo tlačítko CTRL. A preto otváranie odkazov do nového okna môže narobiť viac škody než úžitku. Ako z toho von?
Bavil som sa o tom s kolegami a došli sme k dvom možným postupom:
- Pri prvej návšteve sa opýtať, kam chce návštevník otvárať odkazy vedúce na externé weby, zapamätať si jeho voľbu v cookies a podľa toho sa riadiť. Lenže... platnosť cookie jedného dňa vyprší a užívateľ môže zmeniť názor. Mne osobne sa tento prístup veľmi nepáči.
- Dať návštevníkovi možnosť takéto odkazy otvoriť tak aj onak. Za odkaz jednoducho pridať ikonku (alebo krátku textovú správu), ktorá otvorí nové okno, pričom kliknutie na pôvodný odkaz ostane nezmenený. A práve o tom tento skript je.
výhody
Myslím, že tých výhod je niekoľko.
- V prvom rade, užívateľ sa môže kedykoľvek rozhodnúť ako si ktorý odkaz otvorí, nemusí nič prepínať.
- V druhom rade sú odkazy na externé weby vizuálne označené, čo je často tiež žiadúce.
nevýhody
- Niekto by za nevýhodu mohol považovať fakt, že nefunguje v browseroch, ktoré nepodporujú štandardy. Mne osobne to ako nevýhoda nepripadá.
- Problémy môžu nastať v prípade, ak sú na webe používané nejaké komplikované odkazy, ktoré by mohli skript zmiasť. Napríklad nadmerné otváranie popup okien a pod.
použitie
Je to jednoduché. Budeš potrebovať samotný skript, ktorý v hlavičke prilinkuješ.
<script type="text/javascript" src="target_blank.js"></script>
Potom ho stači zinicializovať (toto je asi vhodné urobiť pri zavedení dokumentu, t.j. pri onLoad). Inicializovať ho môžeš bez parametrov (v tom prípade budú použité defaultné parametre), alebo si môžeš nastaviť vlastný obrázok či alternatívne texty.
targetBlank.init() targetBlank.init(idElementu, cestaKObrazku, alternativnyTextObrazku, titulokOdkazu)
Ak nejaký atribút nechceš uviesť, stačí ho nahradiť hodnotu false.
praktický príklad
Kliknutím na tieto odkazy zinicializuješ skript s danými parametrami. V praxi však asi budeš skript volať automaticky (napr. pomocou event attacheru) pri zavedení dokumentu a s defaultnými atribútmi.
- inicializuj na celý dokument
- inicializuj iba na obsahovú časť
- inicializuj s vlastným textom a bez obrázku
Prosím, neupozorňujte ma na to, že keď na tieto odkazy kliknete viac krát, že sa tam nahromadí viac ikon. Uvedomte si, že tento skript je primárne určený na to, aby sa zinicializoval pri onLoad-e a nie na to, aby si ho užívateľ inicializoval desať krát dookola. Ďakujem.
Ukážkové odkazy v obsahovej časti:
- hash (vnútorný odkaz na stránke)
- relatívny odkaz na rovnakej doméne
- absolútny odkaz na rovnakej doméne
- kotva (nikam sa neodkazuje)
- jednoduchý odkaz na cudziu doménu
- zložitejší odkaz na cudziu doménu
kompatibilita
Skript by mal bez problémov fungovať vo všetkých prehliadačoch, ktoré podporujú štandardy. Otestovaný a funkčný je pod IE6, Mozillou a Operou. V starších prehliadačoch by mal plynule degradovať.
Budem rád, ak ma poinforujete o testoch v ďalších prehliadačoch, hlavne na Macu a pod Linuxom.
Súbory na stiahnutie
| Názov | Typ | Veľkosť | |
|---|---|---|---|
 |
images | adresár | |
 |
target_blank.js | JavaScript | 4.73 KB |