Format Ideal Tulisan Arab buat Halaman Web

January 2, 2012 § 9 Comments

Seneng rasanya melihat dakwah di dunia maya akhir-akhir ini tumbuh bak rerumputan hijau pasca hujan turun. Apalagi kalau liat para ustadz online itu berusaha menampilkan dalil-dalil beserta bahasa Arabnya, selain lebih ilmiah, hal itu juga sukses membuat orang penasaran buat mempelajarinya ^^

tulisan arab

Sayangnya walau ada tulisan Arabnya, font yang dipakai masih ala kadarnya, walhasil tulisan jadi terlihat kecil dan susah dibaca. Pembaca pun gak mau repot-repot membaca dalil dan langsung lompat ke artiannya.

“Fontnya kecil Om, bisa sakit mata kalo dipaksa buat baca tulisan itu”
“ Waduuh…?!”

Inspirasi dari attaubah.com

Niat nyari inspirasi desain dari komunitas dakwah, ane iseng buka-buka link list dari muslim.or.id, kegiatan blogwalking pun berjalan dan akhirnya ketemu ama blog dg alamat attaubah.com. MasyaAllah! Saudara kita yang satu ini gak tanggung-tanggung buat maksimalin tampilan tulisan Arab. Tulisannya jelas, diharokatin, bikin semangat buat dibaca! Coba liat perbandingan berikut:

attaubah.com

Faedah jika Tulisan Arab Jelas

1. Membuka pintu pahala buat yang baca ayat atau hadits.
2. Kalo halaman webnya disimpen, memudahkan pembaca buat menghafal dalil-dalil tadi.
3. Bikin orang semangat kembali buat mendalami Bahasa Arab.
4. Masih banyak, pikiro dewe! ^^

Tapi Gimana Caranya..?

Jika kita memakai Ms. Office, tentu mudah buat merubah style tulisan dan gonta-ganti font di sana. Lha masalahnya web engine macam blogspot atau wordpress masih belum ada yang kayak gitu. Solusinya adalah memakai scipt CSS. Teknisnya seperti ini:

1. Ketika selesai menulis, masuk ke mode HTML (biasanya disamping mode Visual).
htmlmode
2. Selanjutnya cari tulisan Arab yang hendak Anda rubah bentuknya. Masukkan script berikut hingga jadinya seperti di bawah ini:

<span style="font: normal normal 26px/36px 'Traditional Arabic', Arial, sans-serif; ">
السلام عليكم
</span>

Nah, tulisan السلام عليكم di atas hanya sebagai contoh, selaraskan dengan kalimat yang Anda inginkan. Jika berhasil, maka tampilannya akan jadi kayak gini:

السلام عليكم

Teknik Lebih Lanjut

Teknik di atas merupakan teknik manual karena harus dimasukkan satu-satu. Untuk Anda yang sudah expert (sekali lagi buat yang ahli!) agar lebih praktis,  Anda bisa menggunakan teknik berikut:
1. Buat sebuah class css di jeroan situs Anda (yg expert pasti dah tau letaknya^^), misalnya ana namakan “arab”

. arab {
font-family: 'Traditional Arabic', Arial, sans-serif;
font-size: 26px;
line-height: 36px;
}

2. Nah setiap ada tulisan Arab, bisa kamu tambahkan class di atas seperti ini:

<span class="arab">
السلام عليكم
</span>

O iya kalo teknik barusan cuma dapat diaplikasikan pada blogspot dan web self hosting saja. Jadi kalo masih make wp-gratisan (kaya saya ini ^^) harus pake cara manual seperti yang pertama. Fiiiiuuuuh…akhirnya posting juga! Kalo ada tambahan silakan diisi di kotak komentar.

Tagged: ,

§ 9 Responses to Format Ideal Tulisan Arab buat Halaman Web

Bijaklah Berkomentar

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

What’s this?

You are currently reading Format Ideal Tulisan Arab buat Halaman Web at ahmaDezaky .

meta

%d bloggers like this: