Halo sobat Redaksianaa, perkenalkan nama saya Lintang Aji Nanda Saputro dari kelas 1 D3 Elektronika B. Pada postingan kali ini saya menulis tentang cara membuat dan memberi Hyperlink dalam HTML. Show Hyperlink adalah cara untuk menghubungkan suatu bagian di dalam file, program atau halaman pada web. Cara untuk membuat program hyperlink adalah dengan menggunakan <a href=”nama link yang diinginkan“> lalu untuk penutupnya menggunakan </a> . Contoh programnya adalah sebagai berikut. contoh gambar program hyperlinkProgramnya adalah sebagai berikut. <html> <head> <title>Menu</title> </head> <body align=center> <p>Tugas Pemrograman</p> <ul> <li><a href=”POST 1.php”>If-else</a></li> <li><a href=”POST 2.php”>FUNGSI</a></li> <li><a href=”array1.php”>Array 1</a></li> <li><a href=”array2.php”>Array 2</a></li> <li><a href=”array3.php”>Array 3</a></li> <li><a href=”array4.php”>Array 4</a></li> <li><a href=”tabel.html”>Tabel Biodata</a></li> <li><a href=”List.html”>List Makanan</a></li> <li><a href=”List 2.html”>List Biodata</a></li> </ul> </body> </html> Berikut adalah hasil dari program tersebut. Jika salah satu dari list tersebut di-klik, maka akan menuju ke halaman web yang diinginkan. Contoh, saya akan meng-klik “list makanan”, maka akan langsung menuju ke halaman web dari list makanan. hyperlink “HomePage” di atas berfungsi untuk kembali ke halaman awal, yaitu Tugas Pemrograman. Sekian dulu ya sobat postingan dari saya, semoga bermanfaat bagi kalian semua yang membacanya. Sampai jumpa di postingan yang selanjutnyaa… Tentunya Anda sudah pernah mendengar kata link, bukan? Istilah ‘link’ (bahasa Indonesia: tautan, pranala) sudah sangat umum diketahui oleh masyarakat, baik dari kalangan pegiat IT ataupun masyarakat awam. Di era modern serba internet seperti saat ini, hampir semua orang pasti sempat mengklik sebuah link di setiap harinya – baik itu link website, link masuk ke grup chat atau platform meeting online, link belanja online, dan masih banyak lagi. Dalam dunia IT sendiri, link memiliki peranan yang fundamental alias penting. Coba bayangkan kira-kira apa jadinya jika semua website yang ada di dunia ini tidak mempunyai link? Web tersebut memang masih tetap dapat beroperasi, hanya saja user (pengguna) akan menjadi 2x lipat lebih repot saat hendak mengakses website. Tanpa adanya link, Anda harus mengetik sendiri URL website yang hendak dituju. Bahkan untuk berpindah halaman dalam website yang sama pun, Anda tetap harus meng-input manual URL halaman yang ingin diakses. Merepotkan! Oleh sebab itulah, kita memerlukan yang namanya link atau hyperlink. Pernahkah Anda terpikir bagaimana cara membuat sebuah link? Apakah link tersebut hadir secara ‘otomatis’ saat sebuah web dibuat? Jawabannya tidak. Anda harus membuat hyperlink HTML sendiri. Namun Anda tidak perlu cemas, sebab membuat hyperlink HTML sendiri bukan perkara yang rumit. Artikel seri belajar ngoding kali ini akan mengupas tuntas cara membuat hyperlink HTML tersimpel untuk Anda. Selain itu, kami juga akan memberikan sejumlah jenis hyperlink pada HTML beserta link HTML code yang bisa Anda coba. Yuk kita mulai pembahasannya berikut ini! Keep scrolling dan selamat membaca! Mengenal Hyperlink: Definisi, Fungsi dan Ciri Khas Hyperlink HTML
Dari ketiga definisi di atas, dapat ditarik suatu benan merah bahwa hyperlink atau link adalah sebuah teks yang digunakan untuk menghubungkan beragam halaman website agar dapat diakses dengan lebih praktis oleh user website. Saat Anda mengklik sebuah hyperlink, maka Anda sudah membuka yang namanya ‘world wide web’ alias kode www. Nantinya, Anda dapat berpindah atau diarahkan menuju halaman atau alamat URL lain yang diinginkan. Cara ini tentunya lebih praktis ketimbang mengetikkan setiap URL ke browser kapanpun kita ingin mengakses sebuah halaman web. Oleh sebab itu, wajib hukumnya bagi sebuah website untuk mempunyai minimal 1 hyperlink di setiap halaman yang dimiliki. Dari pengertian di atas, kita juga sudah mendapatkan gambaran lengkap terkait fungsi hyperlink. Fungsi utama dari kehadiran link adalah untuk menghubungkan setiap dokumen HTML. Pun link juga berfungsi untuk mempermudah setiap user website dalam mengunjungi web dan melakukan penelusuran. Berbeda dengan teks lainnya, link mempunyai ciri khas tersendiri yakni mempunyai warna yang berbeda sehingga mudah dikenali atau dibedakan. Umumnya, warna dari sebuah link adalah biru. Warna ini pun akan berubah menjadi ungu, apabila Anda sudah pernah mengklik link tersebut sebelumnya. Bahkan jika Anda dengan sengaja mengarahkan kursor mouse ke link, maka icon panah kursor akan berubah bentuk menjadi gambar tangan kecil yang seolah-olah siap mengklik link. Menarik sekali, bukan? Sebagai catatan tambahan, hyperlink HTML mempunyai atribut masing-masing dengan kegunaan yang berbeda-beda. Beberapa jenis atribut link HTML antara lain: href, style, target, title, rel, dan seterusnya.
Jenis-Jenis Hyperlink pada HTMLMasyarakat awam mungkin mengira bahwa hanya ada 1 jenis hyperlink pada HTML – atau menganggap bahwa semua link HTML adalah sama saja. Padahal sesungguhnya tidak demikian. Ada beberapa jenis hyperlink pada HTML yang bisa dikelompokkan menurut sifatnya. Alhasil, penting untuk Anda ingat juga bahwa berbeda jenis link maka akan berbeda pula cara membuat hyperlink HTML. Lalu apa sajakah jenis-jenis hyperlink pada HTML? Menurut tipe alamat URL tujuan, link dapat dibedakan menjadi 2 yakni: Hyperlink ExternalPertama adalah hyperlink external. Link external adalah link yang digunakan untuk mengakses domain / web lain. Semisal Anda mengakses Appkey.id kemudian menemukan link external yang membawa Anda menuju halaman Facebook dari Appkey.id. Mungkin Anda juga pernah membuka link external dari sebuah web atau aplikasi. Semisal teman Anda mengirimkan tautan link YouTube di pesan WhatsApp. Saat Anda mengklik link tersebut dan beralih dari WhatsApp ke YouTube, maka Anda sudah menggunakan link external. Contoh membuat hyperlink HTML external adalah sebagai berikut:
Hyperlink InternalBerkebalikan dengan hyperlink external, hyperlink internal adalah tautan yang digunakan untuk mengarahkan user berpindah dari halaman 1 ke yang lain dalam halaman web Anda sendiri. Jika Anda perhatikan, setiap website cenderung mempunyai lebih dari satu halaman, bukan? Sebuah website bisa mempunyai halaman seperti beranda, kategori, about us, contact, dan lain sebagainya. Saat user berpindah semisal dari beranda ke halaman about us, maka link yang user gunakan adalah link internal. Intinya, link internal adalah link yang dipakai oleh user untuk berpindah halaman dalam 1 web yang sama. Seperti ibaratnya pintu aneka kamar di dalam rumah Anda – Anda bisa berpindah ke ruangan mana saja tanpa meninggalkan rumah. Cara membuat hyperlink HTML internal sesungguhnya tidak jauh berbeda dengan cara membuat hyperlink external. Perbedaannya hanya terletak pada jenis link yang disisipkan ke dalam struktur coding. Contoh membuat hyperlink HTML internal:
Selain external dan internal link, masih ada jenis hyperlink lainnya yang bisa Anda temukan di internet, yakni: Relatif AddressRelatif address adalah sebuah URL yang hanya menyebutkan nama file serta path saja. Untuk nama network address / location dan protocol sama sekali tidak akan tampak. Relatif address banyak dipakai oleh blog dan web. Absolute AddressAbsoulte address memuat semua komponen, tidak seperti relatif address. Di sini, Anda bisa mendapat URL address secara lengkap, mulai dari nama file, protokol, network location dan juga path. Absolute address sendiri sering digunakan sebagai backlink untuk artikel web. Link SectionTipe link terakhir adalah link section. Link ini digunakan untuk menghubungkan website dengan ‘section’ atau bagian tertentu dari sebuah dokumen / artikel di web. Dengan memakai link section, Anda bisa langsung menuju ke halaman yang spesifik sesuai penelusuran. Link section ini biasa digunakan untuk membuat kamus online. Tutorial Mudah Membuat Hyperlink HTMLAnda sudah berkeliling mengenal apa itu hyperlink, jenis dan fungsi dari hyperlink. Kini tibalah kita pada tutorial mudah untuk membuat hyperlink HTML. Pada dasarnya, hyperlink HTML memiliki bentuk tag<a>. Bentuk penulisan default hyperlink HTML adalah:
Tag<a> harus mempunyai atribut HTML href agar link bisa dipakai menentukan URL address tujuan / URL website Anda. Contoh struktur link HTML adalah: <a href=http://appkey.co.id/>Appkey Indonesia</a> Baiklah, mari kita mulai tutorial lengkap cara membuat link HTML pada web:
2. Pastikan semua file (link.html, about.html, contact.html, dan seterusnya) sudah berada dalam 1 folder (seperti saat Anda membuat link internal).
Terima kasih sudah mengikuti artikel edisi kali ini sampai di sini. Nantikan lebih banyak artikel seri belajar ngoding lainnya hanya dari Appkey.id! Sayonara! Jasa Pembuatan Aplikasi,
Website dan Internet Marketing | PT APPKEY Bagaimana cara membuat hyperlink di HTML?Untuk membuat link di HTML kita perlu yang namanya tag <a> singkatan dari anchor. Tag <a> mempunyai atribut khusus yaitu href. Atribut ini digunakan untuk mendefinisikan alamat url yang nantinya akan dituju. Kepanjangan dari href adalah Hypertext Reference.
Bagaimana cara membuat link URL?Cara membuat link URL sendiri dengan Bitly. Klik Create.. Masukkan link panjang.. Tempel link yang ingin dibuat.. Tampilan akan berubah ke mode edit.. Klik bagian Customize Back-Half.. Klik Save.. Edit link ke penamaan sendiri.. Tunggu notifikasi alamat link URL tersedia atau tidak.. Apa itu A dalam HTML?Deskripsi. Penjelasan HTML a (anchor link)
a menunjukkan sebuah anchor. Apa itu anchor? Anchor adalah teks yang menunjukkan awalan dan akhiran sebuah hypertext link. HTML <a> element digunakan untuk mendefinisikan sebuah hyperlink. Link dapat merujuk ke halaman yang sedang terbuka ataupun ke halaman lain (website lain) ...
Bagaimana cara menampilkan gambar pada HTML?Dalam HTML, tag yang berfungsi untuk menampilkan gambar adalah tag <img>, singkatan dari image. Tag <img> merupakan jenis tag yang berdiri sendiri atau dalam konteks elemen, merupakan elemen tanpa tag penutup (empty element). Tag <img> memiliki atribut khusus yaitu src singkatan dari source yang berarti sumber.
|