براؤزر میں تصویر کاٹنے کا طریقہ کار
کاٹنے کا عمل Canvas API کا استعمال کرتے ہوئے مکمل طور پر آپ کے براؤزر ٹیب میں چلتا ہے۔ کوئی سرور سائیڈ پروسیسنگ نہیں، کوئی اپ لوڈ نہیں، کوئی تھرڈ پارٹی سروس نہیں۔ ہر مرحلہ آپ کے آلے پر ہوتا ہے۔
- تصویر کو
<img>عنصر میں لوڈ کریں تاکہ براؤزر اسے مقامی طور پر ڈی کوڈ کرے۔ ایک کینوس اوورلی تصویر کو ویو پورٹ کے مطابق پیمانہ کر کے دکھاتا ہے جبکہ ایک قابل گھسیٹ انتخاب مستطیل موجودہ کاٹنے والے علاقے کو ظاہر کرتا ہے۔ - مستطیل کو اس کے کناروں یا کونوں سے گھسیٹ کر کاٹنے کے علاقے کو ایڈجسٹ کریں۔ مستطیل تصویر کی حدود تک محدود رہتا ہے تاکہ آپ تصویر سے باہر کا علاقہ منتخب نہ کر سکیں۔ جب کوئی مقررہ پہلو تناسب فعال ہو (1:1، 16:9، 4:3)، سائز تبدیل کرنا خود بخود اس تناسب کو برقرار رکھتا ہے۔
- پکسل ریڈ آؤٹ گھسیٹتے ہی براہِ راست اپ ڈیٹ ہوتا ہے، موجودہ کاٹنے کی چوڑائی، اونچائی، X اور Y پوزیشنز تصویر کے پکسل کوآرڈینیٹ میں دکھاتا ہے۔ یہ آپ کو بغیر اندازے کے عین طول و عرض ہدف بنانے دیتا ہے۔
- جب آپ «کاٹیں اور ڈاؤن لوڈ کریں» پر کلک کرتے ہیں، صفحہ سورس تصویر کے صرف منتخب علاقے کو ایک آف اسکرین کینوس پر اصل پکسل ریزولوشن میں کھینچتا ہے، پھر نتیجہ
canvas.toBlob()کے ذریعے سورس فائل جیسے ہی فارمیٹ میں برآمد کرتا ہے۔ ڈاؤن لوڈ کے لیے ایک Blob URL بنایا جاتا ہے۔
تصاویر آن لائن کیوں کاٹیں؟
- کاٹنا ناپسندیدہ کناروں، خالی جگہوں یا بصری بے ترتیبی کو ختم کرتا ہے۔ ایک ہی کاٹنے کا عمل اکثر کسی بھی فلٹر یا رنگ ایڈجسٹمنٹ سے زیادہ تصویر کی ساخت کو بہتر بناتا ہے۔
- پہلو تناسب کا کنٹرول اشاعت کے پلیٹ فارمز کے لیے ضروری ہے۔ سوشل میڈیا فیڈز پروفائلز کے لیے 1:1، ویڈیو تھمب نیلز کے لیے 16:9 اور معیاری فوٹوگرافی کے لیے 4:3 کی توقع کرتی ہیں۔ صحیح تناسب پر کاٹنا اپ لوڈ کرتے وقت عجیب لیٹر باکسنگ یا کٹ آف سے بچاتا ہے۔
- کلائنٹ سائیڈ کاٹنا لاکڈ ڈاؤن کارپوریٹ ڈیوائسز پر واحد آپشن ہے جن میں فوٹو ایڈیٹر کی کمی ہے۔ چونکہ کچھ اپ لوڈ نہیں ہوتا، ڈیٹا لیک کا کوئی خطرہ نہیں اور حساس تصاویر کے لیے کسی تعمیل جائزے کی ضرورت نہیں۔
- لائیو ڈائمینشن ریڈ آؤٹ اندازے کو ختم کرتا ہے۔ آپ گھسیٹتے ہی پکسل کوآرڈینیٹ اور انتخاب کا سائز دیکھتے ہیں، لہٰذا آپ پکسل پیمائش کے آلے پر سوئچ کیے بغیر عین چوڑائی اور اونچائی پر کاٹ سکتے ہیں۔
کاٹنے کے عام استعمال
کاٹنا ویب پبلشنگ، سوشل میڈیا اور سافٹ ویئر ڈیولپمنٹ میں سب سے عام تصویری ترامیم میں سے ہے۔ یہاں تین نمونے ہیں جہاں براؤزر پر مبنی کاٹنے کا آلہ وقت بچاتا ہے۔
- آن لائن سٹور کے لیے پروڈکٹ فوٹوز تیار کرنا۔ 1:1 یا 4:5 کے یکساں پہلو تناسب پر کاٹیں تاکہ ہر لسٹنگ تھمب نیل گرڈ میں سیدھ میں آئے۔ برآمد اصل فارمیٹ کو محفوظ رکھتی ہے، لہٰذا JPEG پروڈکٹ شاٹس JPEG ہی رہتے ہیں۔
- دستاویزات یا بگ رپورٹس کے لیے اسکرین شاٹس تراشنا۔ تصویر کو ٹکٹ یا پل ریکویسٹ میں منسلک کرنے سے پہلے براؤزر ٹول بار، ونڈوز ٹاسک بار یا حساس نوٹیفیکیشنز کاٹ کر ہٹا دیں۔
- لینڈنگ پیج کے لیے ہیرو امیج یا بینر تیار کرنا۔ 16:9 کا پری سیٹ لاک کریں، تصویر کے سب سے اہم حصے کو کاٹنے والے مستطیل کے مرکز میں رکھیں، اور ریٹینا ڈسپلے پر بہترین معیار کے لیے اصل ریزولوشن پر برآمد کریں۔
عملی مثال: 4000×3000 تصویر کو ہیرو بینر کے لیے 1200×675 پر کاٹنا
ڈیجیٹل کیمرے سے 4000×3000 پکسل کی تصویر عام ویب ہیرو بینر کے لیے بہت بڑی ہوتی ہے۔ بینر کی جگہ 1200×675 (16:9 فریم) ہو سکتی ہے۔
تصویر کو اپ لوڈ زون میں ڈالیں۔ تصویر مکمل ریزولوشن پر لوڈ ہوتی ہے لیکن آرام دہ گھسیٹنے کے تعامل کے لیے ویو پورٹ میں سمٹ جاتی ہے۔ 16:9 پہلو تناسب کا پری سیٹ منتخب کریں۔ کاٹنے کا مستطیل فوراً تصویر میں فٹ ہونے والے سب سے بڑے 16:9 علاقے پر جکڑ جاتا ہے۔ مستطیل کو گھسیٹ کر فوکل پوائنٹ — پہاڑ کی چوٹی، پروڈکٹ، کسی کا چہرہ — کو فریم میں رکھیں۔ لائیو ریڈ آؤٹ موجودہ انتخاب کو 4000×2250 (پوری تصویر کی 16:9 ونڈو) پر دکھاتا ہے۔ کونے کے ہینڈل کو پکڑ کر اندر کی طرف گھسیٹیں جب تک چوڑائی کا ریڈ آؤٹ 1200 px تک نہ پہنچ جائے۔ چونکہ تناسب مقفل ہے، اونچائی خود بخود فالو کرتی ہے۔ کاٹیں اور ڈاؤن لوڈ کریں پر کلک کریں۔ صفحہ اصل پکسلز سے منتخب 1200×675 علاقہ نکالتا ہے اور کٹی ہوئی فائل کو سورس فارمیٹ میں فراہم کرتا ہے۔ پورا چکر ایک یا دو سیکنڈ لیتا ہے اور ابتدائی صفحہ لوڈ کے علاوہ کوئی نیٹ ورک بینڈوڈتھ استعمال نہیں کرتا۔
کاٹنے کے لیے تصویری فارمیٹس کون سے ہیں؟
یہ آلہ کسی بھی فارمیٹ کو قبول کرتا ہے جسے براؤزر ڈی کوڈ کر سکے: PNG، JPEG اور WebP تقریباً تمام حقیقی استعمال کے معاملات کو کور کرتے ہیں۔ کٹا ہوا آؤٹ پٹ سورس فائل جیسے ہی فارمیٹ میں محفوظ ہوتا ہے۔ PNG بغیر نقصان کے رہتا ہے، JPEG اپنے اصل معیار کی سطح برقرار رکھتا ہے، اور WebP ویسے ہی رہتا ہے۔ فارمیٹ سورس فائل کے MIME ٹائپ سے پتہ چلتا ہے۔
کیا کاٹنے سے تصویر کا فائل سائز کم ہوتا ہے؟
کاٹنا پکسلز ہٹاتا ہے، لہٰذا آؤٹ پٹ کا فائل سائز عام طور پر سورس سے چھوٹا ہوتا ہے، خاص طور پر جب آپ بڑی بارڈر یا خالی جگہ کاٹ دیتے ہیں۔ برآمد اصل فائل فارمیٹ اور اس کے انکوڈنگ پیرامیٹرز استعمال کرتی ہے — PNG بغیر نقصان کے رہتا ہے، JPEG اپنی اصل کوالٹی سیٹنگ برقرار رکھتا ہے — لہٰذا بچت صرف کم پکسلز کی وجہ سے ہوتی ہے، دوبارہ کمپریشن سے نہیں۔
پہلو تناسب کے پری سیٹس کیا کرتے ہیں؟
پری سیٹس (1:1، 16:9، 4:3، 3:2، 9:16) کاٹنے والے مستطیل کے چوڑائی سے اونچائی کے تناسب کو مقفل کرتے ہیں۔ جب کوئی پری سیٹ فعال ہوتا ہے، کسی بھی کونے یا کنارے کے ہینڈل کو گھسیٹنے سے انتخاب کے سائز میں تبدیلی آتی ہے جبکہ تناسب مستقل رہتا ہے۔ فری موڈ پر سوئچ کرنے سے پابندی ہٹ جاتی ہے تاکہ آپ مستطیل کو من مانی طور پر سائز تبدیل کر سکیں۔ تناسب تصویر کے پکسل کوآرڈینیٹ پر لاگو ہوتا ہے، لہٰذا برآمد شدہ آؤٹ پٹ کا پہلو تناسب بالکل وہی ہوتا ہے جو آپ نے منتخب کیا تھا۔
کیا تصویر کسی سرور پر اپ لوڈ ہوتی ہے؟
نہیں۔ تصویر کبھی آپ کے آلے سے باہر نہیں جاتی۔ صفحہ براؤزر کے File API کا استعمال کرتے ہوئے تصویر کو میموری میں پڑھتا ہے اور Canvas API کا استعمال کرتے ہوئے کاٹتا اور نتیجہ برآمد کرتا ہے۔ آپ اپنے براؤزر کا DevTools Network پینل کھول کر تصدیق کر سکتے ہیں — کاٹنے کے دوران صرف بیرونی درخواستیں ابتدائی صفحہ لوڈ اور اشتہاری کالز ہیں۔ تصویری ڈیٹا منتقل نہیں ہوتا۔
کیا میں عین پکسل کوآرڈینیٹ داخل کر کے مخصوص علاقہ کاٹ سکتا ہوں؟
موجودہ ورژن تصویر کے پیش نظارہ پر گھسیٹ کر کاٹنے کے مستطیل کو ایڈجسٹ کرتا ہے۔ آپ انتخاب کے X، Y، چوڑائی اور اونچائی کے لائیو پکسل کوآرڈینیٹ پڑھ سکتے ہیں۔ کاٹنے والے مستطیل کے لیے براہِ راست عددی ان پٹ v1 میں دستیاب نہیں ہے لیکن مستقبل کی اپ ڈیٹ کے لیے منصوبہ بند اضافہ ہے۔
اصل تصویر کا کیا ہوتا ہے؟
اصل فائل آپ کے آلے پر رہتی ہے۔ صفحہ اسے ڈسپلے اور کاٹنے کے لیے براؤزر میموری میں پڑھتا ہے، لیکن ڈسک پر سورس فائل میں کبھی ترمیم نہیں کرتا۔ کٹا ہوا آؤٹ پٹ ایک نئی فائل ہے جسے آپ علیحدہ ڈاؤن لوڈ کرتے ہیں۔ اصل آپ کے کمپیوٹر یا فون پر اپنی اصل جگہ پر بغیر کسی تبدیلی کے رہتا ہے۔
کیا کاٹنے کے لیے فائل سائز کی کوئی حد ہے؟
یہ آلہ کمزور ڈیوائسز پر براؤزر میموری کو کنٹرول میں رکھنے کے لیے اپ لوڈ زون میں 30 MB فی فائل کی حد نافذ کرتا ہے۔ اگر آپ کی تصویر 30 MB سے بڑی ہے، تو آپ اسے یہاں کاٹنے کے لیے لوڈ کرنے سے پہلے کسی مخصوص امیج ریسائزر ٹول سے پہلے چھوٹا کر سکتے ہیں۔
کیا کاٹنا موبائل فونز اور ٹیبلیٹس پر کام کرتا ہے؟
جی ہاں۔ کاٹنے کے ہینڈلز کو ٹچ ٹارگٹس کو مدنظر رکھ کر سائز کیا گیا ہے، اور تعامل پوائنٹر ایونٹس کا استعمال کرتا ہے جو ماؤس کلکس اور انگلی کے ٹیپس دونوں کے ساتھ کام کرتے ہیں۔ فون کی اسکرین پر تصویر کا پیش نظارہ دستیاب چوڑائی کے مطابق ڈھل جاتا ہے، اور کنٹرولز آسان ایک ہاتھ سے استعمال کے لیے عمودی طور پر ترتیب پاتے ہیں۔