Tampilkan postingan dengan label HTML. Tampilkan semua postingan
Tampilkan postingan dengan label HTML. Tampilkan semua postingan

Senin, 14 Agustus 2017

Membuat Form LOGIN


Assalamualaiku Wr. Wbr
Selamat Pagi tamen-teman.. Apa kabar hari ini? Semoga sehat dan selalu dalam lindungan-Nya. Aminn..
Langsung saja teman, dalam kesempatan pagi hari ini saya akan membahas mengenai Bagaimana cara membuat Form Login? Mari kita ulas.

A. Pendahuluan
    1. Pengertian
        Form(formulir dalam bahasa Indonesia) adalah dokumen dengan spasi (juga diberi nama field atau placeholder) untuk menulis atau memilih, untuk serangakaian dokumen dengan konten serupa.

    2. Latar Belakang
        Dalam suatu aplikasi mungkin diperlukan form login untuk dapat membka konten inti. Formlogin juga digunakan untuk memudahkan dalam masuk ke suatu aplikasi.

    3. Maksud dan Tujuan
        1. Share ilmu
        2. Membuat form untuk lebih mendalami bahasa pemrograman.

    4. Hasil yang diharapkan
        Semoga hasil dapat membantu teman-teman dalam menyelesaikan tugas pembuatan form. Juga saya dapat lebih mengingat cara membuat form.

B. Alat dan Bahan yang Diperlukan
    1. Laptop/ Komputer
     2. Sublime Text/Notepad++
   
C. Durasi Waktu
    Waktu yang diperlukan sekitar 5-10 menit.

D. Proses dan Tahapan
    1. Buka Laptop atau komputer anda

     2. Buka aplikasi Sublime Text/ Notepad++
       
     3. Buat New File, Lalu simpan dengan tipe data HTML(karena saya menggunakan html).
     4. Tuliskan script html, pada file yang telah disimpan.

     5. Tuliskan 'Membuat Form Login' pada Title

     6. Tuliskan tag <form> pada dalam body
   

     7. Masukkan input yang diperlukan di dalam form. Saya hanya memasukkan Username dan Password

     8. Tambahkan button untuk tombol Login.

     9. Setelah itu jangan lupa simpan.

    10.Buka file yang yang telah disimpan melalui web browser.


E. Hasil yang Didapatkan
    Form Login telah dibuat dengan baik. 
    
F. Temuan Permasalahan
    Kesalahan dan ketidak telitian dalam penulisan script.

G. Kesimpulan
    Form telah dibuat dengan baik, dan tidak susah. Kalau ingin lebih menarik bisa ditambah CSS.

H. Referensi
     https://translate.google.co.id/translate?hl=id&sl=en&u=https://en.wikipedia.org/wiki/Form_(document)&prev=search 


Terimakasih untuk semuanya, Semoga apa yang saya share dapat membantu teman-teman semuanya. 
Sampai jumpa selanjutnya.
Wassalamualaikum Wr. Wb
     

Selasa, 08 Agustus 2017

Cara Memasukkan Gambar pada HTML

Assalamualaikum Wr. Wb.
Bertemu lagi dengan saya! Apa kabar hari ini?? Semoga tetap selalu dalam lindungan Tuhan Yang Maha Esa.
Disini saya akan Membahas mengenai bagaimana cara memasukkan gambar pada HTML.
Mari langsung saja kita ulas bersama.

A. Pendahuluan
    1. Pengertian
       Gambar/gam·bar/ n tiruan barang (orang, binatang, tumbuhan, dan sebagainya) yang dibuat dengan coretan pensil dan sebagainya pada kertas dan sebagainya; lukisan;

    2. Latar Belakang
        Gambar adalah salah satu penarik minat baca seseorang. apalagi dengan adanya gambar kita akan lebih mudah dalam memahami suatu tujuan yang dibuat.

    3. Maksud dan Tujuan
          1. Mengetahui cara memasukkan gambar dengan HTML
          2. Lebih mengasah kemampuan

    4. Hasil yang Diharapkan 
         Semoga gambar dapat ditampilkan dengan sempurna di web browser.

B. Alat dan Bahan
    1. Sublime Text/Text Editor Lain
     2. Laptop/Komputer
     3. Web Browser

C. Waktu yang Dibutuhkan
     Kurang lebih 5-10 menit.

D. Proses dan Tahapan
     1. Pastikan laptop/komputer anda menyala
      2. Buka text editor anda.
     3. Ketikkan tag HTML
     4. Jangan lupa untuk menyimpannya, dengan type .html .
     5. Tuliskan dalam tag body
         <img src="...">


     6. Lalu, simpan lagi.
     7. Terakhir buka folder melalui web browser.
        

E. Hasil yang Didapatkan
    Gambar berhasil di upload dan dapt ditampilkan lewat web browser.

F. Temuan Permasalahan 
    Kurang ketelitian dalam memasukkan type gambar.

G. Referensi
    https://kbbi.web.id/gambar


Mungkin itu yang dapat saya sampaikan. Semoga sukses dan GoodLuck!
Wassalamualaikum Wr. Wb.

