1 / 16

Aplikasi Jaringan III: Membuat Webpage Sederhana

Aplikasi Jaringan III: Membuat Webpage Sederhana. Matrikulasi Pedati 2005 Bahan diramu dari telaga.cs.ui.ac.id/WebKuliah/webdesign. Pendahuluan. Webpage dapat dibuat menggunakan bermacam-macam bahasa seperti HTML, XML, PHP, ASP, dll

omar-carr
Download Presentation

Aplikasi Jaringan III: Membuat Webpage Sederhana

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Aplikasi Jaringan III:Membuat Webpage Sederhana Matrikulasi Pedati 2005 Bahan diramu dari telaga.cs.ui.ac.id/WebKuliah/webdesign

  2. Pendahuluan • Webpage dapat dibuat menggunakan bermacam-macam bahasa seperti HTML, XML, PHP, ASP, dll • Dari sekian banyak bahasa, yang paling umum dan paling mudah adalah HTML

  3. HTML • HTML adalah singkatan dari HyerText Markup Language • HTML terdiri dari file teks biasa (dengan karakter ASCII), dengan tambahan tag-tag dan kode • File-file webpage dengan bahasa html biasa disimpan dengan ekstensi .html atau .htm (contoh: index.html)

  4. HTML Tag • Semua kode HTML ditulis menggunakan tag • Tag: diapit oleh tanda kurung < dan > • Contoh: <tag> Ini Budi </tag> • Tanda / merupakan penutup tag, menyatakan bahwa aturan tag tersebut hanya berlaku pada teks “Ini Budi” saja • Tag yang tidak dikenali akan diacuhkan

  5. Contoh HTML Tag <html> <head> <title> Halaman Web pertamaku </title> </head> <body> <center> <h1> Halaman web pertamaku </h1> </center> <p> Ini adalah halaman web pertamaku yang paling sederhana. </p> </body> </html>

  6. Tampilan Contoh HTML

  7. HTML Tag • Web browser tidak mempedulikan tag huruf besar maupun huruf kecil • Contoh: <title> text </title> sama saja dengan <TITLE> text </TITLE>

  8. Latihan • Jalankan Notepad • Tuliskan kode html • Simpan sebagai file dengan ekstensi .htm atau .html • Double-click file tersebut agar muncul di browser

  9. Tag-tag Lainnya <html> <head> <title> Web Page Basic </title> </head> <body bgcolor ="white" text = "blue"> <center> <!show the different height tags> <h1>Basic Web Page Design</h1> <h3>Basic Web Page Design</h3> <h5>Basic Web Page Design</h5> </center>

  10. Tag-tag Lainnya <!show the type of text tags> <hr> <p> This is an example of a very simple web page. <i> This is an example of a very simple web page. </i> <b> This is an example of a very simple web page. </b> <em> This is an example of a very simple web page. </em> This is an example of a very simple web page. Another line </body> </html>

  11. Tag-tag Lainnya

  12. Tag-tag Lainnya • Tag-tag lainnya dapat dilihat pada file html-tags.html • Kode-kode khusus dapat dilihat pada file special-char.html • Contoh lain file html yang mengandung tabel dan image dapat dilihat pada direktori Matrikulasi

  13. Tugas yang harus dibuat • Masuk ke bunga via SSH putty • Buat direktori public_html/ pada home bunga anda • Ubah direktori public_html menjadi dapat diakses orang lain menggunakan perintah chmod 755 • Simpan semua file web page Anda di direktori public_html tersebut. Setiap Anda menambahkan file baru, ketikkan perintah chmod 755 –R untuk mengubah permission semua file di directori public_html

  14. Tugas yang harus dibuat • Buat webpage yang memuat profil diri Anda, menggunakan Notepad dan Word • Buat minimal 3 file: • index.html: file yang berisi link ke xx.html dan yy.html • xx.html: file yang dibuat dengan notepad • yy.html: file yang dibuat dengan word atau lainnya • Webpage yang anda buat akan dapat diakses orang lain di jaringan JUITA dengan alamat url http://www.mhs.cs.ui.ac.id/~xxx dimana xxx adalah username anda, jadi buat webpage sebaik mungkin 

  15. Membuat html dengan Word • Microsoft Word juga dapat digunakan untuk membuat file html • Caranya sangat mudah  • Untuk membuat file baru: • Pilih menu File, kemudian pilih New, lalu pilih web page • Menu-menu pada Word akan berubah dengan sendirinya • Untuk mengubah file .doc ke .html: • Buka file di Word • Lalu pilih File lalu pilih Save as type: web page

  16. Mengapa harus dari dasar? • Mengapa harus belajar membuat html menggunakan notepad jika bisa dengan Word dan tools lainnya yang lebih canggih (NVU, MSDE, Dreamweaver, dll)? • Karena mempelajari dasar-dasar dari suatu bahasa selalu bermanfaat untuk memahami yang lebih kompleks • Membuat Anda terbiasa dengan kode tag ketika anda mempelajari web programming lebih lanjut.

More Related