উত্তর:
সমস্ত ব্রাউজারে কাজ করার .ico
জন্য, আকার হিসাবে পছন্দ করা হয়, 32x32 সর্বাধিক ব্যবহৃত হয়, 16x16 এছাড়াও কাজ করে (এটি বেশিরভাগ জায়গায় ব্রাউজারে ব্যবহৃত প্রকৃত আকার)।
আপনার প্রশ্নেও নয়, এগুলি 8 বা 24 বিটের রঙের গভীরতা হওয়া উচিত।
এটি লক্ষণীয় যে আপনি যদি iW ব্যবহারকারীদের আপনার সাইট বুকমার্ক করার পরিকল্পনা করেন তবে <link>
এটি চিত্রের জন্য পৃথক , উদাহরণস্বরূপ স্ট্যাকওভারফ্লো এর:
<link rel="apple-touch-icon" href="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png">
যা হলো:
কোনও ছবি জড়িত করতে এবং এটিকে ফ্যাভিকনে রূপান্তর করতে বা এটিকে স্ক্র্যাচ থেকে তৈরি করতে আপনি http://www.favicon.cc/ এর মতো সরঞ্জাম ব্যবহার করতে পারেন ।
এর পরে, আপনি যদি নিজের ফাইলটির নাম দেন favicon.ico
এবং এটি আপনার ওয়েবসাইটের মূলে রাখেন তবে বেশিরভাগ ওয়েব ব্রাউজারগুলি এটি স্বয়ংক্রিয়ভাবে পায় get
তবে আপনি আপনার html ফাইলগুলিতে এটি স্পষ্টভাবে ঘোষণা করতে পারেন:
<link rel="shortcut icon" type="image/png" href="path/to/your/favicon.png" />
অন্যান্য ফর্ম্যাটটি ব্যবহার করার সুবিধা সহ ico
, বিভিন্ন পৃষ্ঠায় বিবিধ ফ্যাভিকন ব্যবহার করুন, আপনার ফ্যাভিকনকে অন্য কোনও জায়গায় রাখুন, favicon
ইত্যাদি বাদে অন্য কোনও নাম ব্যবহার করুন
আইই এর জন্য সম্পূর্ণ ডোমেন HTTP পথ সহ মার্কআপ এবং ডকুমেন্ট ফোল্ডারে ফেভিকন রাখুন:
<link rel="shortcut icon" href="http://www.your-site-domain/favicon.ico">
স্ট্যান্ডার্ড চিত্র বিন্যাস:
বিভিন্ন ডিভাইস, ব্রাউজার এবং ওএসের জন্য আপনি বিভিন্ন আইকন ব্যবহার করতে পারেন। উদাহরণস্বরূপ নীচে একটি তালিকা যা আপনাকে অনুপ্রাণিত করতে পারে। জিনিসগুলি অগ্রগতি হিসাবে তালিকাটিকে সঠিকভাবে সম্পাদনা / সম্পাদনা করুন।
<link rel="icon" type="image/x-icon" href="/images/icons/favicon.ico" />
<link rel="icon" type="image/png" sizes="96x96" href="/images/icons/favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/images/icons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/images/icons/favicon-16x16.png" />
<link rel="shortcut icon" type="image/x-icon" href="/images/icons/favicon.ico" />
<link rel="apple-touch-icon" sizes="57x57" href="/images/icons/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="/images/icons/apple-touch-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/images/icons/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="/images/icons/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/images/icons/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="/images/icons/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/images/icons/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="/images/icons/apple-touch-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/images/icons/apple-touch-icon.png" />
<link rel="icon" type="image/png" href="/images/icons/android-chrome-192x192.png" sizes="192x192" />
<link rel="mask-icon" href="/images/icons/safari-pinned-tab.svg" color="#5bbad5" />
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="msapplication-TileImage" content="/images/icons/mstile-144x144.png" />
<meta name="msapplication-config" content="/browserconfig.xml" />
<meta name="theme-color" content="#282B34" />
জিআইএমপি দিয়ে আমার .ico ফাইলটি তৈরি করতে আমার একটু সমস্যা হয়েছিল তবে এই পোস্টে বিস্তারিত নির্দেশনা দেয়। কৌতুকটি প্রথমে একটি ইনডেক্স রঙের টেবিলে রূপান্তর করতে প্রথমে জিআইএফ ফর্ম্যাট হিসাবে সংরক্ষণ করছে এবং তারপরে আইসিও ফর্ম্যাটে রূপান্তর করে।