Menyajikan Format Target Link, Email dan Telepon

1) Menentukan Target Link
Target atau tujuan yang dihubungkan melalui suatu link dapat ditentukan sendiri oleh kita. Target yang di maksud di sini adalah dimana dokumen akan ditempatkan atau ditampilkan. Dalam keadaan default (ketika atribut TARGET tidak di sertakan), dokumen baru yang ditampilkan pada saat link dipilih akan menutup atau menimpa dokumen lama (dokumen yang mengandung link bersangkutan). Untuk melakukan hal, kita hanya perlu menambahkan atribut TARGET di dalam tag <a>, yang memiliki bentuk umum penulisan seperti berikut: <a href=”NamaDokumen” target=”NamaTarget”>Teks/Gambar<a/>
NamaDokumen adalah namadokumen yang akan di tampilkan jika link bersangkutan dipilih/diklik dan NamaTarget adalah target atau tempat tujuan dari dokumen yang akan ditampilkan. NamaTarget bisa bernilai _BLANK maupun nama frame (jika layar web kita bagi dengan menggunakan frame)
2) Link Email
Selain menghubungkan antara halaman dan antara bagian-bagian dari satu halaman, tag <a> memungkinkan kita untuk link ke alamat email. Ini adalah cara paling sederhana untuk memungkinkan pengunjung halaman web kita untuk "mengirim pesan" kepada kita. Dengan memberikan link yang dapat diklik ke alamat email kita, maka mudah bagi pengunjung untuk mengirim pesan dan pengunjung tidak perlu mengetikkan alamat email.
Cara penulisan link HTML ke alamat email adalah seperti berikut :

<a href="mailto:nama@yourdomain.com"> Kirim pesan email</a>

Kata-kata “Kirim pesan email” akan muncul seperti link <a> lainnya .
Jika kita ingin orang melihat alamat email kita yang sebenarnya ( sehingga mereka dapat mencata atau mengirim pesan menggunakan program email yang berbeda ), adalah seperti ini :

<a href="mailto:nama@yourdomain.com">nama@yourdomain.com</a>

Dalam kebanyakan web browser, bila seseorang mengklik link tersebut , maka terbuka sebuah jendela di mana dia dapat mengetik pesan email yang segera dikirimkan kepada kita
Kita juga dapat memberikan beberapa informasi tambahan di link sehingga subjek dan isi pesan juga langsung tertulis. Yaitu dengan menambahkan variabel subject (perihal) dan body (isi pesan). Pisahkan variabel dari alamat email dengan tanda tanya ( ? ) , Nilai dari variabel dengan tanda sama dengan ( = ) , dan kemudian memisahkan masing-masing variabel dan nilai pasangan dengan ampersand ( & ). Berikut adalah contoh menentukan subjek dan body untuk contoh email sebelumnya :

<a href = "mailto:author@somedomain.com?subject=Pertanyaan & body=Kapan edisi berikutnya keluar ?"> Author@somedomain.com </a>

Ketika pengguna mengklik link ini , pesan email dibuat dengan author@somedomain.com sebagai penerima, “Pertanyaan” sebagai subject/perihal , dan Kapan edisi berikutnya keluar ? sebagai isi pesan .
3) Link Telepon
Kita juga dapat membuat link telepon di dokumen web kita. Hal ini karena banyak pengunjung web menggunakan smartphone untuk mengakses website kita, sehingga dapat digunakan untuk melakukan panggilan telepon ! Jadi kita dapat menuliskan nomor telepon, sehingga pengunjung dapat langsung klik untuk menghubungi nomor telepon terebut. Cara penulisannya adalah seperticontoh berikut .

<a href="tel:0123456789">Hubungi kami di (012) 3456789 </a>

Ketika pengguna ponsel menekan link tersebut, mereka mendapatkan kotak peringatan meminta mereka untuk mengkonfirmasi bahwa mereka ingin
terbaik untuk menggunakan link telepon :

•  Dianjurkan agar memasukkan nomor lengkap panggilan internasional , termasuk kode Negara, seperti +62 untuk Indonesia, karena tidak diketahui di Negara mana pengguna akan mengakses web kita .
• menuliskan nomor telepon ke dalam isi link sehingga jika link tidak bekerja , nomor telepon masih terbaca .
• Android dan iPhone memiliki fitur yang dapat mendeteksi nomor telepon dan secara otomatis mengubah mereka menjadi link. Sayangnya , beberapa nomor 10 - digit yang bukan nomor telepon mungkin akan berubah menjadi link juga. Jika dokumen kita memiliki string angka yang mungkin akan dideteksi sebagai nomor telepon, kita dapat mengaktifkan auto - deteksi off dengan memasukkan elemen meta berikut dalam kepala dokumen kita . 

