আমার চিত্রগুলির ফাইলের আকার হ্রাস করতে আমি কী করতে পারি?


15

কিছু ওয়ার্ডপ্রেস থিমের সাথে কাজ করা আমি কয়েকটি চিত্র ফাইলগুলিতে সংশোধন করেছি এবং লক্ষ্য করেছি যে আমার সম্পাদিত সংস্করণগুলি কখনও কখনও আসলটির চেয়ে 3-4x বড় হয় (একই বিন্যাসটি ব্যবহার করে সংরক্ষণ করা হয়)। আমি মান হ্রাস করতে চাই না - ফাইল আকার ছোট করার কিছু উপায় কী কী তা দ্রুত লোড হবে?

এখনই, উদাহরণস্বরূপ, আমি ফটোশপ ব্যবহার করি এবং ইমেজ মানের স্লাইডারটিকে '8' (10 এর বাইরে) এ সেট করি।

উত্তর:


14

স্মেশিং ম্যাগাজিন পিএনজি অপটিমাইজেশন এবং জেপিজি অপ্টিমাইজেশান সম্পর্কে 2 দুর্দান্ত নিবন্ধ করেছে ।

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

উভয় নিবন্ধ সুনির্দিষ্ট কৌশলগুলিতে যায় যা আপনি ফটোশপে আপনার ফাইলগুলি আরও বেশি সংক্ষেপণের জন্য প্রস্তুত করতে ব্যবহার করতে পারেন। ফাইল সংরক্ষণের পরে ব্যবহৃত কৌশলগুলির তুলনায় যা অনেক বেশি কার্যকর।

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

আমি ইমেজঅપ્টিম নামে একটি ম্যাক অ্যাপ ব্যবহার করি । তাদের সাইট থেকে:

ইমেজঅપ્টিম চিত্রগুলি অনুকূল করে - তাই তারা কম ডিস্কের জায়গা নেয় এবং দ্রুত লোড করে - সেরা সংকোচনের প্যারামিটারগুলি খুঁজে এবং অপ্রয়োজনীয় মন্তব্য এবং রঙিন প্রোফাইলগুলি সরিয়ে দিয়ে। এটি পিএনজি, জেপিইজি এবং জিআইএফ অ্যানিমেশন পরিচালনা করে।

: ImageOptim বিভিন্ন অপ্টিমাইজেশান সরঞ্জাম ব্যবস্থার GUI উপলব্ধ AdvPNG AdvanceCOMP থেকে OptiPNG , PngCrush , JpegOptim , libjpeg থেকে jpegtran, Gifsicle এবং ঐচ্ছিকরূপে PNGOUT

