সিএসএস, জেএস এবং এইচটিএমএলের জন্য কোড পর্যালোচনা নির্দেশিকা


9

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


1
এটি ঠিক আজ এইচএন তে ছিল, এটি শুরু করার জন্য ভাল জায়গা হতে পারে। taitems.github.com/
ফ্রন্ট-

উত্তর:


5

দেখার জন্য কয়েকটি বিষয়:

  • কাঠামোগত তথ্য উপযুক্ত HTML ট্যাগ ব্যবহার করে চিহ্নিত করা হয়? H1- H6শিরোনাম, UL/ OLএবং LIতালিকার জন্য, ইত্যাদি?
  • কোন উত্তরাধিকার এইচটিএমএল ট্যাগ (পেরেছেন <b>, <i>, <center>, <font>) ব্যবহার?
  • সাইট কি কমপক্ষে মার্কআপ ব্যবহার সম্ভব?
  • শৈলীর তথ্য কি CSS ফাইলগুলিতে বহিরাগত?
  • সমস্ত জাভাস্ক্রিপ্ট বহিরাগত? ইভেন্ট হ্যান্ডলার সহ?
  • সিএসএস ক্লাসের নামগুলি কি পৃষ্ঠায় ( img-caption) ফাংশনটি ( এবং bold-red) ফর্ম ( ) বা সামগ্রী ( pink-elephant) নয়?
  • চিত্রগুলি কি উপযুক্ত বিন্যাসে রয়েছে (প্রকারের উপর নির্ভর করে পিএনজি বা জেপিগ)?
  • জাভাস্ক্রিপ্ট লাইব্রেরির ন্যূনতম সংস্করণ ব্যবহার করা হয়েছে?
  • Allyচ্ছিকভাবে, সমস্ত স্থানীয়ভাবে বিকাশযুক্ত জাভাস্ক্রিপ্ট এবং সিএসএস ফাইলগুলি হ্রাস করা হয়েছে?
  • এইচটিএমএল / সিএসএস কি বৈধতা দেয়?
  • পারফরম্যান্স চেক / অপ্টিমাইজ করার জন্য ওয়াইস্লো (বা অনুরূপ) ব্যবহার করা হয়েছে?
  • (বেশিরভাগ) [এসইও] জাভাস্ক্রিপ্টের সাহায্যে সাইটটি কী অ্যাক্সেসযোগ্য?
  • [এসইও] কি এইচটিএমএলের শীর্ষে সর্বাধিক প্রাসঙ্গিক সামগ্রী পাওয়া যায়?

আমি মাত্র দ্রুত ওয়েবসাইটে স্টিভ স্যান্ডার্সের বইটি পেয়েছি। এটি বেশ সহায়ক এবং আপনি উল্লেখ করেছেন এমন কিছু বিষয় ভাল are
কুমার

0

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

এটি অ-প্রবেশমূলক মার্কআপের সাথেও করতে হবে। পরিবর্তে <font style="color:red;font-size:16pt">Hello</font>এক ব্যবহার করতে হবে <div class="red-colored-big-fond">Hello</div>

জাভাস্ক্রিপ্ট একই। <button onclick="javascript:alert('a');">Clickme</button>একের পরিবর্তে একটি বোতাম শ্রেণি / আইডি নির্দিষ্ট করে জাভাস্ক্রিপ্ট থেকে এটি লক্ষ্যবস্তু করা হবে। এটি আপনার মার্কআপ কোড বজায় রাখা আরও সহজ করে তোলে।


0

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

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

.arial12pt { font-family: Verdana; font-size: 8pt; }

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


0

এইচটিএমএল যতদূর যায়, আমি সবসময় আমার ফাইলগুলিতে শ্রেণিবদ্ধতা এবং ইন্ডেন্টেশন করার জন্য একটি পয়েন্ট করি make উদাহরণস্বরূপ, যদি আমার কাছে একগুচ্ছ ডিভস থাকে:

<div id="content">
   <div id="post">
     <div class="title">
       Blah Blah Title
     </div>
   </div>
</div>

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

#whatever{
    background-image: url('blah.gif');
    color: #FFF000;
}

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

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


0

জাভাস্ক্রিপ্টের জন্য আমি সর্বদা এটি JSLint এর সাথে যাচাইকরণ করতে চাই, আমি এতগুলি বাগের কথা ভাবতে পারি যে জেএসলিন্ট ধরেছে যে এটি ব্যবহার না করা কেবল পাগল।


0

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

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