ফেভআইকন (Favicon) হলো একটি ছোট আইকন যা কোনো ওয়েবসাইটের ব্রাউজার ট্যাব, বুকমার্ক লিস্ট, বা অ্যাড্রেস বারে প্রদর্শিত হয়। এটি একটি ওয়েবসাইটের পরিচিতি প্রকাশ করে এবং ব্যবহারকারীদের সহজেই সাইট শনাক্ত করতে সাহায্য করে।
ফেভআইকন যুক্ত করার পদ্ধতি
ফেভআইকন যুক্ত করার জন্য <link> ট্যাগ ব্যবহার করা হয় এবং এটি <head> ট্যাগের মধ্যে রাখা হয়।
মৌলিক উদাহরণ
<head>
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
ফেভআইকন তৈরি এবং ফাইল ফরম্যাট
ফেভআইকন তৈরি করার জন্য সাধারণত .ico ফাইল ফরম্যাট ব্যবহৃত হয়। তবে, আধুনিক ব্রাউজারগুলো .png, .jpg, .svg ইত্যাদি ফরম্যাটও সমর্থন করে।
ফেভআইকন তৈরি করার ধাপ
- একটি 16x16 পিক্সেল বা 32x32 পিক্সেল সাইজের ইমেজ তৈরি করুন।
- এটি
.icoফরম্যাটে সংরক্ষণ করুন। বিভিন্ন অনলাইন টুল যেমন favicon.io বা favicon-generator.org ব্যবহার করে এটি সহজেই তৈরি করা যায়।
ভিন্ন ভিন্ন ফরম্যাটে ফেভআইকন যুক্ত করা
বিভিন্ন ফরম্যাটে ফেভআইকন সমর্থনের জন্য নিচের মতো কোড লেখা যেতে পারে:
<head>
<!-- সাধারণ ICO ফাইল -->
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!-- PNG ফাইল -->
<link rel="icon" type="image/png" href="favicon.png">
<!-- SVG ফাইল -->
<link rel="icon" type="image/svg+xml" href="favicon.svg">
</head>
ব্রাউজারের জন্য ফেভআইকন কাস্টমাইজেশন
বিভিন্ন ডিভাইস বা ব্রাউজারের জন্য ফেভআইকন কাস্টমাইজ করা সম্ভব। যেমন মোবাইল অ্যাপ্লিকেশনের জন্য একটি অ্যাপ্লিকেশন আইকন তৈরি করতে হয়।
অ্যাপল টাচ আইকন
<link rel="apple-touch-icon" href="apple-touch-icon.png">
ভিন্ন সাইজের ফেভআইকন
<link rel="icon" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" sizes="16x16" href="favicon-16x16.png">
ফেভআইকন যুক্ত করার সম্পূর্ণ উদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ফেভআইকন যুক্ত করার উদাহরণ</title>
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<h1>ফেভআইকন যুক্ত হয়েছে!</h1>
</body>
</html>
ফেভআইকন ব্যবহারের সুবিধা
- ব্র্যান্ডিং: ওয়েবসাইটের ব্র্যান্ড পরিচিতি প্রকাশ করে।
- ইউজার এক্সপেরিয়েন্স: ব্যবহারকারীরা সহজেই সাইট চিহ্নিত করতে পারে।
- পেশাদারিত্ব: ওয়েবসাইটকে আরও পেশাদার দেখায়।
সারাংশ
ফেভআইকন একটি ছোট হলেও গুরুত্বপূর্ণ উপাদান যা ওয়েবসাইটের ব্র্যান্ডিং এবং ব্যবহারকারীর অভিজ্ঞতা উন্নত করে। এটি সঠিক ফরম্যাট এবং সাইজ ব্যবহার করে সহজেই যুক্ত করা যায়, যা ওয়েবসাইটের ভিজ্যুয়াল আইডেন্টিটি আরও সমৃদ্ধ করে।
Read more
