مطمئناً در بسیاری از وب سایتها یا وبلاگ های مختلف، آیکون های کوچکی را در نوار آدرس آن‌ها دیده‌اید. به آیکونی که در نوار آدرس سایت ها قرار می‌گیرد، اصطلاحاً Favicon گفته می‌شود.

در این آموزش قصد داریم مراحل ایجاد این نوع آیکون توسط فتوشاپ را آموزش دهیم و در آخر آن برای نوار آدرس وبلاگ یا وب سایت قرار دهیم.

آموزش ایجاد آیکئن نوار آدرس وبلاگ(favicon) 

مطمئناً در بسیاری از وب سایتها یا وبلاگ های مختلف، آیکون های کوچکی را در نوار آدرس آن‌ها دیده‌اید. به آیکونی که در نوار آدرس سایت ها قرار می‌گیرد، اصطلاحاً Favicon گفته می‌شود.

در این آموزش قصد داریم مراحل ایجاد این نوع آیکون را به صورت دلخواه آموزش دهیم و در نهایت آن برای نوار آدرس وبلاگ یا وب سایت قرار دهیم.

ایجاد آیکون دلخواه توسط فتوشاپ:

برای ایجاد طرح آیکون خود، می‌توانید از نرم‌افزارهای مختلفی که برای این کار ساخته شده‌اند استفاده کنید.

اما اگر دوست دارید از امکانات فتوشاپ برای ساخت آیکون کمک بگیرید، می‌توانید به روش زیر عمل نمایید:

با فشرده کلید Ctrl + N و یا انتخاب New از منوی File، یک سند جدید ایجاد کنید. چون ما آیکون را با اندازه 16 در 16 لازم داریم، مطمئناً واردکردن چنین اندازه‌ای در سند ایجاد شده و کار کردن روی آن، چندان جالب نیست. پس بهتر است اندازه آن را مثلاً 600 در 600 قرار دهید تا بتوانید با خیال راحت آیکون را طراحی کنید و در پایان آن را به اندازه 16 در 16 تغییر دهید.

اکنون طرح دلخواه خود را ایجاد کنید. برای اینکار می‌توانید از براش، ابزار Pen، تایپ متن و ... استفاده کنید. همچنین می‌توانید از ابزار Shape  هم کمک بگیرید. این ابزار دارای اشکال و طرح‌های آماده‌ای می‌باشد که می‌تواند در این مورد به شما کمک کند. اگر طرح‌های آماده این ابزار مورد توجه شما قرار نگرفت، می‌توانید Shape هایی را با طرح‌های دلخواه از اینترنت و یا CD ابزارهای فتوشاپ تهیه نمایید.

برای مثال ما یک آیکون را با استفاده از ابزار Shape رسم کرده‌ایم و با استفاده از لایر استیل (Layer style) به آن افکت می‌دهیم.

در تصویر زیر نتیجه کار پس از اعمال استیل روی آن را می‌بینید.

تغییر اندازه آیکون:

پس از رسم کردن و تکمیل آیکون مورد نظر، باید آن را به اندازه مورد نظر در آوریم. برای این کار به منوی Image رفته و Image size را انتخاب نمایید. اکنون در کادر Width و Height مقدار 16 پیکسل را وارد کرده و رزولیشن آن را هم روی 300 قرار دهید و در نهایت آن را Ok نمایید.

ذخیره آیکون:

اکنون باید از آیکون خود خروجی بگیرید. قبل از هر چیز باید ذکر کنم که تنها می‌توانید از فرمت های PNG،GIF و Ico برای قرار دادن آیکون در نوار آدرس سایتتان استفاده کنید.

پس برای این کار در منوی File گزینه Save as را انتخاب کنید. در کادر مربوط به انتخاب فرمت، می‌توانید از بین گزینه PNG و GIF یکی را انتخاب کنید. اما با توجه به اینکه فتوشاپ قالب Ico را برای خروجی ندارد، می‌توانید با نصب پلاگین افزودن فرمت آیکون، این فرمت را به فتوشاپ اضافه کنید.

اگر به پلاگین مورد نظر دسترسی نداشتید، می‌توانید با کمک نرم‌افزارهای تبدیل تصویر، آیکون خود را به فرمت Ico تغییر دهید.

نکته: بهترین فرمت برای این کار ico می‌باشد. همچنین می توانید آیکون انیمیشن (متحرک) را با فرمت Gif تهیه و برای این کار از آن استفاده کنید.

آپلود آیکون و دریافت لینک آن:

اگر فضای میزبان اختصاصی ندارید، می‌توانید از سایت های مربوط به آپلود عکس استفاده کنید. اگر آیکون خود را به فرمت Ico تبدیل کرده‌اید، باید دقت کنید که سایت های آپلود، این فرمت را پشتیبانی کنند.

 در زیر آدرس سایت های ایرانی رایگانی که امکان آپلود رایگان تصویر را به شما می‌دهند ملاحظه می‌نمایید.

http://www.upcity.ir

http://8pic.ir/

http://uplod.ir

http://www.imgup.com/

اما بنده پیشنهاد می‌کنم که حتما به سایت های خارجی زیر سر بزنید چرا که علاوه بر امکان آپلود آیکون، منبع وسیعی از آیکون‌ها را در اختیارتان قرار می‌دهند :

http://findicons.com

http://www.iconj.com/

به عنوان مثال ما آیکون خود را به فرمت Ico تبدیل کرده‌ایم و آن را در وب سایت http://www.iconj.com/ آپلود می‌کنیم. پس از اینکه آیکون ما آپلود شد، لینک آدرس آن را به ما می‌دهد که باید آن را کپی کنیم و در قالب وبلاگ خود قرار دهیم که این کار در ادامه توضیح داده می‌شود.

از مزایای این سایت این است که «لینک قرار دادن آیکون در نوار آدرس سایت» را به طور مستقیم به شما می‌دهد. پس شما دیگر نیازی به برنامه‌نویسی ندارید و تنها با کپی لینکی که در کادر دوم  قرار گرفته است و قرار دادن آن در قالب سایت، برای سایتتان آیکون قرار می‌دهید. در پایین نمونه لینکی که این وب سایت به ما داده است را مشاهده می‌کنید:

نکته: قسمت آبی رنگ لینک فوق، آدرس آیکون است. پس در صورتی که شما آیکون خود را در سایت های دیگری آپلود کرده‌اید، لینک آن را در این قسمت قرار دهید.

قرار دادن لینک آیکون در قالب وبلاگ یا وب سایت:

برای قرار دادن لینک در وب سایت یا وبلاگ، به قسمت مدیریت وبلاگتان بروید و گزینه «ویرایش قالب» را انتخاب کنید. سپس لینک ذکرشده را بعد از تگ قرار دهید و قالب را Ok کنید. OK کردن به معنی ثبت تغییرات قالب است که در وبلاگ های مختلف با عناوین مختلفی ذکر شده است. به تصویر زیر دقت نمایید...

اکنون اگر به نوار آدرس ما نگاهی بیاندازید، همین آیکون را خواهید دید...

نویسنده: ناصری

منبع: http://pcaid.lxb.ir

ایمیل:Pcaid2013@gmail.com

لطفا در صورت استفاده این مطلب در وبلاگ یا وب سایت خود، منبع را نیز ذکر نمایید...با تشکر