tRikSonic
Tema

HTML Tag a - Belajar Element <a>

Terakhir diperbarui : 25 Mei 2018 - 08.35
HTML tag <a> mempunyai pengertian sebagai Anchor text, Anchor text adalah sebuah kalimat yang mengandung link didalamnya. atau kita membuat Link dengan menggunakan HTML <a>
background html
Umumnya anchor text ini disebut juga dengan hyperlink ataupun backlink. Kebanyakan para blogger menyebut Anchor text dengan kata backlink, sebab lebih mudah diingat.
Anchor text dapat bermanfaat bagi para blogger yg ingin menaikkan kualitas SEO dalam sebuah web atau blog, cara ini sangat efektif dan telah terbukti menggunakan memakai anchor text ini dapat menaikkan viewers/page view yang nantinya berpengaruh terhadap Mesin Pencarian / Search Engine.

Contoh :

<a href="https://triksonic.blogspot.com/">Trik sonic</a>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>
 
<a href="https://triksonic.blogspot.com/">Trik sonic</a>

</body>
</html>

Attribute:

Attribut HTML tags <a>

download

Penjelasan : Attribute download digunakan untuk menentukan link yang diklik oleh user berupa perintah download

Contoh 1 :

<p>
   Link : <a href="https://example.com/" download="download">example.com</a>
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
  Link : <a href="https://example.com/" download="download">example.com</a>
</p>

<p>
  <b>Klik link diatas dan silahkan tunggu.</b>
</p>

</body>
</html>

href

Attribut href, digunakan untuk Menentukkan alamat URL/Link atau element Target.

Contoh 1 :

<p>
  <a href="https://triksonic.blogspot.com/">Trik sonic</a> adalah blog yang membahas tentang tutorial
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
<a href="https://triksonic.blogspot.com/">Trik sonic</a> adalah blog yang membahas tentang tutorial
</p> 

</body>
</html>

hreflang

Penjelasan : attribute hreflang menegaskan Bahwa link yang akan dituju / diklik memiliki bahasa suatu negara tertentu, misal : "id" (bahasa indonesia).
<p>
  <a href="https://triksonic.blogspot.com/" hreflang="id">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
  <a href="https://triksonic.blogspot.com/" hreflang="id">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>

</body>
</html>

type

Penjelasan : attribute Type digunakan untuk menegaskan Bahwa link yang akan dituju / diklik memiliki bahasa dengan Format / Media denagn type tertentu, untuk lebih lengkapnya tentang Media Type silahkan Kunjungi Link ini IANA MEDIA TYPE
<p>
  <a href="https://triksonic.blogspot.com/" type="text/html">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
  <a href="https://triksonic.blogspot.com/" type="text/html">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>

</body>
</html>

rel

Penjelasan : attribute rel digunakan untuk menegaskan hubungan dengan kontent yang ada dengan Link / target yang dituju.
Nilai Atribut ini adalah :
  • alternate
  • author
  • bookmark
  • help
  • license
  • next
  • nofollow
  • noreferrer
  • prefetch
  • prev
  • search
  • tag
<p>
  <a href="https://example.com/" rel="nofollow">example.com</a> 
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
  <a href="https://example.com/" rel="nofollow">example.com</a> 
</p>

</body>
</html>

target

Penjelasan : Attribut target digunakan untuk Menentukkan target tempat atau cara membuka sebuah dokumen yang ada pada sebuah link.
Nilai Atribut ini adalah :
Value Penjelasan
_blank Membuka link pada tab baru browser
_self Membuka Link pada frame yang sama
_parent Membuka Link dalam kerangka induk
_top Membuka dokumen terkait dalam Full Window
framename Membuka Link dalam bingkai/Frame bernama
<p>
  <a href="https://triksonic.blogspot.com/" target="_blank">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<p>
  <a href="https://triksonic.blogspot.com/" target="_blank">Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>

</body>
</html>

media

Penjelasan : Attribute media digunakan untuk Menentukkan media query yang digunakan pada dokumen yang dirujuk oleh link tersebut.
<p>
  <a href="https://triksonic.blogspot.com?output=print"media="print and (resolution:300dpi)">
  Trik sonic</a> 
  adalah blog yang membahas tentang tutorial
</p>

Browser Support

Desktop

ChromeYa
SafariYa
FirefoxYa
OperaYa
IEYa
EdgeYa

Mobile

Android WebviewYa
Chrome AndroidYa
Edge MobileYa
Firefox AndroidYa
Opera AndroidYa
iOs SafariYa
Samsung InternetYa

Default CSS

Browser yang support dengan element <a>, biasanya mempunyai nilai default :
a:link, a:visited { 
    color: (internal value);
    text-decoration: underline;
    cursor: auto;
}

a:link:active, a:visited:active { 
    color: (internal value);
}
X
Run
Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.