Pemograman Dasar (HTML dan PHP)

PHP

(1)

Pengertian PHP

PHP adalah bahasa pemrograman script server-side yang didesain untuk pengembangan web. Selain itu, PHP juga bisa digunakan sebagai bahasa pemrograman umum (wikipedia). PHP di kembangkan pada tahun 1995 oleh Rasmus Lerdorf, dan sekarang dikelola oleh The PHP Group. Situs resmi PHP beralamat di http://www.php.net.
PHP disebut bahasa pemrograman server side karena PHP diproses pada komputer server. Hal ini berbeda dibandingkan dengan bahasa pemrograman client-side seperti JavaScript yang diproses pada web browser (client).
Pada awalnya PHP merupakan singkatan dari Personal Home Page. Sesuai dengan namanya, PHP digunakan untuk membuat website pribadi. Dalam beberapa tahun perkembangannya, PHP menjelma menjadi bahasa pemrograman web yang powerful dan tidak hanya digunakan untuk membuat halaman web sederhana, tetapi juga website populer yang digunakan oleh jutaan orang seperti wikipedia, wordpress, joomla, dll.
Saat ini PHP adalah singkatan dari PHP: Hypertext Preprocessor, sebuah kepanjangan rekursif, yakni permainan kata dimana kepanjangannya terdiri dari singkatan itu sendiri: PHP: Hypertext Preprocessor.
PHP dapat digunakan dengan gratis (free) dan bersifat Open Source. PHP dirilis dalam lisensi PHP License, sedikit berbeda dengan lisensi GNU General Public License (GPL) yang biasa digunakan untuk proyek Open Source.
Kemudahan dan kepopuleran PHP sudah menjadi standar bagi programmer web di seluruh dunia. Menurut wikipedia pada februari 2014, sekitar 82% dari web server di dunia menggunakan PHP. PHP juga menjadi dasar dari aplikasi CMS (Content Management System) populer seperti Joomla, Drupal, dan WordPress.
Dikutip dari situs w3techs.com, (diakses pada 18 Desember 2014), berikut adalah market share penggunaan bahasa pemrograman server-side untuk mayoritas website di seluruh dunia :
Market Share PHPDapat dilihat dari tampilan diatas bahwa mayoritas website modern saat ini menggunakan PHP.

Fungsi PHP Dalam Pemrograman Web

Untuk membuat halaman web, sebenarnya PHP bukanlah bahasa pemrograman yang wajib digunakan. Kita bisa saja membuat website hanya menggunakan HTML saja. Web yang dihasilkan dengan HTML (dan CSS) ini dikenal dengan website statis, dimana konten dan halaman web bersifat tetap.
Sebagai perbandingan, website dinamis yang bisa dibuat menggunakan PHP adalah situs web yang bisa menyesuaikan tampilan konten tergantung situasi. Website dinamis juga bisa menyimpan data ke dalam database, membuat halaman yang berubah-ubah sesuai input dari user, memproses form, dll.
Untuk pembuatan web, kode PHP biasanya di sisipkan kedalam dokumen HTML. Karena fitur inilah PHP disebut juga sebagai Scripting Language atau bahasa pemrograman script.
Sebagai contoh penggunaan PHP, misalkan kita ingin membuat list dari nomor 1 sampai nomor 10. Dengan menggunakan HTML murni, kita bisa membuatnya secara manual seperti kode berikut ini:
<!DOCTYPE html>
<html>
   <head>
      <title>Contoh list dengan HTML</title>
   </head>
<body>
<h2>Daftar Absensi Mahasiswa</h2>
   <ol>
      <li>Nama Mahasiswa ke-1</li>
      <li>Nama Mahasiswa ke-2</li>
      <li>Nama Mahasiswa ke-3</li>
      <li>Nama Mahasiswa ke-4</li>
      <li>Nama Mahasiswa ke-5</li>
      <li>Nama Mahasiswa ke-6</li>
      <li>Nama Mahasiswa ke-7</li>
      <li>Nama Mahasiswa ke-8</li>
      <li>Nama Mahasiswa ke-9</li>
      <li>Nama Mahasiswa ke-10</li>
   </ol>
