Secara umum, halaman 404 terdapat di setiap website dengan tujuan yang sama, memberitahu pengunjung bahwa konten yang mereka cari tidak dapat ditemukan. Situasi ini dapat terjadi karena sejumlah alasan. Pengunjung mungkin saja mengetik alamat URL yang tidak benar atau mungkin juga sedang membuka halaman yang telah dipindahkan atau dihapus. Dalam kebanyakan kasus, halaman 404 berisi pesan yang menyatakan bahwa konten yang diminta tidak dapat ditemukan.

Tapi ada cara yang lebih efektif yang bisa dimanfaatkan pada halaman ini. Simak tips penggunaan halaman 404 yang menarik dan user-friendly berikut ini:

1. Gunakan widget Google.

Salah satu cara mudah untuk meningkatkan fungsi halaman 404 Anda adalah dengan Google Webmaster Tools widget 404. Untuk menggunakan fitur ini, salin kode di bawah ini dan letakkan di template halaman 404 Anda:

<script>
  var GOOG_FIXURL_LANG = 'en';
  var GOOG_FIXURL_SITE = 'http://www.example.com'
</ Script>
<script  src = "http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js">
</ Script>

Setelah menambahkan kode di atas, Google secara otomatis akan menangani form pencarian pada halaman tersebut. Dari sisi visual, widget 404 Google tidak begitu menarik. Tetapi karena mudah diinstal, solusi ini bisa jadi alternatif yang tidak merepotkan untuk halaman 404.

2. Rekomendasikan link menuju konten lain yang menarik

Jika widget Google tidak cocok, Anda dapat menyesuaikan halaman 404 Anda dengan memasukkan gambar atau teks yang mewakili brand Anda, serta memberikan informasi relevan yang berguna bagi pengunjung.

Anda dapat memasukkan daftar link menuju konten-konten populer pada situs Anda. Untuk menentukan halaman mana yang paling sering dilihat, gunakan Google Analytics atau aplikasi statistik website lainnya. Dengan begitu, meskipun pengunjung tidak menemukan konten yang dicari, setidaknya mereka bisa mendapati konten lain yang cukup menarik sehingga membuat mereka betah berada pada website Anda.

3. Mengurangi kemungkinan terjadinya error 404.

Perlu diingat bahwa tidak peduli berapa banyak Anda memperbaiki halaman 404 Anda, hal ini masih menjadi satu kelemahan jika dilihat dari perspektif pengunjung yang bisa saja merasa frustrasi karenanya. Bahkan jika pengunjung telah menemukan halaman yang dia inginkan melalui form pencarian pada halaman 404 tersebut, mereka mungkin merasa kerepotan dan bosan.

Langkah pertama untuk membantu meminimalisir error 404 adalah dengan mencari link-link yang sudah tidak terpakai dan bisa memicu error 404. Anda bisa mencoba aplikasi seperti “Broken Link Checker” yang membantu mendeteksi link-link yang rusak pada website Anda. Atau jika Anda menggunakan wordpress, bisa juga mencoba plugin semisal Broken Link Checker ini.

Tapi apa yang harus Anda lakukan jika statistik website menunjukkan bahwa beberapa pengunjung mendapati halaman 404 dari link yang rusak dari website orang lain?

Jika memungkinkan, Anda perlu menghubungi web master situs tersebut dan meminta untuk memperbaiki link menuju website Anda. Jika itu tidak memungkinkan, Anda dapat mengatur 301 redirect di website Anda. Redirect otomatis ini dapat mentransfer semua lalu lintas masuk dari link yang rusak di website menuju satu halaman yang telah ditentukan.

Sebelum masuk ke sesi sharing, Imam (moderator FreSh Surabaya) memperkenalkan forum FreSh Surabaya kepada para peserta yang hadir. Beberapa peserta FreSh Surabaya berasal dari kalangan penulis, animator, game developer, dan lainnya.

Pada penyelenggaraan FreSh Surabaya kemarin, juga hadir tamu dari IMULAI yang diwakili Hari Wijayanto. Hari Wijayanto menjelaskan beberapa hal tentang IMULAI, sebuah kompetisi ide bisnis dalam bidang teknologi informasi. Kompetisi ini sudah digelar empat kali. Beberapa pemenang IMULAI 3 berasal dari Surabaya.

Masuk ke sesi utama, Ami Raditya menjadi presentator pertama. Ami memulai dengan berkilas balik ke masa sepuluh tahun yang lalu, saat Ami menciptakan sebuah dunia (fantasi) yang ia namai Vandaria. Ia menulis novel Vandaria, membuat setting dunia, membuat rentang masa, menghidupkan tokoh, menciptakan konflik yang menarik.

Setelah lama tidak tersentuh, Ami kembali menghidupkan Vandaria. Ia mengajak orang-orang kreatif (para penulis, komikus, animator, game developer) untuk ikut menghidupkan tokoh dan mewarnai dunia Vandaria. Ami memang sudah mengeset dunia Vandaria untuk bisa dimasuki oleh tokoh-tokoh karakter baru. Ia sudah menciptakan pakemnya.

Ami sudah membuat trilogi novel untuk dunia Vandaria. Novel vandaria bahkan pernah dinobatkan sebagai novel fantasi paling laris di Indonesia.

Setelah sesi sharing Ami selesai, giliran Adhicipta yang bercerita tentang karya terbarunya, Andventures of Wanara. Anoman, yang menjadi tokoh utama dalam komik, film animasi, dan game yang dikembangkan Adhicipta dan tim.

