Tempat belajar blogspot

Apa itu CSS


Pengertian CSS dan sejarah CSS

CSS bagi saya adalah hal yang sangat penting untuk urusan penampilan sebuah halaman web layaknya kosmetik untuk make up wajah, karena dengan tampilan menarik pastinya pembaca atau pengunjung sebuah website tersebut akan lebih mudah mendapatkan informasi yang mereka inginkan. Contoh sederhana tata letak widget search atau kolom pencarian berada di posisi paling bawah dari sebuah halaman web atau kolom pencarian itu tertutupi oleh objek - objek lain, maka bisa dibayangkan jikalau kita sendiri adalah pengunjung website tersebut tapi kita kesulitan untuk mencari artikel yang berkaitan dengan kata kunci karena widget search yang sulit ditemukan? Ya, jawaban paling sederhana adalah kita akan mencoba mencari website lain melalui mesin pencari Google dan meninggalkan website yang sebelumnya.

Sedangkan menurut sumber lain (Wikipedia)
Cascading Style Sheet (CSS) merupakan aturan untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemograman. Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML. CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya. CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.

Perbedaan elemen HTML menggunakan CSS dan tanpa CSS

Bagi yang masih bingung mengenai fungsi atau hasil yang didapat dari penggunaan CSS pada sebuah halaman HTML, mungkin contoh gambar di bawah ini bisa memberikan pemahaman yang lebih jelas.



Bisa dilihat pada contoh sederhana gambar di atas terdapat perbedaan tampilan kotak pencarian dengan tambahan CSS dan kotak pencarian tanpa tambahan CSS pada bagian tab "Result". Kotak pencarian dengan tambahan CSS bisa memberikan tampilan yang lebih menarik sesuai keingingan kita, karena dengan CSS kita bisa memberikan beberapa perubahan tampilan dan tidak ketinggalan seperti efek - efek animasi juga bisa kita tambahkan.

Sejarah CSS

Nama CSS didapat dari fakta bahwa setiap deklarasi style yang berbeda dapat diletakkan secara berurutan, yang kemudian membentuk hubungan ayah-anak (parent-child) pada setiap style. CSS sendiri merupakan sebuah teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C pada tahun 1996. Setelah CSS distandarisasikan, Internet Explorer dan Netscape melepas browser terbaru mereka yang telah sesuai atau paling tidak hampir mendekati dengan standar CSS.
sumber : Wikipedia

Versi CSS

Untuk saat ini terdapat tiga versi CSS, yaitu CSS1, CSS2, dan CSS3. CSS1 dikembangkan berpusat pada pemformatan dokumen HTML, CSS2 dikembangkan untuk memenuhi kebutuhan terhadap format dokumen agar bisa ditampilkan di printer, sedangkan CSS3 adalah versi terbaru dari CSS yang mampu melakukan banyak hal dalam desain website. CSS2 mendukung penentuan posisi konten, downloadable, huruf font, tampilan pada tabel /table layout dan media tipe untuk printer. Kehadiran versi CSS yang kedua diharapkan lebih baik dari versi pertama dan kedua.

CSS3 juga dapat melakukan animasi pada halaman website, di antaranya animasi warna hingga animasi 3D. Dengan CSS3 desainer lebih dimudahkan dalam hal kompatibilitas websitenya pada smartphone dengan dukungan fitur baru yakni media query. Selain itu, banyak fitur baru pada CSS3 seperti: multiple background, border-radius, drop-shadow, border-image, CSS Math, dan CSS Object Model.
sumber : Wikipedia

Apa saja yang bisa dilakukan dengan CSS?