<meta name="format-detection" content="telephone=no">

• Untuk perangkat Blackberry , menggunakan berikut: 

<meta http-equiv="x-rim-auto-match" content="none">

Menyajikan Link ke Bagian Dokumen HTML

Artikel Yang Sekarang cukup simple saja
apabila kita membuat suatu paragraf dan kita ingin langsung ke paragraf tersebut
itu cukup gampang yaitu dengan menggunakan attribut id dan simbol #
Contoh pemberian id untuk menandai elemen yang ingin di tautkan atau di tampilkan

<h1 id="heading">Bagian Atas</h1>

Contoh pemberian link harus di tambah tanda # dan masukan id yang akan di tuju

<a href="#heading>Kembali Ke Bagian Atas</a>

nah cukup sampai situ , sekarang ke link yang menuju ke dokumen lain

cukup sama tetapi kita cuman perlu menambahkan <a href="dokumenlain.html#DokLain">
nah di bagian dokumen lain itu harus di beri id juga sama seperti yang contoh sebelumnya
<h1 id="DokLain">Dokumen Lain</h1>

Contoh Hasil Codingan

<html>
<head>
<title>link</title>
</head>
<body>
<h2 id="atas">Latihan membuat ke bagian tertentu dalam satu dokumen</h2>
<p> pilih salah satu judul buku berikut untuk melihat deskripsi : </p>
<a href="#c"> pemrograman C</a><br />
<a href="#cpp"> pemrograman C++</a><br />
<a href="#bcb"> pemrogaraman Borland C++Builder</a>
</p> <p><a id="c"><strong>pemrograman C</strong> </a></p>
<p> C merupakan bahasa pemrograman yang sudah tidak digunakan lagi kehandalannya dan banyak digunakan untuk membuat program-progarm dalam berbagai bidang, termasukpembuatan kompilator (compiler) dan sistem operasi. Sampai saat ini, C masih tetap menjadi bahasa populer dan beribawah dalam kanca pemrograman. Sejauh ini, C juga telah menjadi inspirasi bagi kelahiran bahasa-bahasa pemrograman baru, seperti C++, java, dan juga yang lainnya ; sehingga dari sisi sintak kontrol programnya, ketika bahasa ini bisa dikatakan sama. Bahasa pemrograman C sangatlah fleksibel dan portebel, sehingga dapat di tempatkan dan di jalankan di dalam beragam sistem operasi. Pada umum nya, C banyak digunakan untuk melakukan interfacing antar perangkat keras (hardwere) agar dapat berkomunikasi satu sama lainnya. <br />
<a href="#atas"> kembali ke atas</ a> </p>
<p><a id="cpp"><strong>pemrograman C++</strong></a></p>
<p> C++ merupakan bahasa pemrograman yang sangat populer dan telah banyak digunakan untuk mengembangkan perangkat lunak di berbagai bidang; seperti : telekomunikasi, embedded system, bisnis, dan hiburan. Salah satu kehandalan dari C++ adalah bahasa ini mendukung sepenuhnya konsep pemrograman berorientasi objek, atau yang lebih di kenal dengan OPP (object oriented programming). (cross platform), C++ juga telah manjadi bagian hidup dari sebagian para pecinta linux.<br />
<a href="#atas">kembali ke atas</a> </p>
<p> <a id="bcb"> <strong>pemrograman borland C++builder</strong> </a> </p>
<p> C++builder adalah sebuah perangkat lunak berbasis C++ yang digunakan untuk melakukan pembuatan aplikasi (baik visual maupun non-visual) yang berjalan di atas platform microsoft windows. Selain itu, C++builder juga banyak di gunakan sebagai alatuntuk pengembangan file-file DLL (Dynamic Link Library ). Dengan adanya kemudahan dan dukungan visual yang di tawarkan di dalamnya, C++builder banyak di gunakan oleh para programmer profesional untuk pengembangan aplikasi yang beraneka ragam jenisnya, seperti : openGL, multimedia, games, database, embedded system, dan banyak lagi yang lainnya.<br />
<a href="#atas">kembali ke atas</a> </p >
</body>
</html>

Menyajikan tabel pada HTML

Menyajikan Tabel pada html ini menggunakan tag <table> ada beberapa tag di dalam <table>_</table>
yaitu <tr> untuk Baris ,, dan <td> untuk Kolom