Karya ini sudah dikerjakan sejak lama. Adhicipta mencari kreator-kreator hebat dari Surabaya untuk diajak dalam tim-nya. Ketika tidak ia temukan di Surabaya, ia akan mencari dari kota lain, asalkan masih dari Indonesia. Ia menginginkan Adventures of Wanara dikerjakan oleh talenta-talenta terbaik bangsa Indonesia.

Adhicipta sharing tentang proses bagaimana mengembangkan sebuah karya yang hebat sekaligus menjual. Adhicipta menceritakan Animotion Way. Diawali dari dream > visualize > communicate > produce > sales & service.

Diawali dari sebuah mimpi yang dipupuk dan ditekadkan untuk diwujudkan. Mimpi itu kemudian divisualisasikan agar benar-benar bisa dibaca. Mimpi itu perlu dikomunikasikan, agar bisa dipahami dan tidak mandeg. Setelah semua konsep dan perangkat siap, mimpi siap diproduksi. Produksilah produk yang benar-benar berkualitas. Dan terakhir yang penting, jual produk itu dengan strategi yang tepat dan pelayanan yang baik. Produk yang hebat adalah produk yang tidak hanya baik tetapi juga diterima pasar.

Bonnie (yang juga tim dari Animotion) pada kesempatan pesentasinya banyak sharing tentang pentingnya strategi bisnis untuk pengembangan sebuah produk. Menurutnya, jika membuat sebuah produk, buatlah yang seakan tidak bisa disaingi. Buatlah produk yang benar-benar hebat.

Akan tetapi, ketika mengembangkan produk, jangan lupa untuk menghandle konsumen. Konsumenlah yang akan menentukan produk itu benar-benar bermanfaat atau tidak, layak dibeli atau tidak. Jangan membuat konsumen kecewa. Bahagiakanlah konsumen dengan produk Anda.

Terkait bagaimana mewujudkan mimpi, Bonnie punya tips menarik. Yaitu, bermimpilah yang besar, berkumpul dengan komunitas yang pas dan mendukung, dan terakhir beraksilah. “Mimpi lah yang besar sekalian, dan punyai komitmen untuk menggapai mimpi itu”, kata Bonnie.

Setelah sesi sharing, dilanjutkan sesi diskusi yang berlangsung sekitar satu jam. Banyak peserta FreSh Surabaya yang bertanya dan ikut berbagi pemikiran. Acara ditutup dengan foto bersama dan pembagian hadiah bagi pemenang kontes tweet dari @FreShSby dan beberapa peserta yang beruntung.

Perlu diperhatikan oleh para pemula yang ingin berkecimpung dalam dunia web design, hanya karena Anda tahu cara menggunakan Photoshop, Illustrator atau Indesign dengan sangat baik, tidak otomatis menjadikan Anda seorang desainer.

Terkadang, banyak dari kita terlalu banyak mengandalkan alat/software dan melupakan apa yang sebenarnya membuat desain itu berkualitas. Desainer yang benar-benar hebat tidak berada pada posisi pengguna. Bagi mereka, proses desain telah dimulai jauh sebelum mereka membuka Photoshop.

Penyakit “User Designer”

Penyakit ini biasanya menginfeksi para desainer pemula: desainer yang baru lulus kuliah atau pertama kali bekerja dalam bidang ini. Mereka memulai karir sebagai desainer tipe “pengguna” dengan mempelajari bagaimana menggunakan sebuah peralatan desain dan mulai ketergantungan pada alat-alat tersebut. Mereka mulai menyadari bahwa aplikasi tersebut dapat melakukan begitu banyak hal, dan mulai meninggalkan buku sketsanya. Setiap kali datang ide kreatif, mereka segera membuka Photoshop dan mulai memainkan ide tersebut dengannya.

Penyakit semacam ini merupakan pembunuh para desainer. Pembunuh keterampilan dan yang paling penting adalah sebagai pembunuh imajinasi. Tetapi terkadang, ibarat cacar air, penyakit “user designer” ini seolah menjadi sesuatu yang harus dialami setiap orang setidaknya sekali dalam hidupnya. Begitu juga dengan para desainer yang tak dapat dipungkiri, banyak mengalami hal seperti ini pada masa awal terjun ke dalam dunia desain.

Efek Penyakit “User Designer”

Menjadi seorang desainer hebat tidak berarti kita hanya belajar bagaimana menggunakan peralatan desain, melainkan harus mampu membuat karya yang bagus tanpa tergantung pada satu jenis peralatan saja. Sering kali kemahiran kita dalam menggunakan sebuah tool desain seakan menjadi penopang bagi kita, sangat membantu, tetapi kadang menghambat perkembangan skill kita sendiri.
Ada beberapa efek buruk jika membiarkan diri pada ketergantungan untuk menggunakan sebuah aplikasi sebagai alat bantu utama, alias, menjadi “user designer“.

Efek yang paling jelas adalah hilangnya fleksibilitas dan daya imajinasi. Ketika Anda mulai menggunakan sebuah aplikasi sebagai alat bantu utama dan membiarkannya mengambil alih proses kreatif Anda, saat itulah Anda mulai membatasi ekspresi dengan apa yang hanya mampu  Anda lakukan dalam aplikasi tersebut.

Desain yang sesungguhnya adalah tidak terbatas pada bagaimana Anda dapat membuat sesuatu di Illustrator atau Photoshop, melainkan mengacu pada keberhasilan informasi atau tujuan yang disampaikan oleh desain tersebut dan mampu memenuhi kebutuhan pengguna (atau klien).

Efek lainnya yang juga cukup mengerikan dari penyakit “user designer” ini adalah kecenderungan untuk menjadi “desainer imitasi”. Alih-alih mencari solusi desain yang cerdas untuk klien Anda, akan selalu berpikir bahwa jauh lebih mudah untuk menyalin sebuah website terkenal lalu dengan menggunakan keahlian Photoshop-nya, mereka membuat karya yang serupa dan cenderung menjiplak.

