Mengenal Apa Itu Headless CMS: Definisi, Fitur dan Kelebihannya

367
Mengenal Apa Itu Headless CMS
Raih Kemenangan
14 min read

Hi, Exabytes Friends! Kebanyakan dari kita mengetahui WordPress sebagai salah satu platform Content Management System (CMS). Namun ternyata WordPress termasuk ke traditional CMS. Selain traditional CMS, kini ada lagi tipe CMS lain yaitu headless CMS.

Banyak dari pembuat konten digital mulai berpindah dari traditional CMS menjadi menggunakan headless CMS. Mengapa demikian? Apakah headless CMS lebih efisien ketimbang traditional CMS? Simak lebih lanjut artikelnya yah biar kamu tahu jawabannya dan mengenal headless CMS lebih lanjut.

Apa itu Headless CMS?

Headless CMS sebenarnya sama seperti sistem manajemen konten biasa yang selama ini sering kita jumpai. Kamu bisa membuat, mengatur, menyimpan dan mempublikasikan konten-konten digital kamu.

Yang membedakan, di headless CMS antara frontend (tampilan layar) dengan backend (pembuatan, pengaturan penyimpanan konten) terpisah. ‘Head’ pada kata headless ialah ketiadaannya frontend pada CMS.

Dengan headless CMS, kamu bisa memilih frontend (tampilan layar) manapun yang ingin kamu kirimkan konten dari backend. Kamu tidak terbatas hanya mempublikasikan konten pada layar website saja tetapi bisa ke aplikasi, smartwatch, layar TV, hingga virtual reality headset. Karena orang zaman sekarang mengkonsumsi konten sudah dari berbagai device.

Tampilan konten dengan Headless CMS

Konten yang telah kamu buat dan simpan di headless CMS akan tersimpan sebagai data melalui API (Application Program Interface). Nah, API inilah yang menghubungkan antara backend kamu dengan output frontend pilihan kamu nantinya.

Perbedaan Headless CMS vs Traditional CMS

Nah, mungkin kamu bertanya, memangnya tidak bisa membuat konten digital untuk aplikasi handphone, layar TV atau smartwatch dari CMS tradisional yang sudah populer kita kenal? Traditional CMS mempunyai batas-batasan sehingga para developer kerap tidak bisa berkreasi lebih jauh dalam membuat tampilan konten digital.

Traditional CMS

Sebagai contoh kita lihat WordPress sebagai traditional CMS. Di WordPress antara frontend dan backend menyatu, ketika kamu membuat suatu konten di CMSnya, maka bisa langsung terlihat hasilnya di website WordPress kamu yang dikenal dengan What You See Is What You Get (WYSIWYG) dengan fitur ‘Preview’.

Preview pada traditional CMS.

Dengan traditional CMS, semua menjadi kesatuan di satu wadah besar: Konten, Foto atau Gambar, HTML & CSS. Hal ini tidak memungkinkan untuk konten digunakan kembali, karena sudah menyatu di satu kode. Biasanya konten yang dibuat di CMS tradisional diperuntukkan untuk tampilan layar (frontend) yang berbentuk website.

Lalu jika kita ingin mengubah tampilan layar website kita hanya dapat melakukan hal-hal seperti mengganti template basic yang sudah tersedia di platform atau yang lebih rumit, menginstall plugin web builder di CMS dan mengedit file template (custom CSS) yang ada di dalam CMS. Kesemuanya tidak fleksibel dan menghambat kreativitas developer.

Headless CMS

Untuk urusan konten, headless CMS kerap menawarkan layanan Content Infrastructure, Pusat Konten atau CaaS – Content as a Service/Konten Sebagai Layanan. 

Mengenal Headless CMS: Definisi, Fitur dan Kelebihannya

Source: Contentful

Dengan adanya fitur ini, konten ketika awal dibuat bisa memilih model atau framework konten, mengatur jenis konten apa dan menentukan bagaimana setiap jenisnya terkait dengan yang lain. Pembuat konten tidak terbatas pada model yang ditawarkan cms tradisional.

