Font

Di dalam senireka grafik, font merupakan salah satu elemen yang penting. Walaupun hanya di atas kanvas putih, dengan gabungan beberapa teknik di dalam seni reka grafik, sesebuah mesej dapat disampaikan dengan efektif dan jelas. Di dalam artikel kali ini, kami akan menunjukkan kepada anda bagaimana cara untuk menginstall font yang baru di dalam komputer anda. Kepada yang telah tahu, maka kami sajikan anda dengan font yang percuma untuk di download dan digunakan di dalam hasil kerja anda.*

Install Font

Contoh – Install font Geo Sans Light

1. Download font Geo Sans Light.

2. Save dan unzip file yang telah di download.

3. Copy file font GeosansLight dan kemudian pergi ke My Computer > Windows > Font

4. Di dalam file Fonts, right click dan paste.

Restart semua program untuk load font yang baru di download. Selamat mencuba!

PERCUMA! Font berkualiti tinggi.

Berikut merupakan antara font yang berkualiti tinggi yang boleh anda download secara percuma*

• Mank Sans – Recommended
  
• MG Open Moderna
• Anivers
• Cardo
• Cicle

*Perhatian: Sila baca terma dan syarat di laman web di mana anda download font tersebut kerana pihak iLuvIslam tidak bertanggungjawab di atas sebarang isu etika yang dilanggar oleh anda. Harap maklum.

Basic Font Effect

Di dalam artikel ini, kam akan mengajar beberapa basic effect yang biasanya digunakan. Selain pada font, effect yang sama juga digunakan pada imej. Semoga beberapa basic font effect ini dapat digunakan pada masa akan datang. Selamat mencuba!

 

• Regular, Bold, and Italic

• Drop Shadow

• Bevel Emboss

• Trasparent (Opacity)

• Reflective

• 3d

Kuasai asas penggunaan gaya font dan anda akan dapat menghasilkan rekaan grafik yang mampu memukau setiap jiwa – jiwa yang melihatnya. Sekian dari kami. 

Blog Review: Good design (Part1)

Di dalam review kali ini, kami akan memaparkan beberapa ciri-ciri laman web atau blog yang baik. Kami akan lihat dari beberapa aspek seperti layout, penggunaan font, colour scheme, dan elemen yang unik di dalam sesebuah laman web.

Layout web

Oleh kerana kebanyakkan pengguna menggunakan platform Blogger (Blogspot) maka kebanyakkan theme boleh di dapati secara percuma dan anda bebas memilih layout yang anda gemari. Berikut merupakan layout yang digunakan oleh majoriti di dalam bahagian Blog Review ini:

Secara general, layout A membolehkan webmaster untuk memasukkan lebih banyak side content seperti link ke laman web lain, animated gif atau widget pilihan mereka. Manakala bahagian tengah merupakan isi kandungan kepada blog itu sendiri. Layout B agak terhad pada content sampingan berbanding A kerana hanya mempunyai satu sidebar sahaja sama ada di sebelah kiri atau kanan.

Contoh blog (di dalam lingkungan blog review) yang berjaya memaparkan penggunaan layout A dan B yang agak baik adalah seperti berikut:

Layout A: Mutiara Iman, IKMA, Callidesign, Iman Taqwa

Layout B: MuscoM, imtiaz sofea

Selain itu, terdapat juga contoh yang unik dan baik dalam penggunaan layout. Ia dapat disaksikan pada blog Shoutulhaq di mana kedua-dua sidebar terletak bersebelahan dan tidak mengapit isi kandungan utama blog itu tersendiri. Layout seperti ini amat berguna bagi mengasingkan content sampingan dan utama di dalam sesebuat laman web.

Antara contoh – contoh laman web yang boleh dijadikan petunjuk untuk penggunaan layout yang amat berkesan dan mengandungi segala maklumat penting untuk sesebuah laman web atau blog.

Layout A: David Airey

Layout B: A List Apart (Article page e.g. bab Layout)

Layout C: Smashing Magazine

InsyaAllah pada review akan datang kita akan lihat pada penggunaan font di dalam design sesebuah laman web/blog. Semoga apa yang ada dapat diperbaiki dari semasa ke semasa. Sebarang pertanyaan amatlah dialu-alukan.

Feedback

Kini, setelah 2 minggu tutorial @ iLuvIslam dilancarkan tibalah masanya untuk kami mengumpulkan maklum balas dari semua pelawat. Mana yang baik, mana yang tidak, harap dapat diberitahu agar kami dapat kekalkan dan perbaiki dari semasa ke semasa. [Read more]

Opacity

Di dalam senireka grafik, antara elemen kecil yang mampu memberikan kesan yang besar ialah opacity. Opacity di dalam senireka grafik secara ringkasnya bermaksud kebolehan sesuatu objek untuk menghalang cahaya melepasinya.

Di dalam rekaan grafik, elemen opacity ini boleh digunakan pada imej atau typeface . Berikut merupakan lokasi di mana fungsi opacity boleh diubah suai di dalam seni reka grafik:

• Photoshop

• GIMP

Elemen opacity ini biasanya digunakan apabila ada subjek yang agak signifikan dan ingin ditonjolkan di dalam grafik itu sendiri. Antara contoh ialah imej di atas di mana asalnya, New Layer mempunyai skim warna (colour scheme) #000000 – hitam dan opacity bagi layer ini diubah kepada 35.4%. Hasilnya, interface lain dapat dilihat dengan tujuan menunjukkan pengguna di manakah lokasi elemen Opacity berada. Semoga ada manfaatnya.