Setelah melihat contoh sederhana mengenai perbedaan elemen HTML dengan CSS dan elemen HTML tanpa CSS, bisa dipastikan kemampuan CSS tidak hanya sebatas mengubah warna saja. Berikut beberapa hal yang sanggup dilakukan dengan CSS.
  1. Mengganti warna elemen HTML dan warna text.
  2. Mengganti jenis font pada halaman web.
  3. Menyesuaikan ukuran halaman web berdasarkan ukuran display browser (Responsive Template).
  4. Memperbesar atau memperkecil ukuran sebuah elemen HTML.
  5. Menyembunyikan elemen HTML tanpa harus menghapus elemen HTML tersebut.
  6. Memberikan efek animasi atau warna yang berbeda pada elemen yang bisa di klik (Untuk memberikan tanda bahwa objek / text / gambar tersebut bisa di klik).
  7. Membuat layout atau template untuk website atau blogger, termasuk ukuran kolom widget serta letak posisi widget.
Baca juga : Cara Penulisan CSS Syntax dan Selector

Tidak hanya 7 hal di atas yang sanggup dilakukan dengan CSS, dengan pemahaman dasar mengenai CSS kita bahkan bisa memberikan perubahan tampilan sebuah halaman web lebih unik atau beda dengan yang lain. Jadi bisa disimpulkan kalau menarik atau tidaknya tampilan web sebenarnya bukan hanya karena CSS saja tapi kita sendiri yang harus memiliki kreatifitas membuat web tersebut terlihat menarik.
Sampai disini dulu artikel mengenai "Apa itu CSS" semoga artikel ini dapat memberikan informasi bermanfaat bagi kita yang ingin belajar membuat website sendiri.
Terima kasih

Artikel ini ditulis oleh :
Perbloggeran

22 comments:

  1. Ternyata versi css itu banyak ya bro..

    ReplyDelete
  2. kalau versi nya update apa kode/syntax nya juga berubah?

    ReplyDelete
  3. Css3 sekarang yang paling jos. Keren, tapi saya masih belum bisa menguasai css dengan baik.

    ReplyDelete
  4. Benar juga, tampilan web menarik karena kreatifitas si pemiliknya.
    Tapi kalau sering ganti-ganti (sangking kreatifnya) mengubah search engine nggak?

    ReplyDelete
  5. saya gak ngerti2 banget kalau masalah CSS mas. Tapi setidaknya memahami sedikit ttg CSS itu perlu bagi seorang blogger

    ReplyDelete
    Replies
    1. Betul gan saya setuju dengan agan, kalau kita bermain dengan halaman blog atau website minimal harus ada pengetahuan dikit soal CSS gan..

      Delete
  6. kalo saya yang penting tinggal make aja nih css

    ReplyDelete
    Replies
    1. hehehe gpp gan sekalian belajar memahami CSS sedikit - sedikit..

      Delete
  7. baru tau CSS juga punya sejarah kya gitu wkwk

    ReplyDelete
    Replies
    1. Hehehe iya gan sedikit banyak supaya tahu cikal bakal munculnya CSS gan..

      Delete
  8. Wah ngedit css itu sih hobi saya mas.. hehe

    ReplyDelete
    Replies
    1. hehehe ok sip gan semangat otak atik templatenya dengan CSS gan..

      Delete
  9. Replies
    1. Iya gan CSS salah satu bahasa web yang di khususkan untuk tampilan tatap muka gan..

      Delete
  10. Replies
    1. hehehe saya belum menguasai php gan, masih proses belajar bahasa php gan...

      Delete
  11. Penjelasannya lengkap, bagus dan enak untuk dibaca. Terima kasih gan. Bicara tentang CSS, saya pernah tuh sesekali coba hapus CSS dari template saya. Wah, ternyata tampilan jadi ancur, polos banget gak ada menarik-menariknya. Dengan artikel ini, saya jadi lebih mengerti seberapa pentingnya CSS untuk style dan skin pada template saya.

    ReplyDelete
  12. baru tahu betapa pentingnya css,, makasih gan infonya.

    ReplyDelete

1. Berkomentarlah dengan sopan.
2. Berdiskusilah dengan bijak.
3. Dilarang SPAM.
4. Dilarang SARA.
5. Dilarang menuliskan tautan link.

Featured Post

Apa itu CSS Syntax dan Selector

CSS ( Cascading Style Sheet ) sudah dijelaskan mengenai pengertian CSS pada artikel sebelumnya Apa itu CSS , namun pada artikel yang sekara...

Popular Posts