Ketimbang menjadi kesatuan seperti di CMS tradisional, pada headless CMS model konten dipecah menjadi elemen per individu: dari judul tulisan, badan tulisan hingga bentuk call to action button di bagian akhir. Lalu kamu bisa menentukan bagaimana mereka terkait satu sama lain, disesuaikan dengan output frontend apapun yang kamu inginkan.

Kesimpulan Perbedaan Headless CMS vs Traditional CMS

Pada Traditional CMS, hosting dan cara mengirimkan konten tergantung pada platform CMS atau in-house. Misalnya menggunakan WordPress Hosting. Lalu fokus pada pembuatan konten lebih ke project konten yang akan ditampilkan ke layar website, model konten hanya untuk satu framework (website) dan ketika membuat satu konten di halaman kerja hanya untuk satu page/post saja dan device yang bisa menampilkan konten terbatas (tentu tidak bisa tampil di smartwatch/layar kulkas).

Sedangkan pada Headless CMS, hosting dengan cloud, cara menampilkan konten di tampilan depan (frontend) melalui API. Dalam membuat konten lebih berfokus ke produk di mana konten akan ditampilkan. Model konten yang terpecah menjadi elemen individu bisa untuk beragam framework atau kerangka kerja dan ketika membuat konten sekali maka bisa digunakan dan ditampilkan di beragam tampilan depan (frontend) atau device apapun yang kamu inginkan.

Bagaimana Headless CMS Bekerja?

Lalu bagaimana headless CMS bekerja dari pembuatan konten hingga tampil di tampilan depan (frontend) yang kita inginkan. Kurang lebih, beginilah cara kerjanya:

  1. Pembuat konten, editor atau  marketer memasukkan konten ke headless CMS tanpa perlu memikirkan bagaimana hasil akhirnya di tampilan depan (frontend) ke pengguna.
  2. Konten yang diinput akan exist di sana, terkadang berupa blok-blok konten.
  3. Frontend developer kemudian dapat mulai mendesain konten dan dapat memilih ingin mempublikasikan konten di tampilan depan layar seperti apa.
  4. API kemudian akan menghubungkan headless CMS dengan tampilan layar (frontend) yang dipilih dan mengirimkan data untuk dipublikasikan di berbagai device.
  5. Konten kini bisa tampil di website, aplikasi di handphone, smartwatch hingga layar TV.

Terlihat, bahwa dengan headless CMS, pekerjaan bisa menjadi lebih efisien dan fleksibel dalam pemilihan output konten.

Pertimbangan Memakai Headless CMS

Jika kamu sedang berpikir apakah harus beralih ke headless CMS dari traditional CMS, meski kamu telah mengenal headless CMS secara singkat tadi, tetap ada hal-hal yang perlu kamu pertimbangkan sebelum memutuskan beralih.

Kelebihan Memakai Headless CMS

Beralih menggunakan headless CMS mempunyai banyak kelebihan untuk kamu. Apa saja kelebihannya?

Dapat Berkreasi Lebih Dengan Konten

Karena headless CMS terpisah dengan frontend atau tampilan depan contohnya layar website maka tampilan website tidak terbatas pada tema-tema yang disediakan platform traditional CMS atau harus ribet menggunakan custom CSS.

Kita bisa berkreasi membuat konten ataukah mau tulisan diselingi foto, video, audio, slideshow, tata letak yang bebas, animasi, dan semua ini bisa ditampilkan di frontend framework apapun yang kamu pilih: website, layar TV, smartwatch dan lain-lain.

Mendapat Lebih Banyak Audiens

Karena konten kamu bisa tampil di frontend device apapun, maka kamu juga akan menjangkau lebih banyak audiens. Audiens kamu kini bukan hanya orang yang mempunyai komputer/laptop dan mengakses website kamu, tapi kamu juga bisa menjangkau pengguna smartphone yang bergantung pada aplikasi, pelari yang menggunakan smartwatch, hingga keluarga saat melihat kontenmu di layar TV.

Cepat Menyesuaikan dengan Inovasi Device

Headless CMS menyajikan data yang raw/mentah, maka cepat menyesuaikan jika ada perkembangan teknologi baru pada device yang frontednya kamu pilih untuk menampilkan konten kamu. 

Contohnya, jika di kulkas keluaran terbaru mempunyai layar untuk menunjukkan indikator/cara pemakaian telah mempunyai fitur baru entah menampilkan video atau voice assistant, kita bisa memasukkan konten kita ke sana.

Konten Dapat Digunakan Kembali

Konten yang kamu buat dan letakkan di headless CMS, karena sifatnya model kontennya yang dipecah per elemen maka bisa kamu gunakan kembali tanpa harus mencari kode di dalam satuan kode konten, foto, HTML & CSS. 

Misalnya, pada konten sebelumnya kamu mempunyai button call to action seperti ‘Daftar Sekarang’. Nah, kamu bisa menggunakannya lagi di konten kamu yang berikutnya.

Efisien Dalam Pengerjaan Konten

Dengan headless CMS, karena setiap konten yang dibuat akan disimpan dalam satu pusat konten, kamu tidak perlu mengulang pekerjaan seperti copy, paste, mengganti gambar di setiap framework frontend yang kamu tuju. Sekali kamu melakukan perubahan, maka akan diaplikasikan pada semua framework frontend pilihanmu.

Selain itu, fitur ini juga dapat membantu kamu menjadi konsisten dengan brand kamu. Misalnya seperti warna background, warna button yang sama, jenis hurufnya sama. Sehingga pengalaman user dengan kamu akan sangat baik dan mengingat brand kamu, meskipun mengaksesnya di device berbeda.

Karena sekali pengerjaan dan sudah teraplikasikan pada semua framework frontend yang dituju, maka proses rendering content juga hanya dilakukan sekali. Headless CMS membuat semua pekerjaan menjadi terasa lebih cepat, efisien dengan waktu dan tenaga.

Lebih Fleksibel Untuk Developer

Tidak hanya pembuat konten yang dimudahkan, namun juga developer bisa menjadi fleksibel dalam pekerjaannya. 

Karena konten yang dibuat dengan headless CMS disajikan oleh API sebagai penghubung, developer dapat memilih alat frontend yang mereka sukai. Baik ingin bekerja dengan Javascript ketimbang PHP atau Ruby. Platform frontend framework pun juga  bisa disesuaikan. Mau dengan React, Vue atau Angular. 

Kamu juga bisa berpindah dari framework satu ke framework frontend lainnya tanpa mempengaruhi konten kamu yang berada di headless CMS. Dengan headless CMS, para developer bisa lebih fokus membuat konten tanpa memikirkan manajemen konten.

Skalabilitas

Skalabilitas artinya kemampuan suatu sistem menangani penambahan beban atau peningkatan untuk mengurangi kesusahan karena beban yang ditambahkan. Dengan headless CMS, karena backend (pembuatan dan penyimpanan konten) dengan frontend (tampilan depan) terpisah, maka jika kamu melakukan optimasi atau upgrade di salah satunya, tidak akan terjadi downtime/tampilan rusak saat maintenance.

Lebih Aman

Keamanan juga merupakan hal yang paling penting untuk kamu pembuat konten. Headless CMS juga menawarkan keamanan. Karena layar depan dengan pembuatan dan penyimpanan konten terpisah dan penerbitan konten di platform frontend melalui API, maka mengurangi resiko terkena serangan DDoS dari backend.

Tidak Mudah Kehilangan Konten

Karena dengan headless CMS terpisah antara backend (pembuatan dan penyimpanan konten) dengan frontend (tampilan depan) dan data konten kamu berada di Cloud yang lalu dihubungkan dengan API, maka kamu tidak akan kehilangan keseluruhan konten saat ada kerusakan atau hacking.

Kekurangan Memakai Headless CMS

Meski headless CMS memiliki banyak kelebihan, namun juga terdapat beberapa kekurangan.

Tidak Cocok Untuk Pemula

