Minggu, 08 Mei 2016

Membuat Link Dan Tabel Dari HTML

       Oke teman kali ini kita akan belajar bagaimanaca cara membuat link dan tebel lewat html dan juga kita akan mengenal atribut-atribut yang dimiliki tabel. pertama tama kita akan belajar bagaimana cara membuat link dengan html

Membuat Link Dengan HTML :
      sebelumnya saya akan menjelaskan sedikit tentang link. link (hyperlink) adalah sebuah acuan dalam dokumen hiperteks(hypertext) ke dokumen lain atau sumber lain.untuk mengenali sebuah link di web biasanya cursor anak panah akan berganti ke cursor bentuk tangan dan tulisan yang memiliki link bisanya memiliki waarna yang terang/berbeda tulisan lainnya.

ada beberapa macam link seperti :

1. INTERLINK
    Interlink (internal link) adalah tautan antar artikel dalam web atau blog, baik artikel lama maupn artikel baru. tujuan agar pengunjung mudah untuk mencari artikel di dalam suatu web atau blog yg dikunjungi

2. EXTERNAL LINK
    External link adalah tautan yang menghubungkan websate atau blog yang satu ke websate atau blog lainnya.

3. BROKEN LINK
    Broken link adalah sebuah tautan yang menghubungkan suatu websate ke websate atau juga url yang tidak tersedia seperti halaman yang biasa kita lihat saat lagi internet "not found"

untuk kode dasar dalam membuat link menggunakan tag <a href="url">text yang mau kita bisa klick</a>
<a> : adalah tag kode dasar dalam pembuatan link
<href> : adalah atribut yang digunakan untuk menghubungkan ke link yang lain

Gambar dalam membuat link dengan html


outputnya 

  
untuk link yang dapat di klick terlihat seperti dibawah :
  
sekarang kita akan belajar bagaimana cara membuat tabel di html seperti yang diatas saya akan menjelaskan dulu bagaimana pengertian tabel beserta atribut yang dimiliki tabel di html

Membuat Tabel Dengan HTML : 

     tabel merupakan cara untuk menampilkan sebuah informasi dalam bentuk kolom dan baris. untuk menampilkan data dalam bentuk table di html kita menggunakan <table><tr><td> 

Tag <table>
Tag <table> adalah pembuka untuk membuat sebuah tabel 

Tag <tr>
Tag <tr> atau table row fungsinya untuk membuat baris pada tabel

Tag <td>
Tag <td> atau tabel data fungsinya untuk menampilkan data pada setiap sel tabel, untuk umumnya table data <tr> ini digunakan untuk membuat kolom dalam baris table

Contoh membuat tabel di HTML


border adalah salah satu dari atribut yang dimiliki tabel gunanya border adalah untuk mendefinisikan ukuran garis tepi dalam bentuk satuan pixels 

hasil output tabel dengan menggunakan <table border="1"> seperti yang diatas

beberapa atribut lainnya yang dimiliki tabel :

1. Cellspacing digunakan untuk membuat spasi antara dua cells dalam satuan pixels

contoh cellspacing dengan menggunkan atribut border

outputnya



 2. Cellpadding digunkan untuk mendefinisikan spasi

contoh cellpadding dengan menggunakan atribut border dan cellspacing


outputnya


3. width digunakan untuk mendefinisikan ukuran tabel dalam satuan pixels 

contoh width dengan menggunkan atribut border dan cellspacing


 output






4. Align digunakan untuk mendefinisikan perataan tabel yaitu perataan tengah, kiri atau kanan

Contoh Align dengan menggunakan atribut 
border, cellspacing,cellpadding, width

contoh diatas menggunakan align="center" (perataan tengah)

outputnya


5. bgcolor digunakan untuk mendefinisikan warna latar belakang

Conoh bgcolor dengan atribut
border,cellspacing,cellpadding,width,align


outputnya


      oh yah sering kali kita membuat tebel baris pertama kita gunakan sebagai judul kolom dari baris-baris di bawahnya. untuk keperluan ini html memiliki tag khusus yang bisa digunakan , yaitu tag <th> (tag head) dalam penggunaan tag <th> kita hanya perlu mengganti tag <td> dengan tag <th> pada baris pertama tabel.

