PELATIHAN INTERNET Oleh : TIM TI FT UNP. Pendahuluan Pertama-tama puji syukur kita sampaikan kepada Allah SWT dan Salawat beserta salam kita persembahkan.

Presentasi berjudul: "PELATIHAN INTERNET Oleh : TIM TI FT UNP. Pendahuluan Pertama-tama puji syukur kita sampaikan kepada Allah SWT dan Salawat beserta salam kita persembahkan."— Transcript presentasi:

1 PELATIHAN INTERNET Oleh : TIM TI FT UNP

2 Pendahuluan Pertama-tama puji syukur kita sampaikan kepada Allah SWT dan Salawat beserta salam kita persembahkan kepada Rasullullah Muhammad SAW. Semoga kegitan ini dari mulai hingga berakhir bernilai nilai ibadah dan berbuah keberkatan dari Allah SWT. Sesuai dengan perkembangan teknologi informasi kebutuhan ilmu dan pengetahuan serta informasi sangat diperoleh oleh semua pihak. Internet sudah menjadi kebutuhan. Bahkan sudah menjadi gaya hidup.

3 Pendahuluan Untuk pembuatan WEBSIDE dibutuhkan beberapa keperluan diantaranya : Pengetahuan dasar tentang HTML Pengetahuan dasar tentang warna dan design web Penataan halaman WEB Upload ke server Membuka halaman WEB

4 Dasar HTML Dimulai dari yang pertama yaitu pengenalan dasar tentang HTML. HTML adalah kependekan dari Hypertext Markup Language dan merupakan bahasa markup yang mengatur sebuah dokumen ditampilkan pada browser.Standart HTML dibuat dengan berdasarkan SGML (Standart Geeralized Markup Language) dan memiliki DTD ( Document Type Definition) yaitu merupakan dokumen yang mengatur sintaks HTML. Sitaks HTML dapat dituliskan diberbagai program pengolahan text salah satunya Notepade, tetapi saat sekarang ini pemograman web sudah dibantu oleh berbagai software aplikasi perancangan web seperti Macromedia Dreamweaver atau Microsoft Frompage.

5 Dasar HTML Struktur Dasar HTML Adalah : Judul Informasi atau isi yang akan disampaikan

6 Dasar HTML Jadi jika diperhatikan dapat dilihat bahwa sebenarnya HTML merupakan sutau bahasa yang terdiri dari banyak. Tag adalah suatu kode standart yang diawali dengan tanda kurung siku terbuka dan tanda kurung siku tertutup. Tag dapat berarti sebagai permulaan perintah dan akhir dari perintah, perbedaanya terletak pada tanda. Tanda tersebut merupakan akhir dari perintah. Namun ada pula tag yang bukan berarti awal dan akhir perintah namun beridiri sendiri seperti,, dan lain-lain.

7 Contoh : Silahkan anda membuka sebuah notepade kemudian ketikkan perintah berikut : HTML Pertama ku Informasi atau isi yang akan disampaikan pada semua orang Semoga bermanfaat Informasi Pertama Informasi Kedua // Kemudian simpan pada folder yang dinginkan dengan nama. Webku.html.

8 Bagian HEAD Untuk kejelaskan lebih jauh dapat dibedakan perintah perintah tag. Diantaranya : Bagian Head Tag ini memberikan informasi mengenai judul halaman. Biasanya dapat kita lihat pada icon paling bawah halaman windows seperti pada gambar …. Ditulis dengan perintah HTML Pertama ku Judul dari halaman web

9 Bagian HEAD

10 Ini ditujukan untuk menentukan basis URL dari dokumen html yang sedang dibuka. Ditujukan untuk relasi antar dokumen HTML yang digunakan REV=”mode” HREF=mailto:nama@email.com> Bagian ini bertujuan untuk mendeskripsikan halaman web yang sedang dibuka oleh user biasanya untuk memberikan informasi mengenai halaman web yang sedang dirancang.