</body>
</html>
Halaman HTML tersebut dapat dibuat dengan mudah dengan cara men-copy-paste tag <li> sebanyak 10 kali dan mengubah sedikit angka-angka no urut di belakangnya. Namun jika yang kita inginkan adalah menambahkan list tersebut menjadi 100 atau 1000 list, cara copy-paste tersebut menjadi tidak efektif.
Jika menggunakan PHP, kita tinggal membuat perulangan for sebanyak 1000 kali dengan perintah yang lebih singkat seperti berikut ini:
<!DOCTYPE html>
<html>
   <head>
      <title>Contoh list dengan PHP</title>
   </head>
<body>
<h2>Daftar Absensi Mahasiswa</h2>
   <ol>
      <?php
      for ($i= 1; $i <= 1000; $i++) 
         {
            echo "<li>Nama Mahasiswa ke-$i</li>";
         }
      ?>
   </ol
</body>
</html>
Contoh Penggunaan PHP dalam HTML
Dengan menggunakan kode baris yang bahkan lebih sedikit, kita dapat membuat list tersebut menjadi 1000 kali, bahkan 100.000 kali dengan hanya mengubah sebuah variabel $i.
PHP tidak hanya dapat melakukan pengulangan tersebut, masih banyak hal lain yang bisa kita lakukan dengan PHP, seperti menginput data ke database, menghasilkan gambar, menkonversi halaman text menjadi PDF, management cookie dan session, dan hal lainnya yang akan kita pelajari di dalam tutorial belajar PHP di duniailkom.

Dalam tutorial PHP kali ini, kita telah mempelajari pengertian PHP, dan fungsi PHP dalam pembuatan website. Pada tutorial selanjutnya kita akan membahas tentang sejarah PHP dan perkembangan versinya, dari awal kemunculannya pada tahun 1994, hingga menjadi salah satu bahasa pemrograman paling populer saat ini.


Dalam sesi tutorial dasar-dasar pemrograman PHP kali ini kita akan membahas tentang pengertian atau apa itu tipe data  beserta jenis-jenis tipe data yang terdapat dalam pemrograman PHP.

Pemahaman akan apa itu tipe data serta jenis-jenis tipe data yang terdapat dalam PHP akan menuntun kita dalam alur algoritma yang tepat. Kebanyakan dari kita banyak mengetahui tipe data yang berhubungan dengan numerik, string dan boolean. Sesungguhnya dalam pemrograman php ada tipe-tipe data khusus yang tidak terdapat dalam beberapa bahasa pemrogaman lain.



Apa itu tipe data ?

Tipe data adalah suatu klasifikasi nilai data yang memiliki karakterisitik sehingga dapat menjadi pembeda antara satu data dengan data lainnya. Untuk menyimpai nilai dari tipe data tersebut digunakan sebuah variabel.

Contoh.1: jika kita ingin menggunakan data numerik : -1, 2, 34, 102 , 100, -89
Maka nilai data tersebut masuk ke dalam tipe data integer.

Contoh.2 : Jika kita ingin menggunakan data numerik : 12.8 , 200.18, 7.8, 9.1
Maka nilai data tersebut masuk ke dalam tipe data float.

Contoh.3 : Jika kita ingin membuat kalimat pada sebuah variabel seperti ; saya, kamu
Maka nilai data tersebut masuk ke dalam tipe data string.


Jenis-jenis tipe data 

(2)
Pada pemrograman PHP terdapat delapan tipe data yang dapat digunakan pada sebuah variabel :

  • Integer - Semua bilangan kecuali bilangan pecahan, misal : 2, 8, 100.
  • Float - Bilangan pecahan (berkoma), misal : 2..4 , 89.2
  • String - Kumpulan karakter, misal : "saya", "kamu".
  • Boolean - Hanya memiliki dua nilai : true atau false.
  • Array - Variabel yang dapat memiliki banyak nilai dan memiliki index, misal : $nama = array("Desi","Diah","Dodo","Didi")
  • Object - Tipe data untuk object pada sebuah class
  • Resource - tipe data yang menghandle referensi external resource, misal : koneksi database
  • Null - tipe data yang hanya memiliki nilai : NULL, misal : $a= null


Untuk memahami lebih dalam tentang tata cara penggunaan tipe data pada pemrograman PHP, Silahkan ikuti Tutorial PHP Tipe data berikut ini :

Mengenal Percabangan di PHP

(3)

Semua bahasa pemograman mempunyai fungsi percabangan, fungsi percabangan digunakan untuk mengeksekusi sebuah perintah dengan kondisi tertentu ,ada beberapa jenis percabangan yang biasa digunakan yaitu :
  • if statement – Digunakan untuk mengeksekusi beberapa kode hanya jika kondisi tertentu adalah benar.
  • if…else statement -Digunakan untuk mengeksekusi beberapa kode jika kondisi benar dan kode lain jika kondisi salah.
  • if…else if….else statement – Digunakan untuk memilih salah satu dari banyak blok kode yang akan dieksekusi.
  • switch statement – menggunakan pernyataan ini untuk memilih salah satu dari banyak blok kode yang akan dieksekusi
Percabangan PHP

STATEMEN IF

Statemen ini hanya akan mengeksekusi blok program jika kondisi nya benar
<?php
$kondisi="hujan";
if($kondisi=="hujan")
{
 echo "kondisi sekarang sedang hujan";
}
?>
if statement
Jika perintah di atas dieksekusi maka akan menampilkan tulisan “kondisi sekarang sedang hujan”

STATEMEN IF ELSE
Statemen ini hanya akan mengeksekusi blok program jika kondisi nya benar dan mengsekusi perintah lainya jika kondisinya salah
<?php
$kondisi="kering";
if($kondisi=="hujan")
{
 echo "kondisi sekarang sedang hujan";
}
else
{
 echo "kondisi tidak hujan";
}
?>
if else statement
jika script diatas dijalankan maka akan menampilkan string “kondisi tidak hujan” karena value dari variabel kondisi adalah kering.

STATEMEN IF ELSE IF
Statemen ini akan mengeksekusi blok program dengan kondisi terpenuhi, jika blok pertama tidak terpenuhi maka akan mengechek kondisi selanjutnya, berikut ini contoh sintaxnya :
<?php
$kondisi="berawan";
if($kondisi=="hujan")
{
 echo "kondisi sekarang sedang hujan";
}
elseif($kondisi=="kering")
{
 echo "kondisi sedang panas";
}
else
{
 echo "kondisi tidak panas dan tidak hujan";
}
?>
if else if else statement
Jika script diatas dijalankan maka akan menampilkan string “kondisi tidak panas dan tidak hujan” karena value dari variabel kondisi adalah berawan. berikut ini juga saya buatkan video tutorial tentang kondisi percabangan


SWITCH

Hampir sama juga dengan kondisi if elseif else yang akan memeriksa setiap blok program sampai kondisi ketemu atau mengeksekusi sintax defaulnya ,berikut ini contoh sintax penggunaa case
<?php
$favcolor="merah";
switch ($favcolor) {
  case "red":
    echo "warna pilihan anda merah!";
    break;
  case "blue":
    echo "warna pilihan anda adalah biru!";
    break;
  case "green":
    echo "warna pilihan anda adalah hijau!";
    break;
  default:
    echo "anda tidak memilih warna yang kami berikan!";
}
?> 
case

Hasil dari scrip ini akan menampilkan string “anda tidak memiih warna yang kami berikan” . untuk lebih jelas penggunaan case anda bisa melihat video tutorial yang saya buat berikut ini
Semoga tutorial sederhana ini bisa membantu teman teman dalam belajar php

HTML

 Pengertian HTML

 (1)
