আমি কীভাবে ব্রাউজারকে সিএসএস ফাইল থেকে চিত্রগুলি ডাউনলোড করতে উত্সাহিত করতে পারি?


13

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


আপনার অন্যান্য প্রশ্নের উত্তর সিএসএস স্প্রিটস সম্ভবত এটির সমাধান করতে সহায়তা করবে।
অসন্তুষ্ট গোয়াট

উত্তর:


10

সিএসএস স্টাইলিংয়ের জন্য, সামগ্রী নয়। স্ট্রাইল যুক্ত করার আগে ব্রাউজারগুলি (যথাযথভাবে) সামগ্রী চেষ্টা করে এবং প্রদর্শন করে, তাই স্টাইল শিটগুলিতে চিত্রগুলি সাধারণত সর্বশেষে ডাউনলোড হওয়ার কারণ। যদি চিত্রগুলি আপনার সামগ্রীতে গুরুত্বপূর্ণ হয় তবে স্ট্যান্ডার্ড এইচটিএমএল <IMG>ট্যাগের মাধ্যমে সেগুলি যুক্ত করুন ।


2
দুর্দান্ত পরামর্শ, বিশেষত শেষ বাক্য। সাজসজ্জার জন্য চিত্র: সিএসএস; সামগ্রীর জন্য চিত্রগুলি: এইচটিএমএল।
অসন্তুষ্টগোট

1
ড্যানিয়েলের যে চিত্রগুলি তিনি উল্লেখ করছেন সেগুলির বিবরণ ("ব্যাকগ্রাউন্ডস", "আইকনগুলি") এগুলি বিষয়বস্তুর বিপরীতে শোভনের মতো সাবলীল করে তোলে। আমি মনে করি তারা সিএসএসে থাকা ঠিক।
ববি জ্যাক

5

আপনার স্টাইলশীট থেকে নিখুঁত ইউআরআই ব্যবহার করুন এবং আইএমজি ট্যাগগুলি থেকে পৃষ্ঠাগুলির একটি লুকানো চিত্রগুলি যুক্ত করুন <div>(এটি ধরে নেওয়া হয় আপনি প্রতিটি পৃষ্ঠায় একই চিত্র ব্যবহার করছেন; আদর্শভাবে পাদদেশে যাতে তারা সমস্ত বোঝানো হয় এবং কোনও প্রদত্ত পৃষ্ঠা কলটিতে ক্যাশে থাকে )।

পৃষ্ঠার চিত্রগুলি অগ্রাধিকার পায় এবং একবারে চিত্রগুলি ক্যাশে হয়ে গেলে তারা পরবর্তী পৃষ্ঠার অনুরোধগুলিতে তত্ক্ষণাত রেন্ডার করে'll


2

চিত্রটি সিএসএসে অন্তর্ভুক্ত করতে ব্রাউজারগুলি যা তথ্য ইউআরআই টাইপ সমর্থন করে (তথ্যের জন্য http://en.wikedia.org/wiki/Data_Uri দেখুন )।

যদিও এর কয়েকটি অসুবিধা রয়েছে:

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

1

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



1

আপনার চিত্রগুলি যতটা সম্ভব ছোট করুন। অপ্রয়োজনীয় বাইটগুলি সরাতে আপনি smush.it ব্যবহার করতে পারেন ।

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