Cara Mengobati

Jika Anda merasakan gejala penyakit “user designer” pada diri Anda, jangan khawatir, ada obatnya. Tergantung pada seberapa jauh penyakit ini telah menyebar pada diri Anda, bisa saja Anda memerlukan proses yang panjang dan sulit untuk pemulihannya. Cara terbaik untuk terbebas dari penyakit ini adalah terus belajar cari kekuatan serta kelemahan Anda dalam bidang desain. Perlu waktu, energi dan yang paling penting kemampuan kita untuk terbuka terhadap ide-ide baru.

Mengatasi ketergantungan berlebih pada software desain dan kecenderungan untuk menjiplak tren yang sedang populer, dapat dimulai dengan kembali pada konsep-konsep dasar berikut:

• memahami prinsip-prinsip dalam desain / elemen-elemen di dalamnya
• pemahaman terhadap apa yang membuat sebuah desain terlihat baik atau buruk
• selalu mencoba hal yang baru; dan jika perlu, Anda harus mengalami kegagalan agar dapat belajar darinya
• jangan pernah menyalin/mencontek sebuah karya, melainkan mencari inspirasi dari karya orang lain tersebut

Mahir dalam menggunakan software desain bukan sesuatu yang buruk, saya tidak mengatakan bahwa Anda tidak harus menghabiskan waktu untuk mempelajari keunggulan yang dapat dimanfaatkan pada sebuah aplikasi. Tapi berhati-hatilah dengannya, jangan biarkan aplikasi-aplikasi tersebut mulai membangun ketergantungan, jadikanlah peralatan tersebut sebagai bagian kecil dari proses kreatif Anda.

Sumber: http://tympanus.net

• Aplikasi Anda dapat mengingat keadaan terakhirnya setelah pengguna menutup browser-nya.
• Anda bisa menyimpan cache aplikasi - jika tidak ada perubahan pada aplikasi/website tersebut, maka tidak perlu lagi memuatnya dari awal, dan tentu saja hal ini akan mempercepat akses website Anda.
• Anda dapat menyimpan preferensi/pengaturan dari pengguna secara lokal - tanpa perlu menyimpannya pada server Anda.

Kini dengan menggunakan fitur Local Storage pada HTML5, Anda dapat dengan mudah memanggil beberapa metode pada objek window.localStorage – dan bahkan bisa mengatur properti-nya secara langsung:

if('localStorage' in window && window['localStorage'] !== null){
    var store = window.localStorage;
    // cara yang valid sesuai panduan API
    store.setItem('sapi','hemeh');
    console.log(
        store.getItem('sapi')
    ); // => 'hemeh'

    // menggunakan shorthand
    store.kambing = 'mbek'
    console.log(
        store.kambing
    ); // 'mbek'

    // shorthand yang lebih singkat
    store['bebek'] = 'kwek'
    console.log(
        store['bebek']
    ); // => 'kwek'
}

Browser yang telah mendukung fitur ini adalah Chrome 4 +; Firefox 3.5 +; IE8 +; Opera 10,5 +; Safari 4 +; iPhone 2.0 +; dan Android 2.0 +.  Data disimpan dengan batas ukuran hingga 5MB data untuk setiap domainnya.

Format Penyimpanan

Secara default, localStorage hanya mendukung string sebagai format penyimpanan. Anda tidak dapat menyimpan hasil perhitungan JavaScript dalam format array atau object.

var sapinya = "sapi-sapi itu sama saja, "+
    "suka melenguh, tetapi"+
    "saya suka susunya";

var sapidet = {
    "kaki":4,
    "tetek":4,
    "makanan":"rumput"
};

window.localStorage.setItem('tentangsapi',sapinya);
console.log(
    window.localStorage.getItem('tentangsapi')
); // => sapi-sapi itu sama saja...

window.localStorage.setItem('detailsapi',sapidet);
console.log(
    window.localStorage.getItem('detailsapi')
); // => [object Object]

Hal ini tentu saja akan sangat membatasi data-data yang ingin Anda simpan. Tetapi Anda bisa memanfatkan JSON untuk solusinya. Contoh:

var sapidet = {
    "kaki":4,
    "tetek":4,
    "makanan":"rumput"
};

window.localStorage.setItem('detailsapi',JSON.stringify(sapidet));
console.log(
    JSON.parse(
        window.localStorage.getItem('detailsapi')
    )
); // => Object { kaki=4, dst...}

Anda bisa menggunakan format lain sebagai solusinya, semisal CSV, pipe |, atau tilde ~, tetapi JSON bagi saya lebih mudah dan banyak browser yang secara native telah mendukungnya. Sebelum Anda mencoba fitur ini, perlu diperhatikan juga tentang beberapa kelemahannya, yaitu:

• Informasi yang tidak memadai tentang kuota penyimpanannya – saat localStorage telah melampaui kuota, Anda hanya akan mendapatkan pesan QUOTA_EXCEEDED_ERR.
• Tidak memiliki fitur yang ada pada cookie, yaitu data yang tersimpan tidak otomatis expired . Mbak Pamela Fox memiliki solusi untuk ini.
• Tidak memiliki enkripsi data – saat ini, semua data pada fitur ini disimpan dalam format string yang dapat dibaca pada browser.

Referensi: http://24ways.org

Pastikan Bahwa Redesain Merupakan Pilihan Terakhir Anda

Mendesain ulang website Anda mungkin saja memerlukan biaya yang tidak sedikit, sehingga ada banyak faktor yang harus Anda pertimbangkan ketika melakukan redesain website. Jadi pastikan apakah redesain website tersebut merupakan suatu keharusan atau apakah redesain tersebut hanya akan menjadi sesuatu yang tidak perlu tanpa hasil yang nyata.

Mengapa Perlu Redesain Website?

Tidak dapat dipungkiri bahwa Anda telah mengeluarkan banyak tenaga, waktu, dan uang untuk desain website Anda yang sekarang. Jadi, Anda hanya akan melakukan redesain website, saat Anda benar-benar merasa bahwa website tersebut memerlukan perbaikan visual karena mungkin pengunjung membutuhkan sesuatu yang baru dari segi visual. Dan perlu diingat bahwa tujuan mendesain ulang website sejatinya adalah untuk pengguna / pengunjung, maka dari itu pastikan bahwa mereka selalu menjadi pertimbangan utama Anda ketika merancang atau mendesain ulang sebuah website.

Tips Redesain Website

Berikut ini beberapa tips untuk membantu Anda meredesain ulang website:

• Untuk website berbasis komunitas, Anda bisa melibatkan pengguna dalam proses redesain website, baik melalui feedback dari mereka atau dengan mengadakan sebuah polling tentang kesan mereka pada redesain website Anda.
• Menjaga elemen utama website Anda berada pada tempat yang sama merupakan cara terbaik untuk memastikan pengguna tidak akan menemukan kesulitan, terutama untuk sistem navigasi website.
• Luncurkan versi beta! Hal ini memungkinkan pengguna untuk menguji website Anda, dan akan memberi gambaran tentang redesain website itu sendiri.Sediakan sarana untuk memberikan umpan balik sehingga Anda dapat memperbaiki website tersebut seperti yang Anda inginkan dan tetap familiar untuk pengunjung setia website Anda.
• Jangan melakukan perubahan signifikan sekaligus. Masih ingat ketika facebook mengubah tata letak mereka dan banyak pengguna mereka menginginkan kembali ke layout yang lama? Anda harus memastikan pengguna untuk terbiasa dengan layout baru dengan membiarkan mereka menggunakan layout lama untuk jangka waktu tertentu. Baru kemudian secara perlahan lakukan perubahan bertahap pada proses redesain tersebut.
• Beri penjelasan tentang redesain website Anda kepada pengguna. Sebelum mengubah website Anda secara keseluruhan, beritahu alasan Anda tentang perlunya redesain website tersebut kepada pengguna.
• Sediakan panduan untuk pengguna / pengunjung. Terutama jika Anda membuat perubahan besar-besaran, bantu pengguna Anda untuk belajar menggunakan website yang baru. Baik melalui sebuah tutorial dalam bentuk teks maupun video.
• Jika setelah Anda melakukan perubahan website dan ternyata gagal mencapai tujuan utama Anda, tidak ada salahnya untuk kembali menggunakan format dan layout website Anda yang lama. Apalagi jika banyak terjadi keluhan negatif dari pengguna tentang redesain tersebut.
• Untuk tips redesain yang lebih mendalam bagi para web desainer bisa disimak juga pada artikel Tips dalam Me-redesain Website

Mendesain sebuah website bukan merupakan hal yang mudah dan begitu juga dengan proses redesain-nya. Merupakan hal yang sangat baik untuk meminta pendapat orang yang peduli dengan website Anda, yang tidak lain adalah pengunjungnya sendiri. Dengan begitu, Anda bisa melihat apakah redesain website memang diperlukan. Jika ya, minta pendapat mereka lagi tentang perubahan apa yang perlu dilakukan. Jika hal ini dilakukan dengan baik, tentu saja pengunjung website Anda akan menjadi pengguna setia dan pada akhirnya akan mengundang lebih banyak pengguna.

Gambar: gibraltardatabases.com

1. Pastikan Konten Website untuk Selalu Rapi dan Diperbarui Secara Teratur

Ketika sebuah website telah memiliki ratusan atau bahkan ribuan halaman konten, kadang banyak bagian dari konten tersebut yang ketinggalan zaman. Selama proses maintenance, Anda harus memeriksa secara berkala isi statis dari sebuah website yang mungkin memerlukan koreksi atau update. Untuk konten semisal berita, Anda tidak perlu memperbaruinya karena memang sudah sepantasnya konten tersebut menjadi usang. Tetapi sebuah website mungkin juga mengandung artikel yang selalu dibutuhkan sepanjang masa, tanpa ada jangka waktu untuk menjadi usang. Untuk konten seperti itu, solusi terbaik adalah dengan memasukannya pada kategori khusus. Sebagai web developer, proses maintenance konten mungkin tidak termasuk dalam tanggung jawab Anda, tetapi jika Anda memiliki blog pribadi, pemeliharaan konten harus selalu dilakukan pada maintenance rutin.

• Kebijakan Privasi, Ketentuan Layanan dan Syarat & Kondisi: Masalah hukum bisa saja timbul jika hal-hal yang disebutkan dalam kebijakan privasi tidak lagi mencerminkan standar perusahaan saat ini. Kajian berkala atas dokumen hukum harus menjadi bagian penting dari maintenance rutin Anda.
• Dokumentasi Software: Dokumentasi untuk produk atau jasa harus diperbarui secara berkala berdasarkan versi software terbaru atau perbaikan bug yang dilakukan. Jika memungkinkan, jadwal maintenance harus mencakup perubahan berkala, koreksi dan update pada dokumentasi tersebut, baik untuk format online dan offline-nya.
• Rawat blog Anda: Jika Anda mengundang pembaca untuk berpartisipasi lebih aktif diblog Anda, Anda harus memastikan bahwa berita, artikel atau posting blog tidak memiliki komentar spam. Seringkali, Anda perlu secara manual menghapus komentar yang berisi link ke website yang mencurigakan. Selain itu, perlu juga untuk mempertimbangkan kembali tag yang Anda gunakan. Beberapa tag dapat dimodifikasi atau diubah untuk lebih relevan pada tema artikel Anda. Dan mungkin juga Anda perlu menonaktifkan komentar untuk artikel-artikel yang memiliki traffic tinggi, untuk menghindari komentar spam.

2. Pengujian Kompatibilitas Browser

Gambar: efflux.co.in

Pastikan bahwa semua bagian dari website Anda berjaan dengan benar pada berbagai macam browser. Tugas ini harus dimasukkan dalam rutinitas maintenance Anda. Perlu diingat juga bahwa kode HTML yang semantik dapat memudahkan kita dalam hal kompatibilitas browser. Anda mungkin perlu menguji secara manual misalnya untuk versi terbaru dari IE, Firefox, Opera, Chrome dan Safari. Jangan lupa juga untuk menguji website Anda secara teratur pada OS yang berbeda, setelah melakukan perubahan pada kode dan isinya. Situs Anda mungkin bekerja dengan baik dengan Safari versi Windows, tetapi tidak begitu baik dengan Safari pada Mac.

3. Mengevaluasi dan Memvalidasi Kode Sesuai Web Standards

Biasanya, proses maintenance juga mencakup pengujian untuk validasi halaman website, terutama setelah memperbarui atau menambah konten website. Validasi ini meliputi kode styling CSS dan juga markup HTML.

Markup HTML yang ‘ringan’ dan ‘bersih’.

Periksa apakah pada elemen website Anda terdapat kode yang dapat disederhanakan. Seorang web developer kadang menderita penyakit yang disebut”Divitis”, yaitu kecenderungan untuk menggunakan <div> berlebihan atau tidak tepat. Dalam beberapa kasus, Anda dapat menghapus beberapa tag <div> tersebut jika memang tidak diperlukan. Tag <div> memang sering diperlukan dalam kode HTML Anda. Tapi pada umumnya, kode yang dirancang dengan baik akan tetap fleksibel tanpa banyak menggunakan tag <div>.

Selain itu perlu diperhatikan juga tentang penggunaan atribut. Apa yang terjadi jika Anda memiliki terlalu banyak atribut dalam kode Anda? Markup HTML akan lebih mudah untuk dikelola dan terlihat lebih bersih jika Anda menghindari penggunaan id dan class  yang berlebihan. Dengan menggunakan teknik inheritance pada CSS, Anda tidak perlu menargetkan setiap elemen pada kode HTML untuk mengatur tampilannya. Hal ini akan membuat kode Anda jauh lebih mudah dikelola.

Gambar: smashingmagazine.com

Memperbaiki kode Javascript

Jika Anda banyak menggunakan custom JavaScript, terutama jika Anda menggabungkannya dengan beberapa library JavaScript, perbaikan dan optimisasi Javascript tentu sangat bermanfaat agar bisa berjalan dengan sempurna.

Optimisasi Kode CSS

Setelah melalui beberapa proses development yang berkelanjutan, kode CSS bisa menjadi terlalu besar, mungkin juga sulit dibaca dan dikelola. Jika Anda memiliki pemahaman kuat tentang konsep CSS, semua penambahan atau perbaikan CSS yang diperlukan di masa mendatang tentu dapat dilakukan dengan lebih efisien. Dengan banyaknya kode CSS yang ada, terkadang akan terjadi redudansi yang bisa menghambat kinerja website itu sendiri.

Sebelum mengoptimalkan kode CSS, Anda harus yakin bahwa kode CSS tersebut valid. Bug pada kode CSS dapat menimbulkan masalah yang tidak diinginkan jika Anda memutuskan untuk melakukan optimisasi secara otomatis menggunakan tool.

Anda bisa juga secara manual mengoptimalkan kode CSS untuk memperkecil kesalahan dan masalah yang timbul jika menggunakan metode otomatis. Anda dapat menggabungkan beberapa kode CSS untuk mengurangi HTTP request yang tidak perlu. Selain itu, Anda mungkin bisa mengubah nama id atau class agar lebih efektif. (Sebagai contoh, menggunakan ”promo-box” sebagai nama class lebih tepat dibandingkan dengan “red-box” karena warna bisa saja berubah sesuai kebutuhan).

4. Meningkatkan Aksesibilitas

Jika Anda telah memvalidasi markup dengan benar dan menggunakan teknik yang baik dalam development sebuah website, maka kemungkinan besar, konten website Anda dapat diakses oleh mereka yang mengunjungi situs tersebut menggunakan teknologi bantu seperti screen reader. Tapi karena konten yang terus diupdate juga dapat mempengaruhi, maka evaluasi aksesibilitas sebuah website harus disertakan dalam jadwal maintenance.

Mengevaluasi Akses Mobile

Masih banyak pemilik website yang enggan mengembangkan versi mobile dari situsnya, baik untuk menghemat waktu dan juga karena banyak perangkat mobile terkini yang cukup handal dalam menampilkan website sesuai versi desktop-nya. Meskipun demikian, itu saja bukan jaminan. Anda harus tetap menguji situs Anda dengan menggunakan mobile browser populer dan platform terkini, seperti Chrome di Android dan Safari di IOS.

Jika versi mobile Anda sudah berjalan dengan baik, Anda dapat terus melakukan evaluasi pada konten terkini dan membuat penyesuaian yang diperlukan.

5. Meningkatkan SEO

Sebagai admin website, Anda mungkin tidak terlalu mahir pada tugas yang berhubungan dengan SEO. Namun, jika itu adalah proyek pribadi, Anda bisa melakukannya sendiri.