HTML adalah singkatan dari Hypertext Markup Language. Disebut hypertext karena di dalam HTML sebuah text biasa dapat berfungsi lain, kita dapat membuatnya menjadi link yang dapat berpindah dari satu halaman ke halaman lainnya hanya dengan meng-klik text tersebut. Kemampuan text inilah yang dinamakan hypertext, walaupun pada implementasinya nanti tidak hanya text yang dapat dijadikan link.
Disebut Markup Language karena bahasa HTML menggunakan tanda (mark), untuk menandai bagian-bagian dari text. Misalnya, text yang berada di antara tanda tertentu akan menjadi tebal, dan jika berada di antara tanda lainnya akan tampak besar. Tanda ini di kenal sebagai HTML tag.
Jika anda ingin melihat bagaimana sebenarnya HTML, silahkan klik kanan halaman ini, lalu pilih View Page Source (di Browser Mozilla Firefox atau Google Chrome). Akan tampil sebuah halaman baru yang merupakan kode HTML dari halaman ini.
Jika anda merasa terintimidasi dengan kode-kode tersebut, anda tidak sendiri, saya juga mengalaminya. Namun, kita akan mempelajari sebagian besar kode-kode ini di Tutorial Belajar HTML di duniailkom.
Cara Melihat Source Code HTML
HTML merupakan bahasa dasar pembuatan web. Disebut dasar karena dalam membuat web, jika hanya menggunakan HTML tampilan web terasa hambar. Terdapat banyak bahasa pemrograman web yang ditujukan untuk memanipulasi kode HTML, seperti JavaScript dan PHP. Akan tetapi sebelum anda belajar JavaScript maupun PHP, memahami HTML merupakan hal yang paling awal.
HTML bukanlah bahasa pemrograman (programming language), tetapi bahasa markup (markup language), hal ini terdengar sedikit aneh, tapi jika anda telah mengenal bahasa pemrograman lain, dalam HTML tidak akan ditemukan struktur yang biasa di temukan dalam bahasa pemrograman seperti IF, LOOP, maupun variabel. HTML hanya sebuah bahasa struktur yang fungsinya untuk menandai bagian-bagian dari sebuah halaman.
Selain HTML, dikenal juga xHTML yang merupakan singkatan dari eXtensible Hypertext Markup Language. xHTML merupakan versi lama dari HTML (sebelum era HTML5 seperti saat ini). xHTML menggunakan aturan penulisan yang lebih ketat. Jika anda menemukan artikel yang membahas xHTML, bisa disamakan dengan HTML, karena perbedaannya tidak terlalu banyak.

Versi terbaru HTML: HTML5

Saat ini versi terbaru dari HTML adalah HTML5. HTML5 berisi beberapa fitur baru, tapi tetap membawa mayoritas fitur dari versi HTML sebelumnya, yakni HTML 4 dan xHTML.
File HTML harus dijalankan dari aplikasi web browser. Dalam tutorial belajar HTML dasar selanjutnya, kita akan membahas tentang Fungsi Web Browser.

Materi Tentang HTML

  (2)
Hyper Text Markup Language (HTML)


1. Pengenalan HTML

HTML (Hyper Text Markup Language) adalah merupakan sebuah dasar ataupun pondasi bahasa pemrograman sebuah webpage, HTML muncul sebagai standar baru dari kemajuan dan berkembangnya internet, pada pertama kali muncul internet masih dalam keadaan berbasis text dimana tampilan sebuah halaman web hanya berisikan sebuah text yang monoton tanpa sebuah format dokumen secara visual, bayangkan saja sebuah dokumen text yang dikemas dalam bungkus format seperti tipe file .txt atau sering disebut notepad, tanpa paragraph, satu warna, satu ukuran huruf tanpa gambar serta tidak adanya visual format dokumen seperti halnya Ms. Word, hal ini akan sangat membosankan dalam membaca. Dan selain itu pertama kali muncul internet user mengakses masih menggunakan sebuah terminal, hal itu jelas sangatlah tidak friendly. Pemrograman HTML muncul seiring perkembangan teknologi dan informasi.

2. Sejarah HTML

Hyper Text Markup Language (HTML) pertama kali diciptakan dan dikembangkan oleh Tim Berners-Lee pada awal tahun 1990-an yang pada saat itu masih bekerja di CERN. HTML diciptakan dengan tujuan sebagai cara sederhana namun efektif untuk mengkodekan dokumen elektronik. HTML pertama kali dipopulerkan dengan menggunakan browser Mosaic.

Tahun 1980, IBM memikirkan pembuatan suatu dokumen yang akan mengenali setiap elemen dari dokumen dengan suatu tanda tertentu. IBM kemudian mengembangkan suatu jenis bahasa yang menggabungkan teks dengan perintah-perintah pemformatan dokumen. Bahasa ini dinamakan Markup Language, sebuah bahasa yang menggunakan tanda-tanda sebagai basisnya. IBM menamakan sistemnya ini sebagai Generalized Markup Language atau GML.

