چگونه اسکرین‌شات کامل صفحه بگیریم: چگونه می‌توان اسکرین‌شات کامل صفحه را در هر دستگاهی گرفت

با راهنمای آسان ما، نحوه گرفتن اسکرین شات کامل از صفحه را یاد بگیرید—ابزارهای داخلی مرورگر، افزونه‌ها و روش‌های موبایلی را برای ثبت تصاویر ایده‌آل بررسی کنید.

چگونه اسکرین‌شات کامل صفحه بگیریم: چگونه می‌توان اسکرین‌شات کامل صفحه را در هر دستگاهی گرفت

هنگامی که می‌خواهید یک صفحه وب را ذخیره کنید، معمولاً به دنبال داستان کامل آن هستید، نه فقط بخشی که روی صفحه‌نمایشتان جا می‌شود. گرفتن یک اسکرین‌شات تمام‌صفحه به معنای ثبت همه‌چیز از بنر بالا تا پاورقی پایین در یک تصویر واحد و منظم است. خبر خوب؟ می‌توانید از فرآیند خسته‌کننده گرفتن چندین اسکرین‌شات و کنار هم قرار دادنشان صرف‌نظر کنید. دو بهترین گزینه شما یک افزونه ساده مرورگر برای ثبت با یک کلیک، یا ابزارهای توسعه‌دهنده خود مرورگر برای یک راه‌حل داخلی هستند.

چرا اسکرین‌شات تمام‌صفحه یک ضرورت مدرن است

آیا تا به حال سعی کرده‌اید یک مقاله طولانی یا رسید آنلاین را ذخیره کنید، اما در نهایت با یک پازل گیج‌کننده از تصاویر ناقص مواجه شده‌اید؟ این یک ناامیدی رایج است. شما فقط بخش‌هایی از صفحه را از دست نمی‌دهید؛ تصویر کامل را از دست می‌دهید. اسکرین‌شات‌های استاندارد نمی‌توانند با وب‌سایت‌های امروزی با اسکرول بی‌پایان کنار بیایند و از ثبت زمینه کامل باز می‌مانند.

دقیقاً به همین دلیل است که دانستن نحوه گرفتن یک اسکرین‌شات تمام‌صفحه به مهارتی حیاتی تبدیل شده است. این فقط یک ترفند جالب نیست؛ بلکه یک ابزار عملی برای طراحان، بازاریابان و در واقع هر کسی است که نیاز به مستندسازی دقیق محتوای وب دارد.

فراتر از پنجره قابل مشاهده

یک اسکرین‌شات معمولی فقط چیزی را که در لحظه می‌بینید ذخیره می‌کند. از طرف دیگر، یک ثبت تمام‌صفحه، کل طول صفحه را در یک تصویر پیوسته با کیفیت بالا ذخیره می‌کند. این برای مجموعه‌ای از وظایف روزمره یک تحول‌آفرین است:

  • بررسی‌های طراحی و تجربه کاربری: تصور کنید می‌خواهید جریان کاربری یک صفحه محصول را فقط با چند تصویر نامرتبط نقد کنید. ثبت کل مسیر، زمینه کامل را به تیم شما می‌دهد.
  • بایگانی محتوا: مقاله بلند و عالی‌ای پیدا کرده‌اید که می‌خواهید آفلاین بخوانید؟ یک ثبت تمام‌صفحه همه چیز را برای بعد ذخیره می‌کند.
  • ثبت سوابق: برای مستندسازی تاریخچه تراکنش کامل یا یک رشته ایمیل طولانی برای سوابق خود بدون از دست دادن حتی یک جزئیات، عالی است.
  • گزارش‌دهی باگ: وقتی یک ایراد بصری مشاهده می‌کنید، نشان دادن کل صفحه به توسعه‌دهندگان به آن‌ها کمک می‌کند مشکل را بسیار سریع‌تر شناسایی کنند.

این درخت تصمیم می‌تواند به شما کمک کند بر اساس نیاز و میزان راحتی‌تان با ابزارهای مختلف، سریعاً بهترین روش را پیدا کنید.

A flowchart detailing a decision-making process to choose between different methods based on user preferences.

همان‌طور که در نمودار جریان نشان داده شده است، اگر سرعت و سادگی اولویت‌های اصلی شما هستند، احتمالاً بهترین گزینه یک افزونه است. اگر با چند کلیک بیشتر مشکلی ندارید و ترجیح می‌دهید از راه‌حل داخلی استفاده کنید، ابزارهای مرورگر انتخابی مناسب هستند.

