BAB II

BAB II
LANDASAN TEORI
2.1
CMS (Content Management System)
Content Management System atau disingkat CMS adalah
perangkat lunak sistem digunakan untuk membantu pemakainya
didalam proses management konten/isi. Suatu CMS dapat
mempermudah dalam mengorganisasikan, mengendalikan dan
penerbitan suatu dokumen yang besar dan isi yang lainnya,
seperti gambar dan sumberdaya multimedia.
CMS yang banyak dipakai saat ini adalah server CMS
(Web Content Management System/WCMS). WCMS adalah
perangkat lunak yang berfungsi untuk membangun dan
memelihara/ updating web, yang dirancang sedemikian rupa
sehingga proses pembuatan dan pemeliharan web menjadi lebih
mudah, efektif dan efisien. [YUH06]
Pembuatan web server dapat dilakukan menggunakan
tool
dan
cara
tradisional.
Kelemahan
cara
ini
adalah
membutuhkan tenaga kerja yang banyak dan biaya yang besar.
Sebagai contoh dalam mengubah kata dalam sebuah web page
dibutuhkan seorang tenaga ahli yang telah menguasi HTML. Jika
sebuah server yang terdiri dari ratusan web page ingin diubah isi
maupun tampilannya, dibutuhkan beberapa orang tenaga ahli
agar perubahannya dapat segera teratasi dengan baik dan cepat,
tentunya biaya yang besar perlu dikeluarkan. Menggunakan CMS
II-1
Landasan Teori
II-2
pengaturan isi dan penampilan dapat dilakukan oleh user yang
tidak menguasai HTML sekalipun.
Dalam hal ini web designer berperan dalam merancang
penampilan dan web programer berperan dalam membuat modulmodul baru untuk diintegrasikan kedalam CMS. Setelah CMS
selesai dibuat proses perawatannya (add, edit, delete) dapat
dilakukan oleh user yang telah dilatih dalam menggunakan CMS.
Dengan begitu meningkatkan produktifitas dan kepuasan sebuah
tim yaitu antara web designer, web programmer dan web
administrator dapat melakukan pekerjaannya secara terpisah.
2.2
CMS Joomla
Joomla adalah sebuah Content Management System
yang bersifat Open Source. Ditulis menggunakan bahasa
pemrograman PHP dan MySQL sebagai database. Joomla dapat
digunakan oleh siapa saja untuk keperluan pembuatan website,
mulai dari yang sangat sederhana, website pribadi sampai dengan
website yang sangat kompleks.
Begitu banyak aplikasi yang dapat ditangani oleh
joomla, tak heran kalau joomla menjadi pilihan banyak orang
dalam pembuatan website-nya. Disamping itu, joomla mudah di
installasi, mudah dalam pengelolaannya dan dapat dimodifikasi
sesuai kebutuhan. Oleh karena itu joomla mempunyai prinsip
flexible , simple, elegant, customizable dan powerful.
Landasan Teori
2.2.1
II-3
Sejarah Joomla
Joomla merupakan pengembangan dari open source
project Mambo, yang dahulu sering disebut Mambo Open Source
atau MOS. Mambo sebenarnya dikembangkan oleh sebuah
perusahaan yang bernama Miro. Miro memberikannya kepada
komunitas open source (komunitas pengembang) sebuah varian
WCMS
yang
gratis
untuk
dikembangkan.
Setelah
menyerahkannya pada komunitas, MOS berkembang dengan
baik. Pada bulan agustus 2005 terjadi perselisihan prinsip antara
pihak komunitas pengembang MOS dengan Miro.
Akibat perbedaan prinsip ini, beberapa orang tim MOS
keluar dari project tersebut dan akhirnya membentuk project
open source baru yang diberi nama Joomla. Kata joomla sendiri
diambil dari kata jumla, bahasa suaheli dari penduduk Kenya dan
Tanzania di benua Afrika yang berarti “all this together”.
Pada tanggal 17 September 2005, dirilis joomla versi
1.0.0. Versi ini merupakan versi alias dari Mambo versi 4.3.5.
Joomla secara terus menerus dikembangkan melalui berbagai
aktivitas oleh komunitas yang sangat aktif dan tertarik dengan
sistem ini.
2.2.2
Template Joomla
Template merupakan satu kesatuan struktur yang
mengatur penampilan situs web joomla secara keseluruhan.
Mulai dari tata letak modul, komponen dan lain sebagainya
Landasan Teori
II-4
sampai dengan pengaturan warna dan jenis huruf yang
digunakan.[YUH06]
Terdapat dua jenis template pada sistem joomla, yaitu
template untuk situs (site template) dan template untuk halaman
administrator (administrator template). Site template merupakan
template situs web joomla yang sesunguhnya, karena template
inilah yang akan dilihat oleh publik (pengunjung). Administrator
template adalah template yang khusus diperuntukan pada bagian
administrator joomla
Joomla template adalah rangkaian file pada CMS
Joomla yang mengatur penyajian dari suatu konten/isi. Template
joomla
bukan
merupakan
suatu
website,
tidak
juga
dipertimbangkan sebagai desain website yang sempurna.
Template merupakan desain dasar utama untuk menampilkan
website Joomla. Untuk menghasilkan efek “sempurna” pada
website, template saling bekerjasama dengan konten yang
disimpan dalam basis data joomla. [NOR06]
Menggunakan template untuk CMS, seperti pada
joomla, mempunyai beberapa keuntungan diantaranya yaitu :
[NOR06]
1.
Terdapat pemisahan antara konten dengan penyajian,
terutama jika menggunakan CSS sebagai layout. Ini
merupakan
kriteria
utama
suatu
website
yang
merupakan standar webiste yang modern.
2.
Dengan template yang baru, tentu saja penampilan
website yang baru bisa diterapkan dengan instan dan
Landasan Teori
II-5
memungkinkan posisi konten yang berbeda dari
sebelumnya seperti halnya warna dan gambar.
3.
Template yang berbeda dapat diterapkan pada halaman
yang berbeda-beda.
2.2.3
Cara Kerja Template Joomla
Dalam CMS Joomla template mempunyai kedudukan
yang penting. Template mempunyai fungsi sebagai yang
mengatur tentang penyajian isi dari joomla. Dalam kata lain
template mengatur bagaimana layout atau tampilan dari suatu
situs web joomla.
Model kerja dari template joomla diawali dengan
permintaan suatu
halaman
utama
(frontpage).
Kemudian
mosMainBody akan menampilkan isi (content) dari komponen
joomla. Komponen tersebut terbagi menjadi beberapa bagian
yaitu controller, model dan view. Komponen yang berperan
sebagai controller memanggil komponen yang berperan sebagai
model yang merupakan kelas dari komponen tersebut dan bagian
view yang bertugas menampilkan isi (content) dari basis data,
dimana tampilan tersebut merupakan keluaran dari komponen
dan keluaran tersebut akan bergabung dengan template.
Landasan Teori
II-6
<model>
<component>.class
.php
Frontpage request
<controller>
<component>.php
mosMainBody
<html view>
<component>.html.
php
Component
output
Join with
template
Page output
Gambar 2.1. Cara Kerja Template [dev.joomla.org]
2.2.4
Cara Pemanggilan Modul dan Komponen
Dari
penjelasan
sebelumnya
sebuah
template
mempunyai fungsi sebagai pengatur tampilan pada joomla. Lalu
bagaimana suatu template dapat menampilkan sebuah modul atau
komponen. Sebelum membahas lebih lanjut apa itu komponen
dan modul pada joomla.
Komponen adalah elemen inti dari kemampuan joomla
[WHI06]. Komponen joomla ditampilkan pada main-body pada
template website. Modul adalah potongan kecil dari konten yang
dapat ditampilkan dimana saja yang disediakan oleh template
Landasan Teori
II-7
[WHI06]. Modul ini merupakan bagian unit fungsi dari joomla
yang berguna untuk menampilkan fitur-fitur utama joomla serta
menampilkan beberapa komponen terkait.
Agar sebuah modul atau komponen tersebut dapat
ditampilkan oleh template, sebuah template hanya perlu
memanggil modul atau komponen tersebut.
mosCountModules
mosLoadModules
Joomla! Modules
mosLoadModules
Template
Joomla! Component
mosShowHead
mosMainBody
Joomla! Page
(Document)
Gambar 2.2. Diagram Pemanggilan Modul [dev.joomla.org]
Dalam diagram di atas digambarkan bagaimana sebuah
template memanggil modul, komponen dan dokumen dari
Landasan Teori
II-8
joomla. Untuk lebih jelasnya dapat di lihat pada tabel di bawah
ini
Tabel 2.1. Perintah Pemanggilan Modul
No
1
Nama Perintah
mosCountModules
2
mosLoadModules
3
mosShowHead
4
mosMainBody
2.3
Keterangan
Berfungsi untuk mengembalikan
nilai dari modul yang terdapat pada
lokasi yang dipanggil, perintah ini
tidak menampilkan sebuah modul
atau komponen.
Berfungsi untuk memanggil dan
menampilkan sebuah modul atau
komponen.
Berfungsi untuk menampilkan judul
(title ) dari sebuah situs web joomla,
dan juga meta name.
Berfungsi untuk menampilkan isi
(content).
Standar Web W3C
Perkembangan web dari sejak ditemukan sampai pada
masa sekarang berkembang sangat pesat. Web membutuhkan
pedoman untuk mencapai kemampuannya secara menyeluruh.
Standar web merupakan panduannya, standar web ini membantu
memastikan bahwa semua orang dapat mengakses informasi yang
disediakan, dan juga membuat pengembangan web semakin cepat
dan lebih menyenangkan. [HOL02]
W3C (World Wide Web Consortium) merupakan
organisasi internasional yang mengembangkan standar web.
Dipimpin oleh Tim Berners-Lee yang merupakan penemu World
Wide Web pada tahun 1989.
Landasan Teori
2.3.1
II-9
Keuntungan Standar Web
Terdapat keuntungan yang didapat dengan mengikuti
standar web diantaranya yaitu accessibility, stabilitas dan
pemeliharaan. Dengan mengikuti standar web akan mempunyai
dasar
yang
lebih
baik
dalam
accessibility
dan
dalam
pengoptimasian untuk mesin pencari akan datang dengan
sendirinya. Mendesain website sesuai dengan standar web juga
akan bermanfaat bagi banyak pengguna web dan memastikan
kelangsungan hidup untuk jangka panjangnya.
Dengan mengikuti standar web dapat membuat situs
web lebih baik dalam penelusuran web. Struktur informasi yang
terdapat pada dokumen tersebut membuatnya lebih mudah untuk
mesin pencari untuk mengakses dan mengevaluasi informasi
yang terdapat pada dokumen tersebut. Juga browser yang lama
masih dapat mengerti struktur dasar dari dokumen tersebut,
walaupun tidak dapat mengerti penambahan standar yang terbaru,
browser tersebut masih dapat menampilkan isi dari website.
2.3.2
Stabilitas
Web yang memenuhi standar web kebanyakan didesain
dapat bekerja pada beberapa versi browser, jadi web yang
menggunakan versi lama akan dapat terus berjalan pada browser
yang baru dan web yang menggunakan versi terbaru masih dapat
berjalan pada browser yang lama.
Karena website mungkin semasa hidupnya akan dilewati
oleh beberapa tim desainer, pentingnya orang tersebut dapat
Landasan Teori
II-10
memahami kodenya dan dapat diedit dengan mudah. Standar web
akan memberikan kumpulan aturan yang setiap pengembang web
dapat diikuti, dimengerti, dan menjadi lebih biasa.
2.3.3
Pemeliharaan
Membuat
website
sesuai
dengan
standar
web
memperpendek waktu pengembangan web dan website lebih
mudah dalam pemeliharaannya. Debbugging dan troubleshooting
menjadi lebih mudah, karena kode sesuai dengan standar. Tidak
perlu lagi khawatir memprogram dan memelihara untuk beberapa
versi kode yang seharusnya dilakukan dalam penyajian yang
sama. [HOL02]
Jika akan mendesain ulang website akan menjadi lebih
mudah. Ciri utama website yang mengikuti standar web yaitu
lebih terstruktur dan memisahkan isi dan penyajian, sehingga
dalam mendesain ulang suatu website akan lebih mudah.
2.4
Web Accessibility
Web accessibility mempunyai arti bahwa orang dengan
keterbatasan kemampuan dapat menggunakan web. lebih
spesifiknya, web accessibility berarti orang dengan keterbatasan
kemampuan dapat mengerti, menggunakan dan berinteraksi
dengan web. [HEN07]
Web merupakan sumber penting yang terus meningkat
di
banyak
aspek
kehidupan
:
pendidikan,
pekerjaan,
pemerintahan, perdagangan, pelayanan kesehatan, hiburan dan
Landasan Teori
II-11
lain-lain. Ini merupakan hal yang perlu dalam web accessibility
untuk memberikan persamaan akses dan persamaan kesempatan
bagi orang yang mempunyai keterbatasan kemampuan. Web
accessibility dapat juga menolong orang yang mempunyai
keterbatasan kemampuan untuk ikut serta lebih aktif dalam
masyarakat.
2.4.1
Sejarah Singkat
Web Accessibility bukanlah hal yang baru. Pada tahun
90-an, informasi web accessibility telah terdapat pada organisasi
seperti Trance Research and Development Center dan perusahan
seperti IBM. Web Page Disability Access Design Standard telah
dikembangkan pada tahun 1996, dan AUS Standards for Web
Design tersedia secara online pada tahun 1997. Juga pada tahun
yang sama, W3C membuat WAI (Web Accessibility Initiative)
dan pada tahun 1999 WCAG 1.0 (Web Content Accessibility
Guidelines) telah selesai dan yang direkomendasikan [THA02].
2.4.2
Keterbatasan Fungsional dan Situasional
Accessibility dapat juga disimpulkan sebagai kwalitas
dari website yang dapat digunakan dan dimengerti oleh
pengguna, walaupun mereka sedang bekerja dalam keterbatasan
kondisi atau dalam ketidakleluasaan. Accessibility adalah tentang
mendesain sehingga banyak orang dapat menggunakan web
secara effektif di berbagai situasi. [THA02]
Landasan Teori
II-12
Kebanyakan orang berfikir accessibility dalam artian
keterbatasan kemampuan, namun itu bukan gambaran secara
keseluruhan. Definisi accessibility lebih luasnya mencakup orang
yang mengoperasikan dalam keterbatasan fungsional dan
keterbatasan situasional. Adapun keterbatasan fungsional dan
keterbatasan situasional adalah :
1.
Keterbatasan fungsional
Menyinggung tentang keterbatasan kemampuan, dengan
kata lain orang yang cacat, seperti orang yang buta,
tidak dapat mendengar, pengguna yang telah tua
sehingga kemampuannya menurun, dan lain-lain.
2.
Keterbatasan situasional
Berhubungan dengan keadaan sekitar, lingkungan, atau
alat. Keterbatasan ini dapat mempengaruhi siapa saja,
tidak hanya orang dengan keterbatasan kemampuan.
Sebagai contoh orang yang menggunakan browser yang
lama atau browser yang tidak umum, koneksi internet
yang lambat, alat yang tidak mempunyai mouse, alat
yang memiliki layar yang kecil, atau orang dalam situasi
yang terbatas dalam menggunakan mata dan tangan, dan
lain-lain.
2.4.3
Keuntungan Web Accessibility
Sementara banyak orang mulai untuk memperhatikan
accessibility, mayoritas dari website masih sedikit dalam
mengimplementasikannya. Kebanyakan desainer, pengembang,
Landasan Teori
II-13
dan manajer tidak mengerti keuntungan dalam menyediakan
website yang accessibe dan juga tidak yakin bahwa itu penting
untuk bisnisnya. Adapun keuntungan yang didapat jika
memperhatikan accessibility :
1.
Berbagai Pengguna
Web accessiblity meningkatkan jumlah orang yang
dapat menggunakan web secara efektif. Contohnya
dalam
bisnis,
accessibility
adalah
bagaimana
meningkatkan penjualan dengan menunjuk kepada
memperluas jarak yang membatasi konsumen dalam
menggunakan website.
2.
Berbagai Situasi
Keterbatasan situasional merupakan persoalan makin
meningkat untuk orang dengan tidak mempunyai
keterbatasan
kemampuan
keterbatasan
mengakomodasi
maupun
kemampuan.
orang
dalam
Web
orang
dengan
accessibility
berbagai
situasi,
meningkatkan situasi dimana website dapat digunakan
secara efektif. Kadangkala keterbatasan terdapat pada
produk itu sendiri, misalnya PDA, telepon seluler, dan
produk lainnya yang terus meningkat yang dapat
mengakses internet. Produk-produk ini mempunyai
keterbatasan dalam input dan outputnya, seperti layar
yang kecil tanpa warna. Dengan mengikuti web
accessibility dapat mengoptimalkan interaksi dengan
produk-produk tersebut.
Landasan Teori
3.
II-14
Desain dan Implementasi yang lebih baik
Kebanyakan
peningkatan
yang
dibuat
untuk
accessibility menghasilkan desain dan implementasi
yang lebih baik secara keseluruhan. Seperti yang sudah
disebutkan sebelumnya, peningkatan accessibility dapat
meningkatkan kegunaan untuk semua pengguna. Desain
yang accessible juga membantu dalam persoalan teknis
dan pemeliharaan.
4.
Menghemat Biaya
Pada awalnya, memahami dan mengimplementasikan
accessibility akan memakan waktu dan biaya. Pada saat
yang sama, beberapa peningkatan accessibility akan
menurunkan biaya website secara keseluruhan, sebagai
contohnya, dengan penggunaan style sheet dalam
pembangunan web akan mengurangi biaya perawatan.
Aspek accessibility yang lainnya yaitu menyediakan
informasi
dalam
teks,
disamping
multimedia.
Umumnya, informasi berbentuk teks lebih mudah dan
murah untuk dikelola, diperbaharui, dan bermigrasi
dibandingkan dengan informasi dalam bentuk gambar.
2.5
SEO (Search Engine Optimization)
Search Engine Optimization (SEO) adalah proses untuk
meningkatkan volume dan kualitas lalulintas suatu situs web dari
mesin pencari melalui hasil pencarian “natural” (“organic” atau
“algoritmic”). Biasanya, situs yang lebih dahulu muncul di hasil
Landasan Teori
II-15
pencarian atau yang mempunyai “tingkat” yang tinggi akan lebih
banyak yang mengunjungi situs tersebut. [WIK07]
Sebagai suatu strategi marketing untuk meningkatkan
lalulintas
web
site,
SEO
mempertimbangkan
bagaimana
algoritma pencari bekerja dan apa yang orang cari. Upaya SEO
mungkin akan terlibat dalam pengkodean situs, penyajian, dan
struktur. Karena SEO yang efektif mungkin dapat mengubah
source code (kode sumber) dari suatu situs, taktik SEO mungkin
bersatu dengan pengembang situs web dan desain.
2.5.1
Sejarah Singkat SEO
Webmaster memulai mengoptimalkan situsnya untuk
mesin pencari pada pertengahan 90-an, mesin pencari pertama
membuat katalog awalan dari situs web. Pada awalnya, semua
yang webmaster perlukan hanya mengirim halaman webnya atau
URL (uniform resource locator) kepada berbagai mesin yang
akan mengirimkan web crawl yang akan “mengambil” halaman
tersebut, menelusuri hubungan (link) ke halaman lainnya dan
mengembalikan informasi yang ditemukan di halaman untuk
diindekkan. Prosesnya men-download halaman tersebut dan
menyimpannya di server mesin pencari, yang dimana program
kedua yang dikenal sebagai pengindeks, menelusuri berbagai
informasi tentang halaman tersebut, seperti kata-kata yang
dikandungnya dan dimana lokasinya, seperti halnya untuk katakata yang spesifik dan hubungan halaman yang dikandungnya,
yang akan disimpan di jadwal untuk di ambil dikemudian hari.
Landasan Teori
II-16
Versi awal dari algoritma pencari bersandar pada
informasi yang diberikan webmaster seperti kata kunci tag meta
atau file indeks. Tag meta menyajikan pedoman untuk setiap isi
halaman. Tetapi menggunakan data meta untuk mengindekkan
halaman kurang dapat diandalkan, karena beberapa webmaster
menyalahgunakan tag meta dengan memasukan kata kunci yang
tidak berhubungan untuk secara palsu menaikan pengaruh
halaman situs webnya untuk menaikan keuntungan.
Untuk memberikan hasil yang lebih baik kepada para
penggunanya,
mesin
pencari
menyesuaikan
diri
dengan
memastikan halaman hasil pencarian yang ditunjukannya
merupakan pencarian yang paling berhubungan, dibandingkan
dengan halaman yang tidak berhubungan yang diisi dengan
banyak kata kunci oleh webmaster yang tidak bertanggung
jawab. Mesin pencari menanggapinya dengan mengembangkan
algoritma peringkat (rangking) yang lebih kompleks, untuk
mempersulit webmaster untuk memanipulasi.
2.5.2
Teknik SEO
Teknik SEO dapat digolongkan menjadi dua kategori
yaitu White Hat SEO dan Black Hat SEO. Teknik yang pertama
yang direkomendasikan oleh mesin pencari sebagai bagian desain
yang baik dan teknik yang kedua tidak direkomendasikan oleh
mesin pencari dan bertujuan untuk meminimalkan efek yang
berhubungan dengan spamdexing. [WIK07]
Landasan Teori
II-17
White hat umumnya membuat isi untuk pengguna bukan
untuk mesin pencari dan membuat isi yang dapat diakses dengan
mudah oleh mesin pencari. Teknik ini lebih fokus untuk
menghasilkan hasil yang baik. White hat SEO mempunyai jalan
yang
hampir
sama
dengan
pengembangan
web
yang
mempertimbangkan accessibility, walaupun keduanya tidak
identik. [WIK07]
Black hat SEO berusaha untuk meningkatkan peringkat
dijalan yang ditentang oleh mesin pencari. Satu teknik black hat
menggunakan teks yang disembuyikan, salah satunya warna teks
yang sama dengan latar belakang atau tidak ditampilkan pada
layar. Mesin pencari akan memberikan penalti untuk situs yang
ditemukan menggunakan teknik black hat, salah satunya dengan
menurunkan peringkatnya atau menghilangkan semua daftarnya
dari basis data. [WIK07]
2.6
Cascading Style Sheet (CSS)
Dalam perkembangan web, Cascading Style Sheet
(CSS) adalah bahasa stylesheet digunakan untuk mengambarkan
penyajian dokumen yang ditulis di bahasa markup. Umumnya
digunakan untuk mengatur tampilan halaman web yang ditulis di
HTML dan XHTML [WIK07A].
CSS
digunakan
pada
halaman
web
untuk
mendefinisikan warna, huruf, layout dan aspek yang lain pada
penyajian dokumen. Rancang utamanya memungkinkan untuk
memisahkan konten atau isi dokumen (HTML atau bahasa
Landasan Teori
II-18
markup lain yang mirip) dan dokumen penyajian (CSS).
Pemisahan ini dapat meningkatkan accessibility dari konten,
lebih fleksibiel, pengendalian karakteristik penyajian yang
spesifik, mengurangi kerumitan dan pengulangan di dalam
dokumen yang terstruktur.
2.6.1
Sejarah singkat
Style sheet telah ada sejak awal dari SGML (Standard
Generalized Markup Language) pada tahun 70-an. Seiring
dengan
berkembangnya
HTML,
membuat
cakupan
keanekaragaman kemampuan tampilan semakin lebar untuk
memenuhi permintaan para pengembang web. Evolusi ini
membuat perancang lebih dapat mengatur tampilan website tetapi
menjadikannya lebih rumit untuk ditulis dan dipelihara.
Keanekaragaman
pengimplementasiannya
di
web
browser
membuat konsitensi tampilan website semakin sulit.
Untuk meningkatkan kemampuan penyajian web,
sembilan bahasa stylesheet yang berbeda diusulkan kepada W3C.
Dari sembilan usulan tersebut, dua yang terpilih menjadi dasar
yang akan menjadi CSS yaitu Cascading HTML Style Sheet
(CHSS) dan Stream-based Style Sheet Proposal (SSP). Pertama
Håkon Wium Lie mengusukan CHSS pada bulan oktober tahun
1994, bahsa ini mempunyai kemiripan dengan CSS yang
sekarang. Bert Bos bekerja pada browser yang diberi nama Argo
yang menggunakan bahasa style sheet sendiri yaitu SSP. Lie dan
Bos saling bekerjasama untuk mengembangkan standar CSS
Landasan Teori
II-19
(huruf ‘H’ dihilangkan dari nama karena stylesheet ini dapat
digunakan pada bahsa markup yang lain selain HTML).
Usulan Håkon diperkenalkan pada konfrensi “Mosaic
and the Web” di Chicago, illinois pada tahu 1994, dan di
perkenalkan kembali bersama Bert Bos pada tahu 1995. pada
masa itu W3C sedang didirikan, W3C menaruh minat untuk
mengembangkan CSS, dan mengorganisir kelompok kerja yang
diketuai oleh Steven Pemberton. Håkon dan Bert sebagai staf
teknikal utama pada aspek projek ini, dengan tambahan anggota,
termasuk Thomas Reardon dari Microsoft, berpartisipasai dengan
baik. Pada akhir tahun 1996, CSS telah siap menjadi resmi, dan
CSS level 1 Recommendation diterbitkan pada bulan Desember.
Pengembangan CSS, HTML dan Document Object
Model (DOM) yaitu HTML Editorial Review Board (ERB)
awalnya digabung dalam satu grup. Pada awal than 1997, ERB
dibagi menjadi tiga grup kerja yaitu HTML Working Group,
DOM Working Group dan CSS Working Group.
CSS Working Group berhasil menangkis isu yang tidak
bisa ditunjukan di CSS level 1, hasilnya CSS level 2 diciptakan
pada 4 November tahun 1997. Lalu diterbitkan sebagai
rekomendasi W3C pada 12 Mei tahun 1998. CSS level 3 telah
dimulai pada tahun 1998, dan masih dalam tahap pengembangan
sampai tahun 2006.
Landasan Teori
2.6.2
II-20
Sintak CSS
Stylesheet terdiri dari satu atau lebih aturan yang
mendeskripsikan bagaimana elemen dari dokumen ditampilkan.
Aturannya terdiri dari bagian dua bagian yaitu selektor dan
deklarasi.
h1 { font-size: 1.8em; }
Kode di atas adalah suatu aturan dan terdiri dari selektor dan
deklarasi. Bagian dari aturan tersebut adalah :

