ফজলে রাব্বীইমেজ এসইও মানে আপনার ওয়েবসাইটের ছবিগুলো এমনভাবে তৈরি করা যাতে সেগুলো দ্রুত লোড হয়, যাঁরা চোখে দেখতে পান না তাঁদের কাছেও অর্থবহ হয়, আর গুগলও বুঝতে পারে। বেশিরভাগ ব্যবসার সাইটে এটা চারটি অভ্যাসে নেমে আসে: প্রতিটি ফাইলের বর্ণনামূলক নাম, সৎ অল্ট টেক্সট, আপলোডের আগে ছোট ও কমপ্রেস করা, আর মানানসই ফরম্যাট। কোনোটাই কঠিন নয়, আর প্রতিটিই সাধারণ ভিজিটরের জন্যও সাইটকে ভালো করে।
সার্চে ছবি কেন গুরুত্বপূর্ণ
ছবি তিনভাবে কাজে আসে। গুগল ইমেজেস আর সাধারণ ফলাফলের ছবিওয়ালা অংশে আসতে পারে, যা জরুরি সেসব পণ্যের জন্য যা মানুষ কেনার আগে দেখতে চান: আসবাব, পোশাক, হস্তশিল্প, খাবার। ছবি পেজের গতিকে প্রভাবিত করে, কারণ মোবাইল ডেটায় পেজ ধীরে খোলার প্রধান কারণ প্রায়ই ভারী ছবি। আর ছবির আশপাশের লেখা গুগলকে পুরো পেজটা বুঝতে সাহায্য করে।
উল্টো দিকে, নামহীন বড় বড় ছবিতে ভরা পেজ ধীর হয়, গুগলকে বোঝার মতো কিছু দেয় না, আর কিছু ভিজিটরকে বাদ দিয়ে দেয়।
1. ফাইলের নাম: ছবিতে কী আছে, সেটাই বলুন
আপলোডের আগে ফোন বা ক্যামেরার দেওয়া নাম বদলে ছোট একটি বর্ণনা দিন।
- দুর্বল:
IMG_4821.jpg,photo-final-new.jpg - ভালো:
jute-tote-bag-natural.jpg,rooftop-solar-panel-installation.jpg
ছোট হাতের অক্ষর আর শব্দের মাঝে হাইফেন ব্যবহার করুন। ছবির বর্ণনা দিন, কিওয়ার্ডের তালিকা নয়। বাংলা সাইটেও ফাইলের নামে সাধারণ ইংরেজি অক্ষর সবচেয়ে নিরাপদ, কারণ লিংক কপি বা শেয়ার করলে ওয়েব ঠিকানার বাংলা অক্ষর প্রায়ই লম্বা, পড়ার অযোগ্য কোডে বদলে যায়।
2. অল্ট টেক্সট: যিনি দেখতে পান না, তাঁর জন্য ছবির বর্ণনা
অল্ট টেক্সট হলো পেজের কোডে ছবির সাথে যুক্ত একটি ছোট বর্ণনা। দৃষ্টিপ্রতিবন্ধী মানুষের স্ক্রিন রিডার এটি পড়ে শোনায়। দুর্বল সংযোগে ছবি লোড না হলে ব্রাউজার এটি দেখায়। আর গুগল এটি দিয়ে ছবিটা বোঝে।
ভালো অল্ট টেক্সট ছোট একটি বাক্যাংশ বা বাক্যে বলে ছবিতে কী আছে:
| ছবি | দুর্বল অল্ট টেক্সট | ভালো অল্ট টেক্সট |
|---|---|---|
| পণ্যের ছবি | "ব্যাগ" | "চামড়ার হাতলসহ প্রাকৃতিক রঙের পাটের টোট ব্যাগ" |
| কাজের ছবি | "ছবি১" | "স্প্লিট এসির ইনডোর ইউনিট পরীক্ষা করছেন একজন টেকনিশিয়ান" |
| আগে-পরে | "ঢাকায় সেরা এসি রিপেয়ার সস্তা এসি রিপেয়ার ঢাকা" | "পরিষ্কারের আগে ও পরে এসির ফিল্টার" |
কয়েকটি সাধারণ নিয়ম:
- কিওয়ার্ড ঠেসে দেবেন না। টেবিলের শেষ উদাহরণ কারও কাজে আসে না।
- শুধু সাজসজ্জার ছবি, যেমন ব্যাকগ্রাউন্ড নকশা বা বিভাজক রেখা, খালি অল্ট টেক্সট রাখতে পারে, যাতে স্ক্রিন রিডার সেগুলো এড়িয়ে যায়।
- বাংলা পেজে অল্ট টেক্সট বাংলায় লিখুন, পেজের ভাষার সাথে মিলিয়ে।
- ছবির ভেতরে জরুরি লেখা থাকলে, যেমন অফার বা খোলার সময়, সেই লেখা পেজেও রাখুন। ছবির ভেতরের লেখা সার্চ ইঞ্জিন বা স্ক্রিন রিডার নির্ভরযোগ্যভাবে পড়তে পারবে, এমন ভরসা করা যায় না।
সবার জন্য সাইট ব্যবহারযোগ্য করা নিয়ে আরও আছে ওয়েবসাইট অ্যাক্সেসিবিলিটির মূল কথা লেখায়।
3. সাইজ: আগে ছোট করুন, তারপর কমপ্রেস
আধুনিক ফোনে তোলা ছবি যেকোনো ওয়েবসাইটের দরকারের চেয়ে অনেক বড়। সেভাবেই আপলোড করলে প্রতিটি ভিজিটরকে পুরোটা ডাউনলোড করতে হয়, প্রায়ই মোবাইল ডেটায়।
- ছোট করুন মোটামুটি সেই মাপে, যে মাপে ছবিটি সবচেয়ে বড় দেখানো হবে। সরু কলামে দেখানো পণ্যের ছবির কয়েক হাজার পিক্সেল চওড়া হওয়ার দরকার নেই।
- কমপ্রেস করুন কোনো ইমেজ কমপ্রেসর বা প্ল্যাটফর্মের নিজস্ব অপটিমাইজেশন দিয়ে। ফলাফল চোখে দেখে নিন; ছবি ছোট হবে, ঝাপসা নয়।
- ফোনে ছোট সংস্করণ পাঠান। ওয়ার্ডপ্রেসসহ বেশিরভাগ আধুনিক প্ল্যাটফর্ম প্রতিটি আপলোডের কয়েকটি মাপ তৈরি করে, আর ব্রাউজার মানানসইটি বেছে নেয়।
- পেজের নিচের দিকের ছবি লেজি-লোড করুন, যাতে ভিজিটর স্ক্রল করলে তবেই লোড হয়। তবে একদম উপরের প্রধান ছবি লেজি-লোড করবেন না; সেটি সাথে সাথে দেখা উচিত।
পেজ এখনই ধীর মনে হলে প্রথমে ছবিগুলো দেখুন, সাথে মোবাইল ডেটায় ধীর ওয়েবসাইট ঠিক করার অন্য কারণগুলোও।
4. ফরম্যাট: কখন কোনটি
| ফরম্যাট | কীসের জন্য ভালো | মন্তব্য |
|---|---|---|
| JPEG | ফটো | সব জায়গায় চলে; মান আর সাইজের ভালো ভারসাম্য |
| PNG | লোগো, স্ক্রিনশট, স্বচ্ছ ব্যাকগ্রাউন্ডের ছবি | ফটোর জন্য প্রায়ই বেশি ভারী |
| WebP | ফটো ও গ্রাফিক্স | একই মানে সাধারণত JPEG বা PNG-এর চেয়ে ছোট; আধুনিক ব্রাউজারে চলে |
| AVIF | ফটো | প্রায়ই আরও ছোট; আপনার প্ল্যাটফর্ম ঠিকমতো সামলায় কি না দেখে নিন |
| SVG | লোগো, আইকন, সাধারণ নকশা | যেকোনো মাপে ঝকঝকে; ফটোর জন্য নয় |
আপনার প্ল্যাটফর্ম যদি আপলোড করা ছবি নিজে থেকে WebP-তে বদলাতে পারে, সেটাই সাধারণত সবচেয়ে সহজ উন্নতি।
সাধারণ প্রশ্ন
ইমেজ সাইটম্যাপ কি লাগবে? বেশিরভাগ ছোট সাইটে না। ছবি সাধারণ পেজ কোডে থাকলে গুগল খুঁজে পায়। অনেক পণ্যের ছবিওয়ালা বড় দোকানের জন্য কাজে আসতে পারে।
প্রতিটি ছবিতে কি ক্যাপশন লাগবে? না, তবে পাঠকের দরকারি তথ্য, যেমন পণ্যের ছবিতে ঠিক কী দেখা যাচ্ছে বা ছবিটি কোথায় তোলা, রাখার ভালো জায়গা ক্যাপশন।
ছবি কি সংশ্লিষ্ট লেখার কাছে থাকা দরকার? হ্যাঁ, সম্ভব হলে। যে লেখার সাথে ছবির সম্পর্ক, তার পাশেই রাখুন, যাতে পুরো পেজ অর্থবহ হয়।
আপলোডের আগে দ্রুত চেকলিস্ট
- ছবির বর্ণনা দিয়ে ফাইলের নাম বদলান।
- যে মাপে দেখানো হবে, সেই মাপে ছোট করুন।
- কমপ্রেস করে দেখুন ছবি এখনও ভালো দেখাচ্ছে কি না।
- পেজের ভাষায় অল্ট টেক্সট লিখুন।
- ছবির ভেতরের জরুরি লেখা পেজেও রাখুন।
অনলাইন দোকানের জন্য এই অভ্যাসগুলো শিরোনাম, বিবরণ আর স্ট্রাকচার্ড ডেটার পাশাপাশি কাজ করে, যা আছে র্যাংক করে এমন পণ্য ও ক্যাটাগরি পেজ অংশে। কোনো কাজে সাহায্য চাইলে আমার এসইও, এইও ও জিইও সার্ভিস দেখুন।