Zastanawialiście się kiedyś jakie są różnice pomiędzy target="blank" a target="_blank"? Czy w ogóle jakiekolwiek są – poza oczywistym dodatkowym podkreśleniem?
Otóż są i to całkiem spore.
Atrybut „target”
target jest atrybutem, który dodajemy do linków, a więc tagów <a>.
Zdecydowanie najczęściej przypisujemy do niego wartość _blank (choć nie jest to jedyna opcja, z której możemy skorzystać), dzięki czemu użytkownik klikający dany link, będzie mógł kontynuować przeglądanie obecnej strony, podczas gdy ta nowa otworzy się na karcie obok.
Przykład:
Różnice między „blank” & „_blank”
Na pierwszy rzut oka obydwa atrybuty „blank” działają podobnie. Klikamy link, a ten otwiera się na nowej karcie.
Natomiast słowem klucz jest tu „link” – liczba pojedyncza.
Co jeśli linków będzie kilka?
Atrybut target="blank" otworzy tylko jedną nową kartę i to na niej będzie otwierał wszystkie kliknięte linki. W efekcie – ciągle będziemy nadpisywali poprzednio otwartą stronę.
W przypadku target="_blank", każda ze stron otworzy się na swojej unikalnej karcie.
Wklej poniższy kod do swojego edytora i sprawdź działanie.
<!-- target bez podkreślenia -->
<a href="https://mmcschool.pl/" target="blank">MMC School</a>
<a href="https://mmcworld.pl/" target="blank">MMC World</a>
<a href="https://developer.mozilla.org/pl/" target="blank">MDN</a>
<!-- target z podkreśleniem -->
<a href="https://mmcschool.pl/" target="_blank">MMC School</a>
<a href="https://mmcworld.pl/" target="_blank">MMC World</a>
<a href="https://developer.mozilla.org/pl/" target="_blank">MDN</a>Aby nie wprowadzać użytkowników w zakłopotanie, najlepiej korzystać z target="_blank", a więc wersji z podkreśleniem.
Warto dodać, że ze względów bezpieczeństwa, do linków z atrybutem target="_blank" należy dodać kolejny atrybut – rel="noopener".
Dzięki niemu zablokujemy niechciane ataki ze strony hackerów na użytkowników naszej strony.
Przeczytaj więcej na temat bezpieczeństwa linków:
Różnice między „noopener”, „noreferrer” oraz „nofollow”
