Scribd Logo
Unggah

Selamat datang di Scribd!

  • Tag Dasar

    Diunggah oleh

    Tasya Nabila
    3 tayangan25 halaman

    Judul Asli

    Tag Dasar.ppt

    Hak Cipta

    © © All Rights Reserved

    Format Tersedia

    PPT, PDF, TXT atau baca online dari Scribd

    Apakah menurut Anda dokumen ini bermanfaat?

    Apakah konten ini tidak pantas?

    Laporkan Dokumen Ini

    Hak Cipta:

    © All Rights Reserved
    Unduh sebagai PPT, PDF, TXT atau baca online dari Scribd
    Tandai sebagai konten tidak pantas
    3 tayangan25 halaman

    Tag Dasar

    Diunggah oleh

    Tasya Nabila

    Hak Cipta:

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

    PK&TI 2C

    (Minggu ke-6)
    03/31/20
    Rr. Artiana Krestianti
    SAP PK&TI 2C 1
    Pendahuluan
    HTML merupakan singkatan dari HyperText Markup
    Language. Dokumen HTML adalah file text murni yang
    dapat dibuat dengan editor text sembarang dan dikenal
    sebagai web page. Untuk mempelajari HTML saat ini
    tidaklah sulit karena sudah banyak program yang mampu
    menghasilkan dokumen dalam format HTML, misalnya
    semua produk Microsoft Office, HotMetal, HotDog,
    HTMLLed dsb. Bahkan dengan hadirnya Microsoft
    Frontpage 2000 dan Frontpage XP (experience) untuk
    membuat dokumen atau web page sudah sangat mudah
    sekali, karena berbagai kebutuhan yang berhubungan
    dengan pembuatan web page sudah tersedia seperti
    component, hyperlink dan sebagainya. Pada kuliah kita
    yang dipakai adalah editor teks biasa yaitu notepad.
    03/31/20 SAP PK&TI 2C 2
    Pemberian Nama Document
    Html
    Dalam memberi nama dokumen HTML, pilihlah
    sembarang nama kemudian tambahkan
    sebuah ektensi .htm atau .html. Pemberian
    nama bersifat case sensitive, maksudnya
    pemberian nama dengan menggunakan case
    berbeda akan dianggap dokumen yang
    berbeda. Misalnya latihan1.htm akan beda
    dengan Latihan1.htm. File yang berakhiran
    HTM atau HTML ini sama untuk berbagai jenis
    sistem operasi seperti Linux, Unix, Windows
    dan sebagainya.
    03/31/20 SAP PK&TI 2C 3
    Elemen HTML

    Dokumen HTML disusun oleh elemen-


    elemen. Elemen merupakan istilah bagi
    komponen-komponen dasar pembentuk
    dokumen HTML. Beberapa contoh elemen
    adalah : head, body, table, paragraf, list,
    dan lain-lain. Elemen dapat berupa teks
    murni, atau bukan teks, atau kedua-nya.

    03/31/20 SAP PK&TI 2C 4


    Definisi Tag
    Untuk menandai berbagai elemen dalam suatu
    dokumen HTML, kita menggunakan tag.
    Petunjuk
    menggunakan tag adalah :
    • Tag pada HTML terdiri atas sebuah angle
    bracket (kurung sudut) kiri, sebuah nama
    tag, dan sebuah angle bracket (kurung
    sudut) kanan. Cara penulisan (syntax) nya
    <nama
    sebagai tag>
    berikut : ………...
    03/31/20
    </nama tag>SAP PK&TI 2C 5
    Definisi Tag (lanjutan)

    • Pada umumnya tag berpasangan. Tag


    pertama menunjukkan tag awal elemen
    dan tag kedua menandakan tag akhir
    elemen. Tag yang menunjukkan akhir
    elemen diberi garis miring (/). Contoh :
    <html> ..................... </html>
    <head> .................... </head>
    <title> ....................... </title>
    <body> ..................... </body>
    03/31/20 SAP PK&TI 2C 6
    Definisi Tag (lanjutan)
    • Tag HTML tidak case sensitive. <b> berarti
    sama dengan <B>.
    • Jika dalam suatu tag ada tag lagi, maka
    penulisan tag akhir tidak boleh bersilang,
    harus berurut. Misalkan :
    • <b><I>Huruf Tebal dan Miring<I><b>
    • Ada beberapa elemen yang tidak mengharus-
    kan tagnya ditulis secara berpasangan,
    elemen tersebut antara lain adalah :

    03/31/20 SAP PK&TI 2C 7


    Definisi Tag (lanjutan)
    – Paragraf (paragraph) dengan tag <p>
    – Ganti baris (line break) dengan tag <br>
    – Garis mendatar (horizontal rule) dengan tag <hr>
    – Daftar data (list) dengan tag <li>
    Sebagai catatan, biasakanlah menulis tag
    secara berpasangan agar kita mudah mengenali
    batasan awal dan akhir dari suatu elemen HTML.
    Selain itu, tag yang berpasangan sangat
    dianjurkan oleh W3C.

    03/31/20 SAP PK&TI 2C 8


    Elemen dalam Html
    Secara umum dokumen web dibagi menjadi dua bagian yaitu head
    dan body. Sehingga setiap dokumen html harus mempunyai pola
    dasar sebagai berikut :
    <html>
    <head> informasi tentang dokumen HTML yang ditampilkan

    dalam caption browser web.


    </head>
    <body> informasi yang ditampilakn dalam windows browser
    web.
    </body>
    </html>
    03/31/20 SAP PK&TI 2C 9
    Elemen Dasar Html
    Elemen dasar HTML terdiri dari beberapa hal :
    • Setiap dokumen html harus diawali dengan menuliskan
    tag <html> dan tag</html> diakhir dokumen. Tag ini
    menandai bahwa dokumen ini adalah dokumen HTML.
    Dalam satu dokumen hanya ada satu elemen html.
    • Elemen head ditandai dengan tag <head> dan diakhiri
    dengan tag </head>. Bagian ini berisi informasi tentang
    dokumen HTMLnya. Minimal informasi yang dituliskan
    dalam elemen ini adalah judul dari dokumen, judul ini
    akan ditampailkan pada caption browser web, ditandai
    dengan menggunakan tag <title> dan diakhiri dengan
    </title>.
    03/31/20 SAP PK&TI 2C 10
    Elemen Dasar Html
    • Elemen body ditandai dengan tag <body> dan diakhiri
    </body>. Bagian ini merupakan elemen terbesar di
    dalam dokumen html. Elemen ini berisi isi dokumen
    yang akan ditampilkan pada windows browser web,
    meliputi paragraf, grafik, link, tabel dan sebagainya.
    • Untuk hasil yang maksimal, cobalah menuliskan
    dokumen HTML, kemudian lihatlah hasilnya. Dapat
    dimulai dengan membuat direktori kerja di drive C
    misalnya dengan nama latihan kemudian buat lagi sub
    direktori dengan nama html. Buatlah dokumen HTML
    dengan menggunakan teks editor notepad dan
    tampilkanlah hasilnya pada browser internet explorer.

    03/31/20 SAP PK&TI 2C 11


    Persyaratan System
    Persyaratan systemnya :
     Sebuah komputer yang siap web.
    Komputer dengan windows 95/ 98/ NT,
    Mac atau Unix.
     Editor teks, notepad atau lainnya.
     Koneksi ke server web (kalau mungkin
    koneksi ke internet).
     Browser web, direkomendasikan Internet
    Explorer atau Mozilla Firefox atau Google
    Chrome.
    03/31/20 SAP PK&TI 2C 12
    Belajar Html
    Belajar HTML akan lebih efektif, jika kita sering
    berlatih dan melihat bagaimana programmer
    web lain membuat HTML. Apabila anda kagum
    akan hasil karya programmer web yang mungkin
    tampilannya sangat menarik di browser web,
    anda dapat mengetahui penulisan dokumen
    HTMLnya degan cara klik menu VIEW pada menu
    bar standard, kemudian pilih SOURCE atau PAGE
    SOURCE. Hal ini akan membuka sebuah window
    baru yang memperlihatkan HTML sebenarnya
    dari page tersebut. Dengan melihat source ini,
    diharap-kan anda dapat melihat dan
    mempelajari tehnik untuk menghasilkan
    halaman web yang menarik tadi.

    03/31/20 SAP PK&TI 2C 13


    Tag-tag Dasar Html
    TAG KEGUNAAN
    AWAL
    <html> Mendefinisikan sebuah dokumen
    HTML
    <head> Mendefinisikan caption browser web
    <body> Mendefinisikan isi dokumen
    <h1> - Mendefinisikan heading 1 sampai
    <h6> dengan 6
    <p> Mendefinisikan sebuah paragraf
    <br>
    03/31/20 Menyisipkan line
    SAP PK&TI 2C break (ganti baris) 14
    Format Teks Html
    TAG AWAL KEGUNAAN
    <b> Mendefinisikan teks yang ditebalkan
    <big> Mendefinisikan teks yang
    dibesarkan
    <small> Mendefinisikan teks yang dikecilkan
    <strong> Mendefinisikan teks yang ditebalkan
    <sub> Mendefinisikan teks subscript
    <sup> Mendefinisikan teks superscript
    <em> Mendefinisikan teks yang ditekan
    <i> Mendefinisikan teks yang
    03/31/20 SAP PK&TI 2C 15
    dimiringkan
    Format Teks Html
    TAG AWAL KEGUNAAN
    <ins> Mendefinisikan teks yang disisipkan
    <del> Mendefinisikan teks yang dihapus
    <strike> Mencoret teks yang ada
    <pre> Menyiapkan format teks terlebih
    dahulu
    <abbr> Mendefinisikan suatu singkatan
    <acronym Mendefinisikan suatu akronim
    >
    <blockquo Mendefinisikan kutipan panjang
    03/31/20
    te> SAP PK&TI 2C 16
    Karakter Html
    Beberapa karakter mempunyai arti khusus
    dalam HTML. Jika menginginkan browser web
    untuk menampilkan karakter-karakter tersebut,
    kita harus menyisipkan entitas karakter ke
    dalam source HTML. Entitas karakter
    mempunyai tiga bagian :
    – Sebuah ampersand (&)
    – Sebuah nama entitas
    – Sebuah nomor entitas (#)
    – Sebuah tanda titik koma (;)
    03/31/20 SAP PK&TI 2C 17
    Karakter Html
    HASI KETERANGAN NAMA NOMOR
    L ENTITA ENTITAS
    S
    © Copyright &copy; &#169
    ® Registered &reg; &#174
    ™ Trademark &#8482
    Non-breaking &nbsp; &#161
    space
    & Ampersand &amp; &#138
    “
    03/31/20 Angle quotation &laquo;
    SAP PK&TI 2C &#171 18

    mark
    Karakter Html
    HASI KETERANGAN NAMA NOMOR
    L ENTITA ENTITAS
    S
    “ Angle quotation &raquo &#187
    mark ;
    " Tanda Kutip &quot; &#34
    < Lebih kecil &lt; &#60
    > Lebih besar &gt; &#61
    X Tanda kali &times; &#215
    :
    03/31/20 Tanda bagi &devid
    SAP PK&TI 2C &#247 19

    e;
    Contoh Tampilan Tag Dasar

    03/31/20 SAP PK&TI 2C 20


    Contoh Program Tag Dasar

    03/31/20 SAP PK&TI 2C 21


    Contoh Tampilan Format Teks

    03/31/20 SAP PK&TI 2C 22


    Contoh Program Format Teks

    03/31/20 SAP PK&TI 2C 23


    Contoh Program Format Teks

    03/31/20 SAP PK&TI 2C 24


    03/31/20 SAP PK&TI 2C 25

    Anda mungkin juga menyukai