ada beberapa atribut untuk tag <table>
Width =panjang(lebar table, pixel atau persen)
Height =panjang(tinggi table, pixel atau persen)
Border =pixel(tebal garis tepi)
Cellspacing =pixel(spasi antar sel)
Cellpadding =pixel(spasi di dalam sel)
Align =[left|center|right](perataan table)
Bgcolor =warna(warna latar belakang table)

Dan ada juga beberapa atribut untuk tag <tr>
Align =[left|center|right](perataan sebaris sel secara horizontal)
Valign =[top|middle|bottom](perataaan sebaris sel secara vertical)
Bgcolor =warna(warna latar belakang baris)

Dan ini atribut untuk tag <td>
Align =[left|center|right](perataan horizontal)
Width =[top|middle|bottom](perataan vertical)
Height =pixel(tinggi sel, pixel atau persen)
Bgcolor =warna(warna latar belakang sel)

Contoh Codingan Table

<html>
<head>
<title>Contoh Pembuatan Table</title>
</head>
<body>
<center><h1>Hasil Dari Codingan</h1></center>
<table border="5" cellpadding="20px" cellspacing="15px" bgcolor="black">
<tr>
<td bgcolor="green">Baris 1 Kolom 1</td>
<td bgcolor="grey">Baris 1 Kolom 2</td>
</tr>
<tr>
<td bgcolor="grey">Baris 2 Kolom 1</td>
<td bgcolor="green">Baris 2 Kolom 2</td>
</tr>
</table>
</body>
</html>

Kegiatan Belajar 14 : Format Tampilan Gambar dengan Map

untuk Kegiatan Belajar 14 tentang  Format Tampilan Gambar dengan Map itu emang biasa sulit di mengerti oleh beberapa orang ,,

Format Tampilan Gambar dengan Map itu bisa di artikan apabila kita memasukan suatu Gambar dan Gambar itu bisa di klik. nah di dalam HTML itu di sebut dengan Tag <map>. tetapi sebelum kita memasukan Tag <map> kita harus memberikan attribut tag usemap=".." di dalam tag <img>
sebagai Contoh :

<img src="Letak File" usemap="#Identitas Map">

kita bisa memasukan # untuk memberi tanda saat kita mengklik gambar tersebut .
setelah kita memasukan tag <img> di html baru disitu kita dapat memasukan tag <map> Formatnya :

<map name =”Nama Map”>             <area shape = ”type” coords=”value” href=”link”> </map>

• Shape = untuk menentukan bentuk hyperlink
• coords = untuk menentukan koordinat/posisi yang akan diklik
• href = tujuan ketika area itu diklik 

map name itu harus di samakan dengan usemap agar bisa saling terhubung,dan untuk area shape ada beberapa type yaitu
   
          Tipe Shape                                 Keterangan

• Default                                       Semua area image 
• Rect                                            Area kotak tertentu 
• Poly                                            Area poligon 
• Circle                                          Area lingkaran tertentu 

      Aturan untuk menuliskan nilai untuk menentukan koordinat pada image yang berguna sebagai area hyperlink dapat dilihat pada daftar tabel di bawah ini

          Tipe Shape                              Keterangan 

• Rect                                         left-x, top-y, right-x, bottom-y 
• Circle                                      center-x, center-y, radius 
• Poly                                         x1, y1, x2, y2, ...xn, yn.  

Contoh Penulisan Secara Lengkap Di HTML

<html>
<body>
<img src="lokasi gambar" width="bisa di isi dengan 100% atau berapapun sesuai keinginan" height="bisa di isi dengan 100% atau berapapun sesuai keinginan" usemap="#Nama Map">
<map name="Nama Map">
          <area shape="rect/circle/poly" coords="angka, angka, angka, angka" href="Tujuan ketika di klik">
</map>
</body>
</html>

Pasang Iklan 300x250

Pasang iklan:

300x250 >> Slot 1
Harga 100 ribu/bulan
blog : http://hanungku.blogspot.com/

Jika ingin beriklan, silakan kirimkan Gambar atau link ke sini alfianfajar8.af@gmail.com .

Cara Membuat Blog

beberapa alat yang di perlukan
- Koneksi Internet
- Akun Gmail

Langkah Langkah
1. Masuk www.blogger.com
2. Masukan Email dan Password Akun Gmail
3. Jika Sudah Login Akan Tampil

4. Klik Blog Baru

5. Nanti akan muncul tampilan seperti ini

6. isi pada form yang telah di sediakan , jika sudah nanti akan muncul tampilan seperti di bawah ini 

 

 *Klik Gambar Untuk Memperbesar