Cara menggunakan contoh hyperlink html

Hallo coders, kali ini kita akan belajar cara membuat link Html. Disini kita akan belajar cara membuat link untuk menghubungkan halaman website kita. Pasti temen temen sudah tau ya, gampangnya kalo temen temen mengeklik navigasi maka halaman akan berpindah nah itu adalah menggunakan tag link temen temen. Coba bayangkan apa jadinya website tanpa link ?. Kita harus mengetik urlnya untuk berpindah halaman, tentu ini akan meribetkan user kan. Nah maka dari itu tag link ini dibuat.

Daftar Isi

• Apa itu tag link Html
• Cara membuat Link Html
  • Link Absolute
  • Link Relative
  • Link dengan Tab baru

Apa itu tag link Html

Link atau hyperlink adalah elemen HTML yang berfungsi menghubungkan suatu halaman web ke halaman web yang lain. Elemen ini bisa diklik dan nanti akan membuka halaman lain sesuai alamat URL yang kita berikan.

Hyperlink ini juga bisa berfungsi untuk kendali menuju scroll top dan scroll down, download file, dan menjalankan fungsi javascript dll. Contohnya adalah navbar di sebuah website landing page gaess.

Nah untuk lebih dalamnya kita akan bahasa lebih dalam ya gess.

Cara membuat Link Html

Cara membuat link di html kita mulai dengan tag a. Di tag ini terdapat atribut yaitu href, nah di sini kita akan meletakan alamat yang akan kita tuju. Kurang lebih konsepnya seperti ini gaess.

Contoh diatas adalah konsep jika kita mau membuat link menuju website blog dunia coding.

Mari kita prakteran, temen temen bisa membuat file dengan naman index.html. Kemudian bisa praktekan kode seperti dibawah ini.

  


  
Belajar Tag Link
  
Halaman ini akan menuju website duniacoding Dunia Coding Academy

Jika temen temen praktekan kode diatas maka akan muncul halaman seperti ini.

Link Absolute

Link absolute ditulis secara lengkap seperti diatas tadi temen temen yaitu https://duniacoding.site/. Atau jika kita ingin ke halaman tertentu di website tersebut temen temen bisa menuliskannya seperti ini https://duniacoding.site/kelas.

  


  
Belajar Tag Link
  
Halaman ini akan menuju website duniacoding Kelas Dunia Coding Academy

Link Relative

Link relative berbeda dengan link absolute. Link relative untuk memanggil file website kita yang dihalaman lain. Semisal kita punya halaman index.html kemudian kita membuat file untuk halaman yang lain contoh halaman.html. Maka akan mengarahkan website kita yang halaman lain dengan cara menuliskan halaman.html didalam atribut href.

Jika file tersebut berada didalam folder yang namanya belajar, maka link relatifnya menjadi href=”belajar/halaman.html”. Tetapi bagaimana jika halaman tersebut berada di dua tingkat luar folder saat ini ? Kita dapat menggunakan href=”../../halaman.html”.

Untuk lebih jelasnya disini saya akan membuat halaman.html yang dijejerkan dengan halaman index.html

index.html

    



    
Belajar Tag Link
    Menuju halaman lain

halaman.html

    



    
Hallo ini halaman baru
    
Untuk kembali kehalaman utama
        klik ini
    

Jika temen temen buka maka hasilnya akan boom keren bukan.

Nah untuk yang kasus didalam folder atau diluar tingkat folder kalian bisa explore sendiri yah mimin sudah kasih cluenya tadi diatas semangat.

Link dengan Tab baru

Setelah kita belajar tentang menuliskan alamat. Kali ini kita akan belajar artibut yang gak kalah penting di tag link yaitu namanya adalah tag target. Atribut ini digunakan khusus menentukan apakah link yang kita tuju itu mau dibuka di browser yang sekarang dengan mengganti keseluruhan halaman atau dengan membuka tab baru dibrowser kita.

Secara default, setiap link yang kita tuliskan akan terbuka di halaman tab browser yang sama atau bisa dibilang menimpa halaman web saat ini seperti yang kita lakuan tadi diawal. Nah jika kita ingin halaman tersebut terbuka di tab baru, gunakan atribut target=”_blank”.

    



    
Belajar Tag Link
    Menuju halaman lain

Nah belajar kita sampai sini dulu ya gaess semoga apa yang saya tulis dapat dengan mudah dipahami oleh kalian semua. Jika ada pertanyaan bisa bertanya di kolom komen insyaallah dibalas secepatnya salam ngoding.

Bagaimana Cara Menambahkan Hyperlink dalam HTML?

Links di HTML – Sintaks.

Tag di HTML mendefinisikan hyperlink. ... .

Atribut terpenting dari elemen adalah atribut href, yang menunjukkan tujuan link..

Kedua contoh di atas menggunakan URL absolut (alamat web lengkap) di atribut href..

Untuk menggunakan gambar sebagai link , cukup letakkan tag di dalam tag :.