HTML থেকে PNG কনভার্টার

Q: PNG-এর ব্যাকগ্রাউন্ড কি সাদার বদলে স্বচ্ছ হতে পারে?

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

Q: লম্বা পেজের শুধু উপরের অংশের ছবি কীভাবে বানাব?

**ছবি** অপশনটি প্রতি পৃষ্ঠায় একটি করে নিন এবং **পৃষ্ঠা** প্রথম পৃষ্ঠা রাখুন। তাহলে পুরো দৈর্ঘ্যের বদলে প্রথম পেজ-মাপের অংশটি পাবেন। পরে ঠিক ফ্রেমে কাটতে [ছবি ক্রপ](/crop-image) টুল ব্যবহার করুন।

সেভ করা ওয়েব পেজ, ড্যাশবোর্ড এক্সপোর্ট বা কম্পোনেন্ট মকআপকে এমন PNG-তে রূপান্তর করুন, যেখানে প্রতিটি অক্ষর ও সরু রেখা ব্রাউজার যেমন এঁকেছিল ঠিক তেমনই থাকে। উইন্ডোর প্রস্থ বেছে নিন, লেআউট সেই অনুযায়ী সাজবে।

অথবা DOC, DOCX, DOCM … ফাইল এখানে ড্রop করুন ·

প্রতি ফাইল সর্বোচ্চ 95 MB· সর্বোচ্চ 20টি ফাইল· 30 মিনিট পরে মুছে ফেলা হয়

আউটপুট

যে ফরম্যাটে রূপান্তর

রেজোলিউশন

ছবি

ফাইল আমাদের সার্ভারে প্রসেস করা হয় এবং 30 মিনিট পরে মুছে ফেলা হয়।

এই টুল কীভাবে ব্যবহার করবেন

1
HTML ফাইল যোগ করুন
প্রতি ব্যাচে সর্বোচ্চ ২০টি এবং প্রতিটি ৯৫ MB পর্যন্ত .html, .htm বা .mhtml ফাইল আপলোড করুন। একটি MHTML ফাইল হিসেবে সেভ করা পেজের ভেতরেই তার ছবি ও স্টাইল থাকে।
2
উইন্ডোর প্রস্থ ঠিক করুন
HTML পৃষ্ঠার প্রস্থ শুরুতে 1280 px থাকে। ফোনের লেআউটের জন্য 390 px বা চওড়া ড্যাশবোর্ডের জন্য 1920 px দিন। যে ফরম্যাটে রূপান্তর আগে থেকেই PNG এবং ছবি একটি লম্বা ছবি।
3
PNG-তে কনভার্ট করুন
PNG-এ কনভার্ট করুন চাপুন। পেজের নিজস্ব কোনো ব্যাকগ্রাউন্ড রং না থাকলে এবং ছবিটি অন্য আর্টওয়ার্কের ওপর বসাতে হলে উন্নত সেটিংস-এর ভেতরে স্বচ্ছ ব্যাকগ্রাউন্ড চালু করুন।

উত্তর

HTML কীভাবে PNG-তে কনভার্ট করব?

.html বা .mhtml ফাইল আপলোড করুন, যে স্ক্রিনের মতো দেখাতে চান সেই অনুযায়ী HTML পৃষ্ঠার প্রস্থ ঠিক করুন এবং PNG-এ কনভার্ট করুন চাপুন। রেন্ডার হওয়া পুরো পেজ একটি লসলেস ছবি হিসেবে ফিরে আসবে।

লেখা ও রেখা স্পষ্ট রাখতে হলে HTML থেকে PNG-তে কনভার্ট করুন

PNG ১৯৯৬ সাল থেকে W3C Recommendation এবং এটি লসলেস কম্প্রেশন ব্যবহার করে, তাই 14 px বডি টেক্সটের অ্যান্টি-অ্যালিয়াসড কিনারা, এক পিক্সেলের টেবিল বর্ডার ও সিনট্যাক্স-রঙিন কোড অক্ষত থাকে। এ কারণেই ডেভেলপাররা বাগ রিপোর্টে PNG ক্যাপচার জুড়ে দেন এবং ডিজাইনাররা রিভিউতে শেয়ার করেন: ঝাপসা কিনারা CSS-এর সমস্যা নাকি কম্প্রেশন আর্টিফ্যাক্ট, তা নিয়ে কাউকে ভাবতে হয় না।

এর মূল্য হলো সাইজ। লেখা ও সমতল রঙের পেজ ভালো কম্প্রেস হয়; ছবিতে ভরা পেজ হয় না। ক্যাপচারটি চ্যাট বা ইমেলে যাবে এবং সেখানে ধারালো বিবরণের চেয়ে সাইজ বেশি জরুরি হলে JPG ছোট ফাইল দেয়। ডকুমেন্টেশন, রিলিজ নোট, ড্যাশবোর্ড ও স্টাইল গাইডের জন্য PNG-ই নিরাপদ ডিফল্ট।

প্রস্থই লেআউট ঠিক করে। HTML-এর কোনো নির্দিষ্ট পেজ নেই: একই ফাইল 1280 px-এ তিন কলামের ডেস্কটপ ডিজাইন এবং 390 px-এ একটি সাজানো কলাম দেখায়। কনভার্টার আপনার দেওয়া HTML পৃষ্ঠার প্রস্থ অনুযায়ী পেজ সাজায়, যা 320 থেকে 3840 px-এর মধ্যে হতে পারে, তারপর প্রথম লাইন থেকে ফুটার পর্যন্ত ক্যাপচার করে।

সাধারণ স্ক্রিনের জন্য HTML থেকে PNG কনভার্টারের প্রস্থ

195:422

390 × 844 px

ফোন

সাম্প্রতিক অনেক iPhone-এর CSS ভিউপোর্ট; মোবাইল লেআউট দেখায়

41:59

820 × 1180 px

ট্যাবলেট

পোর্ট্রেটে iPad Air; অনেক সাইট এর কাছাকাছি ব্রেকপয়েন্ট বদলায়

8:5

1280 × 800 px

ল্যাপটপ

এই কনভার্টারের ডিফল্ট প্রস্থ

16:9

1920 × 1080 px

Full HD মনিটর

চওড়া ড্যাশবোর্ড ও অ্যাডমিন প্যানেল

HTML

হাইপারটেক্সট মার্কআপ ল্যাঙ্গুয়েজ

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

কম্প্রেশন: –
স্বচ্ছতা (ট্রান্সপারেন্সি): –
অ্যানিমেশন: –
প্রবর্তনের সাল: 1993 · Tim Berners-Lee; maintained by WHATWG

HTML কনভার্টার

PNG

Portable Network Graphics

PNG একটি লসলেস রাস্টার ফরম্যাট, যা ১৯৯৬ সালে PNG Development Group প্রকাশ করে এবং পরে W3C ও ISO স্ট্যান্ডার্ড করে। এটি প্রতিটি পিক্সেল হুবহু ধরে রাখে, পূর্ণ অ্যালফা ট্রান্সপারেন্সি সমর্থন করে এবং টেক্সট, ধারালো প্রান্ত ও সমতল রং কোনো আর্টিফ্যাক্ট ছাড়াই সামলায়। এই নির্ভুলতার কারণে স্ক্রিনশট, লোগো, আইকন ও ইন্টারফেস গ্রাফিকসের জন্য এটি আদর্শ। দুর্বলতা হলো সাইজ: PNG হিসেবে সেভ করা ছবি একই ছবির JPEG বা WebP-এর চেয়ে প্রায়ই কয়েক গুণ বড় হয়। সব ব্রাউজার, অপারেটিং সিস্টেম ও এডিটর PNG ফাইল খোলে।

কম্প্রেশন: লসলেস
স্বচ্ছতা (ট্রান্সপারেন্সি): হ্যাঁ
অ্যানিমেশন: না
প্রবর্তনের সাল: 1996 · PNG Development Group

PNG কনভার্টার

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

স্টাইল বা ফন্ট না হারিয়ে HTML থেকে PNG-তে কনভার্ট করুন

একটি সাধারণ .html ফাইল প্রায়ই অন্য জায়গায় রাখা জিনিসের ওপর নির্ভর করে: css ফোল্ডারের স্টাইলশিট, আসল সার্ভারের ছবি, ফন্ট সার্ভিসের ফন্ট। এগুলো না থাকলে পেজ ডিফল্ট ফন্টে স্টাইলহীন লেখায় ফিরে যায়। Chrome বা Edge-এ পেজটি Webpage, Single File হিসেবে সেভ করলে একটি .mhtml ফাইল হয় যাতে স্টাইল ও ছবি একসাথে থাকে; আপলোডের জন্য এটিই সবচেয়ে নির্ভরযোগ্য।

ওয়েব ফন্টেও একই নিয়ম। @font-face দিয়ে ঘোষণা করা ফন্ট তখনই লোড হয় যখন তার ফাইল পাওয়া যায়; শুধু আপনার কম্পিউটারে থাকা ফন্টের জায়গায় একটি অনুরূপ ফন্ট বসে। হুবহু টাইপোগ্রাফি জরুরি হলে ফন্ট এমবেড করুন বা পাঠানোর আগে ফলাফল দেখে নিন।

নির্দিষ্ট প্রস্থ থাকলে একটি রিপোর্টের সাপ্তাহিক ক্যাপচার পাশাপাশি তুলনা করা যায়। প্রিন্টের জন্য ফলাফল নির্বাচনযোগ্য লেখা থাকা দরকার হলে বদলে HTML থেকে PDF ফরম্যাট ব্যবহার করুন।

HTML থেকে PNG নিয়ে প্রশ্ন

নিজের ব্রাউজারের স্ক্রিনশটের চেয়ে HTML থেকে PNG কি ভালো?

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

একই পেজের JPG-এর চেয়ে PNG কয়েক গুণ বড় হয় কেন?

PNG প্রতিটি পিক্সেল কোনো ক্ষতি ছাড়াই সংরক্ষণ করে। লেখা ও সমতল রং এভাবে ভালো কম্প্রেস হয়, কিন্তু ছবি, গ্র্যাডিয়েন্ট ও ভিডিও পোস্টার হয় না, তাই প্রচুর ছবিওয়ালা ল্যান্ডিং পেজের PNG বড় হতে পারে। এমন পেজের জন্য HTML থেকে JPG হালকা বিকল্প; কোড নমুনা, চার্ট ও UI-এর ক্ষেত্রে ঝাপসা হওয়ার ক্ষতি সাধারণত মেনে নেওয়া ঠিক নয়।

PNG-এর ব্যাকগ্রাউন্ড কি সাদার বদলে স্বচ্ছ হতে পারে?

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

কনভার্টার কি পেজের JavaScript চালায়?

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

লম্বা পেজের শুধু উপরের অংশের ছবি কীভাবে বানাব?

ছবি অপশনটি প্রতি পৃষ্ঠায় একটি করে নিন এবং পৃষ্ঠা প্রথম পৃষ্ঠা রাখুন। তাহলে পুরো দৈর্ঘ্যের বদলে প্রথম পেজ-মাপের অংশটি পাবেন। পরে ঠিক ফ্রেমে কাটতে ছবি ক্রপ টুল ব্যবহার করুন।