สอนแก้ไขปัญหาคอมพิวเตอร์

แคปหน้าเว็บยาวๆ ทั้งหน้า ฟรี! 5 วิธีที่ช่างคอมใช้จริง

แคปหน้าเว็บยาวๆ ทั้งหน้า ฟรี! 5 วิธีที่ช่างคอมใช้จริง

แคปจอแค่หน้าเดียวไม่พอ อยากได้ทั้งหน้าเว็บ ทำยังไง?

เคยเจอไหมครับ อยากแคปหน้าเว็บไซต์เก็บไว้ แต่เว็บมันยาวมาก กดปุ่ม PrtSc (Print Screen) ได้แค่ส่วนที่เห็นบนจอ ส่วนที่เลื่อนลงไปอีกยาวๆ กลับแคปไม่ได้

ผมเจอลูกค้าถามเรื่องนี้บ่อยครับ โดยเฉพาะพวกที่ต้อง:

  • แคปหลักฐานการโอนเงิน ที่เป็นหน้าเว็บธนาคารยาวๆ
  • เก็บข้อมูลจากเว็บ เช่น รายการสินค้า สเปคคอม ราคาอะไหล่
  • แคปหน้าเว็บไปโพสโซเชียล เช่น Facebook, LINE
  • เก็บหลักฐานการสั่งซื้อ จาก Shopee, Lazada

บางคนก็แคปทีละส่วน แล้วเอาไปต่อกันใน Paint หรือ Photoshop ซึ่งเสียเวลามากครับ แถมรอยต่อก็ไม่สวย

วันนี้ผมจะมาแนะนำ 5 วิธีที่ง่ายกว่านั้นเยอะ แคปได้ทั้งหน้าเว็บ ไม่ว่าจะยาวขนาดไหนก็แคปได้หมดครับ ทุกวิธีฟรีทั้งหมด


สรุป 5 วิธีแคปหน้าเว็บยาวๆ ทั้งหน้า

วิธีเครื่องมือข้อดีข้อเสีย
วิธีที่ 1Chrome DevTools (ไม่ต้องลงอะไร)ฟรี ไม่ต้องติดตั้ง ภาพคมชัดต้องเปิด DevTools
วิธีที่ 2GoFullPage Extensionใช้ง่ายมาก กดคลิกเดียวต้องติดตั้ง Extension
วิธีที่ 3Firefox (มีในตัว)ฟรี คลิกขวาได้เลยใช้ได้เฉพาะ Firefox
วิธีที่ 4Microsoft Edge (ไม่ต้องลงอะไร)ฟรี มีในเครื่องอยู่แล้วใช้ได้เฉพาะ Edge
วิธีที่ 5แคปเป็น PDFได้เอกสารพร้อมส่งไม่ได้ไฟล์ภาพ

วิธีที่ 1: ใช้ Chrome DevTools (ไม่ต้องลงอะไรเลย)

วิธีนี้ใช้ได้เลยโดยไม่ต้องติดตั้งอะไรเพิ่มครับ ใช้ Google Chrome ตัวเดิมที่มีอยู่ได้เลย และได้ภาพคมชัดที่สุดในบรรดาทุกวิธี

ขั้นตอน

  1. เปิดหน้าเว็บที่อยากแคปใน Chrome
  2. กด Ctrl + Shift + I (เปิด DevTools) หรือ F12
  3. กด Ctrl + Shift + P จะมีช่องค้นหาขึ้นมา (Command Menu)
  4. พิมพ์คำว่า screenshot
  5. เลือก Capture full size screenshot
  6. ระบบจะ Download รูปเป็นไฟล์ PNG ให้อัตโนมัติ

จากประสบการณ์ผม วิธีนี้ได้รูปคมชัดที่สุดครับ เพราะ DevTools แคปตามความละเอียดจริงของหน้าเว็บ แต่อาจจะยากนิดนึงสำหรับคนไม่ถนัดเรื่อง DevTools

ตัวเลือกแคปใน DevTools

