Wednesday, December 21, 2016

HTML Part 1 : Pengenalan HTML


Assalamu'alaikum Wr Wb

Dalam pertemuan pada hari kedua ini saya akan memaparkan mengenai Pengenalan HTML. Langsung saja.


 A. PENGERTIAN
      Apa itu HTML?






  • HTML adalah bahasa markup standar untuk membuat halaman web.






  • HTML adalah singkatan dari Hyper Text Markup language.






  • HTML menggambarkan struktur halaman Web menggunakan markup.






  • Elemen HTML adalah blok bangunan dari halaman HTML.






  • Elemen HTML diwakili oleh tag.






  • HTML tag label potongan konten seperti "judu", "ayat", "table", dsb.
  • Browser tidak menampilkan tag HTML, tetapi menggunakan mereka untuk membuat isi halaman.


    • Hyper Text Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegrasi.

    B. LATAR BELAKANG

          Pada awalnya HTML hanyalah halaman-halaman berformat yang bisa dilihat oleh sedikit program browser. Sasaran awal HTML adalah menyajikan informasi teks yang memungkinkan pengguna terhubung atau beralih ke halaman-halaman web lainnya atau yang biasa disebut Hyperlink diantara isi dari website.


    C. MAKSUD & TUJUAN
         Bertujuan agar kita dapat memahami dan mengerti dasar dasar dari HTML.


    D. ALAT DAN BAHAN

        1. PC

        2. Sublime Text

        3. Web Browser : Mozilla Firefox, Google Chrome, Internet Explorer,dll.

    E. TAHAP PELAKSANAAN
    Struktur dasar dari HTML adalah sebagai berikut :
    <!DOCTYPE html>
    <html>
    <head>
        <title>Hallo Dunia</title>
    </head>
    <body>
    HALLO DUNIA
    </body>
    </html>

    CARA MENJALANKAN FILE HTML

    Yang harus kita lakukan untuk menjalankan File HTML kita harus Memiliki web browser ( Firefox, Chrome, Opera dll ) dan sebuah Text Editor , Kita pakai saja Notepad bagi sobat yang menggunakan Windows silahkan klik Menu Windows lalu Cari " Notepad ".


    Selanjutnya kita buka aplikasi Notepad atau aplikasi Text Editor lainya lalu ketikkan berikut

    <!DOCTYPE html>
    <html>
    <head>
        <title>Hallo Dunia</title>
    </head>
    <body>
    HALLO DUNIA
    </body>
    </html>



    Simpan teks diatas dengan cara klik menu File > Save As atau CTRL + SHIFT + S Dan berikan nama hallo.html dan simpan di folder sesuai keinginan sobat, buka folder tadi dan cari hallo.html Klik kanan > Open With > Firefox ( jika sobat menggunakan web browser firefox )

    CONTOH DOKUMEN HTML SEDERHANA
    Tag:
    <!DOCTYPE html>
    <html>
    <head>
    <title>Page Title</title>
    </head>
    <body>

    <h1>My First Heading</h1>
    <p>My first paragraph.</p>

    </body>
    </html>
    Outputnya :

    Keterangan :










  • Tag <!DOCTYPE html> deklarasi mendefinisikan dokumen ini menjadi HTML5.







  • Tag <html> elemen elemen akar halaman HTML.







  • Tag <head> elemen berisi informasi meta tentang dokumen.







  • Tag <title> elemen menentukan judul untuk dokumen.







  • Tag <body> elemen berisi konten halaman yang terlihat.







  • Tag <h1> elemen mendefinisikan judul besar.







  • Tag <p> elemen mendefinisikan sebuah paragraf.

    TAGS HTML
    Tag HTML adalah nama elemen dikelilingi oleh sudut kurung:
    <Tagname> isikan konten disini....
    </tagname>
    Keterangan :
    Tag HTML biasanya datang dalam pasangan seperti <p> dan </p>
    Tag pertama dalam pasangan adalah tag awal,  tag kedua adalah tag terakhir
    Tag akhir ditulis seperti tag awal, tetapi dengan gari miring dimasukkan sebelum nama tag.
    Tip: Awal tag juga disebut tag pembuka, dan tag akhir disebut tag penutup.

    Browser Web
    Tujuan dari web browser (Chrome, IE, Firefox, Safari) adalah untuk membaca dokumen HTML dan menampilkannya.
    Browser tidak menampilkan tag HTML, tetapi menggunakan mereka untuk menentukan bagaimana menampilkan dokumen:

     Struktur HTML Halaman
    Di bawah ini adalah visualisasi struktur halaman HTML:
    catatan:  hanya konten di dalam <body> (daerah putih diatas) ditampilkan dalam browser.

    Tag <!DOCTYPE html> Deklarasi
    Tag <!DOCTYPE html> deklarasi mewakili jenis dokumen, dan membantu browser untuk menampilkan halaman web dengan benar.
    Ini harus hanya muncul sekali, di bagian atas halaman (sebelum tag HTML).
    Tag <!DOCTYPE html> deklarasi tidak sensitif huruf.
    Tag <!DOCTYPE html> deklarasi HTML adalah:
    <!DOCTYPE html>

    Versi HTML
    Sejak hari-hari awal web, ada banyak versi HTML:

    Versi Tahun
    HTML 1991
    HTML 2.0 1995
    HTML 3.2 1997
    HTML 4.01 1999
    XHTML 2000
    HTML5 2014


    F. REFERENSI
    • https://id.wikipedia.org/wiki/HTML
     http://www.w3schools.com/html/html_intro.asp

    Sekian dari saya, apabila ada kesalahan dalam penulisan , tata letak, dll saya minta maaf yang sebesar-besarnya.

    Wassalamu alaikum Wr Wb.
    By Allif_sa at
    Labels: Postingan

    No comments:

    Post a Comment

    Subscribe to: Post Comments (Atom)