Kurs HTML - odsyłacze do stron internetowych

Odsyłacze do stron internetowych, inaczej zwane hiperłączami lub po prostu linkami, to element strony, przedstawiony zwykle w formie krótkiego tekstu lub obrazka, którego kliknięcie powoduje przejście do innej strony, podstrony lub plików, etc..

Działanie internetu opiera się na odsyłaczach, hiperłączach. Dzięki nim, odwiedzając jedną stronę, możemy szybko przejść do kolejnych witryn, np. źródeł informacji. Hiperłączami są także linki wewnętrzne, powodujące poruszanie się w obrębie jednej strony, np. moduły nawigacji zwane menu.

Dzięki temu, przykładowo na naszym forum, jednym kliknięciem myszki, jesteś w stanie przejść do kolejnych kategorii i postów, a z nich do nowych stron internetowych.

Hiperłącza są zwykle wyróżnione na stronie WWW innym kolorem, niż tekst podstawowy. Domyślnie stosowany kolor niebieski oraz podkreślenie. Parametr też można zmieniać, jednak ze względu na przyjęte standardy, często pozostaje on taki sam na każdej witrynie.

Przykład 1. Hiperłącze tekstowe:

Kliknij tutaj, aby przejść na stronę Centrum Pomocy home.pl

Hiperłączem mogą być także elementy graficzne, np. przyciski (buttony), zdjęcia czy obrazy. Taka forma, pozwala nie tylko opierać budowę strony o tekst, ale także przyjazną dla oczu grafikę, dzięki której możemy skierować użytkownika strony tam, gdzie chcemy.

Hiperłącza w postaci obrazów, stosuje się najczęściej w galeriach oraz w modułach nawigacji, gdzie chcemy zastosować elementy graficzne, np. identyfikacja kategorii produktów w sklepie, zaprezentowana zdjęciami przykładowego asortymentu.

Przykład 2. Hiperłącze obrazkowe:



Dzięki znajomości podstaw języka HTML oraz w/w zagadnienia, bez żadnego problemu, czy to w kreatorze Click Web, sklepie Click Shop a nawet w poczcie (np. w podpicie do wiadomości e-mail), będziesz w stanie umieścić dodatkowe odnośniki do podstron, witryn czy zasobów.

Znacznikiem odpowiedzialnym za dodanie hiperłącza jest: <a>...</a>
Aby link był użyteczny, tzn. możliwy do kliknięcia i przekierowania, wprowadzamy go w postaci:
<a href="adres strony docelowej">opis</a>

Przykład 3. Dodawanie adresu strony WWW zewnętrznej:

<a href="http://pomoc.home.pl">http://pomoc.home.pl</a>

http://pomoc.home.pl

Przykład 4. Dodawanie adresu strony WWW z w własnym opisem:

<a href="https://pomoc.home.pl">Kliknij tutaj</a>, aby przejść do Centrum pomocy.

Kliknij tutaj, aby przejść do Centrum pomocy.

Przykład 5. Dodawanie adresu strony WWW z opisem zawierającym własne formatowanie:

<a href="https://pomoc.home.pl"><b><i>Kliknij tutaj</i></b></a>, aby przejść do Centrum pomocy.

Kliknij tutaj, aby przejść do Centrum pomocy.

Jeśli chcielibyśmy, aby kliknięcie w link powodowało otwarcie docelowej strony w nowym oknie/na nowej karcie przeglądarki, dodatkowo sugerujemy użyć atrybutu : target="_blank"

Przykład 6. Dodawanie adresu strony WWW - otwarcie w nowym oknie przeglądarki.

<a href="http://pomoc.home.pl" target="_blank" >http://pomoc.home.pl</a>

Więcej informacji o formatowaniu tekstu, znajdziesz w artykule pomocy dostępnym pod adresem: https://pomoc.home.pl/baza-wiedzy/formatowanie-tekstu/

 

Jeśli tworzycie hiperłącza lub wstawiacie obrazki, pamiętajcie o zastosowaniu atrybutów ALT i TITLE. Więcej o nich napisaliśmy w osobnym wpisie.

Kliknij tutaj, aby przejść do artykułu.