Scribd Logo
Unggah

Selamat datang di Scribd!

  • Yoseph Deka Trifishka - 20293478 - C - Tugas HTML&CSS

    Diunggah oleh

    Yoseph Deka
    10 tayangan8 halaman
    Tugas CSS dan HTML

    Judul Asli

    Yoseph Deka Trifishka_20293478_C_Tugas HTML&CSS

    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
    Tugas CSS dan HTML

    Hak Cipta:

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

    Yoseph Deka Trifishka - 20293478 - C - Tugas HTML&CSS

    Diunggah oleh

    Yoseph Deka
    Tugas CSS dan HTML

    Hak Cipta:

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

    Nama: Yoseph Deka Trifishka

    NIT: 20293478
    Kelas: C
    Tugas Studio Penyusunan SIP dan Analisis Tata Ruang: Membuat ringkasan materi tentang
    bahasa pemrograman Hypertext Markup Language (HTML) dan Cascading Style Sheet (CSS)

    1. HYPERTEXT MARKUP LANGUAGE (HTML)


    A. Tentang HTML
    • HTML adalah kepanjangan dari Hypertext Markup Language. Perlu diketahui
    bawah HTML bukan termasuk bahasa pemrograman, melainkan HTML adalah
    markup standar untuk membuat dan menyusun halaman pada aplikasi
    website.HTML adalah pondasi awal dalam mengembangkan halaman website
    yang disusun secara terstruktur dari segi tampilan desain dan fungsinya
    • Ada dua aplikasi yang digunakan untuk membuat suatu dokumen HTML yang
    terdapat pada komputer, diantaranya adalah text editor dan web browser.
    - Text editor berfungsi sebagai tempat untuk membuat dokumen HTML yang
    terdiri dari kodekode HTML.
    - Web browser berfungsi untuk menerjemahkan dokumen HTML yang telah
    dibuat menjadi halaman website yang berisi teks, gambar, suara atau video
    • Kode HTML yang kita buat akan diterjemahkan oleh web browser agar tampil
    seperti yang dirancang. Pada dasarnya seluruh web browser dapat menampilkan
    kode HTML sama baiknya, namun jika sudah berbicara mengenai desain halaman,
    tiap-tiap browser memiliki beberapa perbedaan.
    B. Sejarah Perkembangan HTML
    Menurut sejarahnya, HTML pertama kali diperkenalkan pada tahun 1990-an.
    Tim Berners-Lee pada tahun 1989 menciptakan HTML sederhana namun sangat efektif
    untuk pengkodean dokumen elektronik. Web browser pada zaman itu digunakan untuk
    membuka dokumen-dokumen dengan format HTML. Pada saat tahun 90-an inilah yang
    menjadi sejarah lahirnya HTML sehingga dinamakan HTML versi 1.0. Sebelum versi
    HTML yang terbaru keluar, ada proses panjang harus melalui persetujuan dari W3C
    (World Wide Web Consortorium) dengan evaluasi yang ketat. Dengan adanya seperti
    ini, setiap ada perkembangan versi terbaru dari HTML bisa dipastikan ada update dan
    fitur baru dari versi sebelumnya. Sampai saat ini versi HTML yang terbaru sudah
    sampai HTML veris 5.0
    C. Pengertian Tag, Elemen dan Atribut pada HTML
    1) Tag
    • Pengertian tag HTML adalah tanda awalan dan akhiran dalam perintah HTML
    yang bisa dibaca oleh web browser.
    • Fungsi tag HTML adalah berbeda-beda tergantung dari perintahnya, seperti
    membuat judul, paragraf, heading, cetak tebal (bold), miring (italic), dan lain
    sebagainya. Contohnya, jika menuliskan perintah <italic>, tag tersebut akan
    menampilkan teks dengan format miring/italic di browser.
    • Dari awal ditemukannya, tag HTML hanya berjumlah 18. Namun, saat ini tag
    HTML sudah berkembang menjadi lebih dari 250 tag.
    • Beberapa contoh tag

    2) Elemen
    • Elemen HTML adalah bagian yang berisi keseluruhan kode dari tag pembuka
    dan tag penutup. Sebagai contohnya adalah <bold>Belanja HTML</bold>.
    • Terkadang elemen juga ditambahkan atribut, sebagai contohnya: <p align =
    “center”> Selamat Pagi!</p. Pada contoh di atas, terdapat satu elemen <p>
    dengan atribut align=”center” dan memiliki isi berupa teks, yaitu Selamat Pagi!
    • Elemen juga tidak selalu berisi tentang teks, kadang juga berisi elemen lain
    yang biasanya disebut dengan nested element atau lebih gampangnya disebut
    elemen di dalam elemen. Supaya lebih jelas berikut adalah contoh nested
    element.

    • Dari contoh di atas dapat dilihat bahwa dari tag pembuka <html> lalu tag
    <body> berisi elemen tag heading dan elemen tag paragraf.
    3) Atribut
    • Atribut HTML adalah kata khusus yang berada di dalam tag pembuka. Atribut
    juga disebut sebagai modifier yang akan menentukan makna dari elemen.
    Atribut bisa ditambahkan pada elemen apapun. Ada juga elemen yang
    mewajibkan menggunakan atribut seperti elemen <a>, <img>, <video>, dan
    lain-lain.
    • Tiap-tiap elemen ini memiliki atribut khusus yang hanya bisa digunakan pada
    elemen tersebut. Berikut jenis – jenisnya:
    D. Fungsi HTML
    1) Membuat halaman website
    2) Sebagai dasar website
    3) Menandai teks pada halaman website
    4) Menampilkan media (video, gambar, tabel, dan lain-lain) di website
    5) Memungkinkan pengguna untuk diarahkan ke website lain

    2. CASCADING STYLE SHEET (CSS)


    A. Tentang CSS
    • CSS (Cascading Style Sheet) adalah suatu bahasa stylesheet yang digunakan untuk
    mengatur tampilan suatu website, baik tata letaknya, jenis huruf, warna, dan semua
    yang berhubungan dengan tampilan. Pada umumnya CSS digunakan untuk
    menformat halaman web yang ditulis dengan HTML atau XHTML.
    • Contohnya seperti memberi warna pada huruf, menebal / memeringkan huruf, dan
    masih banyak lagi. Tampilan website yang hanya menggunakan HTML akan
    terlihat membosankan, maka dari itu diciptakannya CSS.
    B. Sejarah Perkembangan CSS
    Perkembangan CSS dibagi menjadi tiga periode:
    1) CSS 1
    Pada tanggal 17 Agustus 1996 World Wide Web Consortium (W3C)
    menetapkan CSS sebagai bahasa pemrograman standard dalam pembuatan web.
    Tujuannya adalah untuk mengurangi pembuatan tag-tag baru oleh Netscape dan
    Internet Explorer, karena kedua browser tersebut sedang bersaing mengembangkan
    tag sendiri untuk mengatur tampilan web.
    CSS 1 Mensupport :
    • Jenis Font
    • Warna Text, Background, dan Elemen lainnya
    • Text attribute seperti spasi antar huruf, surat, dan baris text
    • Alignment text atau gambar seperti rata kiri, kanan, dan tengah
    • Margin, Border, Padding, dan Positioning untuk kebanyakan elemen
    • Mengidentifikasi & menklarifikasi secara generik dan unik sebuah group
    attribute
    2) CSS 2
    Spesifikasi CSS 2 dipublish dan dikembangkan oleh W3C pada Mei 1998.
    Merupakan Upgrade dari CSS 1, CSS 2 memiliki fitur baru seperti Positioning suatu
    Elemen atau Z-Index secara absolut, relatif, dan tepat. CSS 2 menekankan pada fitur
    Accessibility and Capacibilty kususnya pada media-specific CSS. CSS 2
    dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa
    ditampilkan di printer.
    3) CSS 3
    CSS 3 adalah versi terbaru dari CSS yang memiliki banyak kelebihan untuk
    mendesain website agar terlihat unik dan menarik. CSS 3 mampu menyisipkan
    animasi, seperti animasi gambar dan animasi 3D. Desain yang ada pada CSS 3
    bersifat responsive, jadi sangat kompatibel dengan desktop maupun smartphone.
    Selain itu, fitur terbaru yang dimiliki CSS 3 adalah Animation, Multiple-
    Background, Drop-shadow, CSS Object-model, CSS Math, dan masih banyak lagi.
    C. Fungsi CSS
    CSS berfungsi sebagai media untuk merepresentasikan suatu tampilan (huruf,
    gambar, dan yang lainnya) pada halaman website. Kode yang ada pada CSS bertujuan
    untuk memperindah tampilan dan memperbaiki user-interface website.
    D. Cara Menuliskan CSS
    • Ada dua cara yang bisa diterapkan untuk menggunakan CSS pada web. Cara
    yang pertama adalah dengan membuat CSS langsung didalam satu file HTML
    kita (internal / inline style sheet). Cara yang kedua adalah dengan cara
    memanggil CSS tersebut dari file CSS tersendiri (external style sheet).
    • Cara pemakaian CSS ada 2 cara. Cara yang pertama adalah dengan
    menggabungkan CSS langsung ke dalam satu file markup (internal), cara yang
    kedua adalah dengan cara memanggil CSS tersebut (eksternal). Internal CSS
    semua kode CSS dan markup dimasukkan dalam satu file yang sama, sedangkan
    jika memakai eksternal CSS diperlukan link untuk menghubungkan keduanya.
    • Penulisan dengan cara Inline artinya bahwa code css tersebut dituliskan
    langsung dibagian program yang sedang anda buat.
    • Penulisan dengan Embedded artinya bahwa code css tersebut dituliskan
    langsung atau dibenamkan pada bagian atas program yang sedang anda buat dan
    pada bagian penggunaan cukup menuliskan selector dari css tersebut disertai
    dengan parameter yang ada
    • Penulisan dengan Embedded Class hampir sama dengan penulisan embedded,
    tetapi disini dalam penggunaannya menggunaka clausa class pada bagian text
    yang ingin ditampilkan.
    • Cara Penulisan css berikutnya adalah dengan Linked Style Sheet yaitu dengan
    cara menuliskan code css tersebut disebuah file yang terpisah kemudian
    memanggilnya dengan menggunakan perintah link, untuk menggabungkanya
    dengan program utama yang memanggil.
    E. Kelebihan & Kekurangan CSS
    Sama halnya dengan bahasa pemrograman lain, Css juga memiliki kelebihan dan
    kekurangannya tersendiri. Berikut ini adalah kelebihan dan kekurangan dari CSS
    1) Kelebihan
    • CSS sangat mudah dipelajari bahkan untuk pemula sekalipun
    • CSS memisahkan antara Desain dan konten yang ada pada blog / website
    • Pengaturan desain bisa anda tentukan sendiri dengan bebas
    • Multi Funcion – 1 file CSS bisa anda gunakan beberapa kali, jadi anda
    tidak perlu repot-repot membuat banyak file CSS.
    • Menghemat waktu kamu ketika membuat maupun mengedit halaman web
    • Size memory yang kecil. Karena file css terpisah, membuat ukuran file
    HTML anda relatif lebih kecil
    2) Kekurangan
    • Karena tidak semua browser sama dalam mengartikan CSS, terkadang
    prosesnya memakan waktu
    • Adanya kemungkinan tampilan yang berbeda antara satu browser, dengan
    browser yang lainnya
    F. Contoh Penggunaan CSS

    Gambar diatas merupakan contoh HTML tanpa Script Code CSS


    Gambar diatas merupakan contoh HTML dengan Script Code CSS. Dengan
    menyisipkan script code CSS, maka akan memberikan sedikit warna pada website
    SUMBER:
    https://www.jagoanhosting.com/blog/html-adalah/
    https://www.techfor.id/panduan-lengkap-belajar-css/
    Kaban, R. and Sembiring, D.J., 2021. HTML (HyperText Markup Language) Pengantar
    Pemrograman Berbasis Web. Insan Cendekia Mandiri.
    Poetra, A., 2003. Tutorial Cascading Style Sheet (CSS). Kuliah Umum IlmuKomputer. Com.
    Sinaga, A.R., Situmeang, S.A., Gurion, B., Manihuruk, M.F. And Sitanggang, P.M., 2021.
    Pelatihan Pembuatan Hypertext Markup Language (HTML) Dan Internet Blog Bagi
    Anak-Anak Panti Asuhan Elim Pematangsiantar. Jurnal Penelitian Dan Pengabdian
    Masyarakat Nommensen Siantar, 1(1), pp.51-60.
    Suryana, T., 2021. Bab 1. Pengenalan Html.
    Suryana, T., 2021. Pengenalan Css Cascading Style Sheet.

    Anda mungkin juga menyukai