PEMOGRAMAN WEB - PRAKTIKUM 1 (PENGENALAN HTML)

-
Hello anak TKJ, disini saya akan membahas tentang pemograman web, di praktikum pertama ini kita akan mengenal dulu sintax-sintax dari html.
Tujuan dari pembelajaran pemograman web ini agar anda terbiasa untuk membuat interface/tampilan yang di buka dengan browser contohnnya membuat halaman login internet yang menggunakan mikrotik, halaman pengumuman, porofolio dan masih banyak lagi.
Ok sekarang kita mulai ke pembahasan!.

Pertama anda siapkan terlebih dahulu text editor atau aplikasi yang dikhususkan untuk menulis kode program, jika belum ada silahkan download dahulu text editor nya, disini kita akan menggunakan yang namanya notepad++, silahkan download disini jika di komputer anda belum terinstal notepad++. jika sudah klik disini, pada situs resmi notepad++ cari tulisan DOWNLOAD dan klik, maka program akan otomatis terdownlod, sesudah di download lalu instal dan jalankan (saya rasa tidak perlu dijelaskan untuk cara menginstal aplikasinya).

Setelah terdownload silahkan buka notepad++, berikut tampilan awal untuk notepad++


Setelah notepad++ terbuka dengan lancar maka sekarang anda sudah dapat menulis kode pertama html anda, silahkan ketikan kode berikut pada ruang untuk menulis kodenya.


Setelah selesai menulis kode silahkan simpan dahulu file proyek anda dengan cara klik ikon save yang tersedia pada tools bar.


Buat terlebih dahulu folder bernama Latihan-HTML-nama_anda di Local Disk D: lalu buat file bernama html1_nama_anda.html lalu klik simpan (Local Disk D: -> Latihan-HTML-nama_anda -> html1_nama_anda.html). berikut adalah tampilan setelah anda menyimpan file proyek anda dengan benar.


Sesudah anda menyimpan file proyek pertama anda dengan benar, maka terlihat sedikit perubahan pada bar nama file sudah menjadi nama file yang sudah anda berikan serta kode tag sudah menjadi warna biru, apa itu kode tag?, kode tag adalah tanda yang menandai elemen-elemen dalam html yang terdiri dari (<) tanda lebih kecil, (>) tanda lebih besar serta (/) garis miring, untuk pembukaan pada tag elemen contohnya seperti <title>, <head> atau <body> dan untuk penutupnya masih seperti pembuka namun pembedanya adalah diawali dengan garis miring contohnya seperti ini </title>, </head> atau </body>, jadi jika anda akan membuat sebuah title pada html maka penulisan nya seperti ini <title>judul title</title>, pada kode tersebut terlihat di awali oleh pembuka tag dan di akhiri oleh penutupnya juga. 
Contoh dari kode yang anda tulis adalah pada tulisan Page Tittle, tulisan tersebut di bungkus oleh tag elemen title, dan pada tulisan This is a Heading  di bungkus dengan tag h1. apa sampai sini anda sudah mengerti? jika masih belum mengerti silahkan diskusikan lagi dengan guru praktikum anda.

Setelah anda paham dengan tag html maka sekarang saatnya untuk membuka file proyek anda dengan cara klik file tersebut maka akan otomatis terbuka pada web browser anda (saya kira sudah tidak perlu untuk dijelaskan apa itu web browser). 
berikut adalah tampilan dari kode yang anda tulis.



Jika anda sudah paham dari kode dasar yang tadi di jelaskan, saatnya untuk membuat kode lagi dengan rapi seperti ini.



Setelah di save lalu pada halaman web proyek anda silahkan di refresh / reload maka hasilnya akan seperti ini.


Pada tampilan di atas terlihat bahwa heading terbesar adalah tag <h1> dan heading terkecil adalah tag <h6>.

Nah sekarang pasti anda sudah mulai mengerti apa itu tag html, sekarang bagian tugas ya!!! 😁.

Tugas!!! 

(Tulisan "Tugas!!!" diatas pake tag <h2> loh...hehe)

  1. Apa kepanjangan dari singkatan HTML ?
  2. Cari macam-macam tag html!
  3. Terapkan tag yang sudah anda cari pada proyek kedua anda!
  4. Simpan Poyek kedua anda di folder bernama Latihan-HTML-nama_anda dengan file bernama tugas_html_2.html
