html

Belajar HTML Bagian 6 : Tag Link dan Tag Script

Pada tutorial sebelumnya kita telah mempelajari mengenai tag title dan tag meta. Jika kamu belum membacanya, kamu bisa membacanya di Belajar HTML Bagian 5: Tag Title dan Tag Meta.

Masih dalam pembahasan yang sama yaitu HTML head atau disebut sebagai Head Element. Namun pada kesempatan kali ini ngodeinweb akan membahas mengenai tag link dan tag script.

 

Tag Link

Tag <link> adalah tag yang biasanya digunakan untuk menginput sebuah file ke dalam halaman HTML. Maksud file di sini adalah file berupa code program lain, misalnya untuk menginput file CSS.

 


Tentang CSS

CSS(Cascading Style Sheet ) merupakan aturan untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS buka merupakan bahasa pemrogramman. (id.wikipedia.org)

Dapat disimpulkan bahwa CSS (Cascanding Style Sheet) adalah sebuah code program yang digunakan untuk mengatur tampilan dari sebuah code HTML. Misalnya untuk mengatur posisi, warna text, navigasi, dan lain sebagainya.


 

Tag <link> diletakkan dibagian head element, yaitu diantara tag <head> dan </head>

Perhatikan contoh berikut. Di sini saya sudah membuat dua file yang berbeda yaitu HTML dan CSS.

Code HTML tanpa tag link.

Sekarang kita akan menginput file css (style.css) menggunkan tag link kedalam HTML.

Penjelasan tag <link>

Tag link tidak memiliki pasangan tag penutup, sehingga penulisannya cukup dengan <link>.

Tag link dapat di isi dengan berbagai macam atribut. Atribut yang harus ada dalam tag link adalah atribut href. Atribut ini (href) berfungsi sebagai penunjuk lokasi file yang akan diinput. Dalam contoh di atas adalah href=”style.css”  (Style.css adalah nama file yang di input).

Atribut type digunakan untuk menentukan jenis file apa yang akan kita input. Karena kita menginput sebuah file CSS, maka nilai dari atribut ini adalah “text/css”.

Atribut rel dalam kasus ini digunakan untuk menyatakan hubungan file yang akan diinput yaitu “stylesheet”.

Masih banyak atribut yang dapat kamu tambahkan ke dalam tag link. Kamu bisa mempelajarinya lebih lanjut di situs w3schools.

 

Baca juga : Belajar HTML Bagian 4 : Perbedaan Tag dan Atribut

 

 


Tag Script

Tag <script> biasanya digunakan untuk menginput sebuah code program script, misalnya untuk menginput code program JavaScript ke dalam HTML.

Tag <script> ini memiliki pasangan tag penutup yaitu tag </script>, sehingga dalam penggunaannya harus selalu bersama atau berpasangan. 🙂

Berbeda dengan tag link yang hanya dapat digunakan untuk menginput file dari luar (eksternal), tag script ini dapat digunakan dengan dua cara yaitu untuk menulis langsung code script di dalam HTML dan dapat juga digunakan untuk menginput file script eksternal.

Untuk menulis langsung code script di dalam HTML, cukup dengan menulisnya di antara tag <script> dan </script>. Kamu dapat meletakkan code script ini di bagian head, body, maupun footer.

 

Untuk menginput file script secara eksternal dalam hal ini adalah file JavaScript, caranya hampir sama seperti menginput file menggunakan tag link.

Perhatikan contoh code berikut.

Penjelasan kode

Atribut src digunakan untuk menentukan dimana lokasi file script berada. Nilai atribut “javascript.js” adalah nama file script yang akan diinput.

Tag script dapat diletakkan di bagian head html, namun ada juga yang meletakkan tag script di akhir code HTML sebelum tag </html>.

Sebenarnya hasil yang akan ditampilkan sama saja, namun ada yang beranggapan bahwa dengan meletakkan tag script (menginput file menggunakan tag script) di bagian akhir maka akan mempercepat proses loading sebuah halaman website.

 

Kamu dapat mempelajari tag link dan tag script lebih lanjut di situs resminya yaitu w3schools maupun mempelajarinya melalui media lain.

Sekian untuk tutorial belajar HTML bagian 6 kali ini. Jika kamu memiliki pertanyaan seputar tag link dan tag script, silahkan menghubungi kami melalui sosial media, comment, maupun email ke [email protected] 🙂

Lanjut ke Belajar HTML Bagian 7: Tag Heading dan Tag Paragraf

Leave a Reply

Your email address will not be published. Required fields are marked *