আমি কীভাবে অনুসন্ধান ইঞ্জিনগুলি অনুসারে পাঠ্যযুক্ত চিত্রগুলি আনতে পারি?

Question

আমি বন্ধুর জন্য একটি ছোট্ট পোর্টফোলিও ওয়েবসাইট তৈরি করছি, এবং বিজ্ঞাপনে এবং সমস্ত কিছুতে সে মানক হরফগুলিকে ঘৃণা করে এবং একটি কাস্টম ফন্টে লিখিত সবকিছু চায়।

যেহেতু সিএসএস ফন্ট-এম্বেডিং এই মুহুর্তের জন্য সত্যিই কোনও বিকল্প নয়, সমস্ত পাঠ্য (ভাগ্যক্রমে, এর মধ্যে অনেকগুলি নেই) চিত্র হিসাবে রাখা হবে।

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

Comments

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

— লজ মেজেস্তে

+1 @ লস সত্যিই, এটিই একমাত্র উপায়।

— ভার্চুসি মিডিয়া

ঠিক আছে, এটি কোনও বিকল্প নয় কারণ এটি প্রধান ব্রাউজারগুলির দ্বারা সমর্থিত নয়, তাই না?

— Wookai

হ্যাঁ, এটি পুরোপুরি IE5.5 এ ফিরে ... আমার উত্তরটি নীচে পড়ুন :)

— অস্কার গডসন

বাহ, কী বিপর্যয়, এটি সফ্টওয়্যার পেশাদাররা কখনই অচল হয়ে উঠবে না এর একটি দুর্দান্ত উদাহরণ ... কারও কারও কাছে লোকজনকে ট্র্যাজিক ভুল থেকে বিরত রাখতে হবে।

— মার্ক রজারস

Answer 1

ফন্টগুলি এম্বেড করুন!

না, তবে সত্যই, এম্বেডেবল ফন্টগুলি সমস্ত বর্তমান ব্রাউজারগুলিতে (এফএফ, ক্রোম, সাফারি, অপেরা) এবং আই 5.5 + (হ্যাঁ, এটি 90 এর দশক থেকে আইইতে কাজ করছে))

আপনার টিটিএফ এটি এখানে আপলোড করুন: http://www.kirsle.net/wizards/ttf2eot.cgi

এটি আপনাকে কোড এবং 2 টি ফাইল (একটি টিটিএফ এবং তারপরে একটি ইওটি [এম $ ওয়েব ফন্ট]) ফিরিয়ে দেবে। কপি, পেস্ট, আপলোড, সম্পন্ন। জয় জয়!

এবং দয়া করে, দয়া করে, ছবি ব্যবহার করবেন না :)

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

Comments

ধন্যবাদ, আমি সত্যিই ভেবেছিলাম যে ফন্ট-এম্বেডিং এখনও সমর্থিত নয়! আমি আপনার ওয়েবসাইট ব্যবহার করে দেখুন!

— Wookai

ঠিক! আশা করি এটি সহায়তা করে: ডি

— অস্কার গডসন

এটি লক্ষ করা উচিত যে আপনি কেবল কপিরাইট সমস্যার কারণে কোনও ফন্ট ব্যবহার করতে পারবেন না - লাইসেন্সের শর্তাদি আগে পরীক্ষা করুন!

— অসন্তুষ্ট গোয়াট

Answer 2

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

কেসটি হরফ ভার্সন গ্রাফিক কাজ হ'ল ফন্টগুলির উপর (গ্রেডিয়েন্ট রঙ, মোচড়িত প্রান্তিককরণ, গ্লসিং, এম্বেসিং, খোদাই ...), যাতে প্রয়োজন মতো সিএসএস বিকল্পগুলির রেন্ডার করা অসম্ভব হয়ে যায় তবে আমি নিম্নলিখিতটি করার পরামর্শ দেব:

সিএসএসের মাধ্যমে চিত্রগুলি ব্যবহার করুন (সম্ভবত কোনও স্প্রাইট) এবং অ্যাঙ্কর পাঠ্যটি পাঠ্য-পরিচয়ের সাথে গোপন করুন। এইচটিএমএল

<a href="work1.html" title="My first work" id="firstWork">My first work</a>

CSS