Sabtu, 05 Agustus 2017

Cara Membuat Tabel dengan HTML

Assalmualaikum Wr. Wb.
Apa kabar teman-teman? Semoga sehat selalu serta dalam lindungan-Nya. Langsung saja disini saya akan membahas mengenai bagaiman sih cara membuat tabrl dengan cript HTML??? Mau tahu ka bagaiman caranya?? Mari kita ulas!
A. Pendahuluan
    1. Pengertian
        Apa itu Tabel? Tebel adalah daftar yang berisi ikhtisar sejumlah data-data informasi yang biasanya berupa kata-kata maupun bilangan yang terusun dengan garis pembatas.

    2. Latar Belakang
        Dengan tabel kita akan lebih mudah dalam menbaca ataupun menerima informasi dengan lebih jelas dan lebih baik. Tapi itu juga tergantung pada orangnya, apakah dia dapat memahami informasi dengan tabel. karena mungkin dalam web, kita membutuhkan informasi yang berada dalam tabel.

    3. Maksud dan Tujuan 
        1. Mempermudah kita untuk membaca informasi
        2. Melatih penguasaan Scrypt

    4. Hasil yang Diharapkan
        Semoga dapat membantu teman-teman dalam memudahkan membuat tabel.

B. Alat dan Bahan
     1. Laptop
      2. Sublime Text/Notepad++

C. Jangka Waktu
     5-10 menit

D. Proses dan Tahapan
    1. Buka text editor anda

     2.Bila sudah mengoding sama seperti diatas coba disimpan.
      3. Setelah disimpan, buka filenya dengan web browser. Hingga muncul gambar seperti.
     4. Bila sudah muncul tabel seperti diatas, berabti kita berhasil dalam belajar membuat tabel.

E. Hasil yang Didapatkan


F. Temuan Permasalahan
    Mungkin ada sedikit kesalahan dalam mengoding script.


G. Referensi
     http://andraorahmin.blogspot.co.id/2014/01/pengertian-tabel-grafik-dan-bagan.html

Rabu, 02 Agustus 2017

Mari Belajar HTML 5


Assalamualaikum kawan...!!
Salam sejahtera untuk kita semua!! Kali ini saya akan membahas mengenai HTML5.

A. Pendahuluan

    1. Pengertian
        Hypertext Mark up Language (HTML). Adalah suatu metode untuk
mengimplementasikan konsep hypertext dalam suatu naskah atau dokumen. HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet.

    2. Latar Belakang 
        HTML merupkan standard bahasa yang di gunakan untuk menampilkan
document web, yang bisa anda lakukan dengan HTML yaitu:
  • Mengontrol tampilan dari web page dan contentnya.
  • Mempublikasikan document secara online sehingga bisa di akses dari seluruh dunia.
  • Membuat online form yang bisa di gunakan untuk menangani pendaftaran, transaksi secara online.
  • Menambahkan object-object seperti image, audi, video dan juga java applet dalam document HTML.

    3. Maksud dan Tujuan
        1. Untuk mempermudah kita dalam  mengoding script.
         2. Memudahkan untuk mengenali bahas pemrograman.


B.  Uraian
     1. Sejarah HTML 5
         HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML (yang pertama kali diciptakan pada tahun 1990 dan versi keempatnya, HTML4,
pada tahun 1997) dan hingga bulan Juni 2011 masih dalam pengembangan. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh
mesin. HTML5 merupakan salah satu karya Konsortium Waring Wera Wanua ( World Wide Web Consortium , W3C) untuk mendefinisikan sebuah bahasa markah tunggal yang dapat ditulis dengan cara HTML ataupun XHTML. HTML5 merupakan jawaban atas pengembangan HTML 4.01 dan XHTML 1.1 yang selama ini berjalan terpisah, dan diimplementasikan secara berbeda-beda oleh banyak perangkat lunak]] pembuat web.

     2. Fitur-Fitur HTML5
Tag <section>...</section>
Tag <SECTION> merupakan dokumen atau aplikasi bagian generik. Hal ini dapat digunakan bersama-sama dengan h1-h6 untuk menunjukkan struktur dokumen.
Tag <article>...</article>
Tag <ARTICLE> merupakan sepotong independen isi dokumen, seperti sebuah blog atau artikel koran.
Tag <aside>...</aside>
Tag <ASIDE> merupakan gambaran dari sebagian konten yang berhubungan dengan isi halaman.
Tag <header>...</header>
Tag <HEADER> merupakan bagian kepala dari dukumen.
Tag <footer>...</footer>
Tag <FOOTER> merupakan bagian catatan kaki yang dapat berisi informasi tentang penulis, informasi hak cipta, dll
Tag <nav>...</nav>
Tag <NAV> merupakan bagian dari dokumen yang dimaksudkan untuk memudahkan dalam proses navigasi.
Tag <figure>...</figure>
Tag <FIGURE> dapat digunakan untuk menghubungkan keterangan bersama-sama dengan beberapa konten tertanam, seperti gambar atau video.


G. Referensi
    Modul dari Sekolah