AVIF ছবি পর্যালোচনা

শুধুমাত্র যেখানে পেজ দ্রুত হয় সেখানে JPEG থেকে AVIF রূপান্তর করুন

AVIF সবচেয়ে কার্যকর যখন আপনি এটিকে একটি ছবি পর্যালোচনা হিসেবে বিবেচনা করেন, সার্বজনীন রপ্তানি সেটিং হিসেবে নয়। এই গাইড আপনাকে AVIF উপযুক্ত JPEG ছবি খুঁজে পেতে, পর্যালোচনা প্রক্রিয়া বেছে নিতে এবং ছোট কিন্তু ভিজ্যুয়ালি খারাপ ফাইল প্রকাশ এড়াতে সাহায্য করে।

দ্রুত সিদ্ধান্ত

পুরো মিডিয়া ফোল্ডার নয়, ব্যতিক্রমগুলো রূপান্তর করুন

সেরা JPEG থেকে AVIF সিদ্ধান্ত শুরু হয় পেজ প্রভাব থেকে। বড় ফটোগ্রাফিক ফাইল রিসাইজের পরও পেজ ধীর করে এমনগুলো রূপান্তর করুন। নিয়মিত থাম্বনেইল, UI স্ক্রিনশট, ডায়াগ্রাম ও ছোট ফাইল সহজ পথে রাখুন।

শক্তিশালী প্রার্থী বড় ফটোগ্রাফিক LCP ছবি

যখন হিরো বা ল্যান্ডিং পেজের ছবি রিসাইজ ও WebP রপ্তানির পরও ভারী থাকে তখন AVIF ব্যবহার করুন।

হয়তো গুরুত্বপূর্ণ কিন্তু প্রধান নয়

শুধুমাত্র তখনই AVIF পরীক্ষা করুন যখন বর্তমান ফাইল এখনও অর্থপূর্ণভাবে ভারী বা পেজে স্পষ্ট গতি সমস্যা থাকে।

পরিহার করুন ছোট, গ্রাফিক বা পর্যালোচনা করা হয়নি এমন সম্পদ

ছবি ছোট, প্রধানত UI, টেক্সট-ভরপুর বা প্রকাশের আগে ফলাফল পরীক্ষা করতে না পারলে AVIF এড়িয়ে চলুন।

প্রথমে ছবি পর্যালোচনা

AVIF বেছে নেওয়ার আগে এই প্রশ্নগুলো করুন

AVIF চমৎকার হতে পারে, কিন্তু এটি কোনো জাদুকরী সমাধান নয়। ছবির সঠিক সাইজ, সঠিক ভূমিকা নির্ধারণ এবং যেখানে দর্শকরা দেখতে পাবেন সেই বিন্যাসে পর্যালোচনা করার পরই ফরম্যাট গুরুত্বপূর্ণ।

প্রশ্ন কেন এটি গুরুত্বপূর্ণ কর্ম
রেন্ডার করা সাইজ কি ইতিমধ্যে সঠিক? AVIF ৪০০০px ছবিকে ৯০০px এ প্রদর্শিত হলে ঠিক করতে পারে না। প্রথমে রিসাইজ করুন, তারপর ফরম্যাট তুলনা করুন।
এই ছবি কি LCP বা প্রথম ছাপ প্রভাবিত করে? বড় উপরের অংশের ছবি গভীর পেজ সজ্জার চেয়ে বেশি প্রভাব ফেলে। হিরো, ল্যান্ডিং এবং প্রচারাভিযান ভিজ্যুয়ালকে অগ্রাধিকার দিন।
বিষয়বস্তু কি ফটোগ্রাফিক? AVIF সাধারণত ফটোগ্রাফিতে ভালো কাজ করে, ফ্ল্যাট UI বা লোগো-স্টাইল গ্রাফিক্সে নয়। যখন ধারালো প্রান্ত বেশি গুরুত্বপূর্ণ হয় PNG, SVG বা WebP ব্যবহার করুন।
আপনি কি প্রাসঙ্গিকভাবে ফলাফল পর্যালোচনা করতে পারেন? AVIF আর্টিফ্যাক্ট লুকাতে পারে যতক্ষণ না ছবি প্রকৃত বিন্যাসে বসে। মোবাইল প্রস্থ, গ্রেডিয়েন্ট, মুখ এবং ক্রপ পরীক্ষা করুন।
আপনার কি বিকল্প পথ আছে? প্রত্যেক পরিবেশ আধুনিক ফরম্যাট একইভাবে বিবেচনা করে না। ছবি মার্কআপ বা আপনার ফ্রেমওয়ার্কের সমতুল্য দিয়ে প্রকাশ করুন।

