1. Pilih salah satu opsi dibawah ini dan Buatlah halaman web sederhana dengan menggunakan HTML tentang
a. Profil Perusahaan
b. Profil organisasi
c. Profil Perguruan Tinggi
d. Profil Tokoh/ Idola
Tampilkan profil pribadi anda dibawahnya yang berisi : Website ini dibuat oleh : Nama, Nis Kelas dsb.
Penilaian :
- Tampilkan informasi sebanyak-banyaknya
- Gunakan penggunaan <tag> sebanyak-banyaknya
- Rancang dengan seindah mungkin sesuai selera anda :)
Petunjuk pengerjaan :
a. Waktu penyelesaian soal adalah jam 07.00 - 23.59 (lewat dari jadwal tidak dinilai)
b. Kirim jawaban anda ke tikjie@gmail.com (Jawaban dilampirkan)
c. Email yang digunakan 1 email tiap siswa
d. Gunakan Subject : Nama_Nis_Kelas_Ujian Semester Ganjil
e. Konfirmasi via chat/ pesan facebook (mulai jam 13.00) wall tidak dilayani :D
f. Hati-hati dengan segala bentuk kecurangan akan diberi sanksi
Soal Ujian MID Semester
SOAL Ujian Mid semester TIK dapat anda download disini
Ketentuan :
Selamat bekerja *_^
Ketentuan :
1.
Jawab pertanyaan
pada kolom yang telah disediakan
2.
Setelah soal telah
anda jawab semua, Save As kembali file ini dengan file name : namamu
Selamat bekerja *_^
Diposting oleh
tikjie
Dasar-dasar HTML
HTML atau Hyper Text Markup Language. Adalah bahasa yang digunakan untuk mendisain dan memformat halaman web. Kita mungkin sudah mendengar tentang bahasa program seperti C, C++, Java, dan Visual basic. Masing-Masing bahasa ini terdiri dari perintah sintakdan programming . Sintak ini adalah yang programmer gunakan untuk memanggil kode. Sangatlah penting mengetahui bagaimana cara menulis kode menggunakan bahasa yang relevan.
Lebih dari itu, kita harus konvensional dengan aturan menyangkut bahasa tertentu. Didalam HTML, sintak ini disebut tag.Tag ditulis dengan tanda-kurung bersudut< dan >.Ada kelompok tag yang sudah dikenal didalam HTML, yang mana digunakan untuk berbagai tujuan. Sebagai contoh, dalam rangka memodifikasi satu baris teks ke dalam Bold, kita menerapkan tag bold dengan suatu tag <b>, kemudian tulis beberapa teks atau suatu paragrap yang berisi beberapa teks,dan tutup tag menggunakan tag </b> seperti dalam contoh listing 1. Semua tag didalam HTML harus ditutup menggunakan sintak </>.Tetapi ada beberapa perkecualian pada aturan ini, yang mana kita akan mendiskusikanya nanti.Kita memakai tag ini sebab HTML bukanlah bahasa yang sensitip seperti C++ dan Java.
Struktur
Setiap kode HTML perlu ditulis dalam suatu struktur yang mana dapat dihubungkan dengan Word Wide Web.Tidaklah wajib untuk mengikuti struktur ini. Bagaimanapun juga,lebih baik mempraktekan langsung struktur ini sbg perancangan halaman web kita. Listing 1 menunjukkan struktur suatu halaman HTML sederhana:
Listing 1
<!– Ini komentar didalam HTML.Ini tidak akan diperliatkan pada browser–>
<HTML>
<HEAD>
<TITLE>
Welcome to HTML
</TITLE>
</HEAD>
<BODY>
<!–halaman CONTENT dimulai –>
<B>Yang ditampilkan di browser, cuma tulisan ini.
</BODY>
</HTML>
Kode diatas menggunakan Notepad dan menyimpan file sebagai satu.html. Kemudian, klik kanan file yang disimpan tadi. bagaimanakah keluarannya?
Listing 2
<B>Untuk menampilkan tulisan cetak tebal</B><BR>
<I>Untuk menampilkan tulisan cetak miring (italic) </I><BR>
<U>Untuk menampilkan tulisan bergaris bawah (underline) </U><BR>
<BR> digunakan untuk menampilkan baris baru.
Listing 3
<Pon> Bla bla bla bla, dan tulisan ini pun akan dianggap satu paragraf. kalau ga percaya, coba aja sendiri. dengan menggunakannya dua kali atau lebih bakal lebih keliatan hasilnya.
</P>
Tidak wajib untuk menutup tag <P>. Tetapi seperti dikatakan sebelumnya, menutup tiap-tiap tag adalah suatu yang baik yang pemprogram praktekkan.
Listing 4
Bekerja dengan Heading
Kita dapat menggunakan heading untuk mengorganisir teks kita dalam berbagai tingkatan. Ada lima tingkatan heading didalam HTML seprti di bawah:
<H1>Level – 1 </H1>
<H2>Level – 2 </H2>
<H3>Level – 3 </H3>
<H4>Level – 4 </H4>
<H5>Level – 5 </H5>
Listing 5
Penempatan List contoh teks atau items.Ada dua jenis list didalam HTML. sebagai berikut
o Ordered List
o Unordered List
Ordered List diwakili oleh tag <ol> tag secara otomatis menomori, dan Unordered List diwakili oleh tag <ul> dan terlihat seperti bullet. Cobalah kode di bawah ini:
<OL>
<LI>Java
<LI>C++
</OL>
kode diatas menghasilkan suatu daftar perintah bahasa. Jika kita
menginginkannya seperti bullet kemudian kita ubah tag <OL> menjadi tag <UL>
sebagai di bawah ini:
Listing 6
<UL>
<LI>Java
<LI>C++
</UL>
Listing 7
Penerapan Definisi List
Definisi List adalah serupa dengan daftar kata. Diterapkan menggunakan tag <DL> dan <DT> seperti ditunjukkan listing 7 dibawah ini.
<DL>
<DT>Java
<DD>Developed by Sun Microsystems Inc
<DT>Yang kedua
<DD>Developed by saya sendiri
</DL>
Listing 8
Indenting Text
Tag <BLOCKQUOTE> yaitu teks yang menjorok lebih kedalam dari garis tepi secara otomatis dari kiri ke kanan. Cobalah contoh berikut :
<BLOCKQUOTE>
You can use Sound Recorder to record, play, and edit sound files.
To use Sound Recorder, you must have a sound card and speakers
installed on your computer. If you want to record live sound,
you also need a microphone.
</BLOCKQUOTE>
Membuat Links
Suatu website bukanlah halaman tunggal.Terdiri dari beberapa halaman yang saling berhubungan. Sebagai contoh,ketika kita klik suatu link nama ” About Us”, pada browser secara otomatis Kita ke halaman web itu .
Bagaimana sihir ini terjadi? Itu merupakan suatu konsep Hyperlinks Kita dapat menciptakan Hyperlinks menggunakan tag <a>.Dan harus ditutup menggunakan tag </a> dan itu mewakili anchor.
Listing 9
<A href =“http://www.tikjie.blogspot.comâ€>tikjie.blogspot</A>
href adalah suatu atribut yang digunakan untuk menetapkan link dan mewakili Teks Reference. Atribut lain meliputi suatu target opsional, yang mana menandakan bagaimana cara membuka link. Nilai atribut ini jadi kosong. Sebagai contoh, kode berikut memanggil lokasi tikjie.blogspot.com didalam suatu jendela browser baru ketika seseorang mengklik teks.
Listing 10
<A href = http://tikjie.blogspot.com target = “_blankâ€>tikjie </A>
Selalu ingat untuk menyimpan file yang telah dibuat dalam ekstensi .html
Lebih dari itu, kita harus konvensional dengan aturan menyangkut bahasa tertentu. Didalam HTML, sintak ini disebut tag.Tag ditulis dengan tanda-kurung bersudut< dan >.Ada kelompok tag yang sudah dikenal didalam HTML, yang mana digunakan untuk berbagai tujuan. Sebagai contoh, dalam rangka memodifikasi satu baris teks ke dalam Bold, kita menerapkan tag bold dengan suatu tag <b>, kemudian tulis beberapa teks atau suatu paragrap yang berisi beberapa teks,dan tutup tag menggunakan tag </b> seperti dalam contoh listing 1. Semua tag didalam HTML harus ditutup menggunakan sintak </>.Tetapi ada beberapa perkecualian pada aturan ini, yang mana kita akan mendiskusikanya nanti.Kita memakai tag ini sebab HTML bukanlah bahasa yang sensitip seperti C++ dan Java.
Struktur
Setiap kode HTML perlu ditulis dalam suatu struktur yang mana dapat dihubungkan dengan Word Wide Web.Tidaklah wajib untuk mengikuti struktur ini. Bagaimanapun juga,lebih baik mempraktekan langsung struktur ini sbg perancangan halaman web kita. Listing 1 menunjukkan struktur suatu halaman HTML sederhana:
Listing 1
<!– Ini komentar didalam HTML.Ini tidak akan diperliatkan pada browser–>
<HTML>
<HEAD>
<TITLE>
Welcome to HTML
</TITLE>
</HEAD>
<BODY>
<!–halaman CONTENT dimulai –>
<B>Yang ditampilkan di browser, cuma tulisan ini.
</BODY>
</HTML>
Kode diatas menggunakan Notepad dan menyimpan file sebagai satu.html. Kemudian, klik kanan file yang disimpan tadi. bagaimanakah keluarannya?
Listing 2
<B>Untuk menampilkan tulisan cetak tebal</B><BR>
<I>Untuk menampilkan tulisan cetak miring (italic) </I><BR>
<U>Untuk menampilkan tulisan bergaris bawah (underline) </U><BR>
<BR> digunakan untuk menampilkan baris baru.
Listing 3
<Pon> Bla bla bla bla, dan tulisan ini pun akan dianggap satu paragraf. kalau ga percaya, coba aja sendiri. dengan menggunakannya dua kali atau lebih bakal lebih keliatan hasilnya.
</P>
Tidak wajib untuk menutup tag <P>. Tetapi seperti dikatakan sebelumnya, menutup tiap-tiap tag adalah suatu yang baik yang pemprogram praktekkan.
Listing 4
Bekerja dengan Heading
Kita dapat menggunakan heading untuk mengorganisir teks kita dalam berbagai tingkatan. Ada lima tingkatan heading didalam HTML seprti di bawah:
<H1>Level – 1 </H1>
<H2>Level – 2 </H2>
<H3>Level – 3 </H3>
<H4>Level – 4 </H4>
<H5>Level – 5 </H5>
Listing 5
Penempatan List contoh teks atau items.Ada dua jenis list didalam HTML. sebagai berikut
o Ordered List
o Unordered List
Ordered List diwakili oleh tag <ol> tag secara otomatis menomori, dan Unordered List diwakili oleh tag <ul> dan terlihat seperti bullet. Cobalah kode di bawah ini:
<OL>
<LI>Java
<LI>C++
</OL>
kode diatas menghasilkan suatu daftar perintah bahasa. Jika kita
menginginkannya seperti bullet kemudian kita ubah tag <OL> menjadi tag <UL>
sebagai di bawah ini:
Listing 6
<UL>
<LI>Java
<LI>C++
</UL>
Listing 7
Penerapan Definisi List
Definisi List adalah serupa dengan daftar kata. Diterapkan menggunakan tag <DL> dan <DT> seperti ditunjukkan listing 7 dibawah ini.
<DL>
<DT>Java
<DD>Developed by Sun Microsystems Inc
<DT>Yang kedua
<DD>Developed by saya sendiri
</DL>
Listing 8
Indenting Text
Tag <BLOCKQUOTE> yaitu teks yang menjorok lebih kedalam dari garis tepi secara otomatis dari kiri ke kanan. Cobalah contoh berikut :
<BLOCKQUOTE>
You can use Sound Recorder to record, play, and edit sound files.
To use Sound Recorder, you must have a sound card and speakers
installed on your computer. If you want to record live sound,
you also need a microphone.
</BLOCKQUOTE>
Membuat Links
Suatu website bukanlah halaman tunggal.Terdiri dari beberapa halaman yang saling berhubungan. Sebagai contoh,ketika kita klik suatu link nama ” About Us”, pada browser secara otomatis Kita ke halaman web itu .
Bagaimana sihir ini terjadi? Itu merupakan suatu konsep Hyperlinks Kita dapat menciptakan Hyperlinks menggunakan tag <a>.Dan harus ditutup menggunakan tag </a> dan itu mewakili anchor.
Listing 9
<A href =“http://www.tikjie.blogspot.comâ€>tikjie.blogspot</A>
href adalah suatu atribut yang digunakan untuk menetapkan link dan mewakili Teks Reference. Atribut lain meliputi suatu target opsional, yang mana menandakan bagaimana cara membuka link. Nilai atribut ini jadi kosong. Sebagai contoh, kode berikut memanggil lokasi tikjie.blogspot.com didalam suatu jendela browser baru ketika seseorang mengklik teks.
Listing 10
<A href = http://tikjie.blogspot.com target = “_blankâ€>tikjie </A>
Selalu ingat untuk menyimpan file yang telah dibuat dalam ekstensi .html
Menggunakan Google Earth
Cara Menggunakan Google Earth - Sudah banyak cara menggunakan perangkat-perangkat internet yang dibahas melalui blog ini. Nah kali ini kita akan belajar cara menggunakan Google Earth, yaitu salah satu perangkat internet buatan google yang dapat memudahkan kita untuk menjelajahi dunia. Agar langsung kepokok pembelajaran kali ini, yaitu cara menggunakan Google Earth, maka berikut adalah penjelasan selengkapnya:
1. Download Software Google Earth
Bila anda belum memiliki aplikasi google earth di PC atau laptop anda, maka hal pertama yang harus anda lakukan adalah men-download software google earth yang dapat diperoleh melalui alamat http://earth.google.com
Melalui alamat tersebut anda bisa men-download dua jenis software google earth. Salah satu disebut sebagai google earth pro, dimana software ini adalah produk google earth yang harus dibeli untuk memilikinya. Sementara dengan versi free, maka anda bisa memprolehnya secara gratis.
2. Instalasi
Setelah selesai men-download software google earth, maka langkah selanjutnya yang harus dilakukan adalah menginstal software tersebut di PC ataupun di Laptop anda.
3. Menggunakan
Setelah proses instalasi google earth sudah selesai dilakukan, maka saatnya tiba, yaitu mengunakan aplikasi google earth itu sendri. Adapun cara menggunakan google earth dapat dilakukan dengan mengetikkan alamat Anda dalam kotak "Fly to", kemudian tekan "Enter" pada keypad dan Google Earth akan mencari ke lokasi tersebut. Anda kemudian akan melihat bagian atas atap rumah Anda dan apa pun di sekitar rumah Anda. Pergi ke mana saja di bumi ini. Cukup ketik lokasi dalam kotak "Fly to" dan klik "Enter".
Gunakan kontrol di sisi kanan layar untuk menavigasi arah utara, selatan, timur, atau barat. Anda juga dapat mengontrol berapa meter ketinggian Anda dari tanah dengan menggunakan kontrol vertikal di sebelah kanan Anda.
Klik pada gambar kecil Saturnus. Ini akan memungkinkan Anda untuk menjelajahi alam semesta. Klik bintang dan sebuah kotak akan muncul dengan informasi lengakap tentang bintang tersebut yang dilengkapi juga dengan video.
Untuk lebih jelasnya tentang cara menggunakan Google Earth ini, maka anda juga sebelumnya dapat melihat cuplikan video tutorial cara menggunakan google earth dibawah ini:
1. Download Software Google Earth
Bila anda belum memiliki aplikasi google earth di PC atau laptop anda, maka hal pertama yang harus anda lakukan adalah men-download software google earth yang dapat diperoleh melalui alamat http://earth.google.com
Melalui alamat tersebut anda bisa men-download dua jenis software google earth. Salah satu disebut sebagai google earth pro, dimana software ini adalah produk google earth yang harus dibeli untuk memilikinya. Sementara dengan versi free, maka anda bisa memprolehnya secara gratis.
2. Instalasi
Setelah selesai men-download software google earth, maka langkah selanjutnya yang harus dilakukan adalah menginstal software tersebut di PC ataupun di Laptop anda.
3. Menggunakan
Setelah proses instalasi google earth sudah selesai dilakukan, maka saatnya tiba, yaitu mengunakan aplikasi google earth itu sendri. Adapun cara menggunakan google earth dapat dilakukan dengan mengetikkan alamat Anda dalam kotak "Fly to", kemudian tekan "Enter" pada keypad dan Google Earth akan mencari ke lokasi tersebut. Anda kemudian akan melihat bagian atas atap rumah Anda dan apa pun di sekitar rumah Anda. Pergi ke mana saja di bumi ini. Cukup ketik lokasi dalam kotak "Fly to" dan klik "Enter".
Gunakan kontrol di sisi kanan layar untuk menavigasi arah utara, selatan, timur, atau barat. Anda juga dapat mengontrol berapa meter ketinggian Anda dari tanah dengan menggunakan kontrol vertikal di sebelah kanan Anda.
Klik pada gambar kecil Saturnus. Ini akan memungkinkan Anda untuk menjelajahi alam semesta. Klik bintang dan sebuah kotak akan muncul dengan informasi lengakap tentang bintang tersebut yang dilengkapi juga dengan video.
Untuk lebih jelasnya tentang cara menggunakan Google Earth ini, maka anda juga sebelumnya dapat melihat cuplikan video tutorial cara menggunakan google earth dibawah ini:
Langganan:
Komentar (Atom)