تبلیغات
Fact World - نحوه قرار دادن فاوآیکن (favicon) در نوار آدرس وبلاگ و سایت

آموزش برنامه نویسی و مهارتهای وب

article 

نحوه قرار دادن فاوآیکن (favicon) در نوار آدرس وبلاگ و سایت

web-favicon فاوآیکن یا favicon، آیکن کوچکی است که معمولا در گوشه نوار آدرس، کنار نشانی های وب نمایش داده می شود که می تواند معرف لوگوی آن پایگاه یا محتویات صفحه مورد نظر باشد، استفاده از فاوآیکن به نمایش در نوار آدرس مرورگر محدود نمی شود، بلکه می توان از آن به عنوان لوگو و نشان، در فید های آر اس اس یا قسمت مربوط به بوکمارک ها در مرورگر کاربران استفاده کرد، به همین دلیل بیشتر سایت ها و وبلاگ های حرفه ای ترجیح می دهند حتما از یک آیکن مناسب و منحصر به فرد برای این منظور استفاده کنند؛ نگاه به پیشینه استفاده از این تکنیک نشان می دهد که در ابتدا تنها فرمت ico توسط مرورگرها پشتیبانی می شد اما به مرور و با پیشرفت تکنولوژی وب، فرمت های استاندارد gif، jpeg و png نیز توسط مرورگرهایی نظیر فایرفاکس، سافاری و اپرا پشتیبانی شد، با این وجود مرورگر پردردسر اینترنت اکسپلورر همچنان در نمایش این فرمت ها به عنوان آیکن، مشکلاتی دارد.

چگونه یک آیکن برای قرار دادن در نوار آدرس بسازیم؟


برای ساخت یک آیکن با فرمت ico نیاز به برنامه هایی تحت عنوان سازنده آیکن دارید برای مثال axialis iconworkshop انتخاب مناسبی است، سپس در فتوشاپ آیکنی در ابعاد 16×16، 32×32 یا 64×64 پیکسل با طرحی دلخواه و با فرمت png بسازید (در نهایت ما به اندازه 16×16 پیکسل نیاز داریم)، سعی کنید از ترکیب رنگی یک دست و به صورت متمایز استفاده کنید، مثلا از رنگهایی که شباهت زیادی به هم دارند یا از سایه ها کمتر استفاده کنید، چرا که با کوچک شدن آیکن، وضوح تصویر نیز کاهش می یابد و ممکن است فرم مورد نظر را از دست بدهد، آزمون و خطا روش خوبی است تا به انتخاب ایده آل خود نزدیک شویم؛ سپس تصویر مورد نظر را وارد برنامه سازنده آیکن کنید و با اندازه 16×16 پیکسل و ترجیحا با استاندارد رنگی true colors از آن خروجی بگیرید، آنگاه فایل خروجی را در سروری آپلود و آدرس آن را در لینک زیر جایگزین نمائید و کد را در قسمت هدر صفحه یا قالب (بین تگهای head) قرار دهید.

کد قرار دادن آیکن در نوار آدرس، سازگار با تمام مرورگرها


همانطور که گفتیم، فرمت استاندار favicon، فرمت ico است، اما برخی از مرورگرها از فرمتهای دیگر نیز پشتیبانی می کنند، به هرصورت کد زیر به صورت استاندارد برای این کار استفاده می شود.
<link rel="shortcut icon" href="http://yoursite.com/favicon.ico" type="image/x-icon" />

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