প্রার্থী নির্বাচন

কোন JPEG ছবি ভালো AVIF প্রার্থী?

ছবি খুঁজুন যেখানে ছোট ফাইল পেজ পরিবর্তন করে, শুধু ফাইল ম্যানেজার নয়। সবচেয়ে উপযুক্ত প্রার্থীরা সাধারণত ফটোগ্রাফিক, ভিজ্যুয়ালি গুরুত্বপূর্ণ এবং পর্যাপ্ত বড় যা লোডিং গতি প্রভাবিত করে।

সেরা প্রার্থী

LCP হিরো ছবি

একটি বড় ফটোগ্রাফিক হিরো যা প্রথম ভিউপোর্ট নির্ধারণ করে এবং রিসাইজ করার পরও ভারী থাকে, সাধারণত সবচেয়ে উপযুক্ত AVIF ব্যবহারের উদাহরণ।

ভালো প্রার্থী

ল্যান্ডিং পেজ প্রচারাভিযান ছবি

যখন একটি প্রচারাভিযান বা পণ্যের ছবি পৃষ্ঠার উপরের দিকে থাকে এবং দৃশ্যমানভাবে পরিপাটি থাকতে হয়, তখন অতিরিক্ত পর্যালোচনা প্রয়োজন হতে পারে।

নির্বাচিত প্রার্থী

সম্পাদনাগত ফিচার ছবি

ছবি যথেষ্ট বড় হলে AVIF ব্যবহার করুন, শুধু প্রতিটি প্রবন্ধের ছবি পুনরায় রপ্তানি হচ্ছে বলে নয়।

দুর্বল প্রার্থী

টেক্সট-ভরপুর স্ক্রিনশট

স্ক্রিনশট, UI ক্যাপচার, ডায়াগ্রাম ও আইকন প্রায়ই AVIF কম্প্রেশনের আগে টেক্সট স্পষ্টতায় ব্যর্থ হয়।

গুণগত মান পর্যালোচনা

AVIF টুলগুলোর মধ্যে গুণগত মানের সংখ্যা কপি করবেন না

AVIF কোয়ালিটি স্লাইডার সর্বজনীন নয়। একটি এনকোডারে ভালো দেখানো মান অন্যটিতে খুব নরম বা ভারী হতে পারে। টুলের ডিফল্ট বা মাঝারি মান থেকে শুরু করুন, তারপর প্রকৃত পৃষ্ঠায় আউটপুট মূল্যায়ন করুন।

লক্ষ্য সবচেয়ে ছোট AVIF ফাইল নয়। লক্ষ্য হলো সবচেয়ে ছোট ফাইল যা পেজকে সমর্থন করে: যথেষ্ট পরিষ্কার বিবরণ, গ্রহণযোগ্য গ্রেডিয়েন্ট, বিভ্রান্তিকর টেক্সচার ক্ষতি নেই এবং দৃশ্যমান রঙ পরিবর্তন নেই।

পর্যালোচনার ক্রম
  1. মূল ক্যামেরা ফাইল নয়, রিসাইজ করা JPEG বা WebP এর সাথে তুলনা করুন।
  2. রেন্ডার করা ডেস্কটপ সাইজ এবং মোবাইল প্রস্থে ছবি পরীক্ষা করুন।
  3. মুখ, আকাশ, গ্রেডিয়েন্ট, ছায়া, ছোট টেক্সচার এবং ব্র্যান্ডের রঙ পরীক্ষা করুন।
  4. আপনি যে পেজে প্রকাশ করবেন সেখানে ফাইলটি সত্যিই লোড হয় কিনা নিশ্চিত করুন।

ভিজ্যুয়াল ব্যর্থতার ধরন

প্রকাশের আগে AVIF আর্টিফ্যাক্ট পরীক্ষা করা উচিত

ভালো AVIF রপ্তানি চমৎকার দেখাতে পারে। খারাপটি চুপচাপ ব্যর্থ হতে পারে: ফাইল ছোট হয়, কিন্তু ছবিটি ফ্ল্যাট, ছড়িয়ে ছিটিয়ে বা গোলমালপূর্ণ মনে হয় ঠিক সেই অংশে যা ব্যবহারকারীরা প্রথমে লক্ষ্য করে।