Blog Review: Hosting

Sebelum kami komen secara mendalam satu persatu blog yang ingin direview, kami ingin mengajak semua melihat satu subjek yang agak penting dan signifikan iaitu hosting sesebuah laman web. Antara laman web yang diposkan untuk review, kami dapati hanya 3 laman web dan blog yang menggunakan hosting sendiri iaitu Muscom, Ibrahzine, dan Cartoonized. Manakala yang lain, kebanyakkan menggunakan blogspot oleh sebagai hosting untuk web blog masin – masing.

Di dalam artikel kali ini kami akan tunjukkan secara ringkas apa bezanya anda menggunakan hosting sendiri (berbayar) berbanding hosting yang diberikan secara percuma. Semoga ia dapat menjadi panduan ringkas kepada sesiapa yang ingin mula mereka laman web sendiri.

Features	Hosting
	Paid	Free
Kebebasan	100%	Limited
Subdomain	Yes	No
Search engine friendliness	Yes	No
Email setup	Yea	No
FTP	Yes	No
Advertisement	No	Mostly Yes
Easy to remember	Yes	No

Namun begitu, semuanya bergantung kepada beberapa faktor yang anda sendiri perlu pertimbangkan seperti kos, ilmu tentang domain dan hosting, dan pilihan anda (your preference). Ada yang hanya ingin blog dan ada yang menggunakan ianya sebagai laman web kelab. Semuanya bergantung kepada anda. Secara keseluruhan, hosting akan memberikan anda kebebasan untuk mereka bentuk sesebuah laman web. Dengan hosting sendiri, anda boleh mereka bentuk laman web dalam bentuk Flash, Blog, atau pun forum. Sekian, jumpa lagi pada review akan datang!

HTML Tutorial #3: HTML File

Setelah belajar beberapa tag untuk HTML, kini tibalah masanya untuk kita mencuba sesuatu yang baru. Dalam tutorial kali ini, kami akan ajarkan anda bagaimana untuk save sesuatu file daripada Notepad untuk menjadi file sebuah laman web. Ya, jika anda uploadkan file ini ke internet, ia boleh diview oleh semua orang di dunia ini! ;)

Langkah 1: Buka Notepad. Copy dan paste code di bawah.

<html>
<head>
<title>Title of page</title>
</head>
<body>
Laman web pertama saya. <b>Yeay!</b>
</body>
</html>

Langkah 2: Klik pada File > Save As. Pilih option berikut:

File name: utama.html

Save as type: All files

Encoding: ANSI

Langkah 3: Save dan ucaplah Alhamdulillah syukur pada Allah kerana anda telah berjaya menyiapkan satu file laman web yang ringkas. Tahniah!

Ini merupakan antara contoh ringkas sebuah file laman web. Segala tag yang anda belajar sebelum ini boleh diletakkan di antara tag <body> dan </body>. Selamat mencuba! InsyaAllah pada tutorial akan datang, kami akan terangkan secara mendalam apa yang kita telah belajar dalam tutorial kali ini.

HTML Test

Seperti mana cikgu akan memastikan bahawa anak-anak muridnya faham tentang sesuatu perkara yang diajarkannya, begitu juga kami. Kali ini, setelah anda belajar perkara-perkara asas dalam HTML maka kami ingin menguji kefahaman anda semua. Semoga berjaya!

[Read more]

HTML Tutorial #2: Link

Kami berharap agar semuanya berjalan lancar. Terima kasih kerana masih setia bersama kami. Kali ini, kami akan terangkan serba sedikit mengenai Link atau dalam bahasa ibunda, pautan. Dalam aspek coding, ia akan membunyai tag <a></a>.

FUNGSI

Ada beberapa fungsi link, antaranya:

• Menghubungkan laman web anda dengan laman web yang lain.
• Menghubungkan file (contoh: imej) yang dirangkumi di dalam satu laman web.
• Menghubungkan file untuk tujuan download.

CODING

GIMP: Download & Install

Assalamualaikum dan salam sejahtera. Di dalam tutorial ini, kami akan mengajarkan kepada anda cara mendapatkan program rekaan grafik GIMP serta cara untuk install program ini di komputer anda. Sebarang pertanyaan bolehlah diposkan di bahagian komen di bawah.

DOWNLOAD GIMP

Anda boleh dapatkan program GIMP di http://www.gimp.org/

 

Klik Download.

Klik pada bahagian Download pilih option berikut:

GIMP FOR WINDOWS

» Download GIMP 2.4.6 – Installer for Windows 2000 and above

* Untuk pengguna Mac, anda boleh pergi ke link berikut, http://www.gimp.org/macintosh/

Download program ini dan double click pada file GIMP Setup file, gimp-2.4.6-i686-setup.exe

Sebarang persoalan tentang cara install, bolehlah rujuk pada bahagian documentation di dalam laman web tersebut. Atau klik pada link di bawah:

http://www.gimp.org/docs/

INSTALL GIMP

1. Pada welcome screen, klik Next.

2. Pada bahagian License Agreement, sila baca dan klik Next.

3. Kemudian, klik pada Install Now.

4. Setelah selesai proses install anda bolehlah Launch GIMP.

Perhatian: Untuk loading pada kali yang pertama mungkin memakan masa yang agak lama kerana program ini akan load file dari pelbagai bahagian di dalam komputer anda seperti font. InsyaAllah untuk kali kedua dan seterusnya akan mudah.

Selamat mencuba!

Next Page »