Keterangan : Tugas akan di upload di classroom, jadi selain anda membuat proyek pada komputer lab sekolah, anda juga harus mengupload file html anda di post tugas yang sudah disediakan.
Selamat mengerjakan dan semoga berhasil!!!
Lokasi: Jl. H. Abdurahman No. 40 Ds. Tanggulun, Kadungora, Mekarbakti, Kadungora, Kabupaten Garut, Jawa Barat 44153, Indonesia

Komentar

Posting Komentar

Postingan populer dari blog ini

WAJIB TAU!!! MACAM-MACAM PESAN ERROR SAAT LOGIN SMKIKAKARTIKAnet / (Routerboard Mikrotik)

-
Gambar
Hello Pengguna SMKIKAKARTIKAnet, sebelumnya perlu diketahui bahwa Hotspot SMKIKAKARTIKAnet sudah di upgrade dan ditenagai oleh Routerboard dari vendor Mikrotik dengan level lisensi tertinggi atau level 6 (Keren kan? Sekolah di kampung aja server hotspot nya udah kaya hotel 😀😎hehehe). Pada perangkat tersebut sudah tertanam pesan error default yang dapat dirubah dan juga tidak dapat di rubah, contohnya saat anda salah memasukan password atau username akan muncul tulisan error " Username/Password Salah ", tulisan tersebut adalah pesan error yang dapat di rubah, jika pesan yang tidak dapat di rubah adalah pesan yang masih bertulisan bahasa inggris seperti " invalid password " dll. Berikut akan saya jelaskan keterangan dari pesan-pesan error tersebut. Invalid Username Or Password Pada pesan error tersebut pasti sudah tidak asing lagi dan jika tidak salah pesan error tersebut dapat dirubah dan sudah menjadi " Username / Password Salah ". So...
Baca selengkapnya

Konfigurasi Dasar Mikrotik - Praktikum 1

-
Gambar
Hello anak TKJ, kali ini saya akan membahas cara mengkonfigurasi Mikrotik Routerboard yang paling dasar atau awalan untuk memulai paraktikum mikrotik. Mikrotik/Routerboard yang saya gunakan adalah mikrotik dengan tipe RB951Ui-2Hnd (lihat mikrotik yang akan di praktikumkan apakah sudah sesuai). Baik sebelum memulai ke tutorial saya mohon untuk bersemangat karena tuorial disini akan lumayan panjang. Bissmillahirrahmanirrahim... Kita Mulai Tutorialnya!!! Pertama siapkan kabel LAN/UTP RJ45 dengan tipe straight, kenapa straight? karena kita akan menghubungkan perangkat berbeda dalam jaringan yaitu PC/Laptop ke Routerboard. Kedua siapakan Routerboardnya!!, setelah kabel dan Routerboard sudah ada maka langsung ke tahap 3. Ketiga pastikan Routerboard sudah menyala(saya kira tidak perlu dibahas cara untuk menyalakan Routerboard) Selanjutnya hubungkan PC/Laptop anda ke Routerboard menggunakan kabel UTP yang sudah disediakan(Pastikan kabel UTP tidak dipasang di Port 1 pada Routerboard,...
Baca selengkapnya

PRAKTIKUM 2 - KONFIGURASI DASAR MIKROTIK

-
Gambar
Hai anak-anak TKJ, sekarang kita akan lanjut lagi ke bagian praktikum 2 dari pembahasan Routerboard Mikrotik, pada praktikum pertama anda diharuskan untuk mengkonfigurasi Routerboard agar mampu terhubung ke internet, nah untuk praktikum yang kedua ini anda diharuskan untuk memberi akses internet pada klien dibawah Routerboard anda atau PC yang anda gunakan saat ini. untuk menghubungkan klien ke internet caranya cukup mudah, konsepnya anda harus memberikan IP terlebih dahulu pada ether yang tersambung ke klien, misalkan klien terhubung ke routerboard pada ether 2, nah pada ether 2 tersebut anda harus menyetel IP pada routerboard dan klien nya juga. ok langsung saja lihat ulasannya dibawah ini! Untuk yang belum paham di praktikum 1, silahkan dilihat kembali modul Konfigurasi Dasar Mikrotik - Praktikum 1  (Klik judul berikut untuk menuju modul praktikum 1). Pertama pastikan pada interface ether 2 anda sudah di beri IP (caranya sudah di bahas di praktikum 1) Misalkan pada...
Baca selengkapnya