Tahun 1986, ISO menyatakan bahwa IBM memiliki suatu konsep tentang dokumen yang sangat baik, dan kemudian mengeluarkan suatu publikasi (ISO 8879) yang menyatakan markup language sebagai standar untuk pembuatan dokumen-dokumen. ISO membuat bahasa ini dari GML milik IBM, tetapi memberinya nama lain, yaitu SGML (Standard Generalized Markup Language). ISO dalam publikasinya meyakini bahwa SGML akan sangat berguna untuk pemrosesan informasi teks dan sistem-sistem perkantoran. Tetapi diluar perkiraan ISO, SGML dan terutama subset dari SGML, yaitu HTML juga berguna untuk menjelajahi internet. Khususnya bagi mereka yang menggunakan World Wide Web.

Mulai pada tahun 1989, sebuah nama HTML muncul dari pemikiran Caillau Tim yang bekerja sama dnegan Banners Lee Robert yang ketika itu masih bekerja di CERN memulai mengembangkan bahasa pemrograman ini, dan dipopulerkan pertama kali dengan browser Mosaic. Dan mulailah dari tahun 1990 HTML sangat berkembang dengan cepat hingga mencapai versi HTML versi 5.0 yang digarap pada 4 Maret 2010 kemarin oleh W3C.

Sejarah dari standar HTML :

- HTML 2.0 (RFC 1866) disetujui sebagai standar 22 September 1995
- HTML 3.2 14 Januari 1996
- HTML 4.0 18 Desember 1997
- HTML 4.01 (minor Fixes) 24 Desember 1999
- ISO/IEC 15445:2000 (“ISO HTML”, berdasar pada HTML 4.01 Strict) 15 Mei 2000
- HTML 5 masih dalam draft pengerjaan Januari 2008

3. Versi HTML
HTML sekarang sudah mencapai versi 5.0. Sebelum digunakan, HTML harus diuji secara ketat oleh suatu badan yang bernama World Wide Web Concortium (W3C). Setiap penambahan/peningkatan versi, terdaoat beberapa tambahan-tambahan tag dari fasilitas yang tidak dimiliki oleh versi sebelumnya. Tentunya versi yang telah dikeluarkan ini harus menjadi standar bagi browser. Bilamana browser ini tidak mendukung versi tertentu, maka browser tersebut tidak dapat menampilkan format HTML yang kita buat. Oleh karena itu, untuk melihat halaman web yang di format dengan HTML versi baru, harus memiliki browser yang sudah mendukung versi HTML tersebut.

Versi-versi HTML

HTML 1.0
Ini adalah awal mula dari HTML (pendahulunya). Pada versi ini masih terlihat beberapa kelemahan dan masih sangat sederhana. Kemampuan yang dimiliki oleh versi 1.0 ini hanya terbatas pada heading, paragraph, hypertext, list, dan setak tebal atau miring pada teks.

HTML 2.0
Versi 2.0 pada 14 Januari 1996, pada versi ini ada beberapa tambahan kemampuan diantaranya penambahan form comment, hal ini menyebabkan adanya sebuah interaktif dan mulai dari versi ini yang menjadikan sebuah pioneer dalam perkembangan homepage interaktif.

HTML 3.0
Dirilis pada 18 Desember 1997 yang sering disebut sebagai HTML+ yang mempunyai kemampuan dalam beberapa fasilitas diantaranya adalah penambahan fitur table dalam paragraph, akan tetapi versi ini tidak bertahan lama.

HTML 3.2
Dan pada bulan Mei 1996 dikeluarkan versi baru sebagai pengganti dan penyempurnaan versi 3.0 ini yaitu HTML veri 3.2, keluarnya versi ini dikarenakan adanya beberapa kasus yang timbul pada pengembang browser yang telah melakukan pendekatan dengan cara lain yang justru hal tersebut menjadi popular, maka dibakukan versi 3.2 untuk mengakomodasi praktek yang banyak digunakan oleh pengembang browser dan diterima secara umum, dapat dikatakan bahwa versi 3.2 ini merupakan versi 3.0 yang dikembangkan oleh beberapa pengembang browser seperti Netscape dan Microsoft.