مرورگرهایی نظیر فایرفاکس از آیکن های متحرک (با فرمت gif) نیز پشتیبانی می کنند، به عنوان یک ترفند می توانید هر دو روش را با هم استفاده کنید تا در مروگرهایی که از این فرمت پشتیبانی نمی کنند، آیکن ساده نشان داده شود و در سایر مرورگرها، به صورت متحرک.
<link rel="icon" type="image/gif" href="http://yoursite.com/gif-favicon.gif" />
چند توصیه:
- بهتر است از آیکن های متحرک استفاده نکنید، چرا که نظر کاربران به جای اینکه به مطالب سایت یا وبلاگتان جلب شود، بیشتر به آیکن متحرک در نوار آدرس جلب می شود.
- اندازه فایل را در حد امکان کم حجم ایجاد کنید، ارزش این کار مخصوصا زمانی که کاربران با وسایلی نظیر تلفن همراه در حال مرور صفحات یا فید آر اس اس وبلاگ یا سایتتان هستند، مشخص می شود.
- سعی کنید آیکنی ساده و واضح بسازید، به یاد داشته باشیم که فاوآیکن تنها یک نشانه است و قرار نیست تمام محتوای صفحات خود را در آن نشان دهیم.
section دسته بندی: مهارتهای وب - مهارتهای وب وبلاگ نویسی -


یکشنبه 13 مهر 1393

نظرات ()


جمعه 24 شهریور 1396 05:59 ق.ظ
These are really impressive ideas in regarding blogging.

You have touched some nice things here. Any way keep up wrinting.
یکشنبه 15 مرداد 1396 08:45 ب.ظ
Thanks for your personal marvelous posting! I truly enjoyed reading it, you're a great author.
I will make sure to bookmark your blog and will come back in the foreseeable future.

I want to encourage one to continue your great work, have a nice evening!
جمعه 13 مرداد 1396 05:42 ق.ظ
Excellent post. I was checking continuously this blog and I'm impressed!

Very helpful info particularly the last part :) I care for such information much.
I was looking for this certain info for a very long time.

Thank you and best of luck.
یکشنبه 18 تیر 1396 06:35 ق.ظ
I write a leave a response when I appreciate a post on a blog or I have something to valuable
to contribute to the discussion. It is a result of the fire displayed
in the article I browsed. And on this post Fact World
- نحوه قرار دادن فاوآیکن (favicon) در نوار آدرس وبلاگ و سایت.
I was moved enough to post a comment :-P I do have some questions for you if it's okay.

Is it just me or do a few of the comments appear as if they are coming from brain dead people?
:-P And, if you are writing on additional social sites,
I would like to follow you. Would you make a list all of
all your shared sites like your Facebook page, twitter feed,
or linkedin profile?
چهارشنبه 20 اردیبهشت 1396 11:33 ق.ظ
I write a leave a response when I like a post on a site or I have something to contribute to
the discussion. It is triggered by the fire communicated in the post I looked at.
And on this post Fact World - نحوه قرار دادن فاوآیکن (favicon) در نوار آدرس وبلاگ و
سایت. I was actually moved enough to create a thought ;) I
do have some questions for you if it's allright. Could it be simply me or does it look like a few of these
comments look like coming from brain dead folks? :-P And,
if you are writing on other social sites, I'd like to
follow anything fresh you have to post. Could you make
a list all of your public sites like your Facebook page, twitter feed, or
linkedin profile?
پنجشنبه 7 اردیبهشت 1396 07:11 ق.ظ
BHW
Hi there, You have done a fantastic job. I'll certainly digg it and personally
suggest to my friends. I am sure they will be benefited from this website.
چهارشنبه 23 فروردین 1396 04:10 ق.ظ
Having read this I believed it was rather informative.
I appreciate you taking the time and energy to put
this short article together. I once again find myself spending a
lot of time both reading and commenting. But so what, it was
still worthwhile!
سه شنبه 15 فروردین 1396 05:21 ب.ظ
Hi there, after reading this awesome piece of writing i am
as well cheerful to share my familiarity here with friends.
سه شنبه 10 فروردین 1395 10:18 ب.ظ
سلام

درآمد ثابت ماهیانه داشته باشید

کسب درآمد ماهانه بالای 1 میلیون تومان

100 درصد تضمینی


لینک آموزش برای آقایان:

http://bit.do/poolsaz

لینک آموزش برای خانم ها:

http://bit.do/poolsaz2

درصورت داشتن هرگونه سوال با ایمیل زیر در تماس باشید :
toopfile.ir@gmail.com

نظر خود را ثبت کنید:

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



آگهی
آموزش طراحی سایت
webgoo.ir

آموزش برنامه نویسی و مهارتهای وب
امکانات جانبی


IP شما: ( )