Anonim

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

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

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

আপনার ব্রাউজারে যে কোনও ওয়েব পৃষ্ঠা সম্পাদনা করুন

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

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

আমি ফায়ারফক্স ব্যবহার করি তাই এটি কীভাবে ব্যবহার করব তা আমি আপনাকে দেখাব। ক্রোম যদিও একই রকম।

  1. আপনি আপনার ব্রাউজারে পরীক্ষা করতে চান এমন একটি ওয়েবপৃষ্ঠা খুলুন।
  2. পৃষ্ঠার যে কোনও জায়গায় ডান ক্লিক করুন এবং পরীক্ষা করুন নির্বাচন করুন।

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

আপনি যদি নীচের ফলকে লাইনগুলিতে আপনার কার্সারটি চালান তবে আপনি ওয়েব পৃষ্ঠার হাইলাইটের বিভিন্ন অংশ দেখতে পাবেন। হাইলাইট চলাকালীন আপনি যে কোডের লাইনটি রয়েছেন তা হ'ল কোড যা পৃষ্ঠার সেই অংশটিকে প্রভাবিত করে।

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

পারফরম্যান্স অনসাইট এসইওর জন্য দরকারী তবে মেমরি, নেটওয়ার্ক এবং স্টোরেজ তেমন ব্যবহার হয় না।

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

একটি পৃষ্ঠায় পরিবর্তন করা

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

  1. আপনি যে সঠিক উপাদানটি পরিবর্তন করতে চান তা ডান ক্লিক করুন এবং পরীক্ষা করুন নির্বাচন করুন।
  2. 'শিরোনাম' বা 'এইচ 1' দিয়ে লাইনটি হাইলাইট করুন যাতে শীর্ষ ফলকে পাঠ্যটি হাইলাইট করা হয়।
  3. বাম দুটি প্যানে নেভিগেট করুন এবং ফন্টের রঙ সন্ধান করুন।
  4. মানটিকে আলাদা কিছুতে পরিবর্তন করুন বা একটি নির্বাচক ব্যবহার করতে রঙিন ডট নির্বাচন করুন।

আপনার পরিবর্তনটি শেষ করার সাথে সাথে পরিবর্তনটি উপস্থিত হবে। আপনি রঙ, আকার, ফন্ট, ব্যাকগ্রাউন্ড এবং ফন্টের সবকিছু পরিবর্তন করতে পারেন। আপনি কাজটি সংরক্ষণ করতে পারবেন না তবে আপনার পরিবর্তনগুলি সেই সেশনের জন্য থাকবে।

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

আপনার ব্রাউজারে একটি ওয়েব পৃষ্ঠা সম্পাদনা করা পরীক্ষা বা পৃষ্ঠাগুলির সাথে চারপাশে খেলার একটি ঝরঝরে উপায়। ব্যয়বহুল বিকাশকারী সরঞ্জাম না কিনে ওয়েব বিকাশ সম্পর্কে কিছুটা শেখার এটিও একটি ভাল উপায়। এখন আপনি কিভাবে জানেন, যান এবং একটি খেলা আছে!

আপনার ব্রাউজারে কীভাবে কোনও ওয়েব পৃষ্ঠা সম্পাদনা করবেন