Scribd Logo
Unggah

Selamat datang di Scribd!

  • Laporan6 A1g021015 Jesicha Anastasia

    Diunggah oleh

    Jesicha Anastasia
    17 tayangan18 halaman
    HTML dan pemrograman komputer (coding) merupakan topik utama dalam laporan praktikum ini. Laporan ini membahas pengertian HTML, fungsi HTML, struktur dasar HTML, kelebihan dan kekurangan HTML, serta soal-soal praktikum seperti membuat teks "Hello World", mengubah warna latar belakang dan teks, membuat link, membuat margin, dan membuat paragraf.

    Deskripsi Asli:

    Judul Asli

    Laporan6 a1g021015 Jesicha Anastasia

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini
    HTML dan pemrograman komputer (coding) merupakan topik utama dalam laporan praktikum ini. Laporan ini membahas pengertian HTML, fungsi HTML, struktur dasar HTML, kelebihan dan kekurangan HTML, serta soal-soal praktikum seperti membuat teks "Hello World", mengubah warna latar belakang dan teks, membuat link, membuat margin, dan membuat paragraf.

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    17 tayangan18 halaman

    Laporan6 A1g021015 Jesicha Anastasia

    Diunggah oleh

    Jesicha Anastasia
    HTML dan pemrograman komputer (coding) merupakan topik utama dalam laporan praktikum ini. Laporan ini membahas pengertian HTML, fungsi HTML, struktur dasar HTML, kelebihan dan kekurangan HTML, serta soal-soal praktikum seperti membuat teks "Hello World", mengubah warna latar belakang dan teks, membuat link, membuat margin, dan membuat paragraf.

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    dari 18

    LAPORAN PRAKTIKUM 6

    KOMPUTER DAN PEMROGRAMAN (CODING)

    Disusun Oleh :

    Nama : Jesicha Anastasia

    NPM : A1G021015

    Kelas : 1A

    Asisten Dosen :

    1. Ratna Syafitri (G1F019021)

    2.Pradifta Irsyad Hidayat (G1F019022)

    Dosen Pengampu :

    Dedi Hamdani,S.Si.,M.Si.

    PROGRAM STUDI PENDIDIKAN GURU SEKOLAH DASAR

    FAKULTAS KEGURUAN DAN ILMU PENDIDIKAN

    UNIVERSITAS BENGKULU

    2021/2022

    1
    BAB I

    LANDASAN TEORI
    A. Pengertian HTML

    HTML adalah singkatan dari HyperText Markup Language. HTML adalah bahasa
    pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian
    dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet
    (Browser) . HTML dapat juga digunakan sebagai link link antara file-file dalam situs atau dalam
    komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam
    dunia internet.

    Hypertext adalah sebuah metode yang dipergunakan untuk berpindah laman web ke halaman
    web yang lain dengan mengklik sebuah tulisan ataupun simbol pada halaman website. Kemudian
    istilah markup adalah sebagai suatu hal yang dilakukan oleh tag HTML terhadap teks yang ada
    di dalamnya. Misalnya ketika kita mengetikan sebuah teks dengan tag pembuka <b> dan tag
    penutup </b> maka teks tersebut tampil pada halaman web sebagai teks dengan huruf yang tebal
    (bold). Sedangkan language adalah bahasa pemrograman atau script yang disusun dari tag-tag
    tertentu yang selanjutnya diterjemahkan ke dalam teks atau visual yang bisa dilihat pada
    tampilan website.

    B. Fungsi HTML

    Secara umum fungsi HTML yaitu, untuk mengelola serangkaian data dan informasi
    sehingga suatu dokumen bisa diakses dan ditampilkan di internet melalui browser.

    Sedangkan secara spesifik fungsi hmtl adalah sebagai berikut:

    • Untuk membuat halaman web yang bisa dibaca dan dipahami pengguna dengan mudah.
    • Untuk menampilkan berbagai informasi pada sebuah browser.
    • Untuk menandai teks pada sebuah halaman, pada sebuah halaman dokumen HTML
    ditulis dengan tag atau simbol tertentu di mana tag atau simbol tersebut menandai teks
    menjadi tebal dengan tag <b></b>, miring dengan tag <i></i> ,bergaris bawah dengan
    tahg <u></u> dan lain-lain.
    • Sebagai dasar sebuah website, tentunya sebuah website yang dibuat mempunyai berbagai
    macam fitur yang dibuat menggunakan bahasa PHP, Java Script, dan CSS. Semua bahasa
    tersebut bisa diaplikasikan apabila web mempunyai bahasa HTML sebagai dasanya.
    • Untuk menampilkan gambar, HTML video dan lain-lain pada halaman website.
    • Untuk membuat link menuju halaman web lain dengan kode-kode tertentu (hypertext).
    • Untuk menandai elemen dan membuat online form atau formulir digital, selain itu hmtl
    juga digunakan untuk menandai bagian-bagian dalam website diantaranya yaitu header,
    main, navigation, footer dan lain-lain.

    2
    C. Struktur Dasar HTML

    1. DOCTYPE atau DTD


    DOCTYPE yang merupakan singkatan dari Document Type Declaration dan juga dikenal
    sebagai DTD adalah deklarasi dokumen yang digunakan untuk menginfokan tipe
    dokumen dan versi HTML yang digunakan kepada aplikasi web browser. Penulisan
    DOCTYPE harus berada pada awal dokumen.
    2. Tag <html>
    Tag html digunakan untuk menginformasikan pada aplikasi web browser bahwa tipe
    dokomen tersebut adalah HTML. Tag html juga menjadi wadah untuk semua elemen
    HTML. Jadi, semua elemen harus berada di dalam tag tersebut kecuali DOCTYPE karena
    DOCTYPE bukan termasuk elemen melainkan deklarasi dokumen.
    Tag html merupakan tag yang membutuhkan penutup tag. Jadi kita harus menutup tag
    tersebut di akhir dokumen.
    3. Tag <head>
    Tag head merupakan tag yang berisi informasi tentang halaman yang tidak ditampilkan di
    halaman web browser. Misalnya: source css, js atau lainnya yang berasal dari luar,
    informasi meta, title, dan lainnya. Namun, khusus untuk tag <title> akan ditampilkan di
    title bar pada web browser. Tag <title> adalah tag yang berada di dalam head HTML
    yang berfungsi untuk menampilkan judul halaman web pada title bar web browser.
    4. Tag <body>
    Tag body merupakan tag yang berisi elemen-elemen yang ditampilkan di halaman web.
    Misalnya teks yang berupa paragraph <p>, heading <h1> hingga <h6>, menampilkan
    gambar <img />, membuat tabel <table>, dan lainnya. Di dalam tag body inilah konten
    visual dari halaman web ditempatkan.

    D. Kelebihan dan Kekurangan HTML

    a. Kelebihan HTML :

    • Digunakan secara luas dan memiliki banyak sumber serta komunitas yang besar.

    • Dijalankan secara alami di setiap web browser.

    • Mudah dipelajari.

    • Open-source dan sepenuhnya gratis.

    • Rapi dan konsisten.

    • Menjadi standar resmi web, dikelola oleh (W3C).

    • Integrasi mudah dengan bahasa backend, seperti PHP dan Node.js.

    3
    b. Kekurangan HTML :

    • Umumnya digunakan untuk halaman web statis. Untuk fitur dinamis, Anda bisa
    menggunakan JavaScript atau bahasa backend, seperti PHP.

    • Tidak bisa menjalankan logic. Alhasil, semua halaman web harus dibuat terpisah
    meskipun menggunakan elemen yang sama, seperti header dan footer.

    • Fitur baru tidak bisa digunakan dengan cepat di sebagian browser.

    • Perilaku browser terkadang sulit diprediksi. Misalnya, browser lama tidak selalu bisa
    merender tag yang lebih baru.

    4
    BAB II

    SOAL DAN PEMBAHASAN

    A. Soal
    1. Review praktikum mengenai pembuatan hello world, background, ganti warna
    background, mengganti warna tulisan, membuat link, dan lain-lain.

    B. Pembahasan
    1. Membuat program Hallo world

    Gambar 1.1

    Gambar 1.2

    5
    Penjelasan :

    Gambar 1.1 dan gambar 1.2 diatas merupakan input dan output untuk membuat program Hallo
    World. Saat menginput codingan, kemudian di simpan (ctrl+s) ke dalam file yang sudah dibuat
    sebelumnya yang bernama belajar HTML.

    2. Mengubah background

    Gambar 2.1

    Gambar 2.2

    6
    Penjelasan :

    Untuk mengubah background, hal pertama yang harus dilakukan adalah membuka browser atau
    pakai gambar yang ada. Setelah gambar sudah ditemukan kemudian simpan gambar di file
    belajar html tadi dan harus satu file tidak boleh terpisah. Disini saya menggunakan gambar logo
    Universitas Bengkulu seperti yang terlihat di gambar 1.4.

    3. Mengubah warna background

    Gambar 3.1

    Gambar 3.2

    7
    Penjelasan :

    Background warna di html dapat diubah. Kita bisa mengubah warna sesuai yang di inginkan
    dengan cara mencari kode warna html di google atau browser. Disini saya menggunakan warna
    merah dengan kode #FF0000.

    4. Mengganti warna teks Hallo World

    Gambar 4.1

    Gambar 4.2

    8
    Penjelasan :

    Sama seperti background, teks Hallo World juga bisa diganti warnanya sesuai yang di inginkan.
    Caranya dengan menuliskan text=”#(kode warna yang di inginkan)”. Kemudian di refresh dan
    warnanya akan berubah. Disini saya menggunakan warna aqua blue.

    5. Membuat link

    Gambar 5.1

    Gambar 5.2

    9
    Penjelasan :

    Selanjutnya yaitu membuat link. Caranya dengan menuliskan link=”#222222” dan dibawahnya
    ditulis href=”#”>Contoh Link</>. #222222 merupakan kode warna. Kita bisa memakai warna
    apa saja yang di inginkan. Href itu untuk membuat sebuah link. Dan tanda “#” setelah href itu
    dapat diubah ke link selanjutnya. Link ini hanya bisa menampilkan yang ada di dalam file belajar
    HTML tdi, contohnya seperti gambar.

    6. Membuat margin atau pembatas

    Gambar 6.1

    Gambar 6.2

    10
    Penjelasan :

    Selanjutnya yaitu membuat margin atau pembatas. Caranya dengan menuliskan


    topmargin=”200px”, kemudian di save dan di refresh. Lalu otomatis codingan tadi akan turun
    sesuai berapa margin yang kita masukkan. Disini saya menggunakan topmargin=”200px”.

    7. Membuat paragraph

    Gambar 7.1

    Gambar 7.2

    11
    Penjelasan :

    Tulis di bawah body :

    Ini adalah paragraf pertama

    Ini adalah paragraph kedua

    kemudian hasilnya saat di output tulisannya akan sejajar ke samping bukan seperti paragraf.

    - Jadi, di HTML itu jika ingin membuat paragraf maka menggunakan kode <p>.

    Contoh :

    <p> Ini adalah paragraf pertama </p>

    <p> Ini adalah paragraph kedua </p>

    Maka hasilnya nanti akan membentuk dua paragraf.

    - Jika ingin memiringkan tulisan maka gunakan <em>

    Contoh :

    Ini adalah paragraf <em> pertama </em> Ini adalah paragraf kedua

    - Nah berbeda lagi jika ingin mempertebal paragraf maka kita harus menggunakan kode
    <strong>

    Contoh :

    Ini adalah paragraf <em> pertama </em> Ini adalah paragraf <strong> kedua </strong>

    12
    8. Membuat size font yang berbeda-beda ukurannya

    Gambar 8.1

    Gambar 8.2

    13
    Penjelasan :

    Untuk membuat font dengan ukuran yang berbeda-beda maka menggunakan h (heading). Seperti
    yang ada pada gambar diatas, terlihat ukuran font semakin kebawah semakin mengecil. mulai
    dari <h1> yang terbesar sampai dengan <h6> ukuran yang paling kecil.
    Contoh :

    <h1> Contoh </h1> dan seterusnya sampai ke <h6> Contoh </h6>.

    9. Memanggil gambar yang ada di file

    Gambar 9.1

    Gambar 9.2

    14
    Penjelasan :

    Untuk memanggil gambar menggunakan kode <img src=”gambar.jpg” height=’80%”


    width=”20%” alt=”Ini Gambar”>
    Alt berfungsi jika gambar tidak ada maka yang muncul adalah tulisan Ini Gambar. Ukuran
    gambar juga bisa diubah.

    10. Membuat link yang bisa masuk ke suatu website

    Gambar 10.1

    15
    Gambar 10.2

    Penjelasan :

    <h1> Belajar Tag Link


    <a href=”http://www.unib.ac.id”>Universitas Bengkulu</a>
    Jika sudah maka di save, lalu kembali ke halaman tadi dan otomatis link Universitas Bengkulu
    muncul. Disini saya menggunakan link website Universitas Bengkulu.

    16
    BAB III

    KESIMPULAN DAN SARAN

    A. Kesimpulan
    HTML adalah singkatan dari HyperText Markup Language. HTML adalah bahasa
    pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian
    dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet
    (Browser) . HTML dapat juga digunakan sebagai link link antara file-file dalam situs atau dalam
    komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam
    dunia internet.

    HTML memiliki fungsi umum mengelola data dan informasi dan juga memiliki beberapa
    fungsi khusus seperti, untuk membuat halaman web yang bisa dibaca dan dipahami pengguna
    dengan mudah, untuk menampilkan berbagai informasi pada sebuah browser. HTML juga
    memiliki kelebihan dan kekurangan.

    B. Saran
    Semenjak adanya video rekaman materi yang diberikan oleh kakak-kakak asdos, materi
    pembelajaran menjadi lebih mudah dipahami. Selain itu, bagi yang ketinggalan pada saat
    pengerjaan coding juga dapat mengulang dengan panduan video yang diberikan. Terimakasih.

    17
    DAFTAR PUSTAKA
    https://www.hostinger.co.id/tutorial/apa-itu-html

    https://www.temukanpengertian.com/2013/06/pengertian-html.html

    https://itkoding.com/struktur-dasar-html/

    18

    Anda mungkin juga menyukai