TEMPLATE WEBSITE RESPONSIVE

Website dengan template responsive itu semakin dibutuhkan mengapa? Saat ini begitu banyak sekali pengguna internet yang mengakses via mobile, menurut data statistik di Indonesia saja pengguna internet via gadget mobile itu jauh lebih banyak ketimbang PC maupun desktop. Akses internet beralih dari suatu yang serius digunakan oleh orang-orang tertentu menjadi kebutuhan bagi semua orang. Kebutuhan mendapatkan informasi, ataupun hiburan menghilangkan kegundahan.
Namun sebelum era ini berjalan, para web designer membuat template menyesuaikan media akses para pengguna internet, dahulu kala kebanyakan menggunakan PC dan Notebook, sehingga tampilan pun menyesuaikan hanya untuk PC dan Notebook, tapi kini eranya berubah. Halaman website yang diperuntukkan PC dan Notebook menyulitkan pengguna mobile dalam melihat informasi yang berada di dalamnya. Tulisannya kecil-kecil, jadi nggak kelihatan, gambarnya itu-itu jadi begitu, layoutnya anu-anu jadi beganu. Dan lain-lain sebagainya.
Sehingga dari sinilah website template responsive datang bak pahlawan menyelamatkan orang-orang yang kesusahan dalam melihat informasi di halaman website. Responsive itu seperti fluid, sifat air yang menyesuaikan wadahnya. Ketika menggunakan PC atau Notebook maka dia menyesuaikan tampilannya, begitu juga ketika mengakses menggunakan tab/ipad, dan begitu juga ketika mengakses menggunakan mobile smartphone. Responsive di picu oleh adanya fitur media, fitur terbaru dari CSS3, meskipun ada juga beberapa yang menggunakan javascript deteksi resolusi layar untuk membuat template responsive.
CSS 3 mempermudah Anda membuat ramuan menghasilkan template yang responsive, namun beberapa developer membuat jadi lebih mudah menggunakan Responsive Framework. Framework yang menjadikan proses pembuatan template responsive jauh lebih cepat dan mudah. Ada 9 framework yang penulis anjurkan.

1. Foundation

Ini adalah salah satu responsive framework favorit saya, karena dengan foundation dari zurb, pembuatan template yang responsive jauh lebih mudah dan jauh lebih cepat. Tidak aneh mereka menyisipkan “It’s now crazy fast for designers and engineers to code and learn too.” di website officialnya. Membuat versi desktop dan mobile jauh lebih optimal dan tidak berantakan. Kunjungi websitenya http://foundation.zurb.com/

2. Gumby

Gumby merupakan framework pembuatan template yang fleksibel, menggunakan luas 960px, jika Anda yang biasanya menggunakan 960grid system dipastikan familiar dengan gumby, dan biasanya memang lebar 960px itu adalah lebar yang paling banyak dipilih oleh para web designer. Gumby menggunakan SASS, pengembangan dari CSS3. Dengan gumby anda bisa membuat template responsive untuk desktop maupun untuk mobile. Patut di coba, kungjungi websitenya langsung di http://gumbyframework.com/

3. Bootstrap

Bootstrap dikenal lebih dekat dengan nama Twitter Bootstrap, mengapa twitter? Karena memang framework ini dibangun oleh para webdesigner yang bernaung dalam perusahaan twitter. Bootstrap menjadi populer dan banyak website yang menggunakan twitter bootstrap ini. Sama dengan framework lainnya dengan bootstrap Anda bisa membuat jenis tampilan website apapun yang Anda inginkan. Silahkan dicoba, http://twitter.github.io/bootstrap/

4. Unsemantic

Unsemantic melanjutkan 960grid system, dibangun menggunakan SASS dan Compas, Dengan bantuan adaptjs membuat tampilan website Anda menjadi responsive. Unsemantic pun support cross browser. Tampilan didesktop sama persis jika dilihat di semua browser. Silahkan mengunjungi websitenya langsung http://unsemantic.com/. Yang jadi nilai tambah adalah Unsemantic fokus kepada SEO, membantu template ini menjadi lebih seo friendly.

5. Skleton

Skleton bukan hanya sebagai framework, tapi benar-benar mendudukan dirinya sebagai kerangka kerja, dan acuan kerja. SEhingga pembuatan halaman website jadi jauh lebih cepat. Tersedia untuk semua tipografi, grid, button, alat-alat yang Anda butuhkan dalam mendesain halaman website. Silahkan kunjungi websitenya http://www.getskeleton.com/

6. HTML5 BoilerPlate

Di tahun 2010, boilerplate menjadi pionir open source dalam pengembangan halaman website, dan tentunya di tahun itu pulalah boilerplate menjadi sangat populer di mata banyak web designer. Dengan boilerplate Anda bisa membuat halaman html5 menjadi sangat cepat dan mudah. Dan disupport oleh banyak browser modern. Boilerplate pun mendukung template mobile responsive. Kunjungi di http://html5boilerplate.com/

7. HTML KickStart

Yang menarik dari HTML Kickstart adalah ringan, dan ramping. Kickstart menjanjikan pekerjaan yang lebih cepat bisa dilakukan oleh para pengembang user interface, yang tidak hanya melulu halaman html biasa. HTML Kickstart sizenya kurang lebih hanya 300kb saja. Berbagai keperluan untuk pengembangan halaman html modern sudah tersedia di sana, silahkan di coba http://www.99lime.com/elements/

8. SproutCore

Sproutcore merupakan kerangka kerja front end, yang berfungsi untuk membangun aplikasi berbasis HTML5 dengan sangat cepat. Uniknya sproutcore mengikuti pola arsitektur MVC, yang biasanya diterapkan kedalam framework server scripting. Silahkan kunjungi http://sproutcore.com/ untuk lebih detil

9. Less Framework

Less framework merupakan sebuah kerangka modern yang berfungsi untuk membangun desain halaman yang responsive, Mirip sekali dengan skleton menggunakan grid sebagai pondasinya. Less framework memiliki 4 jenis responsive yakni Desktop, tablet, handphone, dan mobile pada umumnya. http://lessframework.com/


Kurang lebih itu adalah framework dalam pembuatan template responsive yang populer digunakan oleh para webdesigner. Kedepannya kita akan bahas bagaimana menggunakannya, satu demi satu.