4 September 2010
by R. Bambang Widiatmoko
1 Comment
Microsoft Word could insert fields that can provide automatically updated information, such as the time, title, page numbers, and so on. This tutorial will show how to insert field to inform number of pages in the document.
1. Locate pointer to desired position. Go to Insert -> Quick Parts -> Field…
Continue Reading →
23 August 2010
by R. Bambang Widiatmoko
0 comments
Tutorial below shows how to use Camera tool on Excel. Camera tool is very useful if user want to create free column-width table that not strict with the existing column width. Watch the following flash-based interactive tutorial. Click the green arrow to move to the next step.
Preview:
Continue Reading →
17 July 2010
by R. Bambang Widiatmoko
0 comments
There are many ways to block flash element(s) in Opera. And here is one of it:
1. Download script BlockFlash2 from userscripts.org.
2. Save it to a specific place (right click on Install button then Save Linked Content As…), such as: D:\scripts\45343.user.js
3. In Opera browser go to Settings -> Preferences… -> tab Advanced -> Content -> click on JavaScript Options… button.
4. On User JavaScript folder, set the folder to D:\scripts. OK and OK.
5. Click on [Play/Stop Flash] to play/stop Flash.
Preview:
3 July 2010
by R. Bambang Widiatmoko
2 Comments
In this post I just want to try the new feature of HTML5 that is non-system web font support, to be used in my blog which is using WordPress. Well I’ve read some reference to implement this feature which will use @font-face syntax. You can read:
Bulletproof @font-face syntax article for the tutorial and @font-face Generator which will generate files like .eot (used by Internet Explorer to support css @font-face declarations), .svg, .html, and .css; so that you can learn @font-face syntax from those files. For converter .ttf or .otf to .eot you can use application to convert TTF files to EOT. Don’t forget to read the wiki how to use the application.
I will show short tutorial how to implement @font-face syntax. Prepare .ttf or .otf font and .eot file. Upload it to folder of your template where there is css file. For the example I use Yikes font.
Edit css and insert this code:
@font-face {
font-family: 'Yikes';
src: url('yikes.eot');
src: local('☺'), url('yikes.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
.yikes1 {font: 2em 'Yikes', Arial, sans-serif;}
If you use wordpress change to HTML mode when create new post, then insert this code (for example):
R. Bambang WidiatmokoFeaturing Yikes font
And here is the result:
R. Bambang Widiatmoko
Featuring Yikes font
Try to select the text ^^ *only works for HTML 5 support browser*
Continue Reading →
28 June 2010
by R. Bambang Widiatmoko
6 Comments
Bila Anda sering menulis atau mendesain dengan tulisan Arab di komputer, ada baiknya untuk memperhatikan font yang digunakan agar pembaca tidak kesulitan dan mengurangi kesalahan membaca tulisan Arab tersebut. Berikut contoh tulisan arab dari al-Quran surat al-Fatihah ayat 7 menggunakan empat font yang berbeda, Arial, Traditional Arabic, Arabic Typesetting, dan Andalus
klik untuk perbesar gambar
Font arab Arial dengan Times New Roman tidak jauh berbeda. Menurut saya font Traditional Arabic dan Arabic Typesetting mempunyai tingkat kejelasan yang terbaik, perbedaannya kalau Arabic Typesetting terlihat lebih rapat. Namun untuk penggunaan tasydid dan kasroh, Arabic Typesetting terlihat lebih tepat peletakannya seperti mushaf saat ini.
Lalu bagaimana untuk penggunaan di web? Untungnya font seperti Arabic Typesetting merupakan salah satu font standard web, jadi kita bisa menggunakan dalam coding desain web. Contohnya sebagai berikut.
Di file css:
.arab1 {font: 3em Arabic Typesetting, Arial, sans-serif;}
Lalu di file html:
صِرَاطَ الَّذِينَ أَنْعَمْتَ عَلَيْهِمْ غَيْرِ الْمَغْضُوبِ عَلَيْهِمْ وَلَا الضَّالِّينَ
Tulisan arab bisa diedit di word lalu copas ke HTML editor. Contoh jadinya:
صِرَاطَ الَّذِينَ أَنْعَمْتَ عَلَيْهِمْ غَيْرِ الْمَغْضُوبِ عَلَيْهِمْ وَلَا الضَّالِّينَ
Update:
Ternyata font Arabic Typesetting bukan font standard web jadi kalau dilihat di komputer yang tidak terinstall font tersebut, tulisan arabnya tidak seperti di screenshot. Jadi solusinya adalah dengan memanfaatkan fitur @font-face HTML5 (lihat tutorialnya).