Tidak seperti traditional CMS yang mempunyai beragam template serta tema website yang bisa kamu pilih dan sesuaikan, dengan headless CMS kamu membangun desain dan struktur dari sebuah kanvas kosong.

Selain itu, karena frontend dan backend terpisah, maka kamu mempunyai dua software yang harus kamu kuasai. Developer harus familiar dengan kode-kode atau cara kerja di keduanya.

Kebanyakan orang yang menggunakan traditional CMS seperti WordPress tidak memerlukan basic ilmu pemrograman. Dengan headless CMS, kamu harus sudah mengerti dan familiar akan pengetahuan tentang pemrograman web.

Tidak Semua Ada Fitur Preview

Karena frontend dan backend yang terpisah, tidak seperti traditional CMS, maka kamu tidak bisa ‘What You See Is What You Get’ alias ketika membuat konten tidak bisa mem-preview bagaimana tampilan konten di layar depan atau frontend (di website, aplikasi handphone, smartwatch) apakah sudah sesuai yang kamu inginkan, apakah tata letak enak dilihat dan sebagainya.

Tidak Bisa Melakukan Analisis Data Langsung

Ketika frontend dan backend terpisah, maka kamu tidak bisa mendapatkan data-data mengenai apa-apa saja yang dilakukan user kamu ketika menikmati kontenmu, berapa lama mereka berselancar, halaman apa yang mereka sukai. Ketika kamu tidak mendapatkan data ini, maka kamu juga susah untuk menyesuaikan konten dan tampilannya dengan kesukaan user sekarang.

Jika dengan traditional CMS seperti WordPress, bisa menggunakan layanan Google Analytics langsung di CMSnya. Tetapi untuk headless CMS, kamu mungkin bisa menggunakan business intelligence tools atau software analisa yang bisa kamu temukan untuk mendapatkan analisis terhadap konten kamu keseluruhan.

Headless CMS Populer

Kamu sudah mengenal headless CMS secara singkat, mengetahui cara headless CMS bekerja dan tahu kelebihan dan tantangan yang dihadapi ketika kamu memilih beralih menggunakan headless CMS. Nah, sekarang tinggal memilih layanan headless CMS yang bisa kamu gunakan.

dotCMS

Mengenal Apa Itu Headless CMS: Definisi, Fitur dan Kelebihannya - 2021

dotCMS, headless CMS lainnya yang juga populer ini didirikan tahun 2003 di Miami Florida. CMS ini mempunyai fitur drag-and-drop untuk pembuat konten mudah dalam modifikasi tampilan dan tata letak halaman konten, membuat dan mengatur beragam alur kerja, ditambah dengan editor WYSIWYG yang dapat menampilkan preview konten yang sedang kamu buat.

Untuk hosting, dotCMS bisa dihosting in-house atau di Cloud. Ada juga fitur personalization sehingga kamu bisa mentrack customer journey ketika menikmati konten kamu dan kemudian menyesuaikan dengan kesukaan mereka. Dan juga multi-language dan multi-tenant, yang artinya kamu dapat memanage ribuan site dan juga channel.

Contentful

Headless CMS: Contentful.

Contentful, headless CMS berbasis API yang didirikan 2013 di Jerman. Contentful yang mempunyai klien seperti: Spotify, WeWork, Audible,Twilio, memberikan developer full program kontrol terhadap konten, dan digital aset. 

Contentful juga CDN support sehingga bisa mengirim muatan data konten (file text, gambar, video) lewat API dalam jarak yang jauh. Pembuat konten juga dapat menyusun konten model sendiri seperti text, foto, slideshow, kalender. 

ButterCMS

Headless CMS: Butter CMS

ButterCMS, didirikan pada 2014 dan berbasis di Chicago ini mempunyai fitur menyajikan konten lewat API, custom type page atau model konten, mensupport multi-site, CDN support untuk file file foto/video/audio kamu, platform untuk blogging yang independen dan dapat diintegrasikan ke framework frontend apapun.

Selain itu, ButterCMS juga dapat melakukan What You See Is What You Get untuk antarmuka SEO landing pages, halaman berita perusahaan, halaman studi kasus terhadap pelanggan, dan banyak lagi.

