Share/Bookmark

Share/Bookmark

Keuntungannya:

• Koleksinya sudah cukup banyak — tidak perlu repot-repot upload lagi kalau mau memutar lagu-lagu yang sudah ada di YouTube
• Tidak menguras bandwidth hosting — kalau menggunakan hosting sewaan dengan bandwidth terbatas
• Lagu tidak langsung dimainkan, harus press play dulu — ini adalah opsi yang bagus karena tidak semua pengunjung mau mendengarkan suara dari situs yang dikunjunginya, kecuali yang bersangkutan memang mau mendengarkannya

Kekurangannya:

• Ada video terputar — yang kadang tidak diperlukan

Trik

Supaya hanya player control yang terlihat dan menyembunyikan video:

• Ambil kodenya, misal:

  <object width="425" height="344">
<param name="movie"
value="http://www.youtube.com/v/T09hBGGpSjk&hl=en&fs=1">
</param>
<param name="allowFullScreen"
value="true"> </param>
<param name="allowscriptaccess"
value="always"> </param>
<embed src="http://www.youtube.com/v/T09hBGGpSjk&hl=en&fs=1"
type="application/x-shockwave-flash"
allowscriptaccess="always"
allowfullscreen="true" width="425" height="344">
</embed> </object>


• Modifikasi sedikit, height jadikan 25, width sesuaikan dengan layout (opsional), allow full screen = false (opsional)

  <object width="500" height="25">
<param name="movie"
value="http://www.youtube.com/v/T09hBGGpSjk&hl=en&fs=1">
</param>
<param name="allowFullScreen" value="false"> </param>
<param name="allowscriptaccess" value="always"> </param>
<embed src="http://www.youtube.com/v/T09hBGGpSjk&hl=en&fs=1"
type="application/x-shockwave-flash"
allowscriptaccess="always"
allowfullscreen="false" width="500" height="25">
</embed> </object>

Jadinya seperti ini:

Share/Bookmark

sIFR atau Scalable Inman Flash Replacement, sesuai namanya menggunakan font yang diembed ke dalam file Flash (.swf).

• Kelebihan: teks tetap bisa di-select seperti layaknya teks normal. Setup lebih mudah.
• Kekurangan: agak lambat dan tergantung pada plugin flash di browser. Harus bikin .swf.*

* Awalnya proses pembuatan .swf ini agak merepotkan. Harus punya minimal Macromedia Flash 6 editor. Tapi sekarang sudah lebih mudah berkat sIFR Generator  online dan Open sIFR tool. 

Sementara FLIR atau Facelift Image Replacement menggunakan file TrueType (.ttf), php dan JavaScript. Di sini teks berubah menjadi image dalam format PNG.

• Kelebihan: lebih cepat. Menggunakan file .ttf.
• Kekurangan: harus berjalan di php, dan teks berubah menjadi image. Setup agak rumit. Transparansinya tampil tanpa masalah di browser-browser baru, tapi tidak di IE6 ke bawah.

Untung keduanya sudah memikirkan faktor kompatibilitas browser. Teks akan tetap muncul dalam font generik apabila teknologi ‘replacement’ ini tidak bisa berjalan.

Silakan pilih dan terapkan mana yang lebih cocok dengan kebutuhan. Atau gabungkan keduanya.

Atau tidak sama sekali :D

Share/Bookmark

F*ck what the other says, I still miss FreeHand.

Share/Bookmark

Tata letak sudah bagus dan sesuai keinginan di Firefox, Opera dan Safari, tapi hancur lebur tak karuan di IE. Diakali supaya tampil bagus di IE, kadang posisinya jadi kacau di browser lainnya. Dan para klien umumnya tak mau tahu tentang masalah browser ‘manja’ ini — tentoe sadja.

Ini adalah tips singkat bagaimana cara mengakalinya. Barangkali sudah tahu, tapi kalau belum tahu silakan dicoba. Buat dahulu CSS untuk Firefox (yang umumnya tidak ada masalah signifikan di Opera dan Safari):

#id {
margin: 10px;
}

Lalu tambahkan kode yang hanya dibaca oleh IE6. Berikan parameter yang sesuai untuk tampilan IE6:

* html #id {
margin: 5px;
}

Baris berawalan * html itu hanya dibaca oleh IE6. Browser lain akan mengabaikannya.

Lalu bagaimana dengan IE7? Ternyata tak kalah manja. Malah perlu penanganan berbeda. Berikan kode khusus dan parameter yang sesuai untuk tampilan IE7:

*:first-child+html #id {
margin: 2px;
}

IE7 akan membaca baris berawalan *:first-child+html, sementara browser lain akan mengabaikannya.

Sepertinya agak ribet. Memang sih. Tapi yah ini salah satu cara berkompromi. Lagipula tidak semua #id dan .class perlu diperlakukan seperti ini. Cukup di bagian yang bermasalah saja.

Urutan penulisan yang direkomendasikan adalah seperti di bawah ini:

#id {
}

/* IE6 hack */
* html #id {
}

/* IE7 hack */
*:first-child+html #id {
}

Share/Bookmark

Pedoman itu digunakan sebagai hukum pertama dalam tipografi. Dan saya rasa hukum itu berlaku juga untuk disiplin ilmu lainnya yang berkaitan dengan visualisasi seperti disain grafis, periklanan, interior, ilustrasi dan lain-lain. Mungkin filmografi juga (CMIIW).

Kalau dijabarkan kira-kira artinya: tidak peduli bagaimana bagusnya konsep, teknik atau apapun di balik pembuatan sebuah karya visual, kalau hasil akhirnya terlihat tidak bagus, berarti karya itu gagal. Tidak bagus. Mementahkan semua konsep, teknik, eksekusi dan usaha di baliknya.

Memang definisi “bagus” itu relatif untuk berbagai kalangan. Tapi bidang disain — yang sering juga disebut plastic art atau applied art — berbeda dengan seni murni, terutama cara apresiasinya yang cenderung lebih singkat. Pendekatan “bagus” itu pembahasannya panjang. Buku-buku seperti Lanturan Tapi Relevan-nya Budiman Hakim bisa jadi referensi yang tepat.

Perlu diingat juga, kalimat di atas tidak bisa langsung diberlakukan sebaliknya. Karena, “If it looks good, it still needs to be proven that it IS good.”

Share/Bookmark

dg (disainer grafis): ini layout menu restauran yang bapak pesan. 

k (klien): ok saya cek dulu ya.

si klien memeriksa mock-up yang telah dibawa oleh si disainer grafis.

k: secara keseluruhan sudah bagus, cuma ada satu kata yang salah ketik. ini ‘mango’ (mangga) seharusnya ditulis dengan dua ‘g’, ‘manggo’. 

dg: oh… mangga dalam bahasa inggris bukannya memang ditulis ‘mango’ dengan satu ‘g’ begitu, pak? 

k: tidak. saya pernah kuliah di (menyebutkan nama sebuah perguruan tinggi terkemuka di inggris). mango tidak ditulis seperti ini. harusnya ‘manggo’. 

dg: oh begitu ya pak. tapi kalo saya lihat di kamus atau saya cek di spellchecker jadinya hanya ‘mango’ dengan satu huruf ‘g’. 

k: kamu kok tidak percaya sama saya. sini mari kita lihat di kamus.

klien tersebut lalu mencari buku kamus di rak bukunya yang penuh dengan buku-buku tebal. sepertinya ensiklopedia. mahal. fyi: jaman itu di tempat itu internet belum terlalu banyak pemakainya, termasuk di kantor si disainer grafis dan di kantor si klien itu. tidak lama kemudian si klien menemukan entry mango. raut mukanya menunjukkan keheranan.

k: lho, kok cuma satu ‘g’ ya?

belum menyerah, dia coba lagi di kamus lainnya. dia coba juga di ensiklopedia dan berbagai buku lainnya. tampangnya makin menunjukkan keheranan yang amat sangat. dan kecewa. si klien juga mencoba siapa tau ada dua entry ‘mango’ dan ‘manggo’. tapi yang ditemukannya hanyalah ‘mango’. tidak ada kata ‘manggo’.

k: aneh. saya yakin sekali kalau mangga dalam bahasa inggris itu ditulisnya ‘manggo’, bukan ‘mango’. 

dg: jadi bagaimana pak? 

k: kok saya lebih suka ‘manggo’ dengan dua ‘g’. kelihatannya lebih mantap. seperti kata aslinya, ‘mangga’. jadi kata-kata ‘mango’ di menu ini tolong diganti semuanya menjadi ‘manggo’ ya. 

dg: (tertegun sejenak) … baiklah pak.

sepuluh tahun kemudian, ketika saya teringat kembali tentang peristiwa tersebut, saya baru menyadari, peristiwa tersebut menggambarkan bagaimana bangsa ini dibentuk dan diwariskan ke generasi berikutnya. tidak perlu malu untuk melakukan sesuatu yang salah. jadikanlah itu sesuatu yang benar, jangan diakui salah. pembenaran. kalau perlu harus ngeyel dan ngotot.

Share/Bookmark

kalau belum nemu di situs itu, logo-logo perusahaan internasional bisa juga dicari di brandsoftheworld.com. gratis juga. gak perlu register. langsung download. disediakan dalam format eps. file eps ini bisa dibuka dengan baik oleh adobe illustrator dan berbagai vector-based software lainnya.

mayan daripada musti nge-trace logo-logo yang udah ada. saving costs. saving time. sisa waktunya bisa dipergunakan dengan baik untuk baca-baca milis atau hal-hal gak penting lainnya. ;)

Share/Bookmark