Trik Blogger

Trik-trik mempercantik blogger,kumpulan trik blogger terlengkap,trik blogspot,cara membuat blog,trik membuat blog tampil menarik

Senin

Home » » Tutorial HTML Bab.12

Tutorial HTML Bab.12

By No comments
Bab 12: Menggunakan Meta Tags
Meningkatkan Search Engine Hasil ...
Ketika mesin pencari menemukan halaman Anda, itu akan perlu untuk indeks itu (yaitu, tambahkan ke database) dengan beberapa informasi dari halaman. Banyak mesin pencari sekarang mendukung <META> tag, yang memungkinkan Anda untuk memberikan kata kunci dan deskripsi ke halaman Anda. Ini memberi Anda lebih banyak kontrol atas bagaimana halaman Anda akan muncul selama pencarian, dan akan sering menyebabkan lebih banyak lalu lintas ke halaman Anda.
<META> Tag yang dapat digunakan untuk beberapa tujuan yang berbeda. Biasanya, Anda harus menempatkan tag dalam <META> <head> tag pada awal dokumen anda. Untuk meningkatkan hasil mesin pencari, kita akan menggunakan dua atribut khusus dalam meta tag. Berikut ini sebuah contoh:
<meta name="description" content="description halaman goes here">
<meta name="keywords" content="keywords pergi here">
Ketika pengguna mencari mesin pencari yang mendukung tag meta dan pertanyaan mereka ungkapan (pencarian untuk kata kunci) yang terkait dengan halaman Anda, halaman Anda mungkin akan ditampilkan di daftar hasil. Halaman Anda akan terdaftar oleh Judul, dan kemudian di bawah judulnya akan menjadi yang pertama seratus atau lebih karakter dari deskripsi Anda ditempatkan di meta tag. Dianjurkan agar Anda menyimpan konten deskripsi tidak lebih dari 200 karakter. Meskipun kata kunci konten tidak terlihat oleh pengguna ketika digeledah, dianjurkan untuk menyimpan ini kurang dari 1000 karakter, karena jika Anda memiliki lebih banyak mesin pencari entah akan mengabaikan istirahat atau menghapus Anda dari indeks. (Spasi tidak diperlukan untuk memisahkan kata kunci)
Contoh nyata situasi meta ...
<html>

<head>
<title> Little Joe's Sound Halaman </ title>
name="description" <meta Cool content="Joe's Koleksi File suara untuk digunakan di rumah Anda page!">
name="keywords" <meta suara content="music joe collection"> midi wav
</ head>

<body>
Halaman Goes Here
</ body>

</ html>

Meta tag tidak terlihat pada halaman web, kecuali jika pengguna memilih untuk 'view source'.
Auto-menyegarkan ...
Refreshing otomatis didukung oleh banyak versi-versi terbaru dari Netscape Navigator dan Microsoft Internet Explorer. Hal ini juga menggunakan bentuk modifikasi dari <META> tag. Auto menyegarkan berarti bahwa sekali satu halaman load, Anda dapat menetapkan jumlah tertentu detik dan kemudian browser akan memuat halaman lain secara otomatis. Struktur dasar adalah sebagai berikut:

<meta http-equiv=REFRESH CONTENT=x_seconds;url="http://www.yourhost.co.za/pagetosendto.html">
URL adalah halaman yang anda inginkan refresh untuk, ISI adalah jumlah detik yang Anda inginkan untuk menunggu sebelum menyegarkan, dan http-equiv = refresh hanya mengatakan bahwa ini adalah tag meta refresh. Sebagai contoh, jika anda ingin halaman untuk refresh untuk sybase.co.za setelah 5 detik itu akan menjadi sebagai berikut:
<meta http-equiv=REFRESH CONTENT=5;URL="http://www.sybase.co.za/">
Bab 13: Bentuk
Formulir ...
Formulir memungkinkan Anda untuk menambahkan interaktivitas ke dokumen-dokumen web Anda dengan cara yang <form> tag. Dengan bentuk tag yang dapat ditambahkan ke halaman web Anda buku tamu, formulir pemesanan, survey, mendapatkan umpan balik atau apa pun.
Konstruksi dasar dari suatu bentuk html ini ...
<form> Memulai bentuk
<input> Meminta informasi di salah satu dari beberapa cara berbeda ...
<input> ... Ada dapat banyak masukan daerah seperti yang anda inginkan
</ FORM> akhir suatu bentuk
<input> Tag yang menyediakan pengguna dengan berbagai cara untuk memasukkan informasi. Ada beberapa tag <input> berbeda.
Form Input ...
Teks
JENIS yang paling umum adalah <input> bentuk TEXT.
<INPUT TYPE=TEXT>
Setiap masukan membutuhkan NAMA.
<INPUT TYPE=TEXT NAME="ADDRESS">
Ketika pengguna mengetik di alamat (misalnya 1313 Mockingbird Lane), ini akan menjadi nilai input dan dipasangkan dengan ALAMAT sehingga hasil akhirnya setelah menjalankan melalui Mailto Formatter akan ALAMAT = 1313 Mockingbird Lane.
Kita bisa jika kita ingin, ketik NILAI.
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="44 Cherry St">
Ini akan secara otomatis memasangkan nilai 44 Cherry St dengan nama ALAMAT, kecuali pengguna perubahan itu. Catatan-pastikan untuk menggunakan tanda kutip di mana saya tetapkan.
Kita dapat menentukan ukuran kotak input teks.
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="44 Cherry St" SIZE=10>
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="44 Cherry St" SIZE=20>
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="44 Cherry St" SIZE=30>
Nilai default adalah 20.
Jika kita inginkan, kita dapat menentukan berapa banyak karakter pengguna dapat memasukkan.
Pergi ke depan dan mencoba untuk memasukkan lebih dari 10 karakter dalam kotak teks di bawah ini:
<INPUT TYPE=TEXT NAME="ADDRESS" SIZE=30 MAXLENGTH=10>
Sangat mirip dengan TYPE = TEXT adalah TYPE = PASSWORD. Hal ini persis sama, kecuali dispays *** bukan masukan yang sebenarnya. Browser akan mengirimkan masukan, itu saja tidak akan menampilkan hal itu.
<INPUT TYPE=PASSWORD>
Ingat bahwa setiap <input> harus memiliki NAMA.
<INPUT TYPE=PASSWORD NAME="USER PASSWORD">
UKURAN, NILAI, dan MaxLength pengubah / atribut bekerja di sini juga. Omong-omong, sebuah <TAG> menginformasikan kepada browser untuk melakukan sesuatu.
Radio Buttons dan Check Boxes
Tombol radio memungkinkan pengguna untuk memilih salah satu dari beberapa pilihan. Periksa kotak memungkinkan pengguna untuk memilih satu atau beberapa atau semua pilihan.
Pertama, mari kita membangun beberapa Radio Buttons.
<INPUT TYPE=RADIO NAME="POSITION">
Sekarang tambahkan 2 more.
<INPUT TYPE=RADIO NAME="POSITION">
<INPUT TYPE=RADIO NAME="POSITION">
<INPUT TYPE=RADIO NAME="POSITION">
Hmmm ... Saya kira kita harus meletakkan satu baris setelah masing-masing.
<INPUT TYPE=RADIO NAME="POSITION"> <BR>
<INPUT TYPE=RADIO NAME="POSITION"> <BR>
<INPUT TYPE=RADIO NAME="POSITION"> <P>
Perhatikan bahwa setiap masukan memiliki nama yang sama. Alasan akan tampak sangat singkat.
Setiap Radio Buttons harus diberi NILAI.
<INPUT TYPE=RADIO NAME="POSITION" VALUE="PB"> <BR>
<INPUT TYPE=RADIO NAME="POSITION" VALUE="DBA"> <BR>
<INPUT TYPE=RADIO NAME="POSITION" VALUE="NOTA"> <P>
Sekarang label masing-masing tombol.
<INPUT TYPE=RADIO NAME="POSITION" VALUE="PB"> <BR> PowerBuilder Developer
<INPUT TYPE=RADIO NAME="POSITION" VALUE="DBA"> Database Administrator <BR>
<INPUT TYPE=RADIO NAME="POSITION" VALUE="NOTA"> Tidak satu pun dari atas <P>
PowerBuilder Developer
Database Administrator
Di atas tidak
Anda juga dapat mengubah label tersebut dengan tag html lain jika Anda inginkan.
Radio Buttons pada dasarnya Anda sudah selesai. Anda dapat membereskan hal-hal dengan menambahkan pernyataan di atas tombol, dan jika Anda inginkan, memilih pilihan default (opsional).
Apa posisi Anda dalam perusahaan? <BR>
<INPUT TYPE=RADIO NAME="POSITION" VALUE="PB" CHECKED> <BR> PowerBuilder Developer
<INPUT TYPE=RADIO NAME="POSITION" VALUE="DBA"> Database Administrator <BR>
<INPUT TYPE=RADIO NAME="POSITION" VALUE="NOTA"> Tidak satu pun dari atas <P>
Apa posisi Anda dalam perusahaan?
PowerBuilder Developer
Database Administrator
Di atas tidak
Tentu saja pengguna hanya dapat memilih 1 pilihan. Pilihan mereka akan dikembalikan kepada Anda sebagai nama / nilai pasangan POSISI = PB (atau manapun yang mereka pilih).
Periksa kotak bangunan cukup banyak hal yang sama. Mulailah dengan hal ini.
<INPUT TYPE=CHECKBOX NAME="PB">
Tambahkan 3 lebih, tapi kali ini masing-masing memberikan NAMA yang berbeda. (Juga menambahkan line break jika anda mau)
<INPUT TYPE=CHECKBOX NAME="PB"> <BR>
<INPUT TYPE=CHECKBOX NAME="DBA"> <BR>
<INPUT TYPE=CHECKBOX NAME="NOTA"> <BR>
Setiap Kotak Centang mendapat NILAI yang sama.
<INPUT TYPE=CHECKBOX NAME="PB" VALUE="YES"> <BR>
<INPUT TYPE=CHECKBOX NAME="DBA" VALUE="YES"> <BR>
<INPUT TYPE=CHECKBOX NAME="NOTA" VALUE="YES"> <BR>
Catatan-Untuk Periksa box yang NAMA NILAI perubahan dan tetap sama dan dengan Radio Buttons, yang NILAI NAMA perubahan tapi tetap sama. Jangan merasa tidak enak, pikiran sederhana saya masih jadi bingung.
OK, mari kita label setiap kotak.
<INPUT TYPE=CHECKBOX NAME="PB" VALUE="YES"> <BR> PowerBuilder Developer
<INPUT TYPE=CHECKBOX NAME="DBA" VALUE="YES"> Database Administrator <BR>
<INPUT TYPE=CHECKBOX NAME="NOTA" VALUE="YES"> Tidak satu pun dari atas <BR>
PowerBuilder Developer
Database Administrator
Di atas tidak
Dan terakhir, Anda mungkin ingin menambahkan sedikit sesuatu di atas kotak cek Anda dan pasangan mungkin memilih default.
Apa yang Anda menempati posisi dalam perusahaan? <BR>
<INPUT TYPE=CHECKBOX NAME="PB" VALUE="YES" CHECKED> <BR> PowerBuilder Developer
<INPUT TYPE=CHECKBOX NAME="DBA" VALUE="YES" CHECKED> Database Administrator <BR>
<INPUT TYPE=CHECKBOX NAME="NOTA" VALUE="YES"> Tidak satu pun dari atas <BR>
Apa yang Anda menempati posisi dalam perusahaan?
PowerBuilder Developer
Database Administrator
Di atas tidak
Pengguna dapat memilih 1, 2, tidak ada atau semua pilihan. Pilihan mereka akan dikembalikan kepada Anda sebagai nama / nilai pasangan ...
PB = YES
DBA = YES
(atau apa yang pernah mereka pilih ... jika mereka memilih apa-apa, tidak akan dikembalikan kepada Anda)
Halaman HTML Anda sendiri ...
Sekarang kita akan membangun halaman umpan balik yang kami ciptakan di Bab 11. Buka halaman kosong "feedback.htm" di Notepad, dan tambahkan berikut (teks biru adalah apa untuk menambahkan).
<html>
<body background="bgnd.gif" bgcolor=#FFFFFF>

<center> <h1> Feedback Form </ h1> </ center>
<br>
<form>
<b> Nama saya adalah: </ b> <input type=text name="name">
<p>
<b> Saya bekerja sebagai: </ b> <br>
<input type=radio name="position" value="Developer" checked> Pengembang <br>
<input type=radio name="position" value="ProjMan"> Project Manager <br>
<input type=radio name="position" value="TechMan"> Manajer Teknis <br>
<input type=radio name="position" value="NOTA"> Tidak satu pun dari atas
</ p>
<p>
<b> Ketika datang ke web browser: </ b> <br>
<input type=checkbox name="Netscape" checked> saya menggunakan Netscape Navigator <br>
<input type=radio name="NetscapeVer" value="2.0"> versi 2.0 <br>
<input type=radio name="NetscapeVer" value="3.0" checked> <br> versi 3.0
<input type=checkbox name="IExplorer"> saya menggunakan Microsoft Internet Explorer <br>
<input type=radio name="IEVer" value="2.0"> versi 2.0 <br>
<input type=radio name="IEVer" value="3.0"> <br> versi 3.0
</ p>

</ body>
</ html>
Simpan file.
Share:  Facebook Twitter Google+

0 komentar:

Posting Komentar