Strapi

Headless CMS: Strapi.

Strapi juga merupakan headless CMS berbasis di Perancis yang bersifat open-source. Fitur yang dimilikinya ialah dibangun dengan Node.js sehingga kamu bisa memanagenya lewat berbagai API. 100% Javascript, satu bahasa untuk mengatur semuanya. Strapi juga memiliki panel admin yang bisa dikustomisasi, menginstall plugin, mengatur digital aset dan juga keamanan berlapis. 

Directus

Headless CMS: Directus.

Headless CMS populer lainnya yang open-source ialah Directus yang berbasis di Brooklyn dimulai tahun 2004. Directus bagus untuk proyek yang memerlukan database layaknya mengelola database SQL khusus secara langsung. 

Dengan directus, developer dapat membuat database khusus untuk mengelola bisnis dan juga konten database untuk situs web dan aplikasi tanpa mempelajari framework atau terpaksa membangunnya dengan teknologi spesifik tertentu. 

Directus menggunakan REST API dan didukung oleh PHP sehingga bisa mempublikasikan konten ke manapun: website, mobile apps, kiosks, IoT devices dan lain-lain.

Netlify CMS

Headless CMS: Netlify CMS.

Netlify CMS juga bisa kamu pilih sebagai headless CMS mu. SEbagai CMS yang open-source, Netlify mempunyai interface (antarmuka) yang editor-friendly, dibangun di atas React sebagai single page, bisa digunakan dengan generator web status apapun untuk proyek konten yang lebih cepat dan fleksibel.

Di Netlify, konten yang kamu buat tersimpan di Git, bersamaan dengan kode-kode untuk pembuatan versi yang lebih mudah, dipublish ke frontend manapun dan konten juga akan otomatis update di Git dari CMS.

Cockpit

Headless CMS: Cockpit.

Cockpit adalah headless CMS yang free, open-source berbasis di Jerman. Mendeskripsikan diri sebagai ‘content provider’ ketimbang ‘website builder’, Cockpit berarti hadir sebagai solusi backend yang hanya membuat dan menyimpan konten. Tidak ada fitur pengeditan bawaan, jadi pure headless CMS.

Platform ini menggunakan API dan JSON untuk mengirim dan menyajikan konten. Dengan Cockpit kamu bisa membuat struktur konten yang fleksibel tetapi tidak ingin dibatasi dalam cara menggunakan konten. Cockpit cocok untuk kamu yang ingin membuat konten didukung banyak perangkat atau memerlukan UI manajemen konten untuk pembuat situs statis. 

Penutup

Nah, sekarang kamu sudah mengenal headless CMS dari definisinya, fitur yang ditawarkan headless CMS dan juga kelebihan serta tantangan memakai headless CMS. Kamu juga bisa langsung mencoba platform headless CMS populer yang sudah mimin rangkum. 

Tentunya, selain 7 headless CMS tadi, masih banyak lagi platform headless CMS yang juga worth-it seperti Storyblook, Sanity, Webiny, ContentStack, Kentico Konten dan lain-lain yang bisa kamu cek di sini.

Kalau kamu pemula dan tertarik untuk memahami lebih dalam tentang headless CMS karena kepikiran ingin beralih ke headless CMS, kamu bisa banget mendalami ilmu lebih lanjut dengan mengikuti acara mendatang Exabytes, Indonesia Website Award x Web Developer Talk 2021!

Mengenal Apa Itu Headless CMS: Definisi, Fitur dan Kelebihannya - 2021

Karena nantinya akan banyak praktisi handal di bidangnya yang akan berbagi insight tentang tren website, strategi konten, hingga kisah inspirasional mereka. Salah satunya adalah tentang topik Headless CMS lho.

Semoga artikel ini bisa membuka wawasanmu tentang Headless CMS ya. Dan jika kamu ingin tahu lebih dalam tentang topik ini, jangan sampai kelewatan, daftar di IWA x WebDevTalk sekarang juga.

Apakah artikel ini membantu?
YaTidak
Raih Kemenangan