Jakie wartości może mieć atrybut target?
Najczęściej występujące wartości atrybutu target to:
- `_blank` otwiera zawartość strony internetowej w nowym oknie lub nowej karcie.
- `_self` otwiera zawartość witryny w tym samym oknie (domyślnie).
- `_parent` powoduje, że zawartość witryny internetowej zostaje otwarta w nadrzędnym kontekście przeglądania. Stosowanie atrybutu `_parent` nie jest popularnym rozwiązaniem, ale nadal można go wykorzystywać wewnątrz tagów.
- `_top` otwiera zawartość strony internetowej w oknie głównym.
Możliwe jest również zastosowanie atrybutu nazwy ramki, który otwiera zawartość strony w ramce o danej nazwie.
Atrybuty target są zapisywane z podkreśleniem na początku (na przykład `target=”_blank”`), co wynika z określeń w walidatorze W3C, który zawiera luki w hipertekstowym języku znaczników.
Czym się różni atrybut blank od _blank?
Gdy do atrybutu target przypisana jest wartość „blank”, po kliknięciu otwiera się jedna nowa karta, na której otwierają się wszystkie kliknięte linki, nadpisując poprzednio otwarte strony. Istnieje jednak możliwość wykorzystania atrybutu „_blank”.
Atrybut „_blank” powoduje, że użytkownik zostaje przekierowany do dokumentu w nowej karcie lub oknie, a każdy kolejny link uruchamia się również w nowej karcie lub oknie.
Korzystanie z atrybutu target „_blank” jest zazwyczaj lepszym rozwiązaniem, ponieważ użytkownicy mają na widoku wszystkie włączone strony w różnych kartach. Warto do atrybutu „_blank” dodać atrybut rel=”noopener”, co pozwala zablokować ataki hakerów na użytkowników Twojej strony internetowej.
Atrybut target i otwieranie linku w nowym oknie
Twórcy stron internetowych często zastanawiają się, w którym oknie przeglądarki powinien otworzyć się dokument, do którego prowadzi link. Domyślnie otwiera się on w aktualnym oknie, nadpisując stronę, z której hiperłącze zostało umieszczone. Użytkownik może powrócić do poprzedniej strony za pomocą przycisku przeglądarki „wstecz”.
Wielu użytkowników preferuje jednak, aby każda strona internetowa uruchamiała się w nowej karcie. Ułatwia to przełączanie się między stronami, co jest szczególnie przydatne na przykład dla studentów, którzy mogą mieć otwartych kilka kart i tworzyć notatki, przełączając się między nimi.
Otwieranie linków w nowym oknie wpływa na UX, ponieważ użytkownicy mogą jednocześnie pozostać na stronie pierwotnej. Implementowanie atrybutu target jest ważne przy realizacji strategii SXO, czyli Search Experience Optimization, łączącej SEO i UX, dwa kluczowe elementy w marketingu internetowym.
Czym jest atrybut noopener?
Atrybut linku noopener jest stosowany wraz z atrybutem „target=_blank”. Ten drugi otwiera stronę internetową w nowej karcie przeglądarki. Zastosowanie atrybutu noopener zapobiega atakom phishingowym, które polegają na podłożeniu szkodliwych treści w miejscu strony docelowej.
Poruszając się po stronach internetowych, warto pamiętać o przejściach kolorów w języku HTML, które pomagają użytkownikowi zorientować się, które linki już otworzył. Niebieski oznacza linki, na które użytkownik jeszcze nie kliknął. Czerwony pojawia się po kliknięciu, aż do momentu pobrania zawartości odnośnika przez przeglądarkę. Magenta wskazuje linki, które użytkownik już odwiedził.
Pamiętaj o ustawieniach target, gdy tworzysz lub przeglądasz strony internetowe!