Slider Untuk Menambah Tampilan Desain Websitemu

ipad-820272_1920

Slider merupakan sebuah bagian penting dalam website yang selalu menjadi trend, karena bisa merepresentasikan sebuah pesan melalui website. Slider yang mempunyai gambar-gambar menarik, tidak lengkap rasanya jika transisi antar gambar dianimasikan secara biasa.

Desainer web dan programer front-end lebih suka menggunakan slider yang mempunyai macam-macam transisi plus karena user juga menyukai hal itu. Berikut ini ada 7 slider yang bisa membuat tampilan website anda lebih menarik, mari kita lihat reviewnya satu per satu.

  1. Wow Slider (http://wowslider.com)
Gambar-A-2

Wow Slider

Wow Slider merupakan slider yang kaya dengan efek transisi, slider ini cocok digunakan pada desain web dengan tema creative website. Wow Slider menyediakan banyak fitur transisi gambar yang sangat cocok untuk website anda dan slider ini sudah mendukung responsive desain. Fitur yang bagus dari slider ini bisa mendukung video slider yang bisa menjadi alternatif, ketika website anda ingin menampilkan video dengan cara yang berbeda.

Tema dari Wow Slider juga bermacam-macam, banyak theme set yang bisa digunakan untuk slider di website anda. Wow Slider mendukung hampir semua browser yang sangat penting untuk para front-end developer. Untuk para programer wordpress dan joomla, Wow Slider menyediakan plug-in untuk modul CMS tersebut.

  1. Owl Coursel (http://owlgraphic.com/owlcarousel/)
Gambar-B-2

Owl Coursel

Owl Coursel merupakan slider yang digunakan untuk main slider pada sebuah web, bisa juga untuk slider pendukung. Main slider mempunyai fitur auto height berguna untuk menjaga aspect ratio dan tingginya menyesuaikan gambar yang anda gunakan. Fitur ini digunakan sebagai slider pendukung dan biasanya dipasang di area tengah atau bawah website.

Penempatan ini bertujuan untuk menampilkan informasi non primer berupa gambar, seperti katalog produk yang sedang featured, pengumuman harian, dan informasi  sekunder lainnya. Owl Coursel sangat cocok digunakan karena sudah mendukung tampilan responsive, Meskipun dari segi animasi slider ini tergolong biasa, namun banyak digunakan untuk website corporate karena tampilannya yang elegan.

  1. Slick (http://kenwheeler.github.io/slick/)
Gambar-D-2

Slick

Slick bisa menjadi pilihan untuk type slider yang mempunyai fitur main slider dan slider pendukung pada sebuah web. Slider ini mempunyai tampilan creative semi corporate, kenapa bisa begitu? Slick mempunyai theme yang bisa dibilang creative dengan tema flat design, tetapi transisi dari slider ini sangatlah minim.

Slick juga dilengkapi navigasi seperti slider lain dan sudah mendukung reponsive desain. Untuk para developer front-end, Slick memberi kemudahan berupa dokumentasi script untuk proses develop yang sangat jelas. Kustomisasinya mudah dan membuat para developer cepat mengaplikasian slider ini pada websitenya.

  1. Slicebox (http://tympanus.net/Development/Slicebox/)
Gambar-C-2

Slicebox

Jika anda menginginkan slider dengan transition effect yang kreatif, Slicebox merupakan slider yang cocok untuk website anda. Fitur box 3D pada slider ini sudah menjadi ciri khas, dan mudah diaplikasikan di website anda. Slider ini juga sudah mendukung fitur responsive desan, namun slider ini hanya bisa digunakan untuk main slider dan hanya bisa image saja, untuk ukuran kita bisa atur sendiri.

  1. Camera by Pixedelic (http://www.pixedelic.com/plugins/camera/)
Gambar-E-2

Camera

Camera merupakan slider yang sangat sederhana dan sangat cocok untuk corporate website. Selain ada kontrol autoplay, Slider juga menyediakan transisi yang elegan. Slider ini hanya digunakan untuk main slider, karena ada fasilitas timer untuk image load dengan animasi loading di pojok kanan atas. Slider dari Camera ini juga mudah diolah oleh developer karena sudah mumpuni dari segi dokumentasi.

  1. Slideme (http://slideme.luigiferraresi.it/)
Gambar-F-2

Slideme

Slideme merupakan slider dengan tipe yang berbeda, umumnya sebuah slider akan berada di bawah menu atau menjadi slider sekunder. Slider ini akan menjadi full header dan meyatu dengan menu. Dengan dokumentasi yang lengkap untik implementasi code, Slider ini cocok umtuk website dengan tema yang creative namun tetap elegan.

  1. Gamma Gallery (http://tympanus.net/Development/GammaGallery/)
Gambar-G-2

Gamma Gallery

Gamma Gallery merupakan slider khusus untuk gallery, yang berbeda dengan galery pada khususnya. Gamma Gallery menggunakan fitur slider dalam gallery sistemnya. Slider ono membantu membuat view gallery agar tidak melulu plain. Gamma Gallery membuat tampilan website tidak hanga lebih baik namun juga bisa menghemat time load saat pertama kali dijalankan dengan adanya ajax loader. Slider semi gallery ini juga responsive dan mampu menjaga aspect ratio dari website menggunakan konsep scaling.

Inspirasi Artikel dan Sumber Gambar :

  1. WowSlider
  2. OwlGraphic
  3. Github Kenwheeler
  4. Tympanus Slicebox
  5. Pixedelic
  6. Slideme Luigiferraresi
  7. Tympanus Gamma Gallery
Aulia Arif Wardana

Post A Reply

Translate »