Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors

Coding Dasar

Coding Dasar

Untuk membangun sebuah website yang profesional dan multifungsi, tentu dibutuhkan adanya pengetahuan tentang coding, yaitu kegiatan menulis atau menyusun kode-kode bahasa pemrograman untuk berkomunikasi dengan komputer.

Dengan kode-kode yang kita tulis dan susun tersebut, kita dapat meminta komputer untuk menjalankan suatu perintah sesuai dengan instruksinya. Seperti membangun dan membuat website, menyusun aplikasi, memproses data serta hal lainnya yang berkaitan dengan coding tersebut.

Terdapat banyak bahasa pemrograman yang sering digunakan oleh programmer untuk berkomunikasi dengan komputer dalam membuat website maupun aplikasi, seperti:

  • CSS
  • JavaScript
  • SQL
  • Phyton
  • Java
  • PHP
  • HTML

Meski terdapat begitu banyak bahasa pemrograman, namun pada kesempatan kali ini kami hanya akan sedikit membahas mengenai coding dasar dengan menggunakan bahasa HTML.

Pembahasan coding dasar HTML ini sangat cocok untuk anda yang sama sekali tidak tahu tentang apa itu HTML maupun untuk anda yang sudah mempunyai basic tentang HTML.

Persiapan Coding Dasar HTML

Sebelum memulai untuk mempelajari coding dasar HTML, ada beberapa persiapan yang harus dilakukan agar proses pembelajaran dapat berjalan lancar.

Di antara persiapan yang perlu dilakukan adalah dengan melakukan penginstallan aplikasi-aplikasi yang dibutuhkan dan aplikasi pendukung seperti aplikasi web browser dan text editor.

1. Instalasi Web Browser

Web browser merupakan perangkat utama yang digunakan untuk menampilkan halaman website dari coding dasar yang kita buat menggunakan HTML.

Setiap web browser mempunyai keunggulan dan kekurangan yang berbeda-beda dalam menampilkan halaman web yang disusun menggunakan coding dasar HTML atau bahasa pemrograman lainnya. Bisa jadi, halaman website yang telah anda buat ditampilkan secara acak-acakan dan semrawut pada browser yang satu, namun pada browser yang lainnya ditampilkan dengan tampilan yang benar, rapih dan sesuai fungsinya.

Hal tersebut dapat diatasi dengan menggunakan bahasa pemrograman CSS sebagai solusi kompatibiltas tampilan website di berbagai browser.

Berikut ini beberapa web browser yang dapat anda install di komputer anda sebagai tahap persiapan dalam mempelajari coding dasar HTML:

  • Google Chrome
  • Mozila Firefox
  • Internet Explorer
  • Safari
  • Opera
2. Text Editor

Selain membutuhkan web browser sebagai aplikasi penampil halaman website, persiapan selanjutnya sebelum memulai pelajaran tentang coding dasar HTML adalah dengan memasang atau menginstall sebuah text editor.

Terdapat banyak teks editor yang dapat kira gunakan untuk membantu memudahkan dalam proses coding dasar HTML maupun bahasa pemrograman yang lain. Berikut ini adalah beberapa aplikasi text editor yang sering digunakan untuk coding:

  • Adobe Dreamweaver
  • Notepad++
  • Sublime Text
  • Gedit

Selain beberapa text editor di atas, masih terdapat banyak text editor lainnya yang dapat anda gunakan dalam melakukan coding dasar sesuai dengan kenyamanan dan bahasa pemrograman yang digunakan.

3. Add On

Berikutnya adalah pemasangan Add On, yang berfungsi untuk memeriksa dan menguji kode yang telah kita susun dari setiap halaman website. Seperti:

  • Firebug
  • Web Developer Tools
Pengenalan HTML

Apa itu HTML?

HTML adalah singkatan dari Hypertext Markup Language yang artinya adalah bahasa markup atau penanda berbasis teks atau disebut juga sebagai formatting language.

HTML merupakan bahasa dasar yang digunakan untuk menampilkan halaman web pada web browser. Semua halaman web seperti google[dot]com, facebook[dot]com, twitter[dot]com, dan halaman website lainnya ditampilkan pada web browser menggunakan HTML.