ใน Command Menu จะมีตัวเลือกการแคปหลายแบบครับ:

  • Capture full size screenshot — แคปทั้งหน้าเว็บ ยาวเท่าไหร่ก็ได้
  • Capture screenshot — แคปเฉพาะส่วนที่เห็นบนจอ (เหมือนกด PrtSc)
  • Capture node screenshot — แคปเฉพาะ element ที่เลือก (ใช้ตอน inspect)
  • Capture area screenshot — ลากเลือกพื้นที่ที่ต้องการแคป

ถ้าแค่ต้องการแคปทั้งหน้า ให้เลือก Capture full size screenshot ครับ


วิธีที่ 2: ใช้ GoFullPage Extension (ง่ายที่สุด)

วิธีนี้ ง่ายที่สุด ครับ แค่คลิกเดียวเลย เหมาะสำหรับทุกคนโดยเฉพาะคนที่ไม่ถนัดเรื่องเทคนิค Extension ตัวนี้เดิมชื่อ Full Page Screen Capture แต่ตอนนี้เปลี่ยนชื่อเป็น GoFullPage แล้ว

ขั้นตอนติดตั้ง

1. เข้าไปดาวน์โหลด Extension

ไปที่ Chrome Web Store - GoFullPage ครับ หรือจะค้นหาใน Chrome Web Store ว่า “GoFullPage” ก็ได้

2. กดปุ่ม “เพิ่มใน Chrome”

3. ยืนยันการติดตั้ง

จะมีหน้าต่างถามว่าต้องการเพิ่ม Extension นี้ไหม ให้กด “เพิ่มส่วนขยาย” ครับ

4. ติดตั้งเสร็จ

เมื่อติดตั้งเสร็จจะมี ไอคอนรูปกล้อง ขึ้นมาที่แถบเครื่องมือด้านบนขวาครับ

เคล็ดลับ: ถ้าไม่เห็นไอคอน ให้กดที่ไอคอนชิ้นส่วนปริศนา (Extensions) แล้วกดปักหมุด GoFullPage ครับ

วิธีใช้งาน

A. เข้าเว็บไซต์ที่ต้องการแคป

เปิดหน้าเว็บที่อยากจะแคปหน้าจอไว้ครับ

B. คลิกที่ไอคอนรูปกล้อง

คลิกซ้าย 1 ที ที่ไอคอนรูปกล้อง ตัว Extension จะเริ่มทำงาน จะเห็นหน้าเว็บเลื่อนขึ้นลงอัตโนมัติ ให้รอจนเสร็จครับ

C. เสร็จแล้ว เลือกวิธีเซฟ

หลังจาก Extension ทำงานเสร็จ จะแสดงภาพ Preview ขึ้นมาพร้อมตัวเลือกครับ

D. เลือกรูปแบบการเซฟ

ไอคอนฟังก์ชันเหมาะกับ
ถังขยะลบรูปนี้ไม่ต้องการรูปแล้ว
PDFเซฟเป็นไฟล์ PDFส่งเป็นเอกสาร เก็บหลักฐาน
รูปภาพเซฟเป็น PNG หรือ JPGโพสโซเชียล แชร์ใน LINE
ประวัติดูรูปที่เคยแคปย้อนหลังหาภาพเก่าที่เคยแคปไว้

E. ตั้งชื่อไฟล์แล้วเซฟ

ในตัวอย่างนี้ผมเลือกเซฟแบบรูปภาพ PNG ครับ สามารถตั้งชื่อไฟล์ใหม่ได้ตามต้องการ

Extension ตัวอื่นที่น่าสนใจ: FireShot

นอกจาก GoFullPage แล้ว ยังมี FireShot ซึ่งเป็นอีก Extension ที่ได้รับความนิยมสูงครับ ข้อดีของ FireShot คือ:

  • แคปได้ทั้ง PNG, JPG และ PDF ในตัว
  • แคปเฉพาะบางส่วนของหน้าเว็บได้ (Capture Selection)
  • ใช้ได้ทั้ง Chrome และ Firefox
  • มีเวอร์ชันฟรีที่ใช้งานได้เพียงพอ