#firstWork {display: block; width: 200px; height: 150px; background-image:url('img/firstwork.jpg'); text-ident: -999em;}

এটি একটি কৌশল। হ্যাঁ, আমি জানি, গুগল এটিকে শাস্তি দিতে পারে, তবে আপনি জানেন, আমি এটি ব্যবহার করে শাস্তিপ্রাপ্ত একটিও সাইট সম্পর্কে কখনও শুনিনি।

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

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

ফিগাপ্যাশনটি অ্যাঙ্কর পাঠ্যের ভূমিকা তৈরি করবে এবং আপনি এটি লুকানোর জন্য সিএসএস ব্যবহার করতে পারেন।

ভাল, 3 সমাধান। একটা তোল. আমি শেষ সঙ্গে যেতে হবে।

Comments

উত্তরের জন্য তোমাকে অনেক ধন্যবাদ ! আপনার সমাধানগুলি সত্যই আকর্ষণীয়, বিশেষত শেষটি।

— Wookai

Answer 3

ইশ। তিনি তার ফন্টের বিষয়গুলি সত্যই অর্জন করতে পারেন কারণ তিনি তার সাইটের অ্যাক্সেসযোগ্যতা হত্যার চেষ্টা করছেন এবং তার পৃষ্ঠাগুলি রেন্ডারিংয়ে গতি কমিয়ে দেওয়ার মতো অন্যান্য ধরণের সমস্যা সৃষ্টি করছেন etc.

longdescআপনি নিজের চিত্রগুলিতে বৈশিষ্ট্য যুক্ত করার চেষ্টা করতে পারেন বলেছিলেন । এটি বলা শক্ত যে সার্চ ইঞ্জিনগুলি এটি কতটুকু ওজন দেয়, তবে এটি সম্ভবত শূন্যের চেয়ে বেশি।

Comments

ওয়েল, অ্যাক্সেসযোগ্যতার জন্য এখানে আল ট্যাগ নেই? দীর্ঘমেয়াদী টিপের জন্য ধন্যবাদ যদিও আমি এর অস্তিত্ব সম্পর্কে অবগত ছিলাম না।

— Wookai

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

— ড্যান্লেফ্রি

Answer 4

ওয়েব ফন্টগুলি এখন সমস্ত বড় ব্রাউজারগুলিতে বেশ মানসম্পন্ন, বিভিন্ন ফন্টের ফর্ম্যাটগুলির ক্রস ব্রাউজারের জটিলতা নির্ধারণ করা জটিল হতে পারে।

গুগল এখানে সাহায্যের জন্য একটি দুর্দান্ত ওয়েব ফন্ট এপিআই এবং ফন্ট ডিরেক্টরি সরবরাহ করে যাতে আপনি দরকারী মনে করতে পারেন।

Answer 5

এমনকি সাইটের অন্য পৃষ্ঠাগুলিতে যাওয়ার একমাত্র উপায় হিসাবে এমনকি Alt ট্যাগ সহ চিত্রগুলি ব্যবহার করা গুগলকে প্রকৃতপক্ষে অনেক বড় স্পষ্টতা দেয় না।

আপনার সর্বোত্তম বেটটি আপনার বন্ধুকে বোঝানো যে সমস্যাটি সমাধান করার জন্য আপনার পৃষ্ঠায় বা সাইটের কোথাও পাঠ্যের লিঙ্ক দরকার। উদাহরণস্বরূপ, যদি আপনি সমস্ত টেক্সট লিঙ্ক সহ সাইটম্যাপ পৃষ্ঠা সেটআপ করতে সক্ষম হন বা কাজ করতে হবে এমন সমস্ত পাঠ্য লিঙ্কের সাথে প্রতিটি পৃষ্ঠায় একটি ড্রপ ডাউন করতে পারেন। লিঙ্ক চিত্রগুলি ছাড়াও এটির কোনও ক্ষতি হতে পারে না।

আমি গুপ্ত লিঙ্কগুলি ব্যবহার না করার পরামর্শ দেব কারণ গুগল এটিকে অবহেলা হিসাবে দেখতে পারে এবং আপনার সাইটের র‌্যাঙ্ক হ্রাস করতে পারে বা স্প্যাম হিসাবে চিহ্নিত করতে পারে।

Comments

