এইচটিএমএলে বিন্যাসের জন্য টেবিলগুলি ব্যবহার করবেন না কেন? [বন্ধ]


665

এটি সাধারণ মতামত বলে মনে হয় যে টেবিলগুলি এইচটিএমএলে বিন্যাসের জন্য ব্যবহার করা উচিত নয়।

কেন?

এর জন্য আমি কখনও ভাল যুক্তি দেখিনি (বা খুব কমই সত্যই বলা যায়)। সাধারণ উত্তরগুলি হ'ল:

  • সামগ্রীটিকে বিন্যাস থেকে আলাদা করা ভাল
    তবে এটি একটি মিথ্যা যুক্তি; ক্লিচ থিংকিং । আমার ধারণা এটি সত্য যে লেআউটটির জন্য সারণী উপাদানটি ব্যবহার করে তা টেবুলার ডেটার সাথে খুব কমই রয়েছে। তাতে কি? আমার বস যত্ন করে? আমার ব্যবহারকারীরা কি যত্ন করে?

    সম্ভবত আমি বা আমার সহযোগী বিকাশকারীদের যাদের একটি ওয়েব পৃষ্ঠার যত্ন বজায় রাখতে হবে ... একটি টেবিল কি কম রক্ষণাবেক্ষণযোগ্য? আমি মনে করি একটি টেবিল ব্যবহার করা ডিভ এবং সিএসএস ব্যবহারের চেয়ে সহজ

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

  • কোডটির পঠনযোগ্যতা
    আমি মনে করি এটি অন্যভাবে। বেশিরভাগ লোক এইচটিএমএল বোঝে, কিছু সিএসএস বোঝে।

  • টেবিল ব্যবহার না করা এসইওর পক্ষে ভাল
    ? কেউ কি কিছু প্রমাণ করতে পারে যে এটি? অথবা গুগলের পক্ষ থেকে একটি বিবৃতি যে টেবিলগুলি এসইও দৃষ্টিকোণ থেকে নিরুৎসাহিত করা হয়?

  • টেবিলগুলি ধীরে ধীরে।
    একটি অতিরিক্ত টবি উপাদান toোকাতে হবে। এটি আধুনিক ওয়েব ব্রাউজারগুলির জন্য চিনাবাদাম। আমাকে এমন কিছু মানদণ্ডগুলি দেখান যেখানে কোনও টেবিলের ব্যবহারটি কোনও পৃষ্ঠাকে উল্লেখযোগ্যভাবে ধীর করে দেয়।

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

আমি টেবিলের পরিবর্তে divs + CSS ব্যবহার করতে ভাল যুক্তিতে আগ্রহী।


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

একটা ডুপ্লিকেট প্রশ্ন ও একটি এ stackoverflow.com/questions/30251/tables-instead-of-divs
Onorio Catenacci

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

1
@ কামিলো এসও এখনও 20 শতকে বেঁচে আছেন। জেফ দৃশ্যত ulট্যাগটি কীভাবে ব্যবহার করবেন তা জানেন না । এই সাইটে সমস্ত তালিকা (ব্যাজ, সম্পর্কিত প্রশ্ন, সাম্প্রতিক ট্যাগগুলি) দেখুন। এগুলি সমস্তই একক কলাম বা দীর্ঘ অনুচ্ছেদে পৃথক করা হয়েছে br
ইয়ি জিয়াং

2
@ ব্র্যাড: কিছু নির্দিষ্ট বিবরণের উপর নির্ভর করে (যে কোনও চালাক কমব্যাকের জন্য এটি আমার আউট আউট ;-) যে ডিআইভির ব্যবহার টেবিলগুলি অপব্যবহারের চেয়ে আরও ভাল। একে অপরের পাশাপাশি যে ডকুমেন্টের দু'টি অংশ রাখা হয় তা ডিআইভি উপাদানগুলিতে বৈধভাবে থাকতে পারে তবে সেগুলি অবশ্যই টেবুলার ডেটা নয়। একটি নির্দিষ্ট স্টাইলিং কী হয় তা বিবেচ্য নয়; বিষয়বস্তু হয় হয় সারণী বা না। দ্রষ্টব্য: আমিও ডিআইভিটাইটিসের পরামর্শ দিচ্ছি না :)
ববি জ্যাক

উত্তর:


496

আমি একের পর এক আপনার যুক্তি দিয়ে যাচ্ছি এবং সেগুলির মধ্যে ত্রুটিগুলি দেখানোর চেষ্টা করব।

সামগ্রীটিকে বিন্যাস থেকে আলাদা করা ভাল তবে এটি একটি মিথ্যা যুক্তি; ক্লিচ inking থিংকিং।

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

তাতে কি? আমার বস যত্ন করে? আমার ব্যবহারকারীরা কি যত্ন করে?

নির্ভর করে। আপনার বস কি নমনীয় কেশিক? তারপরে সে পাত্তা দিবে না। তিনি যদি সক্ষম হন তবে তিনি যত্নবান হবেন, কারণ ব্যবহারকারীরা তা করবেন

সম্ভবত আমি বা আমার সহযোগী বিকাশকারীদের যাদের একটি ওয়েব পৃষ্ঠার যত্ন বজায় রাখতে হবে ... একটি টেবিল কি কম রক্ষণাবেক্ষণযোগ্য? আমার মনে হয় একটি টেবিল ব্যবহার করা ডিভ এবং সিএসএস ব্যবহারের চেয়ে সহজ।

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

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

গভীরভাবে নেস্ট করা <div>গুলি হ'ল টেবিল লেআউটগুলির মতো একটি অ্যান্টি-প্যাটার্ন। ভাল ওয়েব ডিজাইনারদের তাদের অনেকের প্রয়োজন নেই। অন্যদিকে, এমন গভীর-নেস্টেড ডিভগুলিতেও টেবিল বিন্যাসগুলির অনেক সমস্যা নেই। প্রকৃতপক্ষে, তারা সামগ্রীগুলিকে যৌক্তিকভাবে অংশগুলিতে বিভক্ত করে একটি অর্থগত কাঠামোয় অবদান রাখতে পারে।

কোডটির পঠনযোগ্যতা আমি মনে করি এটি অন্যভাবে। বেশিরভাগ মানুষ এইচটিএমএল বোঝে, সিএসএস কম বোঝে। এটা সহজ।

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

টেবিল ব্যবহার না করা SEO এর পক্ষে ভাল for

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

টেবিলগুলি ধীরে ধীরে। একটি অতিরিক্ত টবি উপাদান toোকাতে হবে। এটি আধুনিক ওয়েব ব্রাউজারগুলির জন্য চিনাবাদাম।

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

আমাকে এমন কিছু মানদণ্ডগুলি দেখান যেখানে কোনও টেবিলের ব্যবহারটি কোনও পৃষ্ঠাকে উল্লেখযোগ্যভাবে ধীর করে দেয়।

দুর্ভাগ্যক্রমে, আমার কাছে কোনও মানদণ্ডের ডেটা নেই। আমি নিজেই এতে আগ্রহী হব কারণ এটি ঠিক যে এই যুক্তিতে একটি নির্দিষ্ট বৈজ্ঞানিক কঠোরতা নেই right

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

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

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


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

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

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

109
একটি স্ক্রিন রিডার পান এবং এটি কোনও টেবিল বিন্যাস সহ একটি পৃষ্ঠা পড়ুন। এটাই সব।
কোরিমাথিউজ

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

290

একটি সিমিয়ার থ্রেড থেকে আমার প্রোগ্রামারের উত্তর এখানে

শব্দার্থবিদ্যা 101

প্রথমে এই কোডটি একবার দেখুন এবং এখানে কী সমস্যা তা নিয়ে ভাবেন ...

class car {
    int wheels = 4;
    string engine;
}

car mybike = new car();
mybike.wheels = 2;
mybike.engine = null;

সমস্যাটি অবশ্যই, বাইকটি গাড়ি নয়। গাড়ির ক্লাসটি বাইকের উদাহরণের জন্য একটি অনুপযুক্ত শ্রেণি class কোডটি ত্রুটি-মুক্ত, তবে শব্দার্থগতভাবে ভুল। এটি প্রোগ্রামারের উপর খারাপভাবে প্রতিফলিত করে।

শব্দার্থবিদ্যা 102

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

উপসংহার

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


39
দুঃখিত, এটি জল ধরে না। আপনি মাইবাইকটির জন্য গাড়ি ব্যবহার করবেন না কারণ আপনি পরিবর্তে একটি "বাইক" শ্রেণি সংজ্ঞায়িত করবেন। আপনি "<table>" এর জন্য অন্য কিছু সংজ্ঞায়িত করতে পারবেন না কারণ এটি একটি সিমেন্টিক ট্যাগের চেয়ে বেশি - এটি ব্রাউজারকে জানায় যে কীভাবে এটির বিষয়বস্তু রেন্ডার করা যায়।
জিমি

57
দুর্দান্ত উপমা এবং দুর্দান্ত উপসংহার। কেন কাউকে নিজের মালিক এবং / বা ব্যবহারকারীদের সঠিক কাজ করতে বাধ্য করা উচিত? কেউ কি আর নিজের কাজে গর্ব করে না?
শেরম পেন্ডলি

39
আমি মনে করি এটি বেশ অহংকারী পোস্ট যা কোনও ব্যাখ্যা দেয় না তবে প্রশ্নের উত্তর না দিয়ে আবার একই দাবিগুলির পুনরাবৃত্তি করে। আমি বুঝতে পারছি না কেন এটি এত উপকার পেয়েছে ????
মার্কাস

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

16
@ থারকুন এবং রিচার্ড: কীভাবে "শব্দার্থগতভাবে ভুল" বিষয়গত হয় এবং কোনও ব্যাখ্যা দেয় না?
ভিঙ্কো ভার্সালোভিক

104

সুস্পষ্ট উত্তর: সিএসএস জেন গার্ডেন দেখুন । আপনি যদি আমাকে বলেন যে আপনি টেবিল-ভিত্তিক বিন্যাসের সাথে সহজেই এটি করতে পারেন (মনে রাখবেন - এইচটিএমএল পরিবর্তন হচ্ছে না) তবে বিন্যাসের জন্য সমস্ত উপায়ে টেবিলগুলি ব্যবহার করুন।

আরও দুটি গুরুত্বপূর্ণ বিষয় হ'ল অ্যাক্সেসযোগ্যতা এবং এসইও।

উভয়ই কি অর্ডার তথ্য উপস্থাপন করা হয় সে সম্পর্কে যত্নশীল। আপনার টেবিল-ভিত্তিক লেআউটটি যদি পৃষ্ঠার ২ য় নেস্টেড টেবিলের ২ য় সারির 3 র্থ কক্ষে রাখে তবে আপনি সহজেই পৃষ্ঠার শীর্ষে নেভিগেশন উপস্থাপন করতে পারবেন না।

সুতরাং আপনার উত্তরগুলি রক্ষণাবেক্ষণযোগ্যতা, অ্যাক্সেসযোগ্যতা এবং এসইও।

অলসতা করবেন না। কিছু শিখতে শক্ত হলেও এমনকি জিনিসগুলিকে সঠিক এবং সঠিক উপায়ে করুন।


24
জেন গার্ডেনে প্রায়শই ব্যবহৃত কৌশলটি চিত্র দ্বারা টেক্সটটি প্রতিস্থাপন করে এবং এটি সিএসএসে সংজ্ঞায়িত করে, যাতে এটি এইচটিএমএল থেকে অদৃশ্য হয়ে যায়। খুব, খুব ভুল।
জিভিএস

3
আমি দুঃখিত তবে এটি ঠিক নেই। পাঠ্যটি এখনও এইচটিএমএলে রয়েছে - এটি সিএসএসজেডিজি ডিজাইনের একটি প্রয়োজনীয়তা। এইচটিএমএল অপরিবর্তিত থাকতে হবে।
এরল্যান্ডো

10
আপনি যদি কিছু ডিজাইন ঘনিষ্ঠভাবে দেখে থাকেন তবে কিছু শিরোনামের পাঠ্যটি এইচটিএমএলের পাঠ্য থেকে পৃথক। কারণ এইচটিএমএলটি অদৃশ্য হয়ে গেছে এবং পরিবর্তে একটি চিত্র .োকানো হয়েছে। (উদাহরণ: csszengarden.com/?cssfile=/212/212.css&page=0 , পথে অ্যাচিভমেন্ট???)
GvS

6
দুঃখিত, ডিব লেআউটগুলি এসইওর পক্ষে আরও ভাল কোনও প্রমাণ নেই। এছাড়াও, গুগল নিজেই বলেছে যে এইচটিএমএল বৈধতা তাদের কাছে কিছু যায় আসে না - কিছুটা আলাদা সমস্যা তবে টেবিলগুলির দিকে লক্ষ্য করে কারণ তারা খুব কমই বৈধতা দেয়।
অসন্তুষ্ট গোট

“আপনারা বেশিরভাগই একজন প্রোগ্রামারের গুণাবলী সম্পর্কে পরিচিত। অবশ্যই তিনটি রয়েছে: অলসতা, অধৈর্যতা এবং হুব্রিস। " - ল্যারি ওয়াল
inkredibl

91

এই সদৃশ প্রশ্নটি দেখুন।

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

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

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


হ্যাঁ ... সত্যিই। আমি দেখতে পাই যে সদৃশ। অামি এটি মিস করেছি. প্রতিশ্রুতি ছাড়াও প্রয়োজনীয় যে কোনও পদক্ষেপ আমি পরের বারে আরও যত্নবান হব :-)?
বেনো রিখটারস

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

8
আমি এই উত্তরটি সত্যিই পছন্দ করি। শব্দার্থগত অর্থপূর্ণ ট্যাগগুলি ব্যবহার করা কেবল traditionতিহ্যের বিষয় নয়, এটি সেই অস্পষ্ট নন-ব্রাউজারগুলিকে (স্ক্রিন পাঠক, স্ক্রিন স্ক্র্যাপার, বিভিন্ন পার্সার) আপনার পৃষ্ঠায় থাকা বিভিন্ন অবজেক্টকে সঠিকভাবে শ্রেণিবদ্ধ করার অনুমতি দেয়।
ফ্যান্টম ওয়াটসন

6
আমি আশা করছিলাম যে কেউ এটি উল্লেখ করবে। অ্যাক্সেসিবিলিটি শীর্ষস্থানীয় হওয়া উচিত!
অ্যান্ড্রু

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

54

দুর্ভাগ্যক্রমে, সিএসএস জেন গার্ডেন আর ভাল HTML / CSS ডিজাইনের উদাহরণ হিসাবে ব্যবহার করা যাবে না। কার্যত তাদের সাম্প্রতিক সমস্ত ডিজাইন বিভাগ শিরোনামের জন্য গ্রাফিক্স ব্যবহার করে। এই গ্রাফিক ফাইলগুলি সিএসএসে নির্দিষ্ট করা আছে।

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

যা কেবলমাত্র এটি দেখায় যে, যারা কঠোর ডিআইভি ও সিএসএস ধর্মের পক্ষেও তাদের পক্ষে, তারা তাদের নিজস্ব বিধি অনুসরণ করতে পারে না। আপনি এটিকে কতটা কাছাকাছি অনুসরণ করেন তার গাইডলাইন হিসাবে আপনি এটি ব্যবহার করতে পারেন।


18
আপনি বলতে চাচ্ছেন তারা করছেন <h1>Some Text</h1>তাদের CSS এবং তারপর: h1 { background-image('foo.jpg'); text-indent:-3000px }? এটি করার সঠিক উপায় এটি কারণ আপনি স্টাইল-কম এইচটিএমএলতে সর্বাধিক শব্দার্থক তথ্য ধরে রাখছেন। অথবা আমি আপনাকে ভুল বুঝেছি।
করণ 1

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

36
@ অ্যামব্রোজ: কারণ ফ্রিগিন সাইটের পুরো পয়েন্টটি বিষয়বস্তু এবং শৈলীর বিভাজন প্রদর্শন করা। সামগ্রী এবং স্টাইলটি সঠিকভাবে বিভিন্ন ব্যক্তিদের দ্বারা পরিচালিত হওয়া উচিত, যাদের উভয়েরই মধ্যে অন্যেরা কী বদলেছে তা "মনে রাখতে" হবে না।
জেমস কারান

5
মিঃ এস এন্ড এন: এটি বিষয়টিকে আরও খারাপ করে দেবে। সঠিক গতিতে আপনাকে गतिशीलভাবে নতুন চিত্র তৈরি করতে হবে in সুতরাং এখন আপনি স্টাইলিং CSS থেকে ব্যবসায় স্তর কোডে সরিয়ে নিয়েছেন।
জেমস কুরান

9
@ জেমস: সামগ্রী এবং স্টাইল সর্বদা বিভিন্ন ব্যক্তি পরিচালনা করতে পারে না। সামগ্রী যখন স্টাইলাইজড হয় তখন অবশ্যই সহযোগিতা ঘটে। এর <h1><img src="something.png"></h1>চেয়ে আর রক্ষণাবেক্ষণ কীভাবে <h1 class="something image">Something</h1>? উভয় উদাহরণে काहीतरी.png আপডেট করা দরকার। তবে দ্বিতীয় উদাহরণটি অনেক বেশি অ্যাক্সেসযোগ্য।
জোশ

48

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


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

আমি আমার অ্যাপ্লিকেশনগুলির সাথে এটি হিট করেছি; ছেলে যখন খুশি হয়েছিলাম তখন আমি বুঝতে পেরেছিলাম যে পর্দার মতো একই পৃষ্ঠাগুলির জন্য কিছু প্রিন্ট সিএসএস দিয়ে "প্রিন্টার বান্ধব" সংস্করণটি তৈরি করা কতটা সহজ ছিল।
লরেন্স ডল

45

বিন্যাসের জন্য একটি টেবিলটি খারাপ হবে না। তবে আপনি বেশিরভাগ সময় কেবল একটি টেবিলের সাহায্যে আপনার প্রয়োজনীয় বিন্যাসটি পেতে পারেন না। খুব শীঘ্রই আপনার কাছে 2 বা তিনটি নেস্টেড টেবিল রয়েছে। এটি খুব জটিল হয়ে ওঠে।

  • এটি পড়া খুব শক্ত। এটা মতামত আপ না। সেখানে আরও কিছু নেস্টেড ট্যাগ রয়েছে যার উপর তাদের চিহ্নিত করার চিহ্ন নেই।

  • উপস্থাপনা থেকে সামগ্রী পৃথক করা একটি ভাল জিনিস কারণ এটি আপনাকে যা করছেন তার উপর ফোকাস করার অনুমতি দেয়। দুটি লিড মিশ্রিত করে পুষ্পিত পৃষ্ঠাগুলি যা পড়া শক্ত।

  • শৈলীর জন্য সিএসএস আপনার ব্রাউজারটিকে ফাইলগুলি ক্যাশে করার অনুমতি দেয় এবং পরবর্তী অনুরোধগুলি আরও দ্রুত are এটি বিশাল।

  • টেবিলগুলি আপনাকে একটি নকশায় লক করে। অবশ্যই, প্রত্যেকেরই সিএসএস জেন গার্ডেনের নমনীয়তার প্রয়োজন নেই, তবে আমি এমন কোনও সাইটে কাজ করিনি যেখানে এখানে এবং সেখানে ডিজাইনটি সামান্য কিছুটা বদলাতে হবে না। এটি CSS এর মাধ্যমে অনেক সহজ easier

  • টেবিলগুলি স্টাইল করা শক্ত। এগুলির সাথে আপনার খুব বেশি নমনীয়তা নেই (যেমন কোনও টেবিলের শৈলী সম্পূর্ণরূপে নিয়ন্ত্রণ করতে আপনার এখনও HTML বৈশিষ্ট্য যুক্ত করতে হবে)

আমি সম্ভবত 4 বছরের মধ্যে নন-ট্যাবুলার ডেটার জন্য টেবিলগুলি ব্যবহার করি নি। আমি আর ফিরে তাকাতে হয়নি।

আমি সত্যিই অ্যান্ডি বুডের সিএসএস মাস্টারি পড়ার পরামর্শ দিতে চাই । এটি আসাধারন.

ছবিটি এক্সেক্স.আইমেজেস-amazon.com http://ecx.images-amazon.com/images/I/41TH5NFKPEL._SL500_BO2,204,203,200_PIsitb-dp-500-arrow,TopRight,45,-64_OU01_AA240_SH20_.jpg


1
আমি এই বইটি খুব পুনঃব্যবহার করতে পারি
জ্যাকব টি। নীলসন

বক্স মডেল, নির্বাচক এবং অবস্থান নির্ধারণের জন্য ভাল উদাহরণ রয়েছে।
কেএমনে

36

সামগ্রীটিকে বিন্যাস থেকে আলাদা করা ভাল
তবে এটি একটি মিথ্যা যুক্তি; ক্লিচ থিংকিং

এটি একটি মিথ্যা যুক্তি কারণ এইচটিএমএল টেবিলগুলি লেআউট! সামগ্রীটি টেবিলের ডেটা , উপস্থাপনাটি টেবিলের নিজস্ব itself এই কারণেই এইচটিএমএল থেকে সিএসএসকে পৃথক করা অনেক সময় কঠিন হতে পারে। আপনি উপস্থাপনা থেকে সামগ্রী আলাদা করছেন না, আপনি উপস্থাপনা থেকে উপস্থাপনাটি পৃথক করছেন! নেস্টেড ডিভসের একটি গাদা একটি টেবিলের চেয়ে আলাদা নয় - এটি কেবল ট্যাগগুলির আলাদা সেট।

এইচটিএমএলকে সিএসএস থেকে আলাদা করার সাথে অন্য সমস্যা হ'ল তাদের একে অপরের অন্তরঙ্গ জ্ঞান প্রয়োজন - আপনি সত্যই এগুলিকে সম্পূর্ণ আলাদা করতে পারবেন না। এইচটিএমএলে ট্যাগ লেআউটটি আপনি যেই করেন না কেন সিএসএস ফাইলের সাথে দৃ tight়তার সাথে মিলিত হয়।

আমি মনে করি ডিভ বনাম টেবিলগুলি আপনার অ্যাপ্লিকেশনটির প্রয়োজনীয়তার জন্য নেমে এসেছে।

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

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


6
স্ক্রিনরেডারগুলি টেবিলগুলি ঠিক আছে .. ঠিক আছে .. সমস্যাটি স্ক্রিনরেডারদের সাথে টেবিলগুলি আচরণ করে না that's একটি টেবিল-ভিত্তিক লেআউটটি অ্যাক্সেসযোগ্য উপায়ে তথ্য উপস্থাপনের প্রবণ। ডানদিকের ন্যাভিগেশনটি দেখতে কেমন হবে তা চিন্তা করুন। এটি পৃষ্ঠার বেশ নিচে হবে।
এরল্যান্ডো

ঠিক আছে, তারপরে তা বোঝা যায় - ধন্যবাদ!
26

8
বেশিরভাগ স্ক্রিন এজেন্টগুলিতে <টেবিল> বা <ডিভি> এর একটি ডিফল্ট উপস্থাপনা থাকে বলে সেগুলিকে উপাদানগুলির উপাদানগুলির পরিবর্তে উপস্থাপনা উপাদান হিসাবে তুলনা করে না।
মার্ক ব্র্যাকেট

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

1
"আমি এটি কাজ করার জন্য চেষ্টা করে দিন কাটিয়েছি" - যদি আমি কিছু বের করার চেষ্টা করি তবে কয়েক ঘন্টা বেশি সময় লাগে তবে আমি এটি স্ট্যাকওভারফ্লো সম্প্রদায়টিতে রেখেছি। কীভাবে কিছু সঠিকভাবে করা যায় তা না জেনে রাখা সঠিকভাবে না করার জন্য কোনও অজুহাত নয়। বিশেষত যখন আমাদের সমস্ত উত্তর আমাদের নখদর্পণে থাকে।
ডেভদেভ

23

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

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

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

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

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

কেস পয়েন্ট ইন - এই আলোচনার ভিত্তিতে আমি কয়েকটি বিদ্যমান টিডিএস এবং টিআরএসকে ডিভগুলিতে রূপান্তর করেছি। 45 মিনিট এ নিয়ে গোলমাল করার সাথে সবকিছু একে অপরের পাশে লাইনে দাঁড়ানোর চেষ্টা করা হয়েছিল এবং আমি ছেড়ে দিয়েছি। পরে 10 সেকেন্ডের মধ্যে টিডি ফিরে আসে - সমস্ত ব্রাউজারগুলিতে - সরাসরি কাজ করে - আর কিছু করার নেই। দয়া করে আমাকে বোঝানোর চেষ্টা করুন - আমাকে অন্য কোনও উপায়ে এটি করার জন্য আপনার পক্ষে কী ন্যায়সঙ্গততা আছে!


আমি এই পোস্টের সাথে আরও একমত হতে পারে না। আমি যে দশ বছরে ডিজাইনে এসেছি, আমি একক সময়ের কথা ভাবতে পারি না যেখানে যুক্তি "আমরা সিএসএস ব্যবহার করি কারণ এটি সাইটব্যাপী পরিবর্তনগুলি পরিচালনা করা সহজ করে তোলে" সঠিক হিসাবে চালিত হয়েছিল।
ড্যানিয়েল জাজো

6
সাইটওয়াইড পরিবর্তনগুলি পরিচালনা করা সহজ করে কি জানেন? এমভিসি এবং টেম্পলেট সিস্টেমগুলি
জিয়াআরও

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

21

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

যদি এটি আপনাকে "ডাব্লুটিএফ" বলে না তোলে তবে আপনার এখন কুল-সহায়তাটি নিচে রাখা দরকার।

আমি সিএসএস ভালবাসি। এটি আশ্চর্যজনক স্টাইলিং বিকল্পগুলি এবং কিছু শীতল অবস্থানের সরঞ্জাম সরবরাহ করে তবে লেআউট ইঞ্জিন হিসাবে এটির ঘাটতি। কিছু ধরণের ডায়নামিক গ্রিড পজিশনিং সিস্টেম থাকা দরকার। প্রথমে তাদের আকারগুলি না জেনে একাধিক অক্ষের বাক্সগুলিকে সারিবদ্ধ করার একটি সহজ উপায়। আপনি যদি এটিকে <table> বা <gridlayout> বা যাই হোক না কেন বলেন তবে আমি কোনও জবাব দিচ্ছি না, তবে এটি সিএসএস থেকে অনুপস্থিত একটি বেসিক লেআউট বৈশিষ্ট্য।

বৃহত্তর সমস্যাটি হ'ল এখানে থাকা বৈশিষ্ট্যগুলি রয়েছে বলে স্বীকার না করে, সিএসএস জেলিয়টরা সিএসএসকে যা কিছু হতে পারে সব থেকে পিছনে ফেলেছে। CSS যদি মূলত বিশ্বের প্রতিটি অন্যান্য লেআউট ইঞ্জিনের মতো শালীন বহু-অক্ষ গ্রিড পজিশন সরবরাহ করে তবে আমি টেবিলগুলি ব্যবহার বন্ধ করতে পুরোপুরি খুশি হব। (আপনি কি বুঝতে পেরেছেন যে ডাব্লু 3 সি ব্যতীত সকলের দ্বারা বহু ভাষাতেই এই সমস্যা ইতিমধ্যে বহুবার সমাধান করা হয়েছে, তাই না? এবং অন্য কেউ অস্বীকার করেনি যে এই বৈশিষ্ট্যটি কার্যকর ছিল))

দীর্ঘশ্বাস. যথেষ্ট ভেন্টিং ing এগিয়ে যান এবং আপনার মাথাটি বালির পিছনে আটকে দিন।


"সিএসএস জেলিয়টস" (যেমন আপনি এটি রেখেছেন) এই সত্য সম্পর্কে অজ্ঞ নয়। পরবর্তী সিএসএস স্পেসে কেবল একটি নয়, সিএসএসে লেআউটগুলির সাথে সমস্যাগুলি সমাধান করার দুটি সমাধান রয়েছে। টেমপ্লেট লেআউটগুলি: w3.org/TR/css3-layout এবং গ্রিড পজিশনিং: w3.org/TR/css3- গ্রিড এটি প্রতিযোগিতামূলক চশমা প্রবর্তন করে না। 2 চশমা আসলে একে অপরের পরিপূরক। যদিও এই মন্তব্যটি লেখার সময় হিসাবে, এখনও কোনও ব্রাউজার এটি প্রয়োগ করে না।
ড্যান হারবার্ট

+1: আমি পুরোপুরি একমত আপনার "এটি কাজ করতে হবে" উচিত নয় (যদিও আমি টেবিলগুলিও পছন্দ করি না)।
ইলেক্ট্রোলগস

আমি ঠিক কেমন অনুভব করছি এটাই 100%। আমি আশা করি আমি আপনাকে উপরের উত্তরে উত্সাহ দিতে পারতাম।
ববউইনহোল্ট

19

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

আপনি যদি প্রতিটি ডিভের জন্য নাম নির্দিষ্ট করে দেন তবে আপনি সেগুলি সিএসএস ব্যবহার করে একসাথে ত্বক করতে পারেন। আপনার যেমনভাবে প্রয়োজন ঠিক তেমন বসার জন্য তারা কেবল আরও কিছুটা বেদনা পান।


18

সাম্প্রতিক প্রকল্পের এইচটিএমএলের একটি বিভাগ এখানে রয়েছে:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>{DYNAMIC(TITLE)}</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel="stylesheet" type="text/css" href="./styles/base.css" />
</head>
<body>
    <div id="header">
        <h1><!-- Page title --></h1>
        <ol id="navigation">
            <!-- Navigation items -->
        </ol>
        <div class="clearfix"></div>
    </div>
    <div id="sidebar">
        <!-- Sidebar content -->
    </div>
    <!-- Page content -->
    <p id="footer"><!-- Footer content --></p>
</body>
</html>

এবং এখানে একটি টেবিল ভিত্তিক লেআউট হিসাবে একই কোড।

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>{DYNAMIC(TITLE)}</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <link rel="stylesheet" type="text/css" href="./styles/base.css" />
</head>
<body>
    <table cellspacing="0">
        <tr>
            <td><!-- Page Title --></td>
            <td>
                <table>
                    <tr>
                        <td>Navitem</td>
                        <td>Navitem</td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>

    <table>
        <tr>
            <td><!-- Page content --></td>
            <td><!-- Sidebar content --></td>
        </tr>
        <tr>
            <td colspan="2">Footer</td>
        </tr>
    </table>
</body>
</html>

টেবিল ভিত্তিক লেআউটে আমি কেবল পরিষ্কার-পরিচ্ছন্নতা দেখি তা হ'ল আমি আমার ইন্ডেন্টেশনটি নিয়ে অত্যধিক বিরক্ত। আমি নিশ্চিত যে সামগ্রী বিভাগে আরও দুটি এমবেডেড টেবিল থাকবে।

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


3
গতি একমাত্র জিনিস নয় যা বৃহত্তর ফাইলগুলির দ্বারা ক্ষতিগ্রস্থ হয়: অনেক সংস্থা ব্যান্ডউইথের জন্য অর্থ প্রদান করে। আপনি যদি ভালভাবে কোডিং করে আপনার ক্লায়েন্টের ব্যান্ডউইথ বিলগুলি অর্ধেক কেটে ফেলতে পারেন তবে এটি একটি দুর্দান্ত সুবিধা।
মিঃ শাইনি এবং নিউ 安 宇

2
হ্যাঁ তবে ভুলে যাবেন না যে এইচটিএমএল সিএসএস-কম লেআউটে দ্বিগুণ আকারের হতে পারে, তবে একটি ডিআইভি + সিএসএস লেআউট ব্যবহার করার ফলে সিএসএস ফাইলের জন্য একটি অতিরিক্ত এইচটিটিপি অনুরোধ হবে, এবং এর জন্য ব্যান্ডউইথের ব্যবহার ফাইল নিজেই।
সোনাররাটিও

12
তবে সিএসএস ফাইলটি কেবল একবার ডাউনলোড করা দরকার, যেখানে প্রতিটি পৃষ্ঠার অনুরোধে পুরো টেবিলের কাঠামোটি আবার পাঠানো হয়।
ব্যবহারকারী 151841

3
আপনি ডিভ + সিএসএসের জন্য উপযুক্ত উপযুক্ত একটি নকশা বেছে নিয়েছেন এবং দেখিয়েছেন যে এটি কোনও টেবিল-ভিত্তিক ডিজাইনে আরও ভার্জোজ? সুতরাং কী: টেবিল-ভিত্তিক লেআউটের পক্ষে উপযুক্ত এমন একটি নকশা তৈরি করা এবং সিএসএসে এটির প্রতিরূপ তৈরি করতে আপনাকে হুপ করতে হবে এমন হুপগুলি প্রদর্শন করা ঠিক তত সহজ।
ড্রিমন

4
@ ড্রেমন: সম্ভবত আপনি একটি উদাহরণ দিতে চান?
ববি জ্যাক

14

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

অর্থ কোডের দৃষ্টিকোণ থেকে আপনার কোডটিরও অর্থ রয়েছে ।


আমার স্বপ্নের একটি গ্রাফিক ডিজাইনার রয়েছে যা আমি সরবরাহ করি সেগুলি অবলম্বন করে / ডেটা নিয়ে যায় এবং সিএসএস, ডিআইভি, টেবিল সম্পর্কে আমার কোনও যত্ন না করেই এগুলিকে একটি পৃষ্ঠায় রেখে দেয় ... :)
ম্যানরিকো কোরাজি

আমি দ্বিতীয় যে ম্যানরিকো - একটি ভিজ্যুয়াল ডিজাইনার যা আপনাকে একটি বিন্যাস তৈরি করতে এবং স্থির এবং শতাংশের মাত্রা সংজ্ঞায়িত করতে এবং তারপরে ন্যূনতম এইচটিএমএল এবং সিএসএস তৈরি করার সুযোগ দেয়, এটি অত্যন্ত কার্যকর হবে!
রিচার্ড ইভ

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

13

ডিআইভিতে কোনও যুক্তি আমার পক্ষে নেই।

আমি বললাম: জুতো ফিট হলে পরুন।

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

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


1
আপনি যদি সমস্ত ব্রাউজারগুলিতে কাজ করে এমন ডিভস + সিএসএস সহ একটি দুটি বা তিনটি কলাম ওয়েবসাইট তৈরি করতে চান তবে আপনার কোনও উপায়ে স্ক্র্যাচ শুরু করা উচিত নয়। ওয়েব থেকে প্রচুর নগ্ন হাড় টেম্পলেট রয়েছে যা আপনি বেস হিসাবে ব্যবহার করতে পারেন। এগুলি সাধারণত সমস্ত ব্রাউজারগুলিতে সঠিকভাবে ডিসপ্লিয়া করতে অনুকূলিত হয় 6++
আর্তুরহ

13

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

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

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

বাস্তবতাত্ত্বিকভাবে আমি মনে করি ডিভগুলিকে কিছুটা পরিবর্তন না করে ডিভ এবং সিএসএস-ভিত্তিক ডিজাইনের বিন্যাসটি পুরোপুরি পরিবর্তন করা খুব শক্ত। তবে একটি ডিভ এবং সিএসএস-ভিত্তিক বিন্যাসের সাহায্যে বিভিন্ন ব্লক এবং তাদের আপেক্ষিক আকারের মধ্যে ব্যবধানের মতো জিনিসগুলিকে টুইঙ্ক করা অনেক সহজ।


13

এটি একটি আলোচিত বিতর্কিত প্রশ্ন হ'ল ডাব্লু 3 সি ব্যর্থতায় লেআউট ডিজাইনের বৈচিত্র্য অনুধাবন করার ব্যর্থতার প্রমাণ test শব্দার্থ-বান্ধব বিন্যাসের জন্য ডিভিড + সিএসএস ব্যবহার করা একটি দুর্দান্ত ধারণা, তবে বাস্তবায়নের বিশদটি এতটাই ত্রুটিযুক্ত যে এগুলি আসলে সৃজনশীল স্বাধীনতার সীমাবদ্ধ করে।

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

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


12

আমার ধারণা এটি সত্য যে লেআউটটির জন্য সারণী উপাদানটি ব্যবহার করে তা টেবুলার ডেটার সাথে খুব কমই রয়েছে। তাতে কি? আমার বস যত্ন করে? আমার ব্যবহারকারীরা কি যত্ন করে?

Google এবং অন্যান্য স্বয়ংক্রিয় সিস্টেম কি যত্ন, এবং তারা ঠিক যেমন অনেক পরিস্থিতিতে গুরুত্বপূর্ণ নন। অজ্ঞান-বুদ্ধিমান সিস্টেমটির বিশ্লেষণ ও প্রক্রিয়াজাতকরণের জন্য শব্দার্থক কোডটি আরও সহজ।


হ্যাঁ, উদাহরণস্বরূপ ব্লগের ইঞ্জিন মন্তব্যগুলি ব্লগ পোস্ট থেকে পৃথক করে। কল্পনা করুন যে লেআউটটি টেবিলগুলি সহ স্টাইল করা হয়েছে ..
ওমর আবিদ

2
-1: আপনি যদি বিন্যাসের জন্য সারণী ব্যবহার করেন তবে গুগল একেবারেই সামান্যতম যত্ন করে না।
টম অ্যান্ডারসন

@ টম অ্যান্ডারসন লেআউটের জন্য টেবিল ব্যবহার করার ক্ষেত্রে তাদের কোনও সমস্যা রয়েছে বলে নয়, কেবল কারণ নন-টেবিল এইচটিএমএল আরও শব্দার্থক হতে থাকে।
ceejayoz

8

কোনও অ্যাপ্লিকেশন দ্বারা উত্পন্ন নেস্টেড টেবিলগুলির 6 স্তরকে জড়িত এমন একটি ওয়েবসাইটের সাথে কাজ করা এবং এটি অবৈধ এইচটিএমএল তৈরি করার পরে, এটি একটি সামান্য পরিবর্তনের জন্য ব্রেকিংটিকে সংশোধন করা আসলে 3 ঘন্টা কাজ ছিল।

এটি অবশ্যই প্রান্তের কেস, তবে টেবিল ভিত্তিক নকশাটি অভাবনীয়। আপনি যদি সিএসএস ব্যবহার করেন তবে আপনি স্টাইলটি আলাদা করে রাখবেন তাই এইচটিএমএল ফিক্স করার সময় আপনার ভাঙ্গার চিন্তাভাবনা কম।

এছাড়াও, জাভাস্ক্রিপ্ট দিয়ে এটি ব্যবহার করে দেখুন। একটি একক টেবিল ঘর অন্য স্থানের টেবিলের এক স্থান থেকে অন্য স্থানে নিয়ে যান। বরং ডিভ / স্প্যানটি কেবল অনুলিপি-পেস্ট-ভিত্তিতে কাজ করবে এমন পরিবেশনা করা জটিল।

"আমার বস যত্ন করে"

আমি যদি তোমার বস হতাম আপনি যত্ন নিতে হবে। ;) আপনি যদি নিজের জীবনকে মূল্য দেন।


এমন একটি ওয়েবসাইটের সাথে কাজ করতে হয়েছে যা স্প্যান এবং ডিআইভি ট্যাগগুলির একটি বিশাল স্যুপ ছিল এবং একটি উপাদান পরিবর্তন করার সময় এটির ভঙ্গুরতা দেখে পুরো পৃষ্ঠাটি (এবং ট্যাগগুলি শিরোনামের পরিবর্তে ব্যবহৃত
ডিভস

ডিভ এর ব্যবহার স্পষ্টত আপনার কোডটিকে যাদুকরভাবে সুন্দর করে তোলে না। ট্যাগের যথাযথ অর্থ ব্যবহারের জন্য অনেক কিছু বলা যায়।
কেন্ট ফ্রেড্রিক

7

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

রক্ষণাবেক্ষণ
উপরের মতো একই অবস্থা এখন আপনি তৃতীয় সারিতে তিনটি থাম্বনেইল যুক্ত করতে চান।
ডিআইভি: এগুলিতে যুক্ত
করুন The বিন্যাসটি স্বয়ংক্রিয়ভাবে সামঞ্জস্য হবে।
সারণী: নতুন ঘরগুলি তৃতীয় সারিতে আটকান। ওহো! এখন সেখানে প্রচুর আইটেম রয়েছে। সেই সারি থেকে কিছু কেটে চতুর্থ সারিতে রাখুন। এখন সেখানে প্রচুর আইটেম রয়েছে। সেই সারিটি থেকে কিছু কাটা ... (ইত্যাদি)
( অবশ্যই, আপনি যদি সার্ভার-সাইড স্ক্রিপ্টিং সহ সারি এবং ঘরগুলি তৈরি করে থাকেন তবে সম্ভবত এটি কোনও সমস্যা হবে না ))


7

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


5

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

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


আপনি সেখানে ভাল পয়েন্ট; তবে মোবাইল ডিভাইসগুলির জন্য ইউআইআই IMHO ইনপুট সীমাবদ্ধতা বিবেচনায় নেওয়া সম্পূর্ণ আলাদা হওয়া উচিত।
ম্যানরিকো কোরাজি

সত্য; এ কারণেই আমি মাঝে মাঝে একটি ভিন্ন পদ্ধতির ব্যবহার শুরু করেছি। এমভিসি মডেলটিতে, আমার ভিউটি কেবলমাত্র এক্সএমএল কাঁচা ডেটা অর্থাৎ সামগ্রী হিসাবে পপ আউট করুন। তারপরে আর একটি এমভিসি মডেল দিয়ে শুরু করুন যেখানে এক্সএমএল কাঁচা ডেটা = মডেল; ভিউ = এইচটিএমএল / সিএসএস; নিয়ামক = এক্সএসএল। এক্সএসএল স্টাইলশিটটি মোবাইলের জন্য অপ্রয়োজনীয় ডেটা শুদ্ধ করে।
সোয়াতি

5

দেখে মনে হচ্ছে আপনি কেবল সারণীতে অভ্যস্ত এবং এটিই। টেবিলের মধ্যে লেআউট স্থাপন কেবলমাত্র সেই লেআউটের জন্য সীমাবদ্ধ। সিএসএসের সাহায্যে আপনি বিটগুলি প্রায় সরিয়ে নিতে পারেন, http://csszengarden.com/ এ একবার দেখুন এবং না, লেআউটটি সাধারণত প্রচুর পরিমাণে নেস্টেড ডিভের প্রয়োজন হয় না।

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

এসইও সুবিধাগুলি পৃষ্ঠায় উচ্চতর গুরুত্বপূর্ণ বিষয়বস্তু রাখার ক্ষমতা থেকে এবং উন্নত সামগ্রী-থেকে-চিহ্নিতকরণ অনুপাতের উন্নতি থেকে আসে।

http://www.hotdesign.com/seybold/


5
  • 508 সম্মতি - আপনার স্ক্রিনারিডারকে আপনার মার্কআপটি উপলব্ধি করার ক্ষমতা।
  • রেন্ডারটির জন্য অপেক্ষা করা হচ্ছে - ব্রাউজারে </table>উপাদানগুলির শেষ না হওয়া পর্যন্ত টেবিলগুলি রেন্ডার করে না ।

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

5

সিমেন্টিক মার্কআপের চারপাশের পুরো ধারণাটি মার্কআপ এবং উপস্থাপনার বিভাজন, যাতে বিন্যাস অন্তর্ভুক্ত।

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

বিকাশকারীদের মার্কআপ সরবরাহ করা বন্ধ করা দরকার যা লেআউটকে বোঝায় যাতে আমাদের মধ্যে যারা বিষয়বস্তু উপস্থাপনের দক্ষতা অর্জন করে তারা আমাদের কাজটি চালিয়ে যেতে পারে এবং উপস্থাপনাগুলির পরিবর্তনের প্রয়োজন হলে বিকাশকারীদের তাদের কোডে ফিরে আসতে হবে না।


4

এটি 'লেআউটের জন্য টেবিলের চেয়ে ডিভগুলি ভাল' কিনা সে সম্পর্কে এটি আসলেই নয়। সিএসএস বোঝে এমন কেউ 'লেআউট টেবিল' ব্যবহার করে বেশ সোজাসাপ্টে যে কোনও ডিজাইনের সদৃশ করতে পারেন। আসল জয় হ'ল এইচটিএমএল উপাদানগুলি যা আছে তার জন্য ব্যবহার করছে। আপনি নন-ট্যাবুলার ডেটার জন্য টেবিলগুলি ব্যবহার করবেন না কারণ একই কারণ হিসাবে আপনি পূর্ণসংখ্যার চরিত্রের স্ট্রিং হিসাবে সংরক্ষণ করেন না - প্রযুক্তিটি যখন আপনি এটির জন্য নির্ধারিত উদ্দেশ্যে ব্যবহার করেন তখন আরও বেশি সহজে কাজ করে। যদি লেআউটের জন্য টেবিলগুলি ব্যবহারের প্রয়োজন ছিল (1990 এর দশকের গোড়ার দিকে ব্রাউজারের স্বল্পতার কারণে) এটি এখন নেই।


3

সারণী বিন্যাসগুলি ব্যবহার করে এমন সরঞ্জামগুলি লেআউটটি তৈরি করতে প্রয়োজনীয় কোডের পরিমাণের কারণে অসাধারণ ভারী হয়ে উঠতে পারে। ডিফল্টরূপে স্যাপের নেটউইভার পোর্টালটি তাদের পৃষ্ঠাগুলি বিন্যাস করতে টেবিল ব্যবহার করে।

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

পৃষ্ঠাগুলির ওজন কমাতে সময় নেওয়া যাতে আপনি আপনার ব্যান্ডউইথ ব্যবহার করতে পারেন ব্যবহারকারীদের সাথে আকর্ষক ক্রিয়াকলাপ করতে।


3

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

উপস্থাপনা থেকে সামগ্রী পৃথক করার ধারণাটি অ্যাপ্লিকেশনটিকে বিভাজন করা যাতে বিভিন্ন ধরণের কাজ কোডের বিভিন্ন ব্লককে প্রভাবিত করে। এটি আসলে পরিবর্তন পরিচালনার বিষয়ে। তবে কোডিং মানগুলি কেবলমাত্র একটি পর্যায়ে পদ্ধতিতে বর্তমান কোডের অবস্থা পরীক্ষা করতে পারে।

অ্যাপ্লিকেশনটির পরিবর্তনের লগ যা "উপস্থাপনা থেকে পৃথক সামগ্রী" কোডিং মানের উপর নির্ভর করে উল্লম্ব সিলোগুলিতে সমান্তরাল পরিবর্তনের একটি প্যাটার্ন দেখায়। যদি "সামগ্রীতে" পরিবর্তনটি সর্বদা "উপস্থাপনার" পরিবর্তনের সাথে থাকে, পার্টিশনটি কতটা সফল?

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


প্রথম দুটি বাক্যটির জন্য +1।
শান ম্যাকমিলান

3

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

কোনও টেবিলের সাথে তাদের লেআউটটি করার বিষয়ে বিবেচনা করে যে কেউ এটি বজায় রাখবেন বলে আশা করবেন না। কোনও ওয়েবসাইট রেন্ডার করার পক্ষে এটি সবচেয়ে সর্বাধিক পিছন দিক। Godশ্বরকে ধন্যবাদ আমাদের কাছে এখন আরও অনেক ভাল বিকল্প রয়েছে। আমি ফিরে যেতে চাই না.

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


3

টেবিলগুলি সিএসএসের তুলনায় সাধারণভাবে সহজ বা বেশি রক্ষণাবেক্ষণযোগ্য নয়। তবে কয়েকটি নির্দিষ্ট বিন্যাস-সমস্যা রয়েছে যেখানে টেবিলগুলি সত্যই সহজতম এবং সবচেয়ে নমনীয় সমাধান।

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

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

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

সারণী ব্যবহার না করার সর্বাধিক গুরুত্বপূর্ণ কারণ হ'ল অ্যাক্সেসযোগ্যতা। ওয়েব সামগ্রীর অ্যাক্সেসিবিলিটি গাইডলাইনগুলি http://www.w3.org/TR/WCAG10/ পরামর্শ আবার বিন্যাসের জন্য সারণী ব্যবহার করে। আপনি যদি অ্যাক্সেসযোগ্যতার বিষয়ে উদ্বিগ্ন হন (এবং কিছু ক্ষেত্রে আপনি আইনত বাধ্য হতে পারেন), টেবিলগুলি সহজতর হলেও আপনার সিএসএস ব্যবহার করা উচিত। নোট করুন যে আপনি সর্বদা টেবিলের মতো সিএসএসের সাথে একই লেআউটটি তৈরি করতে পারেন , এটিতে আরও বেশি কাজের প্রয়োজন হতে পারে।


3

আমি কিছু বিষয় ইতিমধ্যে আচ্ছাদিত ছিল না দেখে অবাক হয়েছি, সুতরাং আমার 2 সেন্ট এখানে আগে দেওয়া সমস্ত বৈধ পয়েন্ট ছাড়াও রয়েছে:

.1। সিএসএস এবং এসইও:

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

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

গ) এসইও কাজের প্রায়শই জিনিস পরীক্ষার এবং পরিবর্তনের প্রয়োজন হয় যা সিএসএস ভিত্তিক লেআউটের সাথে অনেক বেশি সুবিধাজনক

.2। উত্পন্ন সামগ্রী:

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

foreach ($comment as $key=>$value)
{
   echo "<tr><td>$key</td><td>$value</td></tr>";
}

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

তদ্ব্যতীত, যখন একটি টেবিল তৈরি করা হয়, সামগ্রীটি (ভেরিয়েবলগুলিতে) ইতিমধ্যে বিন্যাসের (কোডে) থেকে পৃথক হয়ে গেছে, এটি পরিবর্তন করা সহজ।

এটি বেশ কয়েকটি কারণ খুব ভাল ডিজাইনের ওয়েবসাইট (উদাহরণস্বরূপ) এখনও টেবিল বিন্যাস ব্যবহার করে।

অবশ্যই, যদি জাভাস্ক্রিপ্টের মাধ্যমে ফলাফলগুলি সম্পাদন করা দরকার, তবে ডিভগুলি ঝামেলার পক্ষে।

.3। দ্রুত রূপান্তর পরীক্ষা

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

.4। বিভিন্ন সমস্যার জন্য বিভিন্ন সমাধান

লেআউট টেবিলগুলি সাধারণত বিচ্ছিন্ন করা হয় কারণ "প্রত্যেকে ডিভ এবং সিএসএস জানেন" "

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

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

কিছু সময় আগে, আমাকে টেবিলগুলি ব্যবহার করে একটি পরিষ্কার এবং সাধারণ সিএসএস লেআউটটি নতুন করে লিখতে হয়েছিল কারণ ব্যবহারকারীদের একটি উল্লেখযোগ্য অংশ সিএসএসের জন্য সত্যই খারাপ সমর্থন সহ আইই এর একটি পুরানো সংস্করণ ব্যবহার করবে because

আমি একজনের জন্য হাঁটু ঝাঁকুনির প্রতিক্রিয়া দেখে অসুস্থ এবং ক্লান্ত হয়ে পড়েছি "ওহ নো! লেআউটের টেবিলগুলি!"

"" এটি সেই উদ্দেশ্যটির উদ্দেশ্যে নয় এবং তাই আপনার এটি এইভাবে ব্যবহার করা উচিত নয় "জনতা, সেই ভণ্ডামি কি না? বেশিরভাগ ব্রাউজারগুলিতে ডার্ন জিনিসটি কাজ করতে আপনাকে ব্যবহার করতে হবে এমন সমস্ত সিএসএস কৌশল সম্পর্কে আপনি কী ভাবেন? তারা কি সেই উদ্দেশ্যে বোঝানো হয়েছিল?

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