HTML 4.0
Yang terakhir perombakan terjadi pada tahun 1999 tepatnya tanggal 24 Desember yaitu HTML versi 4.0, seperti yang kita kenal HTML pada saat ini penambahan link, meta, imagemaps. Image dan lain-lain sebagai penyempurnaan versi 3.2. Di samping itu versi ini ditambahkan tag-tag baru seperti ABBR, ACRONYM, BUTTON, PARAM, BUTTON, TBODY, THEAD dan lain sebagainya.

HTML 5.0
Pada tanggal 4 Maret 2010, terdapat sebuah informasi bahwasannya HTML versi 5.0 masih dikembangkan oleh W3C (World Wide Web Consortium) dan IETF (Internet Engineering Task Force) yaitu sebuah organisasi yang menangani HTML sejak versi 2.0.

4. Struktur Dasar Dokumen HTML

Struktur dasar dokumen HTML adalah sebagai berikut :
 

<html>
<head>
<title>Disini Judul Dokumen HTML</title>
</head>
<body>
      Disini penulisan informasi Web
</body>
</html>

Dari struktur dasar HTML di atas dapat dijelaskan sebagai berikut:

a. Tag


Adalah teks khusus (markup) berupa dua karakter "<" dan ">", sebagai contoh <body> adalah tag dengan nama body. Secara umum tag ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag penutup (ditambahkan karakter "/" setelah karakter "<"), sebagai contoh <body> ini adalah tag pembuka isi dokumen HTML, dan </body> ini adalah tag penutup isi dokumen HTML.
b. Element

Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title, dimana:
ini adalah tag penutup judul dokumen HTML
Tag-tag yang ditulis secara berpasangan pada suatu element HTML, tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.

Contoh penulisan tag-tag yang benar
<p>
<b>
................
</b>
</p>
Contoh penulisan tag-tag yang salah
<p>
<b>
................
</p>
</b>

c. Attribute

Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas nama dan nilai. Penulisannya adalah sebagai berikut:


<TAG>
nama-attr="nilai-attr"
nama-attr="nilai-attr"
.................
.................
</TAG>

Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman web menjadi hitam, penulisannya adalah

d. Element HTML

Menyatakan pada browser bahwa dokumen Web yang digunakan adalah HTML.
Sintaks:


<html>
..........
</html>

e. Element HEAD

Merupakan kepala dari dokumen HTML. Tag dan tag terletak di antara tag dan tag .
Sintaks:


<head>
...........
</head>

f. Element TITLE


Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>.
Sintaks:
<title>
.........
</title>

g. Element BODY


Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>. Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.
Sintaks:

<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
..............
</body>
Attribute text memberikan warna pada teks, bgcolor memberikan warna pada latarbelakang dokumen HTML, background memberikan latarbelakang dokumen HTML dalam bentuk gambar, link memberikan nilai warna untuk link, alink memberikan warna untuk link yang sedang aktif, vlink memberikan warna untuk link yang telah dikunjungi. Jika attribute bgcolor dan background keduanya dispesifikasikan maka attribute background yang akan digunakan, akan tetapi jika nilai attribute background (gambar) tidak ditemukan pada dokumen HTML maka attribute bgcolor yang akan digunakan.

5. Kelebihan dan Kekurangan HTML

Kelebihannya :

1 Merupakan bahasa pengkodean yang lintas platform (cross platform), maksudnya HTML dapat digunakan pada berbagai jenis mesin komputer yang berbeda dan berbagai macam sistem operasi yang berbeda. Jadi berdifat fleksibel karena ditulis cukup dengan menggunakan editor karakter ASCII.

2 Dapat disisipi gambar baik gambar statis atau dinamis (animasi) termasuk menggunakan gambar untuk dijadikan hyperlink. Gambar disini digunakan untuk merujuk pada suatu halaman web, dimana setiap titik-titik yang sudah didefinisikan berupa rectangular (kotak), poligon (kurva tak beraturan) atau lingkaran digunakan untuk ‘jump’ ke halaman lain, atau link ke halaman di luar web yang bersangkutan.