نیاز به این تکنیک با ظهور طراحی واکنش‌گرا به‌شدت افزایش یافت. با بلندتر و پویاتر شدن صفحات وب، تیم‌های تست کشف کردند که ثبت کل صفحه رندر شده برای آزمایش حیاتی است. در واقع، با 2015، بسیاری گزارش دادند که این روش در مقایسه با اسکرین‌شات‌های تک ناحیه نمایش، باگ‌های بازگشت بصری را تا 30–40% کاهش می‌دهد. چرا؟ زیرا عناصر خارج از صفحه نمایش و محتوای بارگذاری تنبل را کشف می‌کند که در غیر این صورت از دست می‌رفتند. می‌توانید جزئیات بیشتری درباره این یافته‌های تست وب در Research and Markets کاوش کنید.

راهنمای سریع روش‌های اسکرین‌شات تمام صفحه

برای کمک به تصمیم‌گیری سریع شما، این جدول رایج‌ترین روش‌ها، موارد استفاده ایده‌آل و الزامات هر کدام را توضیح می‌دهد.

روش بهترین گزینه برای سطح مهارت فنی نیاز به نصب دارد؟
ابزارهای توسعه‌دهنده مرورگر گرفتن سریع و یکباره بدون نصب هیچ چیز. مقدماتی خیر
افزونه‌های مرورگر استفاده مکرر، امکانات اضافی مانند ویرایش و ذخیره‌سازی ابری. ندارد بله
قابلیت‌های سیستم‌عامل موبایل ثبت محتوا در گوشی یا تبلت شما. ندارد خیر
اپلیکیشن‌های شخص ثالث امکانات پیشرفته، اتوماسیون و همکاری تیمی. متفاوت است بله

هر یک از این رویکردها جایگاه خاص خود را دارد. انتخاب مناسب واقعاً به این بستگی دارد که چقدر قصد دارید اسکرین‌شات بگیرید و پس از آن چه برنامه‌ای برای استفاده از آنها دارید.

استفاده از ابزارهای داخلی مرورگر برای ثبت تمیز و دقیق

گاهی اوقات، بهترین ابزار برای کار همان ابزاری است که از قبل در اختیار دارید. قبل از اینکه به دنبال افزونه دیگری بگردید، دانستن این نکته ارزشمند است که مرورگرهایی مانند Google Chrome و Microsoft Edge یک قابلیت قدرتمند و داخلی برای گرفتن اسکرین‌شات تمام صفحه دارند. این ابزار در میان توسعه‌دهندگان و افراد فنی محبوب است زیرا دقیق و کاملاً عاری از شلوغی است.

این ابزار بومی در پنل Developer Tools پنهان شده است. شاید کمی ترسناک به نظر برسد، اما روند کار به طرز شگفت‌انگیزی ساده است. بدون دانلود، بدون ثبت‌نام و بدون آیکون‌های اضافی که نوار ابزار شما را شلوغ کنند. تنها کافی است یک تصویربرداری دقیق پیکسلی از کل صفحه داشته باشید، دقیقاً همان‌طور که مرورگر آن را می‌بیند.

دسترسی به دستور اسکرین‌شات

اول از همه، باید ابزارهای توسعه‌دهنده (Developer Tools) را در صفحه‌ای که می‌خواهید از آن تصویر بگیرید باز کنید. چند راه سریع برای این کار وجود دارد:

  • میانبر صفحه‌کلید: سریع‌ترین راه فشردن کلیدهای Cmd+Option+I در مک یا Ctrl+Shift+I در ویندوز است.
  • منوی کلیک راست: همچنین می‌توانید در هر نقطه‌ای از صفحه کلیک راست کرده و از منویی که ظاهر می‌شود گزینه "Inspect" را انتخاب کنید.

با باز بودن پنل DevTools، مرحله بعدی اجرای یک دستور است. نگران نباشید، نیازی به نوشتن کد نیست. فقط منوی دستورات را با فشردن کلیدهای Cmd+Shift+P (مک) یا Ctrl+Shift+P (ویندوز) باز کنید.

یک نوار جستجو در بالای صفحه نمایش شما ظاهر خواهد شد. به سادگی تایپ کردن "screenshot" را شروع کنید و فوراً لیستی از گزینه‌ها نمایان خواهد شد.

نکته حرفه‌ای: چندین گزینه خواهید دید، اما برای یک تصویربرداری کامل، گزینه‌های "area" یا "node" را نادیده بگیرید. آنچه به دنبالش هستید Capture full size screenshot است. این دستور به مرورگر می‌گوید کل صفحه را در یک تصویر یکپارچه بگنجاند.

آن گزینه را انتخاب کنید، Enter را بزنید و تمام. مرورگر لحظه‌ای برای پردازش کل صفحه صرف می‌کند و سپس اسکرین‌شات را معمولاً به صورت فایل PNG، مستقیماً در پوشه دانلودهای شما ذخیره می‌کند. روشی بسیار تمیز و مستقیم است.

