আমার ফটোশপ চিত্রের পাঠ্যটি "অস্পষ্ট" দেখাচ্ছে

Question

আমি ফটোশপ সিএস 5 তে একটি ওয়েবসাইট শিরোনাম তৈরি করছি, তবে আমি যখন এটি দেখি তখন পাঠ্যটি খুব ঝাপসা লাগে এবং কেন তা আমার কোনও ধারণা নেই।

আমি ওয়েব প্রিসেট ব্যবহার করি। তীক্ষ্ণ এবং সর্বোত্তম ফলাফলের জন্য আপনি কী প্রস্তাব দিচ্ছেন?

এখানে বর্তমান মকআপ:

Comments

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

— জারি কেইনেনেন

@ কোইইউ - যে স্তরগুলি সম্পর্কে আমি সবচেয়ে বেশি উদ্বিগ্ন তা হ'ল পাঠ্য স্তরগুলি, এবং আমি সেগুলি জাগ্রত করি নি

— জেফ

(ওহ, আমি "xSky" এর আশেপাশের বক্ররেখার দিকে তাকিয়ে ছিলাম) ফটোশপটি ডিফল্টরূপে পাঠ্যের সাথে কিছু অ্যান্টি-এলিয়াসিং প্রয়োগ করে এবং সেটিংস আপনার বর্তমান প্রয়োজন অনুসারে করতে পারে না। গ্রাফিকডিজাইন.স্ট্যাকেক্সেক্সঞ্জ / প্রশ্নগুলি / ১১77//২ এর উদাহরণ রয়েছে (যদিও এটি সরাসরি আপনার প্রশ্নের উত্তর দেয় না)

— জারি কেইনেনেন

এই

Answer 1

ডিফল্টরূপে, ফটোশপ পাঠ্য স্তরগুলিতে কিছু অ্যান্টি-এলিয়াসিং প্রয়োগ করে। অ্যালেক্স অন্য একটি প্রশ্নে একটি দুর্দান্ত তুলনা প্রদান করেছেন :

অ্যান্টি-এলিয়জিং বিকল্পগুলি সরঞ্জামদণ্ডে এবং Characterউইন্ডোতে পাওয়া যায়:

---

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

Comments

সুতরাং আমি অনুমান করি যে এটি এটি করছে অ্যান্টি আলিয়াজিং? আর কীভাবে আমি সাহসী পাঠ্য অর্জন করতে পারি? :)

— জেফ

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

— জারি কেইনেনেন

এছাড়াও, আমি যুক্ত করতে পারি, এটি পাঠ্যের ছবিগুলি একটি ভাল ধারণা নয় বলে একটি কারণ । রিয়েল টেক্সট ক্লায়েন্ট দ্বারা সবচেয়ে আকাঙ্ক্ষিত উপায়ে রেন্ডার করা যেতে পারে।

— mattdm

Answer 2

আপনার ট্যাগের জন্য heightএবং widthবৈশিষ্ট্যগুলি (বা সিএসএস) imgচিত্রের প্রকৃত আকারের সাথে মেলে তা নিশ্চিত করুন । অন্যথায়, এটি ওয়েব ব্রাউজার দ্বারা পুনরুদ্ধার করা হবে, এবং অনেক ওয়েব ব্রাউজারগুলি কুৎসিত উপায়ে এটি করে। এমনকি যেগুলি এটি তুলনামূলকভাবে ভাল করে তা চিত্রটিকে কিছুটা ঝাপসা করে।

আপনি যদি এটি দেখতে ঠিক হন তা নিশ্চিত করতে চান তবে পিক্সেলগুলি 1: 1 রাখুন।

Comments

বিষয়টি হ'ল ফটোশপে নিজেই এটি বিব্রত দেখা যাচ্ছে। আমি কীভাবে "পিক্সেল 1: 1" করব?

— জেফ

@ জেফ "পিক্সেল 1: 1 রাখছেন" 100% জুমে ছবিটি দেখার সমতুল্য।

— জারি কেইনেনেন

@ কোইউ - ঠিক আছে, আমার কাছে ইতিমধ্যে এটি আছে। :)

— জেফ

Answer 3

অ্যাক্সেসযোগ্যতা এবং অনুসন্ধান ইঞ্জিন সমস্যার দিকে পরিচালিত করে আমি কোনও চিত্র হিসাবে পাঠ্যটি প্রদর্শন করব না।

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

Comments

সর্বদা পিএনজি ব্যবহার করুন, দীর্ঘদিন আগে জেপিজি থেকে দূরে গিয়েছিলেন: পি

— জেফ

Answer 4

আমি আরও ভাল রেজোলিউশনের জন্য পাঠ্যটিকে স্বচ্ছ পিএনজি ফাইল হিসাবে তৈরি করব। আরেকটি বিকল্প হ'ল স্টাইল এবং এসইও উভয়ের জন্য এসআইএফআর ব্যবহার করা। sIFR মূলত ফন্টটিকে ফ্ল্যাশ হিসাবে এম্বেড করছে তবে এটি 100% অনুসন্ধান ইঞ্জিন বান্ধব। উদাহরণস্বরূপ 3d-photomontage.com এ কিছু উদাহরণ দেখুন ।

Answer 5

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

আপনি যদি নিজের লেখায় অস্পষ্টতা না চান তবে পিএস-এ অ্যান্টি-এলিয়জিং বিকল্পগুলি থেকে কেবল 'কিছুই নয়' নির্বাচন করুন। এইচটিএমএল সংস্করণ সর্বদা ওএস বা ব্রাউজারের উপর নির্ভর করে পাঠ্যকে আলাদাভাবে উপস্থাপন করবে যাতে আপনারা যা করতে পারেন তেমন কিছুই নেই।

পাশাপাশি এটি দেখুন, এটি পিএসের পরিবর্তে আপনার HTML এ পাঠ্য রেন্ডারিংয়ের সমস্যাগুলি সমাধান করতে আপনাকে আরও সহায়তা করা উচিত

http://www.w3.org/TR/SVG11/painting.html#TextRenderingProperty

আমি সবসময় 'ক্রিস্প' অ্যান্টিএ-অ্যালাইজড বিকল্পটি নির্বাচিত এবং এইচটিএমএলে পাঠ্য যেভাবেই অন্যরকম দেখতে পাবেন তা সম্পর্কে সচেতন হয়ে ডিজাইন করি!