1. Singkatan (Akronim)
Untuk menuliskan suatu dokumen atau beberapa istilah kita terkadang menggunakan singkatan (akronim). Untuk menuliskan singkatan, ada tag html yang di gunakan yaitu Tag dan Tag Ketika menggunakan tag diatas, maka pada saat mouse pointer kita berada diatas singkatan tersebut yang di tampilkan di browser web, maka kepanjangan dari singkatan tersebut akan di tampilkan mengambang di atasnya.
latihan1.html
2. Address
Alamat (address) merupakan salah satu elemen yang umum di dalam suatu dokumen. Untuk membuat alamat pada dokumen html di sediakan secara khusus yaitu Tag . Dengan adanya tag ini maka penulisan alamat dapat di standarkan. Secara default tag akan menampilkan teks di sebalah kiri, untuk di sebelah kanan menggunakan atribut dir=”rtl”. Sintaks penulisannya :
singkatan
singkatan
Contoh Penggunaan Akronim
WWW adalah halaman-halaman website yang dapat saling terkoneksi satu dengan lainnya (hyperlink)yang membentuk samudra belantara informasi.
HTTP adalah protokol yang dipergunakan untuk mentransfer dokumen dalam World Wide Web(WWW).
alamat anda
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
2
latihan2.html
3. Arah Teks
Secara lazim untuk teks kita membacanya dari kiri ke kanan (left to right – ltr). Di html ada tag yang digunakan untuk mengubah penulisan teks dari kanan ke kiri (right to left – rtl). Tag yang digunakan yaitu Tag bidirectional override merupakan tag yang digunakan untuk mendefinisikan arah penulisan teks. Atribut yang digunakan dir. Sintaks penulisannya :
latihan3.html
Contoh Penggunaan Address
STMIK AMIKOM Yogykarta
Kampus Terpadu: Jl.Ring Road Utara
Condong Catur
Sleman
Yogykarta
Teks yang mau di arahkan
Contoh Penggunaan BDO
STMIK AMIKOM Yogykarta
Jurusan :
S2 Megister Teknik Informatika
S1 Teknik Informatika
S1 Sistem Informasi
D3 Teknik Informatika
D3 Manajemen Informatika
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
3
4. Teks yang Disisipkan atau Dihapus
Dalam menulis artikel web kita bisa mengkoreksi teks yang di tuliskan dengan menggunakan tag dan tag. Tag tersebut kita bisa megkoreksi hasil pekerjaan dengan menyisipkan atau menghapus. Tag memberikan tanda untuk sisipan dengan membuat teks di garis bawah. Sedangkan Tag bukan menghapus teks tetapi mengkoreksi pekerjaan dengan memberikan garis tengah horizontal pada teks yang dihapus. Sintaks penulisannya :
latihan4.html
5. Font
Dengan tag anda bisa menentukan format tampilan font dalam document HTML seperti color, size, style dan lainnya. Di bawah ini atribut yang bisa digunakan untuk tag font diantaranya sebagai berikut:
5.1 Ukuran Font
Atribut size digunakan untuk mengatur ukuran font. Nilai font dimulai dengan nilai 1 untuk ukuran huruf terkecil dan nilai 7 untuk ukuran paling besar atau +1 untuk ukuran huruf terkecil dan nilai +6 untuk ukuran paling besar.
5.2 Jenis Font
Atribut face digunakan untuk mengatur jenis huruf yang diinginkan. Atribut face harus diisi dengan string jenis font seperti: Arial, Times New Roman, Verdana, Courier New, Courier, monospace dan lain sebagainya.
Satu tahun adalahlima belas dua belas bulan
Contoh Penggunaan INS & DEL
Budi membeli perlengkapan kuliah diantarnya sebagai berikut:
1. Buku tulis Rp.10.000
2. ballpoint pen Rp.15000
3. stabilo Rp.5000
Total pembeliannya adalah40.000 30.000
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
4
5.3 Warna Font
Atribut color digunakan untuk mengatur warna font yang diinginkan. Untuk memberi nilai pada atribut color ada dua cara, yaitu: Dengan menyebutkan nama warna seperti red, green dan blue. Dengan menggunakan nilai RGB (Red Green Blue) dari satu warna misalnya:
#FF0000 untuk red, #00FF00 untuk green dan #0000FF untuk Blue. Sintaks penulisannya :
latihan5.html
6. Link HTML
Dokumen HTML menggunakan hyperlink (anchor) untuk menghubungkan kepada dokumen lain. Dokumen ini bisa berupa teks dan / atau gambar yang saling menghubungkan menuju ke dokumen atau bagian lain dalam suatu dokumen. Browser web akan menyorot teks atau gambar yang di identifikasi sebagai link dengan warna atau garis bawah untuk menunjukkan bahwa itu adalah hyperteks link sering di singkat hyperlink atau link saja.
6.1 Tag Anchor
Tag untuk membuat suatu link kepada dokumen lain dalam web. Atribut pada tag diantaranya: atribut href="uri" untuk mendefinisikan lokasi link, atribut name="name" untuk mendefinisikan nama link, dan atribut target="_blank"|"_parent"|"_top"|"_self"
Ukuran Font
Jenis Font
Warna Font
Contoh Penggunaan Font
Ini ukuran 1
Ini memakai font Arial
Ini Warna Biru
Teks ini menggunakan warna merah,
Jenis font yang digunakan adalah Courier New, dan ukuran teksnya 7.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
5
untuk _blank akan membuka pada window baru, _parent/_top akan keluar dari frame, _self akan tetap di window browser. Sintaks penulisannya :
Link html terdapat 3 jenis yaitu diantaranya sebagai berikut: Link Relatif
Dibuat apabila anda membuat suatu link pada page anda ke page lain pada komputer yang sama, tidak memerlukan menggunakan alamat internet yang lengkap. Jika kedua page pada direktori yang sama, anda dapat menuliskan nama file html sebagai berikut:
latihan6.html Link Absolut
Dibuat apabila anda membuat link ke page web lain yang berada pada web site lain di internet. Dalam hal ini anda harus menuliskan alamat internet secara lengkap. Berikut adalah contohnya:
latihan7.html
Link web Amikom
Contoh Penggunaan Link Relatif
Anda ingin melihat format font pada latihan5.html, silahkan klik link berikut.
Contoh Penggunaan Link Absolut
Anda ingin mengunjungi situs resmi amikom. Silahkan klik link berikut.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
6
Link ke Bagian Lain dalam Dokumen
Link jenis ini dibuat apabila untuk dokumen yang panjang sekali, sehingga apabila di tampilkan dalam browser web akan mengharuskan kita melakukan scroll layar berulang-ulang. Navigasi untuk penelusuran dokumen dapat dimudahkan dengan membuat link antarbagian, dengan menandai setiap bagian tersebut dengan memberinya nama. Sehingga pada beberapa tempat di dalam dokumen akan ada bagian yang bernama, dan dibagian lainnya dapat diletakkan link untuk menuju bagian-bagian tersebut. Sintaks penulisannya :
latihan8.html
Link asal
Artikel bebas
.
.
.
Posisi tujuan
Artikel bebas
.
.
.
Contoh Penggunaan Link Dalam Dokumen
Lihat Bab 4.
Bab 1 adalah menjelaskan bla bla bla.
Bab 2 adalah menjelaskan bla bla bla.
Bab 3 adalah menjelaskan bla bla bla.
Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.
Bab 5 adalah menjelaskan bla bla bla.
Kembali ke atas
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
7
6.2 Link Mailto
Mailto digunakan untuk membuat link pada suatu pesan mail (tidak akan bisa bekerja jika mail client tidak terpasang).
latihan9.html
Contoh Penggunaan Link Mailto
Anda ingin mengirim tugas pemrograman web bisa melalui email berikut.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
8
REFERENSI Sidik, Betha dan Pohan, I. Husni. (2011). Pemrograman Web dengan HTML disertai lebih dari 200 contoh program beserta tampilan grafisnya. Bandung: Informatika. Arief, M. R. (2011). Pemrograman Web Dinamis menggunakan PHP dan MySQL. Yogyakarta: Andi Offset.
Untuk menuliskan suatu dokumen atau beberapa istilah kita terkadang menggunakan singkatan (akronim). Untuk menuliskan singkatan, ada tag html yang di gunakan yaitu Tag dan Tag Ketika menggunakan tag diatas, maka pada saat mouse pointer kita berada diatas singkatan tersebut yang di tampilkan di browser web, maka kepanjangan dari singkatan tersebut akan di tampilkan mengambang di atasnya.
latihan1.html
2. Address
Alamat (address) merupakan salah satu elemen yang umum di dalam suatu dokumen. Untuk membuat alamat pada dokumen html di sediakan secara khusus yaitu Tag . Dengan adanya tag ini maka penulisan alamat dapat di standarkan. Secara default tag akan menampilkan teks di sebalah kiri, untuk di sebelah kanan menggunakan atribut dir=”rtl”. Sintaks penulisannya :
singkatan
singkatan
WWW adalah halaman-halaman website yang dapat saling terkoneksi satu dengan lainnya (hyperlink)yang membentuk samudra belantara informasi.
HTTP adalah protokol yang dipergunakan untuk mentransfer dokumen dalam World Wide Web(WWW).
alamat anda
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
2
latihan2.html
3. Arah Teks
Secara lazim untuk teks kita membacanya dari kiri ke kanan (left to right – ltr). Di html ada tag yang digunakan untuk mengubah penulisan teks dari kanan ke kiri (right to left – rtl). Tag yang digunakan yaitu Tag bidirectional override merupakan tag yang digunakan untuk mendefinisikan arah penulisan teks. Atribut yang digunakan dir. Sintaks penulisannya :
latihan3.html
STMIK AMIKOM Yogykarta
Kampus Terpadu: Jl.Ring Road Utara
Condong Catur
Sleman
Yogykarta
Teks yang mau di arahkan
STMIK AMIKOM Yogykarta
Jurusan :
S2 Megister Teknik Informatika
S1 Teknik Informatika
S1 Sistem Informasi
D3 Teknik Informatika
D3 Manajemen Informatika
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
3
4. Teks yang Disisipkan atau Dihapus
Dalam menulis artikel web kita bisa mengkoreksi teks yang di tuliskan dengan menggunakan tag dan tag
latihan4.html
5. Font
Dengan tag anda bisa menentukan format tampilan font dalam document HTML seperti color, size, style dan lainnya. Di bawah ini atribut yang bisa digunakan untuk tag font diantaranya sebagai berikut:
5.1 Ukuran Font
Atribut size digunakan untuk mengatur ukuran font. Nilai font dimulai dengan nilai 1 untuk ukuran huruf terkecil dan nilai 7 untuk ukuran paling besar atau +1 untuk ukuran huruf terkecil dan nilai +6 untuk ukuran paling besar.
5.2 Jenis Font
Atribut face digunakan untuk mengatur jenis huruf yang diinginkan. Atribut face harus diisi dengan string jenis font seperti: Arial, Times New Roman, Verdana, Courier New, Courier, monospace dan lain sebagainya.
Satu tahun adalah
Budi membeli perlengkapan kuliah diantarnya sebagai berikut:
1. Buku tulis Rp.10.000
2. ballpoint pen Rp.15000
3. stabilo Rp.5000
Total pembeliannya adalah
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
4
5.3 Warna Font
Atribut color digunakan untuk mengatur warna font yang diinginkan. Untuk memberi nilai pada atribut color ada dua cara, yaitu: Dengan menyebutkan nama warna seperti red, green dan blue. Dengan menggunakan nilai RGB (Red Green Blue) dari satu warna misalnya:
#FF0000 untuk red, #00FF00 untuk green dan #0000FF untuk Blue. Sintaks penulisannya :
latihan5.html
6. Link HTML
Dokumen HTML menggunakan hyperlink (anchor) untuk menghubungkan kepada dokumen lain. Dokumen ini bisa berupa teks dan / atau gambar yang saling menghubungkan menuju ke dokumen atau bagian lain dalam suatu dokumen. Browser web akan menyorot teks atau gambar yang di identifikasi sebagai link dengan warna atau garis bawah untuk menunjukkan bahwa itu adalah hyperteks link sering di singkat hyperlink atau link saja.
6.1 Tag Anchor
Tag untuk membuat suatu link kepada dokumen lain dalam web. Atribut pada tag diantaranya: atribut href="uri" untuk mendefinisikan lokasi link, atribut name="name" untuk mendefinisikan nama link, dan atribut target="_blank"|"_parent"|"_top"|"_self"
Ukuran Font
Jenis Font
Warna Font
Ini ukuran 1
Ini memakai font Arial
Ini Warna Biru
Teks ini menggunakan warna merah,
Jenis font yang digunakan adalah Courier New, dan ukuran teksnya 7.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
5
untuk _blank akan membuka pada window baru, _parent/_top akan keluar dari frame, _self akan tetap di window browser. Sintaks penulisannya :
Link html terdapat 3 jenis yaitu diantaranya sebagai berikut: Link Relatif
Dibuat apabila anda membuat suatu link pada page anda ke page lain pada komputer yang sama, tidak memerlukan menggunakan alamat internet yang lengkap. Jika kedua page pada direktori yang sama, anda dapat menuliskan nama file html sebagai berikut:
latihan6.html Link Absolut
Dibuat apabila anda membuat link ke page web lain yang berada pada web site lain di internet. Dalam hal ini anda harus menuliskan alamat internet secara lengkap. Berikut adalah contohnya:
latihan7.html
Link web Amikom
Anda ingin melihat format font pada latihan5.html, silahkan klik link berikut.
Anda ingin mengunjungi situs resmi amikom. Silahkan klik link berikut.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
6
Link ke Bagian Lain dalam Dokumen
Link jenis ini dibuat apabila untuk dokumen yang panjang sekali, sehingga apabila di tampilkan dalam browser web akan mengharuskan kita melakukan scroll layar berulang-ulang. Navigasi untuk penelusuran dokumen dapat dimudahkan dengan membuat link antarbagian, dengan menandai setiap bagian tersebut dengan memberinya nama. Sehingga pada beberapa tempat di dalam dokumen akan ada bagian yang bernama, dan dibagian lainnya dapat diletakkan link untuk menuju bagian-bagian tersebut. Sintaks penulisannya :
latihan8.html
Link asal
Artikel bebas
.
.
.
Posisi tujuan
Artikel bebas
.
.
.
Lihat Bab 4.
Bab 1
Bab 1 adalah menjelaskan bla bla bla.
Bab 2
Bab 2 adalah menjelaskan bla bla bla.
Bab 3
Bab 3 adalah menjelaskan bla bla bla.
Bab 4
Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.
Bab 5
Bab 5 adalah menjelaskan bla bla bla.
Kembali ke atas
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
7
6.2 Link Mailto
Mailto digunakan untuk membuat link pada suatu pesan mail (tidak akan bisa bekerja jika mail client tidak terpasang).
latihan9.html
Anda ingin mengirim tugas pemrograman web bisa melalui email berikut.
PENGENALAN PERANCANGAN WEB -
Pengenalan Perancangan Web – S1 Sistem Informasi
8
REFERENSI Sidik, Betha dan Pohan, I. Husni. (2011). Pemrograman Web dengan HTML disertai lebih dari 200 contoh program beserta tampilan grafisnya. Bandung: Informatika. Arief, M. R. (2011). Pemrograman Web Dinamis menggunakan PHP dan MySQL. Yogyakarta: Andi Offset.


Anda sedang membaca artikel berjudul .gif)
0 komentar:
Posting Komentar