আকাশ বা গ্রেডিয়েন্টে ব্যান্ডিং যখন কম্প্রেশন অতিরিক্ত করা হয়, মসৃণ পটভূমিতে ধাপ দেখা দিতে পারে।
মোমের মতো ত্বক বা পণ্যের টেক্সচার প্রতিচ্ছবি ও পণ্যের পৃষ্ঠতল প্রাকৃতিক বিবরণ হারাতে পারে যদিও ফাইল প্রথম নজরে তীক্ষ্ণ দেখায়।
নরম সূক্ষ্ম বিবরণ পাতা, কাপড়, চুল এবং ছোট পুনরাবৃত্ত প্যাটার্ন এমনভাবে ছড়িয়ে যেতে পারে যা বাইট সঞ্চয়ের চেয়ে কম মানের মনে হয়।
রঙ বা কনট্রাস্ট পরিবর্তন প্রচারাভিযান ও পণ্যের ছবিগুলো রূপান্তরের পর ব্র্যান্ড-নিরাপদ রঙ পরীক্ষা প্রয়োজন।
ক্রপ ও ফোকাল পয়েন্ট ভুল যদি রেসপন্সিভ ক্রপ ছবির সেই অংশ লুকায় যা পেজ বিক্রিতে সাহায্য করে, তাহলে ছোট ফাইল হওয়া কোনো জয় নয়।

ডেলিভারি

অন্ধভাবে প্রতিস্থাপন না করে বিকল্পসহ AVIF প্রকাশ করুন

গুরুত্বপূর্ণ পেজ ছবির জন্য ডেলিভারি সহজ ও পূর্বানুমানযোগ্য রাখুন। সমর্থিত হলে প্রথমে AVIF ব্যবহার করুন, WebP বা JPEG বিকল্প রাখুন, প্রস্থ ও উচ্চতা নির্ধারণ করুন, এবং ব্রাউজারকে দেরিতে লেআউট সাইজ আবিষ্কার করতে দেবেন না।

শুধুমাত্র যখন AVIF সত্যিই LCP ছবি হয় তখনই প্রিলোড করুন। প্রতিটি রূপান্তরিত সম্পদ প্রিলোড করলে পেজ ধীর নয় বরং ব্যস্ত হতে পারে।

HTMLAVIF বিকল্পসহ ছবি মার্কআপ
<picture>
  <source srcset="/images/landing/hero.avif" type="image/avif">
  <source srcset="/images/landing/hero.webp" type="image/webp">
  <img
    src="/images/landing/hero.jpg"
    width="1600"
    height="900"
    alt="Product photo in the landing page hero"
    loading="eager"
    fetchpriority="high">
</picture>

গোপনীয়তা ও নিয়ন্ত্রণ

অপ্রকাশিত প্রচারাভিযান ছবি এলোমেলো আপলোড প্রবাহ থেকে দূরে রাখুন

বড় JPEG ছবি সাধারণত নিরপেক্ষ ফাইল নয়। এতে প্রকাশিত হয়নি এমন পণ্য, ক্লায়েন্ট কাজ, অবস্থানের সূত্র, সাজানো প্রচার সামগ্রী বা অভ্যন্তরীণ তথ্য প্রকাশকারী ফাইলনেম থাকতে পারে। এগুলো রূপান্তরকের কাছে আপলোড করা সচেতন সিদ্ধান্ত হওয়া উচিত, ডিফল্ট নয়।

একটি লোকাল ওয়ার্কফ্লো সোর্স ফাইল, আউটপুট নাম এবং পর্যালোচনা ধাপগুলো প্রকল্পের কাছাকাছি রাখে। এটি বিশেষভাবে উপকারী যখন একই ল্যান্ডিং পেজে ভিজ্যুয়াল ব্যালান্স ঠিক করার জন্য একাধিক রপ্তানি চেষ্টা প্রয়োজন হয়।

ব্যবহারিক ওয়ার্কফ্লো