3 Dapat disisipi animasi berupa Java Applet atau file-file animasi dari Macromedia Flash atau Macromedia Shockwave (untuk keperluan ini, browser harus memiliki plug-in khusus untuk menjalankan file-file animasi ini).

4 Dapat disisipi bahasa pemrograman untuk mempercantik halaman web seperti Javascript, Vbscript, Active Server Pages, Perl, Tcl, PHP, dan sebagainya.

5 Bukan merupakan bahasa pemrograman jadi tidak memerlukan kompiler. Cara menjalankannya cukup dengan menggunakan browser.

Kekurangannya :

1 Menghasilkan halaman yang statis, untuk memperoleh halaman yang dinamis harus menggunakan bahasa pemrograman tertentu seperti Javascript atau Vbscript dan animasi seperti Flash atau Shockwave.

2 Memiliki tag-tag yang begitu banyak sehingga susah dipelajari untuk yang masih awam.

3 Tidak dapat menghasilkan halaman yang interaktif. Interaktif disini maksudnya client dapat berinteraksi dengan server. Untuk keperluan itu HTML harus disisipi bahasa pemrograman yang dapat menangani hal tersebut, contohnya Perl dan Tcl.


Dasar-Dasar HTML Lengkap Untuk Belajar Pemrograman Web

(3)
Dasar-Dasar HTML Lengkap Untuk Belajar Pemrograman Web-HTML merupakan kode dasar yang harus dipahami ketika ingin belajar pemrograman web, kode-kode dasar dalam html merupakan pengenalan awal sebelum nantinya belajar bahasa pemrograman web tingkat tinggi seperti PHP, dan lain sebagainya. Karenanya HTML menjadi materi penting dalam kurikulum pembelajaran mata pelajaran pemrograman web dasar di SMK.
Berbagai macam teknologi (seperti CSS, JavaScript, Flash, AJAX, JSON) dapat digunakan untuk mendefinisikan elemen dari sebuah halama web. Akan tetapi, pada level paling rendah, sebuah halaman web didefinisikan dengan menggunakan HTML (HyperText Markup Language). Tanpa HTML maka tidak akan ada halaman web

Kode Dasar HTML

Kode dasar HTML:
1
2
3
4
5
6
7
8
<html>
<head>
<title>Judul</title>
<body>
<p>Halo ini kode HTML pertamaku</p>
</body>
</head>
</html>
Perhatikan penulisan kode HTML diatas, yang diberi highlight merupakan tempat untuk menuliskan kode html lainnya, misalnya kode untuk membuat table dan lain sebagainya.

Tag, Elemen, dan Atribut HTML

Dari kode dasar HTML diatas, dapat dibagi menjadi tiga pokok bahasan utama yaitu pembahasan tentang Tag, Elemen dan Atribut.
Tag
Tag dalam HTML rata-rata ditulis berpasangan. Tapi tidak semua Tag selalu ditulis berpasangan. Tag HTML selalu diawali dengan Tag pembuka <> dan diakhiri dengan Tag penutup </>.
Contoh tag dalam HTML:
1
2
3
4
5
6
7
8
<html>
<head>
<title>Judul Laman</title>
<body>
      <p>Ini kode HTML pertamaku</p>
