Setelah kita mempelajari tentang HTML dan Juga dasar CSS maka kita melangkah ke studi kasus. Jika anda belum membaca tutorial sebelumnya ada baiknya anda membaca artikel HTML untuk Web Design dan CSS dan Web Design agar lebih memahami tutorial ini. Dalam pembuatan design web dua kolom ini kita akan menggunakan konsep tableless design (design tanpa menggunakan tag <table> akan tetapi menggunakan <div>). Kelebihan tableless design adalah waktu loading yang diperlukan halaman web akan lebih cepat.

Setelah kita mempelajari bagaimana penggunaan CSS dalam tutorial Dasar Penggunaan CSS Dalam Web Design tutorial kali ini akan membahas kode-kode yang sering digunakan dalam CSS. Jumlah Kode syntaks CSS tidaklah sedikit, tentu saja tidak perlu menghafalnya. Yang perlu dilakukan adalah sering-sering berlatih hingga secara otomatis kita hafal sendiri atau kita bisa melihat referensi kode-kode tersebut.

Tutorial ini merupakan tutorial lanjutan dari CSS dan Web Design sebelumnya. Kalau pada tutorial sebelumnya kita berbicara mengenai definisi dan syntak CSS, maka tutorial kali ini kita akan belajar bagaimana implementasi syntak tersebut secara nyata di lapangan.

Cascading Style Sheets (CSS) adalah bahasa yang digunakan untuk mendefinisikan tampilan halaman web. CSS didesain untuk memisahkan antara isi stau halaman website dengan cara menampilkan isi (desainnya). Dengan pemisahan ini maka membuat desain web akan lebih mudah karena satu definisi dalam CSS bisa digunakan oleh banyak halaman web. Kalau kita mempelajari tutorial saja sebelumnya mengenai HTML Untuk Web Design anda akan menemukan bahwa design dan content masih jadi satu. Sebagai contoh pendefinisian background dan warna tampilan masih dedefinisikan sendiri-sendiri pada masing-masing halaman. Hal ini tidak akan efektif jika halaman yang dibuat berjumlah banyak dengan desain yang mirip.

Meta Tag sangat berguna untuk optimisasi SEO dari website atau blog kita. Meta Tag yang umumnya diperhatikan oleh search engine adalah TITLE, KEYWORD, dan DESCRIPTION. meskipun ada banyak jenis meta tag saya hanya akan menjelaskan tiga jenis ini saja pada pembahasan ini.

Form digunakan untuk membawa input data ke halaman yang dituju pada action form. HTML akan dipadukan dengan pemrograman server side seperti PHP untuk melakukan manipulasi terhadap data yang masuk. FOrm dalam HTML didefinisikan dalam bentuk “<form …></form>”. Input yang berada didalam tag tersebut akan dibawa ketika form disubmit.

Tabel digunakan untuk mendefinisikan suatu daftar secara teratur. Disana ada baris dan kolom, pada bagian atas biasanya terdapat nama masing-masing kolom. Dalam HTML table didefinisikan dengan syntak “<table>” dan diakhiri dengan “</table>” sedangkan baris didefinisikan dengan “<TR>” dan diakhiri juga dengan “</TR>”.

Kalau anda pernah mengunjungi sebuah website maka pasti anda akan menemui sebuah desaign website yang memilki beragam background gambar maupun berupa warna.  Adanya background baik itu berupa gambar maupun warna akan menambah daya tarik suatu website untuk dikunjungi oleh pengunjung.

HTML memiliki kemampuan untuk menampilkan media berupa gambar dan dengan bantuan javascript mampu menampilkan video flash ataupun file mp3. Rasanya tidak menarik kalau sebuah website tidak memiliki gambar di dalamnya dan hanya terdiri atas text saja. Gambar dalam HTML didefiniskan dengan menggunakan tag “<img>”.

Links dalam HTML digunakan untuk berpindah dari suatu helaman ke halaman lain yang ditunjuk.  Links didefinisikan dengan tag “<a>” dan diakhiri dengan “</a>”.  Links ini juga akan membantu SEO suatu website apabila dioptimalkan dengan baik. SEO merupakan salah satu cara efektif  agar website anda dikenali dengan baik oleh search engine pada kata kunci tertentu.