11 Bagian Body Bagian body adalah merupakan isi dari halaman web yang menginformasikan data-data pada user (penguna atau pengunjung halaman web). Dapat berupak text, gambar, suara dan lain-lain. Ada beberapa perintah tag umum yang digunakan pada body. Backround = Menentukan URL atau suber direktori dari file image sebagai background. Bgcolor = Menentukan warna dari background Text = Menentukan warna dari text Alink = Menentukan warna dari link sedang active Vlink= Menentukan warna dari link yang sudah dikunjungi Link = Menentukan wana dari link Topmargin Menentukan batas atas dokumen Leftmargin = Menentukan batas kiri dari margin Bgproperties=Jika diisi dengan FIXED maka gambar background tidak ikut tergulung.

12 Contoh pertama Silahkan di edit kembali web yang telah dibuat dengan mengetikkan : HTML Pertama ku Informasi atau isi yang akan disampaikan pada semua orang Semoga bermanfaat Informasi Pertama Informasi Kedua

13 Contoh ke dua Dan bedakan dengan perintah berikut jika terlebih dahulu salin gambar dengan nama back.gif. HTML Pertama ku Informasi atau isi yang akan disampaikan pada semua orang Semoga bermanfaat Informasi Pertama Informasi Kedua

14 Contoh ke tiga Bedakanlagi dengan perintah ini HTML Pertama ku Informasi atau isi yang akan disampaikan pada semua orang Semoga bermanfaat Informasi Pertama Informasi Kedua universitas negeri padang

15 Format Dokumen HTML Kita dapat menampilkan dokumen HTML dengan mengunakan beberapa tag seperti berikut : merupakan perintah untuk memulai baris baru, sehingga penulisannya tidak kesamping lagi melainkan kebawahnya untuk memulai paragraph baru. membuat garis batas horizontal yang berguna untuk membagi dokumen dimana n adalah huruf dari 1 sampai dengan 7 bertujuan untuk mebesarkan font dan mengicilkan font. adalah besar font terbesar. Biasanya digunakan untuk membuat judul atau biasa disebut dengan heading. adalah membuat tampilan yang diketik sama dengan yang ditampilkan di browser. Hal ini mirip mengan glue (lem atau perekat) adalah untuk menengahkan karakter.

16 Contoh : HTML Pertama ku Informasi atau isi yang akan disampaikan pada semua orang Semoga bermanfaat Informasi Pertama

17 Contoh : Peserta platihan web di FT UNP dikelompokkan atas dua kelompok yaitu : Kelompok I ============================================================ Terdiri dari --------------------------------------------- : no : Nama : NIM : : 1 : Muh. Fadli : 00123 : : 2 : Kamaruzaman : 10114 : : 3 : Riki Martin : 21211 : : 4 : Wulandari : 32112 : --------------------------------------------

18 Contoh : Kelompok II ========================================================== Terdiri dari ------------------------------------------- : no : Nama : NIM : : 1 : Saiful : 13123 : : 2 : Amri : 45114 : : 3 : Luna Haru : 41415 : : 4 : Sarmila : 32919 : -------------------------------------------- universitas negeri padang

19 Bagian Format Karakter HTML Logical Format merupakan kepenekan dari cituation yang berfungsi untuk menampilkan kutipan untuk menampilkan tulisan untuk menandakan text itu adalah program. untuk memberikan penekanan atau penandaan pada text tertentu untuk menandai suatu text sebagai sample untuk menandai bagian yang penting dalam text tertentu untuk menampilkan variable dalam halaman web untuk menampilkan alamat pada halaman web

20 Bagian Format Karakter HTML Physical Format untuk membuat huruf tebal untuk huruf miring untuk huruf mirip mesin ketik untuk huruf bergaris bawah untuk menampilkan garis horizontal pada tengah huruf untuk menampilkan huruf lebih kecil untuk menampilkan huruf lebih besar untuk menampilkan subscript untuk menampilkan superscript untuk mengatur huruf sesuai dengan property font yang disediakan

21 Bagian Link Untuk menghubungkan kehalaman yang lain yang tidak ada hubungan dengan halaman web sendiri digunakan link web side ft unp

22 Pengayaan Buat Design web dengan aplikasi pemograman web seperti dreamweaver atau frontpage Upload ke server gratis seperti : www.geocities.com www.100webspace.com www.freehostia.com

23 Pengayaan

24

25

26

27