প্রতিটি ছবি আলাদা প্রকল্পে না নিয়ে পুনরাবৃত্তিযোগ্য JPEG থেকে AVIF রূপান্তর প্রক্রিয়া

  1. 01
    শুধুমাত্র ভারী প্রার্থীদের সংগ্রহ করুন

    সাধারণ রিসাইজ ও WebP রপ্তানির পরও গুরুত্বপূর্ণ বড় JPEG ছবির একটি সংক্ষিপ্ত তালিকা থেকে শুরু করুন।

  2. 02
    AVIF ভ্যারিয়েন্ট আলাদাভাবে রপ্তানি করুন

    AVIF আউটপুট একটি নির্দিষ্ট ফোল্ডারে রাখুন যাতে সোর্স JPEG এবং নিয়মিত WebP ফাইল সহজে তুলনা করা যায়।

  3. 03
    প্রকৃত পৃষ্ঠায় পর্যালোচনা করুন

    প্রার্থীকে প্রকৃত কম্পোনেন্ট বা টেমপ্লেটে রাখুন এবং দৃশ্যমান ফলাফল পরীক্ষা করুন, শুধু রূপান্তরকের প্রিভিউ নয়।

  4. 04
    বিকল্প মার্কআপসহ প্রকাশ করুন

    যেখানে সমর্থিত সেখানে AVIF পরিবেশন করুন এবং পূর্বানুমানযোগ্যতার জন্য WebP বা JPEG বিকল্প রাখুন।

  5. 05
    নিয়মটি নথিভুক্ত করুন

    লিখে রাখুন কোন ছবি ভূমিকা AVIF পায় যাতে পরবর্তী আপডেট অনুমানের খেলা না হয়।

ফরম্যাট সীমানা

WebP কে বেসলাইন এবং AVIF কে উন্নত হিসেবে ব্যবহার করুন

একটি সুস্থ ওয়ার্কফ্লো সাধারণত একটি ডিফল্ট এবং একটি ব্যতিক্রম পথ থাকে। ওয়েবসাইটের নিয়মিত ছবির জন্য WebP ডিফল্ট কারণ এটি ব্যবহারিক এবং ব্যাপকভাবে সমর্থিত। AVIF ব্যবহৃত হয় যখন বড় ফটোগ্রাফিক ছবি এখনও বেশি জায়গা নেয়।

সেই সীমানা প্রবন্ধের ওয়ার্কফ্লো দ্রুত রাখে এবং ভারী বা LCP প্রভাবিত ছবি উদ্ধার করার পথ দেয়।

নিয়মিত প্রবন্ধের ছবি নির্দিষ্ট কোনো ফাইল এখনও ভারী না হলে WebP ব্যবহার করুন।
বড় ফটোগ্রাফিক হিরো রিসাইজ করার পর AVIF চেষ্টা করুন এবং ভিজ্যুয়াল ফলাফল তুলনা করুন।
স্ক্রিনশট ও UI যখন টেক্সট ও ধারালো প্রান্ত গুরুত্বপূর্ণ হয় PNG বা WebP পছন্দ করুন।
পর্যালোচনা করা হয়নি এমন ব্যাচ রপ্তানি শুধু ফোল্ডার ছোট বলে অন্ধভাবে AVIF প্রকাশ করবেন না।

প্রকাশের আগে চেকলিস্ট

JPEG এর পরিবর্তে AVIF ব্যবহারের আগে এটি পরীক্ষা করুন

সোর্স ছবি রিসাইজ করা হয়েছে AVIF ফাইলটি ক্যামেরার মূল নয়, বরং সর্বোচ্চ প্রদর্শিত সাইজের কাছাকাছি।
পেজ AVIF ব্যবহার করে নেটওয়ার্ক বা পেজ-সোর্স পরীক্ষা নিশ্চিত করে নতুন ফাইলটি সত্যিই পরিবেশিত হচ্ছে।
একটি বিকল্প ব্যবস্থা রয়েছে আপনি যে ডেলিভারি পথ ব্যবহার করেন সেখানে WebP বা JPEG উপলব্ধ থাকে।
গুণগত মান পর্যালোচনা করা হয়েছে ডেস্কটপ ও মোবাইলে আর্টিফ্যাক্টের জন্য চূড়ান্ত পেজ পরীক্ষা করা হয়েছে।
মেটাডেটা এখনও অর্থবহ Alt টেক্সট, Open Graph ছবি এবং JSON-LD ছবি রেফারেন্স দুর্ঘটনাক্রমে ভাঙ্গেনি।
মূল ফাইল সংরক্ষিত থাকে সোর্স JPEG ভবিষ্যতে ক্রপ, সাইজ এবং পুনরায় রপ্তানির জন্য উপলব্ধ থাকে।

প্রশ্নোত্তর

সাধারণ প্রশ্নাবলী

JPEG থেকে AVIF প্রকাশ সিদ্ধান্তের জন্য ব্যবহারিক উত্তর