আমি কীভাবে আমার ওয়েবসাইটে ফ্যাভিকন যুক্ত করব?


20

আমার সাইটে ফেভিকন যুক্ত করার জন্য আধুনিক মানকটি কী? স্ট্যান্ডার্ড ইমেজ ফর্ম্যাট এবং আকার কি?

উত্তর:


8

সমস্ত ব্রাউজারে কাজ করার .icoজন্য, আকার হিসাবে পছন্দ করা হয়, 32x32 সর্বাধিক ব্যবহৃত হয়, 16x16 এছাড়াও কাজ করে (এটি বেশিরভাগ জায়গায় ব্রাউজারে ব্যবহৃত প্রকৃত আকার)।

আপনার প্রশ্নেও নয়, এগুলি 8 বা 24 বিটের রঙের গভীরতা হওয়া উচিত।

এটি লক্ষণীয় যে আপনি যদি iW ব্যবহারকারীদের আপনার সাইট বুকমার্ক করার পরিকল্পনা করেন তবে <link>এটি চিত্রের জন্য পৃথক , উদাহরণস্বরূপ স্ট্যাকওভারফ্লো এর:

<link rel="apple-touch-icon" href="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png">

যা হলো:
এসও টাচ আইকন


6

কোনও ছবি জড়িত করতে এবং এটিকে ফ্যাভিকনে রূপান্তর করতে বা এটিকে স্ক্র্যাচ থেকে তৈরি করতে আপনি http://www.favicon.cc/ এর মতো সরঞ্জাম ব্যবহার করতে পারেন ।

এর পরে, আপনি যদি নিজের ফাইলটির নাম দেন favicon.icoএবং এটি আপনার ওয়েবসাইটের মূলে রাখেন তবে বেশিরভাগ ওয়েব ব্রাউজারগুলি এটি স্বয়ংক্রিয়ভাবে পায় get

তবে আপনি আপনার html ফাইলগুলিতে এটি স্পষ্টভাবে ঘোষণা করতে পারেন:

<link rel="shortcut icon" type="image/png" href="path/to/your/favicon.png" />

অন্যান্য ফর্ম্যাটটি ব্যবহার করার সুবিধা সহ ico, বিভিন্ন পৃষ্ঠায় বিবিধ ফ্যাভিকন ব্যবহার করুন, আপনার ফ্যাভিকনকে অন্য কোনও জায়গায় রাখুন, faviconইত্যাদি বাদে অন্য কোনও নাম ব্যবহার করুন



2

আইই এর জন্য সম্পূর্ণ ডোমেন HTTP পথ সহ মার্কআপ এবং ডকুমেন্ট ফোল্ডারে ফেভিকন রাখুন:

<link rel="shortcut icon" href="http://www.your-site-domain/favicon.ico">

স্ট্যান্ডার্ড চিত্র বিন্যাস:

  • .ico
  • 16 x 16 পিক্সেল

1

বিভিন্ন ডিভাইস, ব্রাউজার এবং ওএসের জন্য আপনি বিভিন্ন আইকন ব্যবহার করতে পারেন। উদাহরণস্বরূপ নীচে একটি তালিকা যা আপনাকে অনুপ্রাণিত করতে পারে। জিনিসগুলি অগ্রগতি হিসাবে তালিকাটিকে সঠিকভাবে সম্পাদনা / সম্পাদনা করুন।

<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" />

0

আপনার আর কোনও লিঙ্কের দরকার নেই, তবে এটি দরকারী। পরিবর্তে, যতক্ষণ আপনি নিজের রুটে ফেভিকন.ইকো (এবং এটি একটি আইকো) নামের ফাইলটি ছেড়ে চলেছেন ততক্ষণ এটি ফ্যাভিকন হিসাবে ব্যবহৃত হবে।


0

জিআইএমপি দিয়ে আমার .ico ফাইলটি তৈরি করতে আমার একটু সমস্যা হয়েছিল তবে এই পোস্টে বিস্তারিত নির্দেশনা দেয়। কৌতুকটি প্রথমে একটি ইনডেক্স রঙের টেবিলে রূপান্তর করতে প্রথমে জিআইএফ ফর্ম্যাট হিসাবে সংরক্ষণ করছে এবং তারপরে আইসিও ফর্ম্যাটে রূপান্তর করে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.