h1 ini merupakan sebuah selektor.

{ } segala sesuatu yang terdapat dalam tanda kurung ini
adalah deklarasi.

Font-size: ini adalah sebuah properti.

1.8em; ini merupakan nilai dari properti.
Selektor dan deklarasi dapat digrupkan, untuk selektor
hanya perlu menambahkan tanda koma, sedangakan deklarasi
tidak perlu menggunakan tanda koma.
body, p, h1, h2, h3, h4, h5, h6 {
font-family: Verdana, Arial, sans-serif;
background: #FFFFFF;
color: #000088;
font-size: 1.8em; }
Terdapat tiga tipe dari elemen yang dapat digunakan
pada selektor :

Elemen HTML, seperti tag <p>, tag <div> dan lainlain.
Landasan Teori

II-21
Elemen dengan class yang spesifik, contohnya suatu
elemen
dengan
class
“konten”
(<p
class=”konten”>).

Elemen dengan Id yang spesifik, contohnya suatu
elemen dengan Id “menu” (<p id=”menu”>).
2.6.3
Class dan Id CSS
Kedua atribut tersebut dapat digunakan pada seluruh
elemen HTML. Penulisan Class didahului dengan tanda titik ( . ),
dan Id dengan tanda pagar ( # ), lalu nama dan deklarasi.
Dengan selector Id suatu elemen dapat menjadi “unik”
di dalam sebuah dokumen. Dengan memberikan nama elemen,
seperti nama atribut elemen form, Id hanya dapat digunakan
hanya sekali pada suatu dokumen, dan aturan style dengan
selektor Id hanya dapat digunakan pada satu elemen tunggal.
Dengan mendeklarasikan sebuah Class, dapat digunakan
pada seluruh elemen di dalam body, <p>, <span>, dan
<div> berulang kali pada dokumen yang sama, halaman yang
sama, tanpa ada masalah. Yang paling utama yaitu dengan class
dapat menciptakan tag HTML sesuai kehendak. Seperti tag
HTML, class dapat diguna ulang di dalam suatu dokumen, tetapi
tidak seperti HTML, class tersebut hanya dapat digunakan salah
satunya pada tag yang berbeda atau pada <div> dan <span>.
Terdapat apa yang disebut dengan Pseudo-Classes dan
Pseudo-Element. Keduanya ada pada HTML, tetapi tidak tampak
pada kode HTML.
Landasan Teori
1.
II-22
Pseudo-Classes mempunyai kemampuan untuk merubah
style link pada dokumen, berdasarkan pada apakah link
tersebut telah dikunjungi, atau bagaimana pengguna
berinteraksi dengan dokumen. Artinya Pseudo-Classes
menawarkan kemungkinan untuk menampilkan elemen
yang sama secara berbeda dengan bermacam-macam
keadaan. Pseudo-Classes umumnya digunakan pada
penyajian link.
2.
Pseudo-Element contohnya seperti :first-letter
dan :first-line disebut Pseudo-Element karena
dimungkinkan untuk menetapkan style pada sub bagian
dari sebuah elemen, misalnya pada baris pertama dari
suatu paragraf.
2.6.4
Inheritance (Pewarisan) Pada CSS
Elemen HTML mewarisi style-nya pada induknya.
Biasanya, struktur di dalam dokumen HTML seperti berikut ini :
<HTML>
<HEAD>
<TITLE>The Tree Structure</TITLE>
</HEAD>
<BODY>
<P>This is normal text and <strong>here
we have text in bold</strong> and right back to
normal text</P>
</BODY>
<HTML>
Landasan Teori
II-23
Di dalam stylesheet, tag body didefinisikan seperti
berikut ini :
<style type="text/css">
<!-BODY {color: #FF0000;}
-->
</style>
Ini berarti warna latar (teks, border, dan lain-lain) adalah
merah, seluruh body dari dokumen. tag <p> mewarisi warna
teks merah, tag <strong> yang terdapat di dalam tag <p>
mewarisi warna merah. Pewarisan akan di-override menjadi
sperti di bawah ini :
<style type="text/css">
<!-BODY {color: #FF0000;}
STRONG {font-weight: bold;
color: #006633;}
-->
</style>
Hasilnya teks cetak tebal menjadi hijau. Ini merupakan
Cascade, konsep ini mempunyai beberapa aturan yaitu karena
<strong> merupakan elemen anak dari <body> seharusnya
mewarisi warna merah, tetapi aturan <strong> lebih spesifik
dari pada aturan <body> oleh karena itu aturan <strong>
menjadi pemenangnya. Semakin dekat suatu style kepada sebuah
elemen, style tersebut yang akan muncul. Penggambarannya
Landasan Teori
II-24
sebagai berikut, Linked > @import > embedded > inline >
HTML [elemen].
2.6.5
Implementasi CSS
Terdapat cara yang berbeda dalam menggunakan CSS
pada dokumen HTML dengan stylesheet, dan cara yang berbeda
tersebut dapat dikombinasikan. Cara yang dapat digunakan dalam
menggunakan CSS adalah sebagai berikut :
1.
Inline (internal)
Dengan cara ini berarti menetapkan style CSS pada
tempat yang spesifik untuk tag yang spesifik pada
dokumen yang spesifik.
<p style="color: #000088;">now follows blue
text.</p>
Contoh pengimplementasian di atas style digunakan
hanya
pada
tag
<p>,
dan
dimana
jika
akan
menggunakan style yang sama harus dilakukan secara
manual.
2.
Embedded (internal)
Pengimplementasian cara ini style dideklarasikan di
dalam bagian <head></head> dari suatu dokumen.
<style type="text/css">
<!-p {color: #000088;}
//-->
</style>
Landasan Teori
II-25
Dengan cara ini, jika akan menggunakan style yang
sama tidak perlu ditulis kembali. Setiap tag <p> di
dalam halaman tersebut mempunyai style yang sama.
3.
Linked (external)
Dengan cara ini penulisan style dilakukan pada suatu
file teks dengan akhiran .css, disebut juga stylesheet
eksternal dan file tersebut hanya berisi CSS.
<link rel="stylesheet"
href="/pathname/stylesheetname.css"
type="text/css">
Jika menggunakan cara ini harus menuliskan perintah
link di atas dituliskan pada bagian kepala dari suatu
dokumen.
4.
@import (external)
Cara ini mempunyai kesamaan dengan cara di atas,
perbedaannya
hanya
pada
perintah
untuk
menghubungkannya.
<style type="text/css">
<!-@import url(pathname/stylesheetname.css);
//-->
</style>
2.6.6
Kelebihan CSS
Sebelum adanya CSS, hampir semua atribut penyajian
dokumen HTML terkandung dalam markup HTML, semua
Landasan Teori
II-26
warna huruf, background style, element alignment, border dan
ukuran dideskripsikan dengan tegas, seringkali diulang-ulang,
pada HTML. CSS mengizinkan untuk memindahkan informasi
tadi menjadi stylesheet yang terpisah yang hasilnya markup
HTML menjadi sederhana.
Banyak
keuntungan
yang
di
peroleh
dengan
menggunakan CSS, keuntungan tersebut adalah :

Fleksibel,
mudah
dalam
penggunaan
dan
pengimplementasian.

Menjaga struktur dari suatu dokumen.

Memperkecil
ukuran
file
dengan
mengurangi
‘kekusutan’ HTML.

Mengurangi penggunaan waktu yang digunakan dalam
pemeliharaan dan perubahan pada website.
2.6.7
Kekurangan CSS
Terdapat beberapa kerugian dengan menggunakan CSS,
diantaranya adalah [WIK07A] :
1.
Dukungan browser yang tidak konsisten
Browser yang berbeda akan menterjemahkan layout
CSS dengan berbeda pula, ini merupakan bug pada
browser atau browser kurang mendukung fitur-fitur
CSS.
Landasan Teori
2.
II-27
Keterbatasan dalam pengaturan vertikal
Penempatan suatu elemen dengan posisi horizontal
secara umum mudah dalam pengaturannya, tetapi posisi
vertikal sulit atau ridak mungkin.
3.
Tidak mendukung banyak background per elemen
Desain grafis yang tinggi memerlukan beberapa gambar
background untuk setiap elemen, tetapi CSS hanya
mendukung satu gambar background pada setiap
elemennya.
4.
Pengaturan dari bentuk elemen XHTML
CSS hanya menawarkan bentuk persegi, sudut yang
membulat dan bentuk yang lain memerlukan nonsemantik XHTML markup.
5.
Tidak ada Variabel
CSS
tidak
membolehkan
mempunyai
penamaan
variabel.
warna
Variabel
atau
dapat
menetapkan
seluruh deklarasi juga memungkinkan penggunaan
kembali dan akan mengurangi ukuran file.
2.7
PHP Hypertext Preprocessor (PHP)
PHP adalah bahasa pemrogrman script yang paling
banyak dipakai saat ini. PHP banyak dipakai untuk memprogram
situs web dinamis, walaupun tidak tertutup kemungkinan
digunakan untuk pemakaian lain. PHP bersifat open source.
Pengguna dapat mengubah source code dan mendistribusikannya
secara bebas serta diedarkan secara gatis.
Landasan Teori
PHP
II-28
bersifat
server
side
scripting
yang
dapat
ditambahkan ke dalam HTML, sehingga suatu halaman web tidak
lagi bersifat statis, namun bersifat dinamis. Sifat server-side
berarti pengerjaan skrip PHP akan dilakukan di sebuah web
server, kemudian hasilnya akan dikirimkan ke browser. Salah
satu web server yang paling umum digunkan untuk PHP adalah
Apache. PHP dapat dijalankan pada sistem operasi Unix,
Windows, dan Mac OS X.
2.7.1
Sejarah PHP
PHP pertama kali dibuat oleh Rasmus Lerdorf pada
tahun 1995. Pada waktu itu PHP bernama FI (Form Interpreted).
Pada saat tersebut PHP adalah sekumpulan script yang digunkan
untuk mengolah data form dari web.
Perkembangan selanjutnya adalah Rasmus melepaskan
kode sumber tersebut dan menamakannya PHP/FI, pada saat
tersebut kepanjangan dari PHP/FI adalah Personal Home
Page/Form Interpreter. Dengan pelepasan kode sumber ini
menjadi open source, maka banyak programer yang tertarik
untuk ikut mengembangkan PHP.
Pada November 1997, dirilis PHP/FI 2.0. Dalam rilis ini
disertakan
modul-modul
ekstensi
yang
meningkatkan
kemampuan PHP/FI secara signifikan. Lalu pada tahun yang
sama juga sebuah perusahaan bernama Zend, menulis ulang
interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat.
Kemudian pada bulan Juni 1998 persusahaan tersebut merilis
Landasan Teori
II-29
interpreter baru untuk PHP dan meresmikan nama rilis tersebut
menjadi PHP 3.0.
Pertengahan tehun 1999, Zend merilis interpreter PHP
baru dan rilis tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah
versi PHP yang paling banyak dipakai. Versi ini banyak dipakai
sebab versi ini mampu dipakai untuk membangun aplikasi web
kompleks tetapi tetap memiliki kecepatan proses dan stabilitas
yang tinggi.
Pada bulan Juni 2004, Zend merilis PHP 5.0. Versi ini
adalah versi mutakhir dari PHP. Versi ini membawa perubahan
yang cukup besar dibandingkan dengan PHP versi sebelumnya.
Pada bagian inti, yaitu Engine dari PHP, dilakukan perombakan
total. Zend Engine yang dipakai sejak PHP versi 3, digantikan
dengan Engine yang baru., yang diberi nama Zend Engine 2.
Salah satu kemampuan yang cukup revolusioner dibandingkan
versi sebelumnya adalah Zend Engine 2 memiliki konsep Object
Oriented Programing yang jauh lebih bagus dengan tidak
mengorbankan kecepatan proses yang merupakan keunggulan
PHP dibandingkan bahasa script yang lainnya. PHP 5.0 juga
memiliki fitur-fitur baru untuk mendukung implementasi Object
Oriented Programing seperti penerapan public, private dan
protected class member, static variables, abstract class dan
interface.
Landasan Teori
2.7.2
II-30
Sintaks PHP
PHP semata-mata bertindak sebagai penyaring. Program
PHP menerima input dari suatu file dan instruksi PHP spesial dan
menghasilkan (output) data untuk ditampilkan. Pada PHP 4,
parser PHP mengkompilasi input untuk menghasilkan bytecode
untuk diproses oleh Zend Engine.
Kode parser PHP berada diantara delimiters, seperti
<?php ?>.
Segala sesuatu yang berada diluar delimiters
dikirimkan langsung pada output dan tidak akan di-parsed oleh
PHP.
Dalam PHP, garis baru diperlakukan seperti whitespace,
di dalam aturan free-form language (kecuali di dalam tanda kutip
string). Statement diakhiri oleh titik koma, kecuali dalam
beberapa kasus khusus. PHP mempunyai tiga tipe comment
syntax. /* */ yang mana menyajikan blok komentar, dan //
atau # yang mana menyajikan komentar dalam satu garis.
Variabel
Variabel berfungsi untuk menyimpan suatu nilai dan
nilai yang ada di dalamnya dapat dirubah sewaktu-waktu. Dalam
membuat suatu nama variabel, nama yang dipilih harus
memenuhi aturan pengenal. Dan variabel pada PHP selalu
diawali dengan simbol dollar ($). Pengenal (identifier) banyak
digunakan dalam program untuk memberi nama variabel, fungsi,
atau kelas. Aturan yang berlaku untuk pengenal adalah :
Landasan Teori

II-31
Karakter yang dapat digunakan yaitu huruf, angka, atau
garis bawah (_).

Karakter pertama harus berupa huruf atau garis bawah.

Panjang pengenal bisa beberpa saja.

Huruf kecil dan hurf kapital dibedakan.
Tipe Data
Tipe data dasar pada PHP ada tiga macam, yaitu :

Integer

Double

String
Integer menyatakan tipe data bilangan bulat dengan
jangkauan kira-kira dari -2 miliar hingga +2 miliar. Double
menyatakan tipe data bilangan real atau titik-mengambang, yaitu
bilangan yang mempunyai bagian pecahan. String menyatakan
tipe data teks (sederetan karakter yang tidak menyatakan
bilangan). Misalnya berupa nama barang atau nama orang.
2.8
Extensible Markup Language (XML)
XML kependekan dari EXtensible Markup Language,
dikembangkan mulai tahun 1996 dan mendapatkan pengakuan
dari W3C (Word Wide Web Consortium) pada bulan Februari
1998. XML digolongkan sebagai bahasa extensible dikarenakan
pengguna diperbolehkan untuk mendefinisikan tag-nya sendiri.
Ini merupakan tujuan utama untuk memudahkan dalam berbagi
data yang terstruktur melewati sistem informasi yang berbedabeda, terutama melewati internet.
Landasan Teori
II-32
Teknologi yang digunakan pada XML sebenarnya
bukan teknologi baru, tapi merupakan turunan dari SGML
(Standart
Generalized
Markup
Language)
yang
telah
dikembangkan pada awal 80-an dan telah banyak digunakan pada
dokumentasi teknis proyek-proyek berskala besar. Ketika HTML
(Hyper Text Markup Language) dikembangkan pada tahun 1990,
para penggagas XML mengadopsi bagian paling penting pada
SGML dan dengan berpedoman pada pengembangan HTML
menghasilkan markup language yang tidak kalah hebatnya
dengan SGML. Dan perlu kita ketahui bahwa XML didesain
untuk mendeskripsikan data, sedangkan HTML difokuskan untuk
menampilkan. Jadi dalam hal ini kita melihat bahwa XML dan
HTML saling melengkapi..
2.8.1

Sintaks XML
Elemen
XML adalah framework umum untuk menyimpan teks
atau data yang terstruktur yang dapat digambarkan seperti pohon
(tree). Syarat yang hanya dibutuhkan adalah dokumen XML
harus mempunyai satu root element. Maksudnya yaitu teks harus
tertutup diantara tag pembuka dan tag penutup yang sesuai.
Sepeti contoh di bawah ini :
<buku>ini adalah buku... </buku>
Landasan Teori

II-33
Deklarasi XML
Dalam setiap header dokumen XML terdapat deklarasi
XML. Berguna untuk mengetahui versi XML berapa yang
digunakan dan juga berisi informasi character encoding yang
digunakan. Seperti pada contoh berikut :
<?xml version="1.0" encoding="iso-8859-1"?>

Komentar
Komentar dapat ditempatkan dimana saja di dalam
pohon elemen (element tree), dapat juga disimpan pada teks di
dalam isi dari elemen. Contoh penulisan komentar seperti contoh
di bawah ini :
<!-- Ini adalah komentar. -->

Atribut
Atribut adalah properti atau bagian dari element. Aturan
dasar dalam penulisan untuk satu elemen adalah sebagai berikut :
<nama atribut=”nilai”>konten</nama>
Atribut tidak bisa dihirarkikan dan tidak berisi subelemen, tetapi atribut dapat dirubah menjadi elemen. Yaitu
seperti pada contoh berikut :
Landasan Teori
II-34
<publikasi>
<buku>Template Joomla</buku>
<penerbit>Elekmedia Komputindo</penerbit>
</publikasi>

Entiti
Entiti adalah karakter pengganti untuk sekumpulan
informasi yang didefinisikan. Dengan menggunakan entity XML
kita bisa menggantikan kalimat yang panjang atau satu blok
elemen yang sering digunakan dengan sebuah pengenal singkat.
Entiti juga dapat digunakan untuk menjuk kepada karakter
spesial. Contoh penggunaan entiti pada penggantian entiti untuk
suatu kalimat adalah :
<!ENTITY NamaBuku “XML programing for
VB and ASP developers”>
Dari contoh di atas dapat digunakan entiti dengan nama
&NamaBuku; di dalam dokumen dan kemanapun mengarahnya,
kalimat “XML programing for VB and ASP developers” akan
dilakukan pengantian. Contoh penggunaan entiti untuk karakter
spesial adalah :
<company_name>AT&T</company_name>
2.8.2
Aturan penulisan XML
Terdapat aturan dalam penulisan yang terdapat pada
XML. Bentuk dokumen XML yang baik harus sesuai dengan
aturan penulisan yang harus diikuti, diantaranya adalah :
Landasan Teori
1.
II-35
Setiap elemen dibatasi dengan sepasang tag pembuka
dan tag penutup.
2.
Elemen yang kosong dapat ditandai dengan tag elemen
kosong (self-closing tag), misalnya <kosong /> atau
sama dengan <kosong><kosong/>.
3.
Semua nilai atribut diberi tanda kutip dengan tanda
kutip satu (‘) atau tanda kutip dua (“). Tanda kutip satu
ditutup dengan tanda kutip satu dan tanda kutip dua
ditutup dengan tanda kutip dua.
4.
Setiap tag tidak boleh saling silang.
5.
Terdapat pendeklarasian character encoding. Ketika
tidak ada pendeklarasian akan diasumsikan sebagai
Unicode encoding, yang didefinisikan oleh Unicode
Byte Order Mark sebelum karakter pertama dari
dokumen. Jika tidak ada, UTF-8 encoding yang akan
diasumsikan.
6.
Nama dari elemen membedakan huruf kapital dan huruf
kecil (Case-Sensitive).