এটি ওয়েবে চিত্র প্রকাশের জন্য দুর্দান্ত (ফটোশপে "ওয়েবের জন্য সংরক্ষিত চিত্রগুলি সহজেই সঙ্কুচিত করে) এবং ম্যাক এবং আইফোন অ্যাপ্লিকেশনগুলি আরও ছোট করার জন্য দরকারী।

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

সেই উক্তির সাথে সংযুক্ত সমস্ত সরঞ্জামের উইন্ডোজ / লিনাক্স / ম্যাক সংস্করণগুলি পিএনজিওউটি ব্যতীত রয়েছে, তবে ধন্যবাদ যে কেউ পিএনজিএইউটিকে ওএস এক্স এবং লিনাক্সে পোর্ট করেছেন কারণ তারা এতটাই চিন্তাশীল। আপনি যদি ইমেজঅપ્টিম ব্যবহার করা চয়ন করেন তবে এটি .app এ পিএনজিওউট ব্যতীত সমস্ত কিছু অন্তর্ভুক্ত করবে, সুতরাং পিএনজিইউটি পোর্টটি ধরুন, এটিকে / usr / লোকাল / বিনে (বা যে কোনও জায়গায়) ফেলে দিন এবং ইমেজঅપ્টিমকে বলুন যেখানে এটি রয়েছে।

ফটোশপের "ওয়েব এবং ডিভাইসগুলির জন্য সংরক্ষণ করুন" এর মাধ্যমে সংরক্ষণের পরেও ফাইলের আকার 30% ছাড়িয়ে যাওয়া আমার পক্ষে বিশেষত পিএনজি চিত্রগুলির সাথে অস্বাভাবিক নয়।

প্রতিলিপি: অপ্টিমাইজেশন চালানোর পরে, বামদিকে আইকন কলাম অনুসারে বাছাই করুন এবং (এক্স) আইকন সহ সমস্ত সারি নির্বাচন করুন - যে ফাইলগুলি আর কোনও হ্রাস করা হয়নি। তাদের তালিকা থেকে সরান, এবং চেক-চিহ্ন আইকন রয়েছে এমন সমস্ত চিত্র পুনরায় চালু করুন। আমি প্রায় প্রতিশ্রুতি দিতে পারি যে আপনার কাছে এমন চিত্র থাকবে যা এখনও ফাইলের আকার হারাবে। আপনি সমস্ত (এক্স) আইকন না পাওয়া পর্যন্ত বাছাই, নির্বাচন, অপসারণ, পুনরায় চালনার পুনরাবৃত্তি করুন এবং এটিকে একটি দিন কল করুন।


+1 বাহ! সেগুলি অসাধারণ নিবন্ধ। আপনি সেগুলি পোস্ট করে আমি খুব আনন্দিত।
জেসেগাভিন

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

10

ফটোশপে ফটোগ্রাফগুলি সংরক্ষণ করার সময় আমি ব্যবহার করার পরামর্শ দিই File > Save for Web and Devices। এটি আপনাকে সংকোচনের স্তরগুলির সাথে খেলতে এবং রিয়েল টাইমে ভিজ্যুয়াল ফলাফলটি দেখতে দেয়। ফটোগ্রাফগুলিতে আপনি সাধারণত এটি 8 স্তরের চেয়ে কম সংরক্ষণ করতে পারেন এবং এখনও দুর্দান্ত ফলাফল পেতে পারেন। বিকল্প পাঠ


1
আপনি কি এই চিত্রটির আকার হ্রাস করতে পারেন? এটি লোড হতে কয়েক সেকেন্ড সময় নেয়।

1
জেপিইজি সাধারণত বৃহত্তর বহু রঙের চিত্রগুলির জন্য একটি ছোট ফাইল আকার।
কেভিন


4

পিএনজি চিত্রগুলির জন্য আপনি রঙিন মানচিত্রের বর্ণের সংখ্যা হ্রাস করতে এবং সূচী পিএনজি হিসাবে সংরক্ষণ করতে পারেন। উদাহরণস্বরূপ, এমন একটি লোগো বিবেচনা করুন যা 128x128 পিক্সেল (সঙ্কুচিত)। কল্পনা করুন যে কেবলমাত্র 16 টি রঙ এটি ব্যবহার করে।

  • পিএনজি -32, পিক্সেল প্রতি চার বাইট - 65 কেবি
  • পিএনজি -8, পিক্সেল প্রতি এক বাইট - 16 কেবি
  • পিএনজি -4, পিক্সেল প্রতি চার বিট - 8 কেবি

আপনি দেখতে পাচ্ছেন যে চিত্রটির গুণমান হ্রাস না করে (এটি কেবলমাত্র নির্দিষ্ট ধরণের চিত্রগুলিতে প্রযোজ্য) আপনি আকারটি যথেষ্ট পরিমাণে হ্রাস করতে পারবেন।

বোতাম এবং সাইট আইকনগুলির জন্য, আপনি এগুলিকে একটি ছবিতে একত্রিত করার এবং সিএসএস বা জাভাস্ক্রিপ্ট ব্যবহার করে তাদের প্রদর্শন (স্প্রাইটস) নিয়ন্ত্রণ করতে পারেন consider এটি প্রতিটি চিত্রের জন্য করা HTTP অনুরোধের সংখ্যার উপর সংরক্ষণ করে।


3

অন্যান্য ফর্ম্যাট চেষ্টা করুন।

  • ফটোগ্রাফের জন্য জেপিইজি
  • আলফা এবং / অথবা ছায়া সহ ফটোগ্রাফের জন্য পিএনজি
  • একটি ছোট রঙের প্যালেট (কালো / সাদা বা হলুদ আইকন বা কিছু) সহ চিত্রগুলির জন্য জিআইএফ

"ওয়েবের জন্য সংরক্ষণ করুন" এর সংমিশ্রণে এটি প্রায়শই একটি দুর্দান্ত সমাধান
জেসন

2
পিএনজি -8 প্রায়শই সংশ্লিষ্ট জিআইএফের তুলনায় অনেক ছোট।
নিও

1
জিআইএফ অ্যানিমেশন বাদে প্রায় অপ্রচলিত এবং এমনকি এটি এপিএনজি দ্বারা ছাড়িয়ে যায়।
অসন্তুষ্ট গোয়াট

2

মূলত, আপনার চিত্রটি বিভিন্ন ফর্ম্যাটে সংরক্ষণ করার চেষ্টা করুন এবং তারপরে ফাইলের আকারটি দেখুন।

আপনি যদি জেপিইজি ব্যবহার করে থাকেন তবে আপনার পেইন্ট.net এর মতো কোনও গ্রাফিক্স সম্পাদকটিতে চিত্রের গুণমান উপরে এবং নীচে সামঞ্জস্য করতে সক্ষম হওয়া উচিত। 50% ইমেজ মানের সাধারণত ওয়েবে জন্য যথেষ্ট ভাল এবং ইমেজ অনেক ছোট করে তোলে।

পিএনজি দিয়ে আপনি এটি করতে পারবেন না তবে এটি লক্ষণীয় যে কখনও কখনও পিএনজি অনেক বড় এবং কখনও কখনও জেপিজির চেয়ে অনেক ছোট হয়। কালো-সাদা চিত্রগুলির জন্য পিএনজি অনেক ছোট, উদাহরণস্বরূপ, কালো এবং সাদা লাইন অঙ্কন।

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


আমি এক্সআইএফ ডেটা দ্বিতীয় করব - আপনার যদি এটির প্রয়োজন না হয় তবে এটি ফেলে দিন। আমি ভেবেছিলাম এটি ছোট হবে (এটি কেবল পাঠ্য, ঠিক?) তবে কিছু সাইটে আমি 30KB এর পার্থক্য দেখেছি যেখানে 50KB চিত্র (ব্যবহারকারী আপলোড করেছেন - তবে পুনরায় আকার পরিবর্তন করেছেন) একই মানের সেটিং এ 20KB বা এর চেয়ে কম হয়েছে - কেবল এক্সআইএফ ডেটা সরিয়ে ..
জেফ্রিপ্রিবি

2

আপনি এটিও নিশ্চিত করতে চান যে আপনি সমস্ত এক্সআইএফ ডেটা সরিয়ে নিচ্ছেন - প্রায় এই সমস্তগুলি ওয়েবে ব্যবহারকারীদের কাছে অপ্রাসঙ্গিক, তাদের কি সত্যিই জানতে হবে যে আপনি ফটো তোলার জন্য একটি ক্যানন 5 ডি ব্যবহার করেছেন এবং আপনি যে ব্যবহার করেছেন ২.৮ এর একটি এফ-স্টপ, ১ 160০ এর আইএসও, এক্সপোজার পক্ষপাতিত্ব এবং একটি 9 মিমি ফোকাল দৈর্ঘ্য সহ 0.5 সেকেন্ডের জন্য উন্মুক্ত?

এই সমস্ত মেটাডেটা আপনার চিত্রকে ওজন যুক্ত করে এবং সাধারণভাবে তা ছড়িয়ে দেওয়া উচিত।

যেমনটি জেসেগাভিন বলেছেন, বেশিরভাগ চিত্র অ্যাপ্লিকেশনগুলি আপনাকে সংক্ষেপণের প্রভাবগুলির পূর্বরূপ প্রদর্শন করবে - এগুলি ব্যবহার করুন, কারণ "8" এর কম্বল সেটিং খুব কমই আপনাকে সেরা বাণিজ্য বন্ধ করে দিতে চলেছে।

শেষ অবধি, গুগল পেজ গতি ফায়ারফক্স / ফায়ারব্যাগ প্লাগইন আপনাকে চিত্রের আকার কতটা হ্রাস করতে পারে তার একটি ভাল ধারণা দিতে পারে (আপনাকে আরও ছোট সংস্করণগুলি দেখতে ও সংরক্ষণ করার অনুমতি সহ)।



1

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

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

অবিচলিত চিত্রগুলির জন্য, তাদের ভবিষ্যতের মেয়াদ উত্তীর্ণের তারিখে সেট করুন। এটি নিশ্চিত করে যে ওয়েব ব্রাউজার এবং মাঝামাঝি কোনও ক্যাশিং প্রক্সি যতক্ষণ সম্ভব চিত্রটি ধরে রাখবে। এর একমাত্র নেতিবাচকতা হ'ল আপনি যদি অন্য চিত্রটি দেখাতে চান তবে আপনাকে আলাদা ফাইল নাম ব্যবহার করতে হবে এবং পরিবর্তে এর সাথে লিঙ্ক করতে হবে। ফাইলনামে সংস্করণ নম্বর (উদাহরণস্বরূপ myimage_1.png বা /images/3/logo.png) এটি করার কার্যকর উপায় হতে পারে। কম-স্ট্যাটিক পৃষ্ঠাগুলির জন্য, একটি বাস্তবসম্পর্কীয় মেয়াদোত্তীর্ণ শিরোনাম (অ্যাক্সেস প্লাস এক্স ঘন্টা) সেট করুন এবং নিশ্চিত করুন যে আপনি সর্বশেষ-সংশোধিত শিরোনাম বা ইটাগ শিরোলেখ (উভয়ই নয়) সেট করে রেখেছেন যাতে আগে ফাইলগুলি ডাউনলোড করা ব্রাউজারগুলি দ্রুত পরীক্ষা করতে পারে পুরো চিত্রটি নীচে টানানোর পরিবর্তে তাদের শিরোনামের তুলনা করে বর্তমান সংস্করণ রয়েছে কিনা।

যদিও এই কৌশলগুলি নিয়ে আলোচনা করার জন্য প্রচুর সংস্থান রয়েছে তবে ইয়াহু এক জায়গায় একসাথে সামগ্রী বিতরণের কার্যকারিতা উন্নত করার জন্য অনেক টিপস নিয়ে এসেছে দুর্দান্ত কাজ করেছে ।

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