Contoh Tag Header



Output


 Oke teman pembelajaran untuk membuat link dan tabel cukup dari saya mohon maaf bila ada kesalahan . bila teman teman ada yang ingin menambahkan atau melengkapi kekurangan saya dari pembelajaran diatas silahkan berkomentar agar kita saling mendapatkan ilmu dan bisa maju bersama sama.


SEE YOU AGAIN !!!!!!!!!







Rabu, 27 April 2016

materi praktikum pemograman Web 1


Halo sobat saya akan menjelaskan tentang pengertian HTML dan strukturnya berserta dengan tag tag yang  digunakan didalam HTML :

1.)   Pengertian HTML dan Struktur Programnya
 HyperText Markup Language atau di sebut juga dengan HTML adalah sebuah  bahasa markah yang digunakan untuk web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dengan format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. 
HTML juga merupakan bahasa pemrograman dasar yang digunakan ketika akan membuat sebuah halaman web, baik web yang statis maupun web yang dinamis. HTML merupakan bahasa markup language. Pada HTML terdapat berbagai tag atau elemen yang dapat digunakan untuk memformat sebuah dokumen dalam web.  
Jadi, HTML yaitu bahasa pemrograman dasar untuk membuat sebuah web, yang bertujuan untuk menghasilkan sebuah tampilan terintegerasi yang berisikan tantang berbagai informasi


Contoh Struktur Pemrograman Web dengan  HTML


 
 Untuk melihat hasil dari kerja kita kita dapat melihat setelah kita menyimpannya seperti contoh di bawah ini :







Untuk melihat hasil dari kerja kita kita dapat melihat setelah kita menyimpannya seperti contoh di bawah ini



2.)    Heading

Heading dalam sebuah HTML adalah sesutau yang sangat di perlukan . Heading dalam HTML didefinisikan dengan tag <h1><h2><h3><h4><h5> <h6>. Semakin besar angka dalam penulisan tag Heading (<h6>) semakin kecil ukuran yang tercetak didalam Browser.begitu pula sebaliknya semakin kecil penulisan tag heading (<h1>)maka semakin besar ukuran yg tercetak didalam Browser.

Contoh dalam penggunaan tag heading



untuk Outputnya terlihat seperti dibawah ini

3.)Paragraf
 
Didalam HTML untuk membuat paragraf kita mengunakan tag <p> sebgai pembuka dan tag </p> sebagaipenutup paragraf  kita dapat melihat hasilnya



Contoh dalam penggunaan tag paragraf


untuk Outputnya terlihat seperti dibawah ini



4.)    Baris Baru
Didalam HTml , Enter tidak terbaca . oleh karena itu untuk membuat baris baru lewat HTML kita perlu menggunakan Tag <br> yang di gunakan untuk menyisipkan baris baru


Contoh dalam menggunakan Tag <br>
 

Untuk Outputnya terilhat seperti di bawah ini







5.)   Penggunaan Align Center pada Tag Paragraf
Untuk membuat tulisan kita berada di tengah , kita perlu menggunakan tag <center>Jika kalian ingin membuat suatu paragraf baru disertai dengan pemerataan teks ke, tengah, dari tampilan browser tag  tag nya seperti ini 

<P ALIGN=CENTER> </P>

 Contoh dalam penggunaan align Center pada tag Paragraf

untuk Outputnya terlihat seperti dibawah ini



6) Unodered List
Unodered list ditandai dengan tag <ul> dan tag <ul> digunakan untuk membuat bullets dan <li> untuk menampilkan hasil dari <ul>


Contoh dalam penggunaan <ul> dan <li>


Output dalam penggunaan <ul> dan <li>

 

7) Ordered List 

Ordered list ditandai dengan tag <ol> dan tag <ol> digunakan untuk membuat angka <li> disini juga untuk menampilkan hasil dari <ol>

Contoh dalam Penggunaan Tag <ol>





Output dalam penggunaan tag <ol>