Pada halaman google[dot]com misalnya, untuk dapat melihat tampilan kode HTML yang ada di dalamnya anda dapat melakukannya melalui dua tahapan berikut:

  1. Buka situs www[dot]google[dot]com, dan klik kanan di sembarang area.
  2. Kemudian pilih menu Inspect element

Maka pada baris pertama akan terlihat sebuah kode yang diawali dengan !DOCTYPE HTML, ini menandakan bahwa dokumen yang sedang anda buka adalah dokumen HTML.

Membuat Website Sederhana Dengan Coding Dasar HTML

Setelah melakukan beberapa persiapan di atas dan mengetahui tentang apa itu HTML, sudahkah anda siap untuk membuat website sederhana?

Yuk kita mulai membuat website sederhana menggunakan coding dasar HTML, hal ini tidak memerlukan waktu lebih dari lima menit. Berikut ini langkahnya:

1. Buka text editor, kali ini saya menggunakan Notepad

2. Masukan teks berikut:

Website Pertama Saya Menggunakan Coding Dasar HTML

3. Kemudian simpan, melalui menu File > Save As

4. Beri nama “Latihan Coding Dasar.html”

5. Save as type All Files

6. Klik Save

7. Kemudian, open file tersebut menggunakan Google Chrome.

Mudah bukan, membuat website menggunakan coding dasar HTML? Langkah di atas merupakan langkah mudah membuat website menggunakan file HTML.

Yuk kita lanjutkan pembahasannya!

Pengenalan Tag HTML

Seperti yang telah disampaikan di atas, bahwa HTML adalah bahasa markup atau penanda. Yaitu bahasa yang digunakan untuk me-markup suatu dokumen.

Sebagai contoh mudahnya adalah ketika kita membuat dokumen dengan menggunakan Microsoft Word, biasanya kita melakukan formatting pada teks seperti menebalkan teks, memberi garis bawah, memiringkan, membuat judul, membuat daftar, dan formatik yang lainnya.

Pada HTML, proses formatting ini sering disebut dengan proses markup yang dilakukan menggunakan tag HTML.

Misalnya untuk melakukan formating pada suatu teks pada website kita menjadi miring, dapat dilakukan dengen menambahkan “em” atau “i” pada file latihan yang sebelumnya telah kita buat, menjadi sebagai berikut:

Kemudian klik save, dan ketika dibuka kembali melalui browser maka kata Coding Dasar HTML akan menjadi miring.

Setiap tag HTML mempunyai pasangan penutupnya, tag penutup biasanya ditandai dengan penambahan tanda slash (/) sebelum nama tagnya.

Struktur File HTML

Tahap selanjutnya dalam pembelajaran coding dasar HTML adalah pengenalan tentang struktur file HTML.

Dalam membuat dokumen HTML terdapat beberapa aturan yang harus dipenuhi dalam penulisannya, ada beberapa tag yang harus dituliskan di dalamnya dan sudah menjadi suatu ketentuan.

Berikut ini adalah tag yang harus ada dalam sebuah file HTML

1. !DOCTYPE HTML

Kode dasar ini adalah tag awal dari setiap dokumen HTML. Tag ini berfungsi untuk memberikan informasi pada browser bahwa dokumen yang sedang dibuka adalah dokumen HTML.

Tag ini wajib dicantumkan pada setiap dokumen HTML yang anda buat.

2. HTML

Kode ini merupakan awal dari isi dokumen HTML, semua kode yang anda tulis harus berada di dalam tag ini.

3. Head

Tag head ini digunakan untuk menyimpan dan menyampaikan berbagai mancam informasi terkait dengan dokumen HTML.

4. Title

Tag title adalah salah satu informasi yang terdapat pada tag head. Title merupakan tag yang berfungsi untuk menampilkan teks judul pada browser.

5. Body

Demikianlah beberapa tag yang harus ada pada penyusunan dokumen HTML.

Untuk lebih jelasnya, silahkan langsung dipraktikan dengan memperbaiki file latihan kita sebelumnya menjadi kode seperti berikut:

 

 

Mudah dan begitu menyenangkan bukan, belajar tentang coding dasar HTML?

Semoga yang singkat ini dapat bermanfaat.

Artikel Terkait:
Bahasa Pemrograman Java

TAGS
#Belajar Website Pemula #Coding Dasar #Pemrograman Android #Software Pemrograman Android #Web Design #Web Developer
© 2023 BQ Islamic Boarding School, All Rights reserved
Login