ผมแนะนำให้ลองทั้ง GoFullPage และ FireShot ดูครับ แล้วเลือกตัวที่ถูกใจ


วิธีที่ 3: ใช้ Firefox (มีฟีเจอร์แคปในตัว)

Firefox มีฟีเจอร์แคปหน้าเว็บทั้งหน้าในตัวอยู่แล้วครับ ไม่ต้องลง Extension ใดๆ เลย ผมว่าเป็นวิธีที่สะดวกมากสำหรับคนที่ใช้ Firefox อยู่แล้ว

ขั้นตอน

  1. เปิดหน้าเว็บที่ต้องการใน Firefox
  2. คลิกขวา บนหน้าเว็บ
  3. เลือก Take Screenshot (ภาษาไทย: ถ่ายภาพหน้าจอ)
  4. เลือก Save full page (บันทึกทั้งหน้า)
  5. กด Download เพื่อเซฟเป็นไฟล์ PNG

วิธีทางลัด

กด Ctrl + Shift + S ใน Firefox ก็จะเปิดหน้าต่าง Screenshot ขึ้นมาได้เลยครับ ไม่ต้องคลิกขวา

ข้อดีของ Firefox คือดู Preview ก่อนเซฟได้ และเลือกแคปเฉพาะ element บนหน้าเว็บได้ด้วย เช่น แคปเฉพาะตาราง เฉพาะรูปภาพ


วิธีที่ 4: ใช้ Microsoft Edge (มีมาในเครื่องอยู่แล้ว)

ถ้าใช้ Windows 10/11 ก็มี Microsoft Edge อยู่ในเครื่องอยู่แล้วครับ ใช้แคปหน้าเว็บยาวๆ ได้เลยโดยไม่ต้องลงอะไรเพิ่ม

ขั้นตอน

  1. เปิดหน้าเว็บที่ต้องการใน Microsoft Edge
  2. กด Ctrl + Shift + S หรือคลิกขวาเลือก Screenshot
  3. เลือก Capture full page
  4. กด Save เพื่อเซฟเป็นไฟล์ภาพ

ฟีเจอร์เพิ่มเติมของ Edge

Edge ยังมีฟีเจอร์ Web Capture ที่ให้ลากเลือกพื้นที่ที่ต้องการแคปได้ด้วยครับ ไม่ต้องแคปทั้งหน้าถ้าต้องการแค่บางส่วน นอกจากนี้ยังวาด markup บนภาพก่อนเซฟได้อีกด้วย เหมาะกับคนที่ต้องแคปหลักฐานส่งงานหรือทำรายงาน

ผมแนะนำวิธีนี้ สำหรับคนที่ไม่อยากติดตั้ง Extension ใดๆ เพิ่มครับ เพราะ Edge มีในเครื่องอยู่แล้ว ฟังก์ชันนี้ก็ใช้ได้ดีเลย


วิธีที่ 5: แคปหน้าเว็บเป็น PDF (ใช้ได้ทุก Browser)

บางทีเราไม่ได้ต้องการไฟล์รูป แต่ต้องการเก็บทั้งหน้าเว็บเป็นเอกสาร PDF ซึ่งเหมาะกับการเก็บหลักฐาน ส่งอีเมล หรือพิมพ์ออกมา วิธีนี้ใช้ได้ทุก Browser ครับ (ถ้าต้องการแก้ไข PDF สามารถใช้ Microsoft Office ฟรี ได้)

ขั้นตอน

  1. เปิดหน้าเว็บที่ต้องการ
  2. กด Ctrl + P (สั่งพิมพ์)
  3. ที่ช่อง Destination เลือก Save as PDF (ไม่ใช่เลือกเครื่องพิมพ์)
  4. ตั้งค่า Layout เป็น Portrait หรือ Landscape ตามต้องการ
  5. กด Save