Kode semantik dan terstruktur dengan baik secara otomatis mendapatkan banyak manfaat pada SEO, bahkan jika Anda menggunakan teknik optimasi biasa. Seiring berjalannya waktu, penggabungan dari berbagai metode optimasi dapat meningkatkan peringkat situs Anda.

Secara umum pada optimasi SEO secara onsite bisa dilakukan dengan perbaikan pada frase kata kunci, deskripsi meta dan tag title yang harus dilakukan secara teratur, seiring dengan berkembangnya website tersebut. Jangan lupa juga untuk mengoptimalkan judul halaman web dan struktur link internalnya.

Kesimpulan

Membiarkan website Anda begitu saja, beberapa waktu setelah peluncuran awal adalah seperti dengan membeli mobil baru tanpa mengganti olinya, yang akhirnya, mobil Anda akan mengalami kerusakan mesin.

Pemeliharaan situs secara berkala sangat berperan untuk memastikan keberhasilan jangka panjang dari website Anda.

Google sendiri memiliki panduan-panduan semacam ini yang harus diterapkan oleh pengguna Google Code-nya. Pada artikel kali ini, akan saya sampaikan beberapa panduan dari Google Code untuk penulisan kode HTML dan CSS. Gaya penulisan ini bukan hanya untuk digunakan pada Google Code, Anda bisa juga menerapkan panduan ini untuk aplikasi di luar itu.

Hilangkan URL protocol pada media yang diambil dari luar.
Hilangkan protocol ( http:, https: ) dari URL yang merujuk ke suatu gambar atau file media lainnya, style sheet, dan script kecuali file-file tersebut tidak tersedia pada kedua jenis protokol.

Menghilangkan protokol -yang membuat URL bersifat relatif- selain bisa mengindarkan dari masalah yang berkaitan dengan konflik antar konten, juga bisa menghemat ukuran file dalam skala kecil.

Contoh:

<script src="//www.google.com/js/gweb/analytics/autotrack.js"></script>

atau