البته، در حالی که این گزینه داخلی برای یک تصویربرداری سریع و بدون دردسر عالی است، محدودیت‌هایی هم دارد. اگر به ویژگی‌های بیشتری مانند ویرایش فوری، حاشیه‌نویسی یا ذخیره در ابر نیاز دارید، ابزارهای اختصاصی مانند افزونه ShiftShift Full Page Screenshot می‌توانند واقعاً جریان کار شما را تسریع کنند.

تصویربرداری از نماهای خاص موبایل

اینجاست که روش DevTools واقعاً می‌درخشد: دقیقاً نشان دادن اینکه یک صفحه وب در یک دستگاه موبایل خاص چگونه به نظر می‌رسد. این برای طراحان وب، توسعه‌دهندگان و آزمایشگرهای کیفی که نیاز به مستندسازی طراحی‌های واکنش‌پذیر دارند بدون حدس زدن، یک تغییردهنده بازی است.

قبل از اجرای دستور اسکرین‌شات، فقط کافی است به حالت دستگاه.

سوئیچ کنید.

با باز بودن پنل ابزارهای توسعه‌دهنده (DevTools) خود، به دنبال آیکون کوچکی باشید که شبیه گوشی و تبلت است (Toggle device toolbar) و روی آن کلیک کنید. صفحه وب شما بلافاصله به نمای اندازه موبیل کوچک می‌شود.

از آنجا، می‌توانید از منوی کشویی در بالای ناحیه مشاهده برای انتخاب یک دستگاه خاص استفاده کنید، مانند یک "iPhone 14 Pro" یا یک "Pixel 7."

وقتی نمای مورد نظر خود را به دست آوردید، فقط دستور Capture full size screenshot را دقیقاً همانطور که قبلاً انجام دادید اجرا کنید.

نتیجه یک تصویر کامل و تمام‌صفحه از سایت شما است که دقیقاً همانطور که در صفحه نمایش آن دستگاه خاص ظاهر می‌شود. این روش فوق‌العاده دقیقی برای ایجاد تصاویر برای گزارش‌های باگ، طرح‌های اولیه طراحی یا ارائه‌ها به مشتریان است، بدون نیاز به داشتن دستگاه فیزیکی در دست خود.

ابزارهای داخلی مرورگر در شرایط اضطراری مفید هستند، اما بیایید صادق باشیم – آنها برای جریان کاری سنگین ساخته نشده‌اند. وقتی نیاز دارید به طور منظم اسکرین‌شات‌های تمام‌صفحه بگیرید، هیچ چیزی به سرعت و راحتی یک افزونه مرورگر خوب نمی‌رسد. این ابزارها درست در نوار ابزار مرورگر شما قرار می‌گیرند و یک فرآیند دست‌وپاگیر و چند مرحله‌ای را به یک کلیک رضایت‌بخش تبدیل می‌کنند.

سناریوهای واقعی را در نظر بگیرید. شاید شما یک طراح باشید که وب‌سایت‌های رقیب را برای یک تابلوی حالت (mood board) بایگانی می‌کند، یک بازاریاب که مقالات طولانی را برای تحقیق ذخیره می‌کند، یا یک کارشناس پشتیبانی که سعی دارد مشکل پیچیده کاربر را از ابتدا تا انتها مستند کند. در این موارد، دست‌وپا چلفتی کردن با ابزارهای توسعه‌دهنده کافی نیست. سرعت همان چیزی است که نیاز دارید و افزونه‌ها آن را ارائه می‌دهند.

مجموعه ShiftShift Extensions نمونه‌ای عالی از این نوع کارایی است. ابزار Full Page Screenshot آن در یک پالت دستوری یکپارچه پنهان شده است، بنابراین همیشه آماده است وقتی به آن نیاز دارید اما هرگز صفحه شما را شلوغ نمی‌کند. این یک تنظیم ایده‌آل برای حرفه‌ای‌هایی است که ابزارهای قدرتمند را بدون قربانی کردن یک فضای کاری تمیز و متمرکز می‌خواهند. اگر به دنبال ساده‌سازی کار خود هستید، می‌توانید بیشتر ابزارهای افزونه مرورگر.

انتخاب افزونه مناسب برای نیازهای شما

یک جستجوی سریع در Chrome Web Store ده‌ها ابزار اسکرین‌شات را نشان می‌دهد. پس، چگونه خوب‌ها را از عالی‌ها جدا می‌کنید؟ واقعاً به چند عامل کلیدی بستگی دارد.

  • عملکرد و سرعت: واقعاً چقدر سریع صفحه را ضبط می‌کند؟ برخی افزونه‌ها در صفحات طولانی و پیچیده کند هستند در حالی که برخی دیگر تقریباً فوری هستند.
  • ویژگی‌های ویرایش: آیا یک ویرایشگر داخلی دارد؟ بهترین ابزارها به شما اجازه می‌دهند بلافاصله پس از گرفتن عکس، آن را برش دهید، متن اضافه کنید، فلش بکشید یا حتی اطلاعات حساس را محو کنید.
  • گزینه‌های خروجی: آیا می‌توانید آن را به عنوان PNG یا JPG ذخیره کنید؟ حتی بهتر، آیا می‌توانید آن را به عنوان PDF قابل جستجو خروجی بگیرید؟ انعطاف‌پذیری کلیدی است.
  • سیاست حریم خصوصی: این یک موضوع مهم است. فنی افزونه می‌تواند صفحه‌ای که در آن هستید را «ببیند»، بنابراین یک سیاست شفاف با اولویت حریم خصوصی ضروری است. ابزارهایی که تمام پردازش‌ها را به‌صورت محلی روی دستگاه شما انجام می‌دهند، همیشه امن‌ترین انتخاب هستند.

انتخاب ابزار مناسب اغلب به ترجیحات شخصی و نیازهای خاص شما بستگی دارد، اما نظرات و امتیازات کاربران می‌تواند اطلاعات زیادی به شما بدهد.

A sleek silver laptop showcasing a software interface with a sidebar menu, against a clean white background.

همچنین ارزش دارد که کمی درباره‌ی آنچه در پشت صحنه اتفاق می‌افتد بدانید. بسیاری از افزونه‌ها از تکنیک «اسکرول و دوخت» استفاده می‌کنند. آن‌ها به‌صورت برنامه‌ریزی‌شده پایین می‌روند، از هر بخش یک تصویر می‌گیرند و سپس آن‌ها را کنار هم قرار می‌دهند. برخی دیگر از موتور رندر بومی مرورگر استفاده می‌کنند تا از همان ابتدا یک تصویر واحد و بی‌نقص تولید کنند.

تفاوت عملکرد کاملاً محسوس است. گزارش‌های بنچمارک نشان می‌دهند که روش‌های رندر بومی اغلب بسیار سریع‌تر هستند و به‌طور متوسط فقط ۰.۸ تا ۱.۶ ثانیه طول می‌کشند. در مقابل، روش اسکرول و دوخت می‌تواند ۱.۸ تا ۳.۵ ثانیه طول بکشد و احتمال خرابی در صفحات با طرح‌بندی‌های پیچیده بسیار بیشتری دارد.

این موضوع را به‌ویژه در صفحات با هدرهای چسبناک یا انیمیشن‌ها متوجه خواهید شد. روش اسکرول و دوخت به‌راحتی دچار سردرگمی می‌شود و ممکن است در اسکرین‌شات نهایی‌تان ایرادات بصری عجیب یا المان‌های تکراری ایجاد کند.

یک راهنمای عملی با یک افزونه

شروع کار با یک افزونه بسیار ساده است. پس از نصب افزونه‌ای که از فروشگاه وب مرورگرتان پسندیده‌اید، معمولاً آیکون آن در کنار نوار آدرس ظاهر می‌شود.

از آنجا به بعد، فرآیند بسیار ساده است. کافیست به صفحه‌ای که می‌خواهید ثبت کنید بروید و روی آیکون افزونه کلیک کنید. اکثر ابزارهای باکیفیت فوراً چند گزینه به شما ارائه می‌دهند:

  • ثبت کل صفحه: انتخاب اصلی. این گزینه با یک کلیک همه چیز را ثبت می‌کند.
  • ثبت ناحیه قابل مشاهده: یک عکس سریع فقط از آنچه در حال حاضر روی صفحه‌نمایش شماست.
  • ثبت ناحیه انتخابی: به شما اجازه می‌دهد با کلیک و کشیدن ناحیه دقیق مورد نظرتان را مشخص کنید.

پس از کلیک روی ثبت کل صفحه، افزونه کار را بر عهده می‌گیرد و کل صفحه را به‌طور خودکار پردازش می‌کند. لحظاتی بعد، یک تب جدید باز می‌شود و اسکرین‌شات آماده شما را نشان می‌دهد که کاملاً برای ویرایش آماده است. می‌توانید از ابزارهای داخلی برای اضافه کردن یادداشت یا برش دادن آن استفاده کنید و سپس آن را به‌صورت PNG، JPG یا PDF در رایانه‌تان ذخیره کنید. این جریان بی‌نقص دقیقاً دلیلی است که افزونه‌ها را به بخشی جدایی‌ناپذیر از جعبه‌ابزار من تبدیل کرده است.

تسلط بر اسکرین‌شات‌های پیمایشی در موبایل

بیایید رک باشیم، ما روی گوشی‌هایمان زندگی می‌کنیم. گرفتن محتوا در حین حرکت فقط یک امکان خوب نیست؛ ضروری است. دانستن نحوه گرفتن اسکرین‌شات پیمایشی در گوشی شما یک ابرقدرت مدرن است، مناسب برای ذخیره همه چیز از رشته پیام‌های طولانی تا دستورهای پخت آنلاین دقیق.

خوشبختانه، دیگر برای این کار نیاز به یک اپلیکیشن شخص ثالث ندارید. فرآیند بین iOS و Android کمی متفاوت است، اما هر دو دارای ابزارهای داخلی شگفت‌انگیز قدرتمندی هستند که کار را انجام می‌دهند.

گرفتن صفحات کامل در آیفون

اپل یک ویژگی اسکرین‌شات صفحه کامل براق را مستقیماً در iOS تعبیه کرده است، اما واقعاً زمانی درخشان می‌شود که از Safari استفاده می‌کنید. اگر ندانید کجا نگاه کنید، یک جواهر پنهان است.

اول، فقط مانند همیشه یک اسکرین‌شات بگیرید:

  • برای آیفون‌ها با Face ID: دکمه Side و دکمه Volume Up را همزمان فشار دهید.
  • برای آیفون‌ها با دکمه Home: دکمه Side و دکمه Home را با هم فشار دهید.

یک پیش‌نمایش کوچک در گوشه سمت چپ پایین ظاهر می‌شود. باید سریع باشید و قبل از ناپدید شدن آن را لمس کنید. وقتی وارد ویرایشگر شدید، به بالای صفحه نگاه کنید. دو تب خواهید دید: Screen و Full Page.

روی Full Page ضربه بزنید. یک نوار لغزنده در سمت راست ظاهر می‌شود که به شما امکان پیش‌نمایش کل صفحه وبی که فقط ثبت کرده‌اید را می‌دهد.

نکته اینجاست: ویژگی بومی iOS این گرفتن‌های صفحه کامل را به صورت PDF ذخیره می‌کند، نه یک فایل تصویری استاندارد مانند PNG یا JPG. این برای ذخیره مقالات یا اسناد عالی است، اما اگر انتظار یک تصویر را داشتید، این نکته‌ای است که باید در نظر بگیرید.

گرفتن اسکرین‌شات پیمایشی در اندروید

اکوسیستم اندروید با وجود تولیدکنندگان مختلف، کمی مانند غرب وحشی است، اما عملکرد اصلی در بیشتر گوشی‌های مدرن گوگل، سامسونگ و وان پلاس نسبتاً یکسان است. معمولاً آن را با نام Scroll Capture یا Scrolling Screenshot.

با گرفتن یک اسکرین‌شات معمولی شروع کنید، که تقریباً همیشه با فشار همزمان دکمه‌های Power و Volume Down انجام می‌شود.

به محض این کار، یک نوار ابزار کوچک در پایین صفحه نمایش شما ظاهر می‌شود. به دنبال آیکونی با فلش‌های رو به پایین باشید — ممکن است برچسب «Capture more» یا فقط نمادی از اسکرول داشته باشد. آن را ضربه بزنید. گوشی شما به طور خودکار به پایین اسکرول کرده و بخش بعدی را به اسکرین‌شات شما اضافه می‌کند.

می‌توانید همچنان آن دکمه را برای گرفتن اسکرین‌شات‌های بیشتر از صفحه فشار دهید. وقتی همه آنچه نیاز دارید را گرفتید، کافیست خود پیش‌نمایش اسکرین‌شات را لمس کنید یا منتظر بمانید نوار ابزار ناپدید شود. برخلاف آیفون‌ها، گوشی‌های اندروید معمولاً این اسکرین‌شات‌های طولانی را به عنوان یک فایل تصویری بلند و یکپارچه (مانند PNG) ذخیره می‌کنند که اشتراک‌گذاری آن در چت‌ها یا شبکه‌های اجتماعی بسیار آسان‌تر است.

چرا گاهی اوقات کار نمی‌کند

تا حالا پیش آمده که بخواهید اسکرین‌شات اسکرولی بگیرید اما گزینه آن... اصلاً وجود نداشته باشد؟ این اتفاق می‌افتد. معمولاً به این دلیل است که اپلیکیشنی که در آن هستید، چیدمانی غیراستاندارد یا روش اسکرول سفارشی دارد. اگر سیستم‌عامل نتواند یک پنجره اسکرول‌پذیر ساده را تشخیص دهد، این قابلیت را ارائه نخواهد داد.

وقتی به این مشکل برمی‌خورید، تنها راه‌حل واقعی روش قدیمی است: به صورت دستی مجموعه‌ای از اسکرین‌شات‌های همپوشان بگیرید و در صورت لزوم بعداً آنها را کنار هم قرار دهید.

نحوه عیب‌یابی مشکلات رایج اسکرین‌شات

اسکرین‌شات را گرفته‌اید، اما وقتی فایل را باز می‌کنید، چیزی درست نیست. شاید بخشی از صفحه کم است، خطاهای بصری عجیبی وجود دارد، یا فایل برای ارسال ایمیل بیش از حد بزرگ است. من هم این را تجربه کرده‌ام. گرفتن اسکرین‌شات یک چیز است؛ درست دریافت کردن آن چیز دیگری است.

بیایید برخی از رایج‌ترین مشکلات و نحوه رفع آنها را مرور کنیم.

انتخاب قالب فایل مناسب: PNG در برابر JPG

اول از همه، بیایید درباره قالب‌های فایل صحبت کنیم. انتخاب بین PNG و JPG (یا JPEG) فقط یک جزئیات فنی نیست — بلکه مستقیماً بر کیفیت و اندازه تصویر نهایی شما تأثیر می‌گذارد.

  • PNG (Portable Network Graphics): این را گزینه با کیفیت بالای خود در نظر بگیرید. PNG از فشرده‌سازی بدون افت کیفیت استفاده می‌کند، به این معنا که هر پیکسل را کاملاً دست‌نخورده نگه می‌دارد. بهترین انتخاب برای اسکرین‌شات وب‌سایت‌ها، رابط‌های کاربری یا هر چیزی با متن واضح و خطوط تمیز است. در اینجا هیچ تاری مشاهده نخواهید کرد.
  • JPG (Joint Photographic Experts Group): این گزینه اصلی شماست وقتی اندازه فایل اولویت اول باشد. JPG از فشرده‌سازی با افت کیفیت استفاده می‌کند که هوشمندانه بخشی از داده‌های تصویری را حذف می‌کند تا فایل کوچک‌تر شود. برای عکس‌ها عالی است، اما می‌تواند متن و لبه‌های واضح در یک اسکرین‌شات را کمی تار کند.

گاهی اوقات یک PNG کامل می‌گیرید اما بعد متوجه می‌شوید برای یک ارائه یا پست وبلاگ به فایل کوچکتری نیاز دارید. مشکلی نیست. می‌توانید به راحتی فرمت PNG را به JPG تبدیل کنید تا حجم فایل را بدون نیاز به گرفتن دوباره اسکرین‌شات، کاهش دهید.

Two mobile phones showcasing abstract website or app content layouts with text and image placeholders.

رفع بریدگی یا ناقص بودن عکس‌های صفحه نمایش

یکی از آزاردهنده‌ترین مسائل این است: شما یک عکس تمام‌صفحه می‌گیرید، اما ناگهان می‌بینید که نیمه پایینی آن فقط یک خلأ سفید خالی است.

این موضوع تقریباً همیشه به نحوه ساخت وبسایت‌های مدرن برمی‌گردد. بسیاری از آن‌ها از تکنیکی به نام بارگذاری تنبل استفاده می‌کنند، که در آن تصاویر و محتوای دیگر تا زمانی که به آن‌ها اسکرول نکنید، واقعاً بارگذاری نمی‌شوند. این برای عملکرد عالی است، اما می‌تواند ابزارهای عکس‌برداری را که سریع‌تر از ظاهر شدن محتوا عمل می‌کنند، به اشتباه بیندازد.

راه حل به طرز شگفت‌انگیزی ساده است. قبل از اینکه دکمه عکس‌برداری را بزنید، خودتان به پایین صفحه اسکرول کنید و به انتهای آن برسید. عجله نکنید. این کار هر عنصر بارگذاری تنبل را مجبور می‌کند تا ظاهر شود و به ابزار شما یک صفحه کامل و رندر شده برای کار می‌دهد.

این ترفند کوچک اسکرول از پیش همچنین راز عکس‌برداری از صفحات با اسکرول نامتناهی است و تضمین می‌کند که هر آنچه نیاز دارید را دریافت کنید.

مقابله با هدرها و فوترهای چسبناک

آن نوارهای پیمایشی را می‌شناسید که با اسکرول کردن شما به بالا یا پایین صفحه‌تان می‌چسبند؟ آن‌ها عناصر «چسبناک» نامیده می‌شوند و می‌توانند برای ابزارهای عکس‌برداری که با اسکرول کردن و «دوختن» تصاویر به هم کار می‌کنند، دردسرساز شوند.

اگر تا به حال یک عکس نهایی با همان هدر تکرار شده در طول صفحه دیده‌اید، دلیلش همین است. ابزار گیج می‌شود و آن را در هر بخش عکس می‌گیرد.

اینجاست که انتخاب ابزار شما واقعاً اهمیت پیدا می‌کند.

  • ابزارهای توسعه‌دهنده مرورگر: دستورات داخلی در Chrome یا Edge معمولاً به اندازه کافی هوشمند هستند تا این مورد را مدیریت کنند. آن‌ها کل صفحه را یکجا رندر می‌کنند، بنابراین هدر چسبناک را به عنوان یک عنصر واحد در جای درست خود می‌بینند.
  • افزونه‌های پیشرفته: بهترین افزونه‌های عکس‌برداری به طور خاص برنامه‌نویسی شده‌اند تا عناصر چسبناک را شناسایی کرده و به درستی با آن‌ها رفتار کنند، چه با گرفتن عکس از آن‌ها فقط یکبار یا حذف کاملشان برای یک عکس تمیز.

اگر ابزار فعلی شما مدام هدرهای تکراری به شما می‌دهد، تغییر به روش پیشرفته‌تری مانند ابزارهای توسعه‌دهنده یا یک افزونه مخصوص این کار، بهترین گزینه شماست.

در اینجا یک جدول مرجع سریع که بر اساس سال‌ها مقابله با دقیقاً همین مشکلات تهیه کرده‌ام، آورده شده است. این جدول مشکلات رایجی را که مردم با آن مواجه می‌شوند و سریع‌ترین راه برای حل آن‌ها را پوشش می‌دهد.

مشکلات رایج عکس‌برداری و راه حل‌ها

مشکل دلیل احتمالی راه حل پیشنهادی
محتوای گمشده/فضاهای خالی بارگذاری تنبل یا اسکرول بی‌نهایت تمام المان‌ها را قبل از ثبت تصویر بارگذاری نکرده بودند. برای اجبار به بارگذاری کل محتوا، قبل از شروع عکسبرداری به انتهای صفحه به صورت دستی اسکرول کنید.
سرصفحه/پاصفحه‌های تکراری المان‌های چسبناک در صفحه ابزارهای عکسبرداری را که تصاویر را \"ترکیب\" می‌کنند، گیج می‌کنند. از یک روش پیشرفته‌تر مانند DevTools داخلی مرورگر یا یک افزونه اختصاصی که می‌تواند المان‌های چسبناک را مدیریت کند، استفاده کنید.
متن مبهم یا جزئیات نامشخص تصویر با فشرده‌سازی بالا به فرمت JPG ذخیره شده است، که کیفیت را کاهش می‌دهد. برای حداکثر وضوح، تصویر را با فرمت PNG ذخیره کنید. اگر حجم فایل حیاتی است، از JPG با تنظیم کیفیت بالاتر استفاده کنید.
حجم فایل بسیار بزرگ یک صفحه طولانی به صورت PNG بدون فشرده‌سازی ذخیره شده است، که منجر به فایلی عظیم شده است. به فرمت JPG ذخیره کنید یا از ابزار آنلاینی برای فشرده‌سازی PNG استفاده کنید. همچنین می‌توانید PNG را به JPG تبدیل کنید تا فایل کوچکتری داشته باشید.
عدم موفقیت عکسبرداری در صفحات پیچیده صفحه دارای المان‌های تعاملی پیچیده، انیمیشن‌ها یا اسکریپت‌هایی است که با ابزار تداخل ایجاد می‌کنند. سعی کنید JavaScript را موقتاً از طریق DevTools غیرفعال کنید، یا از افزونه عکسبرداری دیگری که ممکن است سازگارتر باشد استفاده کنید.

امیدوارم این جدول، مسیر روشنی را برای بار بعدی که تصویر شما دقیقاً طبق انتظار نیست، ارائه دهد. کمی دانش عیب‌یابی می‌تواند مقدار زیادی زمان و ناامیدی را صرفه‌جویی کند.

سوالی دارید؟ ما پاسخ داریم

Two laptops side-by-side illustrating a website issue with a sticky note and a fixed, clean webpage.

حتی با بهترین ابزارها در دسترس، هنگام ثبت تصاویر تمام‌صفحه قطعاً با چند وضعیت دشوار مواجه خواهید شد. بیایید برخی از رایج‌ترین سوالاتی که می‌شنوم را بررسی کنیم تا هر بار بتوانید تصویری عالی ثبت کنید.

بهترین فرمت برای ذخیره اسکرین‌شات من کدام است؟

در نُه مورد از ده مورد، PNG بهترین انتخاب شماست. این فرمت از فشرده‌سازی بدون اتلاف (lossless compression) استفاده می‌کند؛ اصطلاحی فنی که به این معناست تصویر شما هیچ کیفیتی از دست نخواهد داد. هر خط متنی کاملاً واضح و هر عنصر طراحی دقیقاً همان‌طور که روی صفحه نمایش می‌بینید، باقی خواهد ماند. این برای نمونه‌های طراحی، گزارش‌های باگ یا هر کار حرفه‌ای که در آن جزئیات اهمیت دارد، الزامی است.

پس، چه زمانی باید از فرمت دیگری استفاده کرد؟ فرمت JPG واقعاً تنها زمانی مناسب است که حجم فایل نگرانی اصلی شماست و کمی تاری تصویر برایتان قابل قبول است. برای بایگانی مقالات یا ترکیب چندین عکس، PDF گزینه‌ای عالی است، به خصوص اگر ابزاری که استفاده می‌کنید متن را قابل انتخاب نگه دارد.

آیا واقعاً می‌توانم از صفحه‌ای که نیاز به ورود دارد اسکرین‌شات بگیرم؟

قطعاً می‌توانید. هر یک از روش‌هایی که صحبت کردیم، از DevTools گرفته تا افزونه‌های مرورگر، با ثبت آنچه در حال حاضر روی صفحه نمایش شما است کار می‌کنند. این فرآیند به طور کامل روی رایانه شما انجام می‌شود.

از آنجا که شما از قبل وارد شده‌اید، مرورگر شما صفحه را با تمام محتوای احراز هویت شده بارگذاری کرده است. ابزار اسکرین‌شات فقط تصویری از آنچه در حال حاضر وجود دارد می‌گیرد. این ابزار با سرور تعاملی ندارد، بنابراین هیچ خطر امنیتی وجود ندارد.

نکته کلیدی که باید به یاد داشته باشید این است: اگر می‌توانید چیزی را در مرورگر خود ببینید، یک ابزار اسکرین‌شات می‌تواند آن را ثبت کند. این باعث می‌شود این ابزارها برای مستندسازی مواردی مانند داشبوردهای حساب‌های خصوصی یا پورتال‌های داخلی شرکت کاملاً ایمن باشند.

چرا اسکرین‌شات‌های من دارای اشکال یا تصاویر گمشده هستند؟

این احتمالاً رایج‌ترین دردسر است و تقریباً همیشه ناشی از نحوه ساخت وب‌سایت‌های مدرن است. چند تکنیک خاص برای ایجاد مشکل در ابزارهای اسکرین‌شات معروف هستند:

  • بارگذاری تنبل (Lazy Loading): یعنی تصاویر تا زمانی که آن‌ها را اسکرول کرده و وارد نمای صفحه نشوید، بارگذاری نمی‌شوند. این برای سرعت صفحه عالی است، اما برای اسکرین‌شات بد است.
  • اسکرول پارالاکس (Parallax Scrolling): آن افکت‌های جالبی که پس‌زمینه با سرعتی متفاوت از پیش‌زمینه حرکت می‌کند، می‌تواند ابزارهای ثبت تصویر را گیج کند.
  • عناصر چسبنده (Staptic Elements): سرصفحه‌ها، پاورقی‌ها یا نوارهای کناری که هنگام اسکرول در جای خود باقی می‌مانند. گاهی اوقات می‌توانند در تصویر نهایی تکرار شوند یا محتوا را بپوشانند.

راه حل به طرز شگفت‌آوری ساده است. قبل از اینکه اسکرین‌شات را بگیرید، فقط یک لحظه وقت بگذارید و کل صفحه را به طور دستی تا انتها اسکرول کرده و دوباره به بالا برگردانید. این کار مرورگر را مجبور می‌کند همه چیز را بارگذاری کند و به ابزار یک صفحه کامل و کاملاً بارگذاری شده برای کار می‌دهد. این یک قدم کوچک است که بیشتر مواقع مشکل را حل می‌کند.


اگر به دنبال ابزاری هستید که بتواند این صفحات پیچیده را بدون زحمت اضافی مدیریت کند، مجموعه افزونه‌های ShiftShift ارزش بررسی دارد. ابزار اسکرین‌شات تمام صفحه با یک کلیک آن به‌گونه‌ای طراحی شده که به‌طور ظریفی با ویژگی‌های طراحی مدرن وب کنار بیاید، و همه اینها از یک پالت فرمان یکپارچه و واحد قابل دسترسی است. این یک ارتقای جدی نسبت به گزینه‌های اساسی داخلی است. شما می‌توانید اکوسیستم ShiftShift را کاوش کنید تا ببینید چگونه می‌تواند گردش کار شما را ساده‌تر کند.

مقاله با استفاده از Outrank

ایجاد شده است

افزونه‌های پیشنهادی