เคล็ดลับเพิ่มเติม

  • ถ้าหน้าเว็บมีโฆษณาเยอะ ลองเปิด Reader Mode ก่อน (กด F9 ใน Firefox) แล้วค่อยเซฟ PDF จะได้เอกสารที่สะอาดกว่า
  • ใน Chrome ตั้งค่า More settings > เลือก Background graphics ถ้าต้องการให้สีพื้นหลังติดมาด้วย
  • วิธีนี้เหมาะมากสำหรับเก็บหลักฐานการสั่งซื้อจาก Shopee หรือใบเสร็จออนไลน์ต่างๆ

เปรียบเทียบ PrtSc กับ Full Page Screenshot

หลายคนยังใช้ปุ่ม PrtSc (Print Screen) อยู่ มาดูความแตกต่างกันครับ:

รายการPrtSc (Print Screen)Full Page Screenshot
แคปได้แค่ไหนแค่ส่วนที่เห็นบนจอทั้งหน้าเว็บ ยาวเท่าไหร่ก็ได้
ต้องติดตั้งอะไรเพิ่มไม่ต้องExtension หรือใช้ DevTools/Firefox
รูปแบบเซฟต้องไป Paste ใน Paint ก่อนเซฟเป็นไฟล์ PNG/PDF ได้ทันที
ใช้ได้กับอะไรทุกอย่างบนจอเฉพาะหน้าเว็บใน Browser
ความสะดวกต้องทำหลายขั้นตอนคลิกเดียวเสร็จ

ถ้าต้องการแคปแค่ส่วนที่เห็นบนจอ PrtSc ก็ยังใช้ได้ดีครับ แต่ถ้าต้องการแคปทั้งหน้าเว็บ ใช้วิธีที่ผมแนะนำข้างบนจะสะดวกกว่ามาก ไม่ต้องมานั่งต่อภาพเองทีละส่วน

สำหรับคนที่ใช้ Windows 10/11 ลองดูวิธีแคปจอด้วย Snipping Tool ที่มีในเครื่องอยู่แล้วด้วยครับ ใช้แคปส่วนที่เลือกบนจอได้สะดวกดี


วิธีแคปหน้าเว็บบนมือถือ

นอกจากคอมพิวเตอร์แล้ว บนมือถือก็แคปหน้าเว็บยาวๆ ได้เหมือนกันครับ:

  • iPhone/iPad (Safari) — แคปหน้าจอปกติ แล้วกดที่ Preview เลือก Full Page ด้านบน แล้วเซฟเป็น PDF
  • Android (Chrome) — กด Share > เลือก Long screenshot (มีใน Android 12 ขึ้นไป)
  • Samsung — แคปหน้าจอ แล้วกดปุ่ม Scroll Capture ที่แถบด้านล่าง กดซ้ำจนได้ความยาวที่ต้องการ

คำถามที่พบบ่อย

แคปหน้าเว็บที่ต้อง Login ได้ไหม?

ได้ครับ ทุกวิธีที่แนะนำทำงานบน Browser ที่เรา Login อยู่แล้ว จะแคปหน้าเว็บธนาคาร หน้า Facebook หรือหน้าอะไรก็ได้หมด เพราะมันแคปจากสิ่งที่แสดงผลบนจอเรา ไม่ได้ไปดึงข้อมูลจากที่อื่น

แคปหน้าเว็บที่มีวิดีโอได้ไหม?

ได้ครับ แต่ส่วนวิดีโอจะแสดงเป็นภาพนิ่ง (เฟรมที่หยุดอยู่ตอนนั้น) ไม่ได้บันทึกเป็นวิดีโอ ถ้าต้องการบันทึกวิดีโอต้องใช้โปรแกรม Screen Record แทน

แคปได้ แต่รูปออกมาเบลอ ไม่คมชัด แก้ยังไง?