.example {
  background: url(//www.google.com/images/example);
}

Sediakan konten alternatif untuk multimedia.
Untuk elemen multimedia, seperti gambar atau video, pastikan untuk menyediakan konten alternatif yang bisa diakses. Untuk gambar, misalnya dengan menggunakan teks alternatif (alt) atau dengan menyediakan transkrip untuk konten video.

Menyediakan konten alternatif merupakan faktor penting dalam hal aksesibilitas. Untuk gambar yang jika menggunakan atribut alt akan menyebabkan redundansi, atau gambar yang tujuannya hanya sebagai elemen dekoratif, Anda bisa menggunakan alternatif kosong dengan menambahkan atribut alt = “”.

Hilangkan atribut type untuk tag style dan script.

Jangan menggunakan atribut type untuk style sheet (kecuali tidak menggunakan CSS) dan skrip (kecuali tidak menggunakan JavaScript).
Menentukan atribut type dalam konteks ini tidak diperlukan karena HTML5 telah mengatur text/css dan text/javascript sebagai nilai default-nya. Hal ini juga aman untuk digunakan pada browser lama.
contoh:

<link rel="stylesheet" href="//www.google.com/css/maia.css">

atau

<script src="//www.google.com/js/gweb/analytics/autotrack.js"></script>

Gunakan atribut ID dan Class yang umum dan bermakna

Pastikan untuk selalu menggunakan ID dan class yang menggambarkan tujuan dari elemen yang bersangkutan, atau menggunakan kata-kata yang umum.Nama-nama yang spesifik dan menggambarkan tujuan dari elemen harus diutamakan, sedangkan nama-nama umum hanya digunakan sebagai fallback untuk elemen yang tidak memiliki makna tertentu.

Contoh:

/* Recommended: specific */
#gallery {}
#login {}
.video {}

/* Recommended: generic */
.aux {}
.alt {}

Gunakan shorthand property jika memungkinkan

CSS menyediakan berbagai shorthand property (seperti font) yang harus digunakan jika memungkinkan, bahkan meski property tersebut hanya memiliki satu value.
Menggunakan shorthand property berguna untuk efisiensi kode dan agar mudah dipahami.
Contoh:

/* Recommended */
border-top: 0;
font: 100%/1.6 palatino, georgia, serif;
padding: 0 1em 2em;

Pisahkan kata pada ID dan class dengan tanda hubung “-”

Contoh:

/* Recommended */
#video-id {}
.ads-sample {}

Menyusun deklarasi rule CSS secara abjad

Masukan deklarasi rule CSS dalam urutan abjad untuk menjaga konsistensi dengan cara yang mudah diingat.

Contoh:

background: fuchsia;
border: 1px solid;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
color: black;
text-align: center;
text-indent: 2em;

Selengkapnya: http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml

Artikel ini akan menjelaskan secara sekilas tentang apa itu Style Tiles, mengapa Anda harus menggunakannya dan bagaimana memasukkannya ke dalam proses desain Anda. Simak dengan seksama karena boleh jadi teknik ini akan mengubah cara Anda mendesain website selama ini.

Apa Sih Style Tiles itu?

Style Tiles merupakan sebuah cara untuk mengembangkan identitas visual sebuah website, tanpa proses yang rumit seperti pada tahap pembuatan mockup. Ide tersebut berasal dari Samantha Warren,seorang desainer yang sangat berbakat dan blogger di Badass Ideas.

Berikut salah satu contoh yang diambil dari Style Tiles:

Jika Anda berjiwa desainer, dengan gambar di atas, Anda akan dapat segera melihat kegunaan dari alat ini. Sangat sederhana dan sangat membantu. Banyak keputusan penting telah dibuat pada tahap ini, baik tentang tipografi, styling warna tombol dan sebagainya. Jika kita membuat sebuah website berdasarkan teknik ini, akan banyak muncul ide yang kuat tentang gaya visual yang akan kita capai.

Berkebalikan dengan Konsep Wireframe

Pada websitenya dijelaskan, Style Tiles berada di antara konsep Mood Board, yang terlalu samar, dengan konsep mockup, yang terlalu tepat. Tetapi secara sederhana, kita bisa menganggapnya sebagai sisi lain dari wireframes.

Coba Anda pikirkan sejenak, tujuan wireframes adalah fokus pada tata letak website. Anda hanya berpikir tentang bagaimana sebuah website akan disusun, berapa rasio ukuran antara elemen satu dengan lainnya, dan sebagainya. Menggunakan wireframe yang sederhana memungkinkan Anda untuk secara cepat mengembangkan banyak ide, karena Anda tidak terganggu oleh hal-hal seperti pilihan warna, pola background, tipografi, maupun komposisi gambar.

Style tile merupakan kebalikan dari konsep tersebut, yang berarti menjadi pelengkap sempurna untuk proses ini. Di sini Anda bisa menyimpan dulu ide-ide tentang tata letak dan benar-benar fokus pada apa yang disebut sebagai “brand feel”, yaitu keputusan-keputusan pada desain yang akan memberikan identitas unik pada sebuah website.

Mengapa Anda Harus Menggunakan Style Tiles?

Setelah Anda memahami konsep dari Style Tiles, mari kita membahas beberapa alasan utama yang harus Anda pertimbangkan untuk menggabungkannya ke dalam alur kerja Anda.

Mempercepat Pengembangan Ide-ide Visual

Alasan pertama yang membuat Style Tiles ini keren adalah, Anda bisa menerapkan konsep ini dalam waktu yang relatif singkat. Sebuah mockup mungkin bisa menghabiskan berjam-jam atau bahkan berhari-hari untuk menyelesaikannya, sedangkan dengan Styles Tiles hanya memerlukan  ide-ide yang relatif lebih kecil tapi penting, yang akan diterapkan nanti pada  porsi yang lebih besar pada tahap selanjutnya.

Hal ini berarti Anda dapat dengan mudah membuat tiga hingga lima ide yang unik untuk sebuah website, kemudian kita bisa mengambil bagian-bagian yang paling bagus atau bisa juga dengan konsep mix match dari setiap Style Tiles tersebut untuk mendapatkan hasil yang diinginkan.

Feedback Klien Dapat Diterapkan dengan Lebih Mudah

Dengan Style Tiles, Anda mengikutsertakan klien pada tahap awal dalam proses desain. Tunjukkan kepada mereka beberapa Style Tile yang berbeda dan mereka akan segera mendapat gambaran awal dari konsep desain nantinya.

Pada tahap ini, kita bisa dengan sangat mudah untuk membuat perubahan kecil atau perubahan besar sekalipun, tanpa merasa sudah menyia-nyiakan banyak waktu dan anggaran.

Merupakan Alternatif Sempurna untuk Konsep Desain yang Responsive

Seiring dengan makin populernya desain yang responsive, para desainer, mau tidak mau harus memikirkan kembali alur kerja mereka. 

Sebagai alternatif, Style Tiles memungkinkan Anda untuk menentukan tampilan elemen website tanpa khawatir tentang ukuran perangkat tertentu. Setelah Anda mendapatkan konsep visual yang matang, Anda dapat dengan mudah menerapkannya pada desain yang responsive.

Anda tertarik untuk menggunakan konsep ini pada proses desain? Silakan mempelajari lebih dalam tentang Style Tiles di http://styletil.es/

Jangan Me-redesain Untuk Kepuasan Diri Sendiri

Tidak peduli apa yang terjadi, jangan biarkan diri Anda menjadi pengambil keputusan tertinggi dari pekerjaan desain Anda. Anda tidak mendesain ulang website untuk kenyamananAnda sendiri. Anda tidak mengganti warna tombol dari biru menjadi merah hanya karena Anda tidak suka biru. Anda melakukannya karena Anda ingin pembaca Anda untuk menghargai desain ulang situs web secara keseluruhan. Anda melakukannya untuk audiens Anda. Jelas, gan?

Ketika Anda mendesain ulang sebuah website, maka sebelum meluncurkan situs baru tersebut, tanyakan ke beberapa orang, misal teman Anda atau buat survey kepadan pengunjung website, apakah desain baru tersebut tampil menarik dan sesuai dengan situasi? Saya tahu bahwa tidak mungkin untuk mendapatkan hasil survey yang tepat, tetapi setidaknya Anda bisa mendapatkan wawasan yang lebih baik. Ada sebuah cerita yang sangat menarik. Meskipun hal ini tidak secara langsung terkait dengan redesain website:

Sebelum meluncurkan Google Wave untuk publik, Google merilisnya secara private kepada beberapa karyawan saja. Para tester Google Wave ini sejatinya adalah sekelompok besar kalangan nerds yang mereka pikir sangat cocok dengan konsep Google Wave. Setelah petinggi Google menemukan bahwa Google Wave ini sukses di kalangan karyawannya, mereka memutuskan untuk meluncurkan Google Wave untuk publik. Hasilnya, seperti kita semua tahu … Google Wave menjadi  bencana bagi Google. Hal ini karena Google berasumsi bahwa karyawan mereka seperti masyarakat pada umumnya, yang akan menggunakan Google Wave tersebut.

Sudah paham? Jika Anda mendesain ulang untuk kepuasan Anda atau hanya sebagian orang saja, bukan pengunjung website pada umumnya, sudah pasti Anda akan mengacaukannya.

Jangan Sampai Kehilangan ‘Jiwa’ Website Anda

Sebuah situs website bisa saja melakukan redesain dalam kurun hanya 10 hari tanpa peduli tentang kehilangan banyak pengunjung atau apa pun, tetapi jika website tersebut berbasis pengunjung yang setia dan berkomitmen, maka desain ulang harus direncanakan dengan matang. Setelah Anda yakin bahwa desain ulang adalah suatu keharusan untuk website Anda, maka pastikan bahwa Anda memilih desain yang mengubah tampilan  tanpa menghilangkan ‘feel‘ dari website tersebut. Kita harus memahami bahwa ‘jiwa’ dari sebuah website itu penting untuk mempertahankan basis pengguna lama. (Jadikan kasus redesain Kaskus sebagai contoh, yang meredesain website-nya habis-habisan, dan menghilangkan kesan awal yang telah melekat pada user-user lamanya sehingga banyak menuai kritik negatif dari pengunjung setianya).

Redesain website tidak harus dibuat sedemikian rumit sehingga para pengunjung harus menghabiskan waktu ekstra untuk memahami lokasi baru dari konten favorit mereka.

Lihat juga contoh berikut:

Beberapa waktu lalu, TechCrunch meluncurkan kembali situs web mereka dengan tampilan yang sama sekali baru. Selama beberapa hari setelah peluncuran, meskipun TechCrunch mendapat feedback negatif dari banyak kritikus karena terlalu banyak menggunakan warna hijau, tetapi para pengunjung dapat dengan cepat menyesuaikan diri dengan desain baru. Yang terjadi adalah pengunjung begitu terbiasa dengan tampilan lama TechCrunch sehingga mereka tidak bisa menyesuaikan diri sendiri secara langsung dengan desain baru tapi, mereka bisa segera melihat bahwa hanya sedikit saja tampilan yang berubah.

Kurangi Konten yang Tidak Terlalu Berguna

Seiring berjalannya waktu, para webmaster akan menyadari bahwa beberapa konten dapat dihilangkan dari website mereka. Tidak mudah memang, untuk membuat suatu perubahan dengan cepat tetapi proses redesain akan memberikan kesempatan lebih kepada webmaster untuk dapat menganalisa isi dari website mereka. Kita harus memahami bahwa konten memiliki semacam usia. Semakin lama, sebuah konten pun bisa menjadi ‘tua’ dan menjadi tidak berarti.

Saat ini, redesain banyak berfokus pada tampilan konten yang minimalis. Maka dari itu, tampilan konten harus dipertimbangkan saat me-redesain sebuah website.

Hindari Menjiplak Pesaing

Kadang-kadang kita terbuai terlalu jauh oleh keberhasilan pesaing dan akhirnya menjiplak mereka. Secara tidak langsung, banyak dari kita berasumsi bahwa jika kita menciptakan sesuatu yang persis seperti pesaing kita, maka kita bisa mengalahkan mereka, atau setidaknya akan sukses seperti mereka. Faktanya, konsep semacam itu tidak akan terjadi seperti yang Anda bayangkan!

Kita harus memahami bahwa pembaca memiliki bermacam kesan untuk sebuah situs web dan sentuhan khusus yang unik-lah yang membuat mereka ‘terikat’  dan selalu tertarik dengan website tersebut. Jika sebuah website mulai menjiplak website lain, maka apa gunanya mengunjungi situs tersebut? Sebaliknya, pembaca akan lebih memilih pesaing kita. Be original!

Sumber: http://designmodo.com

FreSh Surabaya bulan ini akan menampilkan orang-orang hebat nan kreatif di balik Vandaria Saga dan The Adventures of Anoman.

Ini sedikit deskripsi tentang karya mereka:

Satu dekade lalu, pada tahun 2000, A. Raditya melahirkan sebuah genre baru bernama ‘role playing novel’ lewat karyanya yang berjudul Holy Knights. Seusai dengan Holy Knights, Raditya kembali menelurkan karya kedua. Kali ini dengan konsep yang lebih matang, lebih spektakuler, lebih massive. Karya ini adalah sebuah konsep dunia bernama Vandaria. 

Vandaria memiliki fanbase besar dan amat loyal. Tersebar di seluruh penjuru Nusantara. Terdiri atas berbagai macam produk. Mulai dari novel, komik, video game, hingga permainan kartu. Memiliki dukungan media yang sangat kuat, juga berotot di jejaring sosial.

The Adventures of Anoman (AoA) adalah kisah petualangan Anoman putra dari Dewi Anjani dan Raja Para Dewa – Batara Guru. Dalam komik ini Anoman adalah tokoh sentral bersama para sahabatnya, Macan Loreng, Lembu Kendhil, Laksmi & Baning menjalani petualangan. 

Anoman nantinya juga akan hadir dalam bentuk komik online dan cetak serta dipersiapkan versi animasi pendek dan game novel. AoA adalah juara Indigo Award 2011.

Para pembicara FreSh Surabaya yang akan berbagi ilmu dan pengalaman tentang bagaimana mencipta dunia fantasi, membuat karakter, cerita, dalam berbagai media seperti: novel, komik, film animasi, dan lainnya, yaitu: 
Ami Raditya (@ami_raditya)
Adhicipta R. Wirawan (@mechanimation)

Waktu dan tempat
Kamis, 26 April 2012
Pukul 18.30-21.30
Di Rodo Coffee Jl. Arif Rahman Hakim 36A , Klampis, Surabaya. Deket ITATS. 

Acara ini gratis dan terbuka untuk umum.
Free welcome drink.
Terbatas untuk 40 peserta.

Daftar di sini: www.freshsurabaya.com/event-reg/