আমি অবশ্যই একটি সাইটম্যাপ সেট আপ করব, তবে এটি সামগ্রী

— সূচি

@ উওকাই - গুগল ইমেজ লিঙ্কগুলি সূচী করবে এটি কেবল তাদের সম্পর্কে তেমন জানেন না। সুতরাং প্রতিটি লিঙ্কে পূর্ণ পাঠ্য সহ আপনার যদি কোনও সাইটম্যাপ পৃষ্ঠা থাকে তবে এটি Google কে আপনার সাইটের পৃষ্ঠাগুলি সম্পর্কে আরও তথ্য দেবে।

— বেন হফম্যান

Answer 6

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

Answer 7

আমি ব্যাকগ্রাউন্ড চিত্র এবং লুকানো নেস্টেড স্প্যানগুলির সাথে এটি করতাম। পাঠ্য ব্রাউজারগুলি এবং অনুসন্ধান ইঞ্জিনগুলিতে দুর্দান্ত দেখাচ্ছে এবং আরও সমৃদ্ধ ব্রাউজারগুলির জন্য কাস্টম ফন্ট রয়েছে।

এইচটিএমএল:

<h1><span>Welcome to Hell on Wheels</span></h1>

সিএসএস:

h1 {
    background: url(welcome.gif) no-repeat;
    display: block;
    height: 68px;
    width: 415px;
}
h1 span { display: none; }

আউটপুট:

এটি কর্মে দেখুন ।

আপনি এই পদ্ধতিটি (যথাযথ ট্যাগ এবং স্মার্ট উপায়ে লুকানো শৈলী) দিয়ে প্রতিস্থাপন করতে পারবেন এমন পাঠ্যের পরিমাণের আসলেই সীমা নেই's তবে সত্যই সত্য যে আপনার ক্লায়েন্টটি যে কাস্টম ফন্টটি ব্যবহার করতে চায় তা সাধারণ ওয়েব ফন্টগুলির চেয়ে অনেক কম পঠনযোগ্য। আপনি সত্যিই তাকে কথা বলতে চেষ্টা করা উচিত।

Comments

আপনি কি এটি পাঠ্য ব্রাউজারগুলিতে পরীক্ষা করেছেন? আমি জানি অনেক স্ক্রীন পাঠক display: noneপাঠ্য উপেক্ষা করে এবং আমি মনে করি কেবল পাঠ্য ব্রাউজারগুলিও তা করে।

— লজ মেজেস্টে

উভয় lynxএবং linksপাঠ্য প্রদর্শন করুন। এটি যদি স্ক্রিন পাঠকদের ক্ষেত্রে সমস্যা হয় তবে আমি এটি ব্যবহার করব h1 span { position: absolute; left: -9999px; }। যদিও পরীক্ষার জন্য আমার কাছে কোনও স্ক্রিন রিডার নেই।

— আনিকা ব্যাকস্ট্রোম

আমি অনুমান করি আপনি ঠিক বলেছেন, তবে সচেতন থাকুন যে এটি বেশিরভাগ স্ক্রিনের পাঠকদের জন্য কাজ করবে না: css-discuss.incutio.com/wiki/Screenreader_Visibility এছাড়াও আমি উইন্ডোতে পরীক্ষার জন্য এনভিডিএ ব্যবহার করি। আপনি যদি এটি পরীক্ষা করে দেখতে চান তবে এটি একটি ফস স্ক্রিন রিডার।

— লজ ম্যাজেস্টে

Answer 8

sFIR পারে এই উদ্দেশ্যে কাজ করে, কিন্তু এটি ব্যবহার রিসোর্স নিবিড় ক্লায়েন্ট সাইড উপর হতে হবে এবং এটি বিভ্রান্তিকর হতে পারে যদি আপনি পাঠ্য এম্বেড লিঙ্ক করা প্রয়োজন।

Comments

তবুও, এটি বডি টেক্সট হিসাবে চিত্র থাকার চেয়ে 100% ভাল। এটি কোনও ওয়েবসাইটটিতে আপনি করতে পারেন এমন সবচেয়ে কম পেশাদার

— কাজগুলির মধ্যে

Answer 9