</body>
</head>
</title>
Pada kode HTML diatas yang diberi highlight,
1
<title>Judul Laman</title>
merupakan contoh dari Tag. Diawali dengan tag
1
<title>....elemen....kemudian ditutup dengan tag </title>.
Dari kode HTML diatas, kita bisa kumpulkan masing-masing tag seperti dibawah ini:
1
2
3
4
5
<html>...</html>
<head>...</head>
<title>...</title>
<body>...</body>
...
Elemen
Elemen merupakan isi tag. Biasanya berupa teks, tapi tidak selalu berupa teks bisa juga berupa sinyaks lainnya.
Contoh Elemen:
1
<p>Halo ini kode HTML pertamaku</p>
Penjelasan singkatnya:
1
<p>.....</p>
Merupakan Tag paragrafh dalam HTML
Sedangkan teks “Halo ini kode HTML pertamaku” merupakan isi tag paragrafh
Ingat!
Jangan tertukar, antara Tag dan Elemen.
Pengetahuan mengenai jenis-jenis Elemen dalam HTML bisa dibaca materi dasar html
Atribut
Atribut merupakan informasi tambahan dari Tag. Sering juga disebut dengan isi Tag. Setiap atribut akan berpasangan dengan Value. Value merupakan isi dari atribut, ditulis setelah tanda sama dengan dengan memberi tanda kutip.
Contoh dari atribut dalam HTML:
1
2
<p align="center">
<table border="1">
Penjelasan singkat dari contoh atribut diatas:
1
<p align="center">
Perhatikan!
Atribut diatas adalah align, dan valuenya adalah center. Atribut diatas digunakan untuk mengatur posisi paragraf berada ditengah / center.
Pengetahuan lebih lengkap mengenai jenis-jenis atribut dalam HTML bisa dibaca pada materi; Jenis-jenis Atribut dalam HTML
Perlu diperhatikan juga, bahwa tidak semua Tag membutuhkan atribut. Contohnya tag
1
<html>...</html>
Tapi pada HTML akan sering ditemukan tag yang berisi atribut-atribut sesuai dengan fungsi yang dikehendaki oleh programmer yang akan membuat laman web.
Kode dasar membuat table di HTML-Untuk membuat tabel/table menggunakan kode HTML caranya sangat mudah. Silahkan diperhatikan terlebih dahulu kode dasar dalam pembuatan table menggunakan kode HTML dibawah ini.
1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<head>
<title>Tabel</title>
</head>
<body>
<table border="1">  
   <tr>     
        <td>Kolom 1 baris ke 1</td>
        <td>Kolom 1 baris ke 1</td>
   </tr>
</table>
</body>
</html>
Contoh table 1.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<title>Contoh Table 1</title>
</head>
<body>
 
<table border="1">  
   <tr>         
      <td>Kolom 1 baris ke 1</td>    
      <td>Kolom 1 baris ke 1</td>
   </tr>
   <tr>           
      <td>Kolom 1 baris ke 2</td>
      <td>Kolom 1 baris ke 2</td>
   </tr>
</table>
</body>
</html>
Kode contoh table 1 diatas, jika ditampilkan dengan browser seperti dibawah ini.
dasar dasar html

Atribut Pada Tabel

Atribut pada tabel HTML merupakan informasi tambahan dari Tag yang digunakan dalam pembuatan Tabel. Beberapa atribut yang sering digunakan dalam pembuatan Tabel antara lain:
1
2
3
4
5
6
7
8
<table border="1">atribut ini digunakan untuk mengatur ketebalan garis tabel.
<td height="90px">
atribut ini digunakan untuk mengatur tinggi kolom
<td width="400px">
atribut ini digunakan untuk mengatur lebar kolom
<td rowspan="2">
atribut ini digunakan untuk menggabungkan beberapa  baris
<td colspan="2">atribut ini digunakan untuk menggabungkan beberapa kolom
Selain atribut diatas, masih banyak lagi atribut-atribut lainnya yang sering digunakan dalam pembuatan table di HTML. Pengetahuan lebih lengkap bisa dilihat pada laman:Jenis-jenis Atribut Pada Table HTML
Contoh penggunaan atribut pada table
Berikut beberapa penggunaan atribut pada pembuatan Tabel menggunakan HTML.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
<head>
<title>Contoh Table 2</title>
</head>
<body>
<table border="1">  
   <tr>     
        <td colspan="2" width="720px" height="90px">Header</td>
   </tr>
   <tr>     
        <td width="200px" height="400px">Sidebar </td>
        <td>Content</td>
   </tr>
   <tr>     
        <td colspan="2" height="90px">Footer</td>
   </tr>
</table>
</body>
</html>
Pada kode yang di highlight, ada tiga atribut yang digunakan yaitu atribut:
1
2
3
<colspan="2">atribut ini digunakan untuk menggabungkan dua kolom
<width="720px">atribut ini digunakan untuk mengatur lebar tabel menjadi 720px
<height="90px">atribut ini digunakan untuk mengatur tinggi baris menjadi 90px

 

Komentar