Pengenalan HTML & Internet

*PENGENALAN HTML & PEMANFAATAN INTERNET Workshop dan Pelatihan UMKMKADIN DKI Jakarta - UPI Y.A.I25 Juli 2011

Oleh;Sularso Budi Laksono. Dr,M.KomM. Al Amin. S.Kom, M.Kom

Pengenalan html & pemanfaatan internet

*Pengenalan html & pemanfaatan internet *Pengenalan HTML HTML Hypertext Markup Language merupakan standard bahasa yang digunakan untuk menampilkan dokumen webUntuk membuat dokumen web yang bisa ditampilkan di browser, perlu menuliskan kode HTML baik secara langsung misal pada editor Notepad, maupun secara tidak langsung misal melalui software Frontpage


*Pengenalan HTMLTAGKode khusus yang merupakan komponen fundamental pada dokumen web dan akan dikenali oleh browserNama tag ditulis di dalam tanda < > dan untuk tag penutup tambahkan tanda Boleh ditulis dengan huruf besar maupun kecilDigunakan sepasang, contoh : dan


*Pengenalan HTMLATRIBUT dan VALUEBeberapa tag mengandung atribut di dalamnya, contoh : Pada contoh di atas, p adalah nama tag, sedangkan align adalah nama atributAtribut pada umumnya melibatkan value, seperti pada contoh, center adalah value untuk atribut align


*Pengenalan HTMLSTRUKTUR DASAR DOKUMEN HTMLTag utama adalah , , Tag HTML berfungsi untuk menyatakan bahwa dokumen tersebut adalah dokumen HTMLTag HEAD berfungsi untuk memberikan informasi tentang dokumen HTML tersebutTag BODY berfungsi untuk menyimpan informasi atau data yang akan ditampilkan dalam dokumen HTML


*Pengenalan HTMLSTRUKTUR DASAR DOKUMEN HTML

Struktur Dokumen akan terlihat :

bagian head bagian body yg akan ditampilkan


*Pengenalan HTMLTITLEUntuk membuat judul pada suatu dokumen web, digunakan tag ..TITLE bukanlah bagian dari teks dokumen dan hanya berada pada bagian HEADTITLE biasanya ditampilkan oleh browser pada title bar dari jendela browser dan biasanya berfungsi sebagai label dari jendela browser tersebut


*Pengenalan HTMLHEADINGHTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul dalam badan dokumenTag-tag judul ini berupa : ... sampai dengan ... Dapat ditambahkan atribut misal align dengan value : left, right, justify


*Pengenalan HTMLPARAGRAF, LINE BREAK dan KOMENTARTag digunakan untuk membuat paragraf, dan dapat ditambahkan atribut misal alignContoh : ...isi paragraf... Untuk membuat baris baru atau berpindah baris digunakan tag Untuk memberikan komentar yang nantinya akan diabaikan oleh browser, digunakan tanda


*Pengenalan HTMLGARIS HORISONTALUntuk membuat garis horisontal pada dokumen web digunakan tag Atribut pada tag size : Menentukan ketebalan gariswidth : Menentukan lebar garisalign : Menetukan peletakan teks dalam barisnoshade : Mengatur agar garis tidak disertai bayangan


Peng. Komp & TI 2C*Contoh1.htmlContoh Soal :


Peng. Komp & TI 2C*PENAMAAN DOKUMEN & ELEMEN HTML (cont.)Hasil :


*Contoh2.html

Belajar Web Design

ini adalah halaman HTML


*Contoh3.htmlKita dapat memaksa ganti baris pada dokumen web dengan tag

Ganti Baris

ini adalah baris ke 1ini adalah baris ke 2ini adalah baris ke 3ini adalah baris ke 4ini adalah baris ke 5


*Contoh4.html

Heading

Heading 1Heading 2Heading 3Heading 4Heading 5Heading 6


Pengenalan & Pemanfaatan Internet**

*Internet Explorer

Internet Explorer merupakan bagian yang biasa kita jumpai pada saat kita meng-install aplikasi windows. Internet Explorer ini menjadi penunjang browser sistem operasi Windows dari segala versi (Windows: 95,98,2000 Me, Xp, dan Windows Server). Sampai saat ini Internet Explorer merupakan web browser yang paling banyak digunakan oleh pengguna di seluruh jagad ala mini, factor yang menjadikan orang berminat menggunakan Internet Explorer adalah karena factor kemudahan penggunaan, kemampuan kerja, kesetabilan dan kecepatan akses yang dimiliki lebih baik dibanding dengan web browser yang lainnya.


*Menjalankan Internet Explorer

Untuk mulai berselancar di browsing internet explorer bisaAnda mulai dengan:Klik start => all programs => klik internet explorer.

Gbr 1. Start internet explorer.



2. Klik internet explorer => ketik (http://www.yai.ac.id/) atau pilih pada ruang Address yang Anda kehendaki, pas pada panah hitam menghadap ke bawah ( )yang ada di sebelah kanan monitor.

Gbr 2. Memulai browsing di ie.



Gbr 3.1. Membuka internet lewat dekstop.Jika membuka browsing lewat desktop => Klik dua kali berturut turut.

Gbr 3. Membuka internet lewat dekstop.



4. Setelah masuk ke dalam browsing yang sudah di buka:

Gbr 4. Bar menu pada internet explorer



Web search = untuk mencari apa yang Anda inginkan, missal saja amin2007, kalau memang kalimat itu ada di internet, akan di tampilkan semua, ini fungsinya untuk mempersingkat pencarian.Stop = untuk memberhentikan browsing address, yang sedang berjalan, ini bisa di lakukan jika Anda membatalkan apa yang ingin di buka.Refresh = untuk mengulang alamat web address yang mati secara tiba tiba, mungkin di karenakan putus coneksi atau ada gangguan dari manapun. Di harapkan dengan tekan tombol refresh maka alamat yang di maksud akan terbuka kembali.Home = untuk kembali pada menu awal, seperti yang sudah pernah Anda seting missal: http://www.google.com , maka begitu Anda klik home alamat website akan kembali ke semula, seperti seting pada gambar dibawah ini.



Gbr 5. internet options dengan address



5. Web Search = ini tidak jauh beda dengan istilah, bypass atau potong kompas, karena dengan Anda hanya ketik kompas, maka bias Anda lihat beberapa alamat website yang berkaitan dengan kalimat kompas biasa Anda acces atau buka.6.Add Tab = tanda plus warna jingga yang ada di bar menu ini, jika anda klik, maka akan membuka lembar kerja baru, karena lembar ini akan menampilkan website sesuai yang ada dan di seting di internet options, maka Anda harus menggantinya di dengan mengetik atau memilih alamat yang sudah tersedia di address. Memakai tab ini berfungsi jika Anda ingin membuka lembar sebsite lebih dari satu alamat.7.Email = barangkali ini sudah bukan hal yang baru terdengar di telinga Anda, karena hamper semua orang di dunia yang berhubungan dengan dunia maya, sering menggunakan yaitu email, email sesungguhnya sangat membantu pada saat Anda harus berbisnis, bekerja, study/belajar dan lainya, untuk bias mengirimkan informasi atau mendapatkan informasi dari rekan, kawan, handaitaulan, family, orang tua dan sebagainya.


*Pemanfaatan Blog untuk Pendidikan &Pengajaran.

Blog atau weblog akhir akhir ini banyak di manfaatkan para penggunanya untuk berbisnis dan sebagai ajang pembelajaran interaksi antara dosen atau guru dengan anak didiknya atau mahasiswanya, seperti misalnya upload matakuliah dalam bentuk attach file pdf, dox, xls, pps, atau image. Atau bisa juga untuk memberi tugas pada anak didiknya. Bermacam - macam blog yang sering di gunakan: blogger.com, blogsport.com, wordpress.com dan lain - lain. Adapun yang ingin di bahas adalah blog dengan memakai wordpress.com



Gbr 6. Desain Blog Pribadi M. Al amin



Gbr 7. Desain Blog pribadi Prof. Dr Rohani Jahja Widodo MSc.



Gbr 8. Desain Blog Organisasi atau Club Tenis Trisakti.



Gbr 9. Desain Blog Organisasi atau Y.A.I Community.



Gbr 10. Desain Blog Pribadi M. Al Amin dengan Blog Detik.


*

Pemanfaatan Situs Jejaring Sosial.

Gbr 11. Friendster.com


*Pemanfaatan Situs Jejaring Sosial.

Gbr 12. Twitter.com


*

Pemanfaatan Situs Jejaring Sosial.

Gbr 13. Facebook.com


*

Memanfaatkan Chating.Gbr 14. Fasilitas Chating Facebook.com


*Memanfaatkan Chating.

Gbr 15. Fasilitas Chating Skype.com


*Memanfaatkan Chating.

Gbr 16. Fasilitas Chating Yahoo Messenger


*Memanfaatkan Video Call.

Gbr 17. Video Call memakai skype dengan rekan di Kota Padang.



Gbr 18. Video Call memakai skype dengan rekan di Kota Bandung.



Gbr 19. Video Call & Chating memakai skype dengan rekan di Kota Padang.



Gbr 20. Video Call memakai skype dengan rekan di Kota Jakarta.


*SEKIAN & TERIMAKASIH


*********

Pengenalan HTML & Internet

Documents

Transcript of Pengenalan HTML & Internet