1. শুধু ওয়েবফন্ট ব্যবহার করুন । কার্যত যে কোনও ব্রাউজার এগুলি সঠিকভাবে প্রদর্শন করবে (যদি আপনি সেগুলি বিকল্প ফর্ম্যাটে রাখেন)। কেবলমাত্র তাদের নিয়মিত ফাইল (যা তারা) হোস্ট করুন। এখানে সত্যিই ভাল টিউটোরিয়াল । আরও একটি সুবিধা: গুগলকে কীভাবে চালিত করা যায় তা চিন্তা করার দরকার নেই

2. এসআইএফআর , কুফান , এফএলআইআর বা অন্যান্য চিত্রের স্প্রাইটস - এটি সত্যই পুরানো শৈলীর ষাঁড়-ক্র্যাব যা অজানা কারণে উদ্ভাবিত হয়েছিল;) এটি ব্যবহার করবেন না।

3. একটি দম্পতি ছবিতে প্রচুর পাঠ্য টাইপ করা হয় এটি:

   • দীর্ঘ লোড সময়
   • অ্যান্টি-সিও (অবশ্যই আপনি ক্লোনিং ব্যবহার করতে পারেন এবং গুগল বট এবং ব্যবহারকারীর কাছে বিভিন্ন সামগ্রী পরিবেশন করতে পারেন তবে এটি কেবল আরও কাজ এবং পরীক্ষামূলক এবং ঝুঁকিপূর্ণ [প্রতিদ্বন্দ্বী সাইটের মালিকরা আপনাকে গুগলে বলতে পারে:])

Answer 10

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

Comments

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

— গত

Answer 11

উত্তরের জন্য এখানে প্রচুর দুর্দান্ত বিকল্প। মনে হচ্ছে ফন্ট কাঠবিড়ালি (http://www.fontsquirrel.com/fontface/generator) একটি উল্লেখের দাবিদার। এবং হ্যাঁ, গুগল ফন্ট এপিআইগুলিও দুর্দান্ত।

চিত্র প্রতিস্থাপনের ক্ষেত্রে, ব্যক্তিগতভাবে আমি কোনও উপাদানটিতে একটি স্প্যানের সুপারিশ করতাম, স্প্যানের পিতামাতার হিসাবে চিত্রটি as তবে প্রদর্শনের পরিবর্তে: স্প্যানের কোনওটি নয়, অবস্থান: একে একে স্ক্রিনটি বন্ধ করে দেওয়া। এইভাবে পর্দার পাঠকরা এখনও সেই সামগ্রীটি পান।

আমি মনে করি মনে হচ্ছে পর্দা ছাড়িয়ে ইনডেন্টের বাইরে চলে এসেছিল, তবে সম্ভবত আমি আমার মূর্খ প্যান্টটি পেয়েছি।

তবে দ্বিগুণও হ্যাঁ - এই ফন্টগুলি এম্বেড করুন।

Comments

ওহ, এবং এখানে সিফার এবং কিউফনের বিরুদ্ধে আমার ভোট।

— ফোকরাশ

Answer 12

ফন্ট কাঠবিড়ালি থেকে ফন্ট -ফেস কিটগুলির মধ্যে একটি ব্যবহার করুন । কিটটি 4 টি বিভিন্ন ফন্ট ফর্ম্যাট এবং সেগুলি ব্যবহারের জন্য প্রয়োজনীয় সঠিক সিএসএস সরবরাহ করে। সমস্ত আধুনিক ব্রাউজারে এবং লিগ্যাসি আইই সংস্করণগুলিতেও কাজ করে!

Answer 13

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

Comments

যদিও এটি আমার কাছে কিছুটা দায়িত্বজ্ঞানহীন বলে মনে হচ্ছে ..

— জেফ

ঠিক আছে, তারপরে কীভাবে পাঠ্যগুলির জন্য চিত্র ব্যবহার করে তার প্রিয় ওয়েবসাইটটির ক্লোন তৈরি করা এবং ক্লোনটির hostsদিকে ইঙ্গিত করার জন্য তার ফাইলটি সংশোধন করা , এবং 2 সপ্তাহের জন্য তাকে সেই সাইটটি ব্যবহার করতে বাধ্য করবেন?

— লজ মেজেস্টে

@ জেফ ভাল, আমি কিছুটা জিভ ইন গাল ছিল ......

— ডেভিড হেফারনান