Cara membuat tautan dalam dokumen HTML. Tag A - sintaks dan atributnya
- URL atau "alamat" dari suatu halaman di Internet
- Tag <A> dan sintaks dasarnya
- Referensi absolut dan relatif
- Tautan relatif ke direktori lebih tinggi dari saat ini
- Atribut tag <A>. Cara membuka dokumen dengan referensi di jendela baru
- Tautan judul. Atribut judul untuk tag <A>
- Atribut hyperlink nofollow. Larangan transfer "kepercayaan" situs dengan referensi
- Tautan internal atau jangkar di dalam dokumen
- Tautan Anchor - Gambar
- Lanjutan
Referensi (atau hyperlink) menembus Internet seperti pembuluh darah. Jika tidak ada tautan, tidak akan ada Internet.
Cara membuat tautan dalam dokumen HTML dan mendaftarkan atributnya dengan benar, apa URL itu dan bagaimana Mesin Pencari berhubungan dengan tautan - dalam pelajaran selanjutnya bagi pemula untuk belajar HTML.
URL atau "alamat" dari suatu halaman di Internet
Setiap dokumen HTML di Web memiliki "alamat pasti" sendiri. Ini disebut "URL", dari bahasa Inggris. URL - Uniform Resource Locator
Struktur URL sering terlihat di bilah alamat browser. Itu termasuk:
- Nama protokolnya adalah http: // atau https: //
- Domain Situs
- folder atau jalur ke folder tempat dokumen ini berada,
- Nama file (mungkin tidak selalu).
Berkat "alamat pasti" ini, menjadi mungkin untuk merujuk ke dokumen ini dari teks dokumen lain.
Tag <A> dan sintaks dasarnya
Saya harap kata "sintaksis" tidak lagi membuat Anda takut 🙂
<a href="http://domen-saita.ru/papka-na-servere/dokument.html"> tautan teks </a>
Seperti yang Anda lihat, setelah tag <A> dimulai, harus ada atribut href wajib yang menentukan alamat dokumen yang ingin Anda tuju.
Di dalam tag wadah <A> itu sendiri adalah sebuah teks (walaupun mungkin ada gambar), yang merupakan teks dari tautan tersebut. Ini juga disebut " Jangkar " atau hanya - Jangkar.
Referensi absolut dan relatif
Dalam contoh di atas, referensi absolut digunakan. Yang berisi URL lengkap dokumen.
Dalam beberapa kasus, atribut href tidak mengandung URL lengkap dengan nama protokol dan domain situs. Jika dokumen tempat tautan mengarah, ada di situs yang sama - Anda dapat menggunakan tautan relatif yang mengarah dari tempat dokumen itu berada.
Skema ketika referensi relatif diterapkan
Contoh: tautan dari dokumen first.html mengarah ke file second.html, yang terletak di folder berita.
Tautan relatif ke direktori lebih tinggi dari saat ini
Kode:
<a href="../first.html"> ini adalah tautan relatif ke file di direktori level satu </a>
Tautan ini mengarah ke file first.html di direktori "parent", yaitu naik satu tingkat .
Kombinasi ../ menunjukkan folder satu tingkat lebih tinggi dari posisi file yang diberikan tempat tautan dibuat.
Atribut tag <A>. Cara membuka dokumen dengan referensi di jendela baru
Agar dokumen dapat dibuka di tab browser baru, Anda perlu menggunakan atribut target = "_ blank"
Atribut tautan target = "_ blank"
Jangan menyalahgunakannya. Tidak perlu membuat tautan internal ke situs dengan atribut ini. Pengguna akan terganggu oleh "jendela pemicu".
Secara umum, dengan atribut target ini - keseluruhan cerita. Masih ada beberapa artinya, tetapi semuanya jarang digunakan saat ini.
Ini karena mereka dirancang untuk bekerja dengan situs pada bingkai yang tidak lagi populer dan, dengan munculnya HTML5 , menjadi sesuatu dari masa lalu.
Tautan judul. Atribut judul untuk tag <A>
Atribut lain yang bermanfaat adalah title = "Teks yang menjelaskan ke mana arah tautan ini"
Sintaks:
<a href="http://domen-saita.ru/papka-na-servere/dokument.html" title="the pop-up hint"> ini adalah tautan petunjuk </a>
Seperti yang Anda lihat, browser menampilkannya sebagai tip alat. Namun, itu memperhitungkan mesin pencari.
Petunjuk atribut untuk judul tautan
Atribut hyperlink nofollow. Larangan transfer "kepercayaan" situs dengan referensi
Ada satu lagi atribut ambigu untuk tautan rel = "nofollow"
Dia memberi tahu Mesin Pencari bahwa dokumen tautan mungkin tidak dapat dipercaya. Pada saat yang sama, indikator trust (“trust”) dari situs Sumber tidak dikirimkan ke situs dengan referensi.
Topik "kepercayaan" dan peringkat tautan masih ada di depan, tetapi jika singkat, "nasib" situs di mesin pencari juga akan bergantung pada jumlah tautan yang mengarah ke situs ini. Semakin banyak dari mereka, semakin banyak tautan situs otoritatif - semakin kredibilitas situs dengan referensi.
Dalam beberapa kasus, ada baiknya “menyaring” tautan dengan atribut ini. Misalnya, jika Anda menulis ulasan negatif tentang layanan apa pun.
<a href="http://bad-sait.ru/dokument.html" rel="nofollow"> situs buruk </a>
Tautan internal atau jangkar di dalam dokumen
Dalam teks besar, pemasangan yang disebut "jangkar" di bagian logis dokumen sering diperlukan. Kemudian, di tempat ini, Anda bisa merujuk.
Cara termudah untuk menggunakannya adalah membuat daftar isi lokal dari hyperlink yang mengarah ke jangkar ini. Daftar isi seperti itu biasanya diletakkan di bagian paling awal artikel.
Saat membuat jangkar seperti itu, atribut nama digunakan alih-alih atribut href.
Sintaks untuk membuat jangkar adalah:
<a name="top"> </a>
Saat membuat tautan, di akhir URL tambahkan melalui tanda # - nama "jangkar":
<p> <a href="#top"> Top </a> </ p>
Transisi akan persis ke tempat ini, mis. Browser akan menempatkan tempat ini di bagian atas yang terlihat.
Seringkali, dalam dokumen yang panjang, di bagian paling bawah mereka memasang tautan "Atas".
... setelah berkeliling dunia biji-bijian harum, mereka menemukan kualitas tertinggi dari yang Afrika, Asia, Amerika Tengah dan Selatan terkenal. Karena itu, hari ini di rumah-rumah kopi merek Biji kopi Anda akan menemukan varietas kopi terbaik dari produsen yang diakui.
? Ke atas ?
Dari dokumen lain, Anda juga dapat keluar ke tempat ini, jika Anda menambahkan di akhir URL melalui tanda # name_
<a href="http://domen-saita.ru/dokument.html#top"> teks tautan mengarah ke jangkar "teratas" dalam dokumen ini </a>
Tautan Anchor - Gambar
Gambar apa saja bisa berupa tautan.
Kode:
<a href="http://sait.ru/dokument.html"> <img src = kartinka.jpg "width =" 100 "height =" 131 "/> </a>
Secara default, tautan digarisbawahi oleh browser dengan garis biru solid, dan gambar tautan mendapatkan bingkai biru.
Tautan-gambar mendapatkan bingkai biru
Untuk menghilangkannya, aturan sederhana ditambahkan ke file CSS untuk situs:
a {border: 0px;}
Ini adalah instruksi untuk menjadikan ketebalan batas nol untuk semua tautan gambar.
Lanjutan
Dalam posting berikutnya, saya akan berbicara tentang tautan email, atribut dan metode "perlindungan" dari spammer jahat