ลองใช้ Chrome DevTools (วิธีที่ 1) ครับ วิธีนี้ได้ภาพคมชัดที่สุดเพราะแคปตามความละเอียดจริงของหน้าเว็บ ถ้าใช้ Extension แล้วภาพเบลอ อาจเป็นเพราะหน้าเว็บมีการโหลดรูปแบบ lazy loading ลองเลื่อนดูทั้งหน้าก่อนแล้วค่อยแคป

Extension แคปหน้าเว็บปลอดภัยไหม? จะขโมยข้อมูลไหม?

GoFullPage และ FireShot เป็น Extension ที่มีคนใช้หลายล้านคนและได้รับการรีวิวดีครับ แต่ผมแนะนำให้ดูจำนวนผู้ใช้และรีวิวก่อนติดตั้ง Extension ใดๆ เสมอ ถ้าไม่มั่นใจ ให้ใช้วิธี DevTools หรือ Firefox ที่ไม่ต้องลงอะไรเพิ่มครับ ดูเพิ่มเติมเรื่องความปลอดภัยบนอินเทอร์เน็ตได้อีก

แคปหน้าเว็บที่เป็น Infinite Scroll (เลื่อนไม่มีจบ) ได้ไหม?

หน้าเว็บแบบ Infinite Scroll เช่น Facebook Feed หรือ Twitter จะแคปได้เฉพาะส่วนที่โหลดขึ้นมาแล้วครับ ถ้าต้องการแคปให้ได้มากที่สุด ให้เลื่อนลงจนถึงจุดที่ต้องการก่อน รอให้เนื้อหาโหลดครบ แล้วค่อยแคป


สรุป

วิธีความง่ายแนะนำสำหรับ
Chrome DevToolsปานกลางคนที่ถนัดเรื่องเทคนิค ต้องการภาพคมชัด
GoFullPage Extensionง่ายมากทุกคน (แนะนำ)
Firefox Screenshotง่ายคนที่ใช้ Firefox อยู่แล้ว
Microsoft Edgeง่ายคนที่ไม่อยากลง Extension
เซฟเป็น PDFง่ายเก็บหลักฐาน ส่งเอกสาร

ผมแนะนำ GoFullPage ครับ เพราะใช้ง่ายที่สุด แค่คลิกเดียวเสร็จเลย ติดตั้งครั้งเดียวใช้ได้ตลอด ฟรีด้วยครับ แต่ถ้าไม่อยากลง Extension ใดๆ ก็ใช้ Chrome DevTools หรือ Firefox ที่มีฟีเจอร์แคปในตัวอยู่แล้วได้เลย

ถ้าเจอปัญหาแคปไม่ได้ หรืออยากรู้เพิ่มเรื่องการใช้คอมพิวเตอร์ ลองอ่านบทความอื่นๆ ของผมได้ครับ เช่นวิธีเช็คเว็บไซต์ล่ม หรือวิธีทดสอบความเร็วเน็ต


บทความที่เกี่ยวข้อง

แชร์บทความนี้

ข้อจำกัดความรับผิดชอบ

บทความนี้จัดทำขึ้นเพื่อให้ความรู้เท่านั้น ผู้อ่านควรสำรองข้อมูลสำคัญทุกครั้งก่อนทำตามขั้นตอนใดๆ โยโยคอมพิวเตอร์ไม่รับผิดชอบต่อความเสียหายที่อาจเกิดขึ้นจากการนำข้อมูลไปปฏิบัติ ผู้อ่านยอมรับความเสี่ยงด้วยตนเอง หากไม่มั่นใจ ควรปรึกษาช่างผู้เชี่ยวชาญ

สุทินันท์ ปูคะภาค (โย) - ช่างคอมพิวเตอร์

เขียนโดย

สุทินันท์ ปูคะภาค (โย)

ช่างคอมพิวเตอร์ประสบการณ์กว่า 20 ปี จากจังหวัดสระบุรี แชร์ความรู้ไอทีผ่านบทความและวิดีโอ YouTube เพื่อให้ทุกคนแก้ปัญหาคอมได้ด้วยตัวเอง

ดูวิดีโอบน YouTube