ภาพหน้าจอเว็บไซต์คุณภาพสูงสุด


16

ฉันได้สร้างเว็บไซต์ที่ฉันต้องการเพิ่มลงในแฟ้มสะสมผลงานของฉัน แต่ฉันมีเวลายากที่จะได้รับภาพหน้าจอคุณภาพสูงของเว็บไซต์เต็มรูปแบบ ฉันพยายามบันทึกเว็บไซต์เป็น PDF แต่นั่นเต็มไปด้วยข้อผิดพลาดบริการออนไลน์อื่น ๆ ไม่สามารถสร้างภาพขึ้นมาได้ ฉันก็แค่พยายามที่จะจับภาพหน้าจอปกติบน mac เพื่อรวมเข้าด้วยกัน แต่มันก็มีคุณภาพลดลงจริง ๆ เมื่อฉันลดขนาดลง

มีความคิดที่ดีไหม? :)


คุณสามารถให้ตัวอย่างของสิ่งที่เกิดขึ้นและอาจเป็นตัวอย่างของสิ่งที่คุณพยายามบรรลุ
cclark413

เมื่อคุณพูดว่า "ผลงาน" คุณหมายถึงภาพทางกายภาพ (พิมพ์บนกระดาษ) หรือชุดภาพ (JPG, PNG) ที่คุณสามารถเผยแพร่ในสื่อดิจิทัลหรือออนไลน์ได้หรือไม่
งงงวย

ฉันสนใจมากว่าทำไมภาพหน้าจอของ Mac ที่ OP ได้ลองใช้นั้นไม่ได้ดีไปกว่าโซลูชันด้านล่าง ฉันไม่ทราบเกี่ยวกับภาพหน้าจอ Hi Def ใด ๆ ดังนั้นหากมีคนสามารถอธิบายได้โปรดอธิบาย นอกจากนี้ฉันยังสนใจในปัญหาการปรับขนาด โดยปกติแล้วจะเป็นวิธีอื่น ๆ แน่นอนว่าเมื่อคุณลดขนาดลง - มีพื้นที่ว่างน้อยกว่าที่พิกเซลจะแสดงภาพ แต่สูญเสีย "คุณภาพ" หรือไม่ เปอร์เซ็นต์การซูมของคุณอาจทำให้เป็นแบบนี้หรือ ลอง 100%
cclark413

1
ความละเอียดหน้าจอ 1920x1080 (1080p) ให้ภาพสำหรับการพิมพ์ที่เหมาะสำหรับ 6.4 x 3.6 นิ้ว
horatio

คำตอบ:


16

ใน Firefox คุณสามารถเปิดคอนโซลด้วยShift+F2และใช้งานscreenshot --fullpageได้

เมื่อต้องการปรับขนาดให้มีขนาดและขนาดแตกต่างกันในขณะที่รักษาคุณภาพข้อความให้ใช้Ctrl+Shift+M(หรือCmd+Opt+Mบน OS X) เพื่อเข้าสู่โปรแกรมดูการออกแบบที่ตอบสนองและปรับขนาดตามต้องการ (คุณยังสามารถใช้สิ่งนี้เพื่อรับภาพหน้าจอที่ความละเอียดสูงกว่าจอภาพของคุณ ของมุมมองแท็บเล็ต / มือถือ) ไม่จำเป็นต้องใช้ปลั๊กอิน

ตัวอย่างขนาดใหญ่

ตัวอย่างเล็ก ๆ


7

หากคุณต้องการจับภาพหน้าจอเต็มหน้าจอในเว็บไซต์คุณสามารถใช้ปลั๊กอิน Google Chromeนี้

สิ่งนี้จะทำให้ภาพหน้าจอหลายภาพ (ขณะเลื่อน) และรวมเป็นภาพ. png หนึ่งภาพ

คุณเพียงแค่คลิกที่ปลั๊กอินและเลือก "จับทั้งหน้า"

ป้อนคำอธิบายรูปภาพที่นี่


ส่วนตัวผมใช้อันนี้มันทำให้ง่ายต่อการบันทึกไฟล์
Yisela

ภาพหน้าจอควรใช้ในแฟ้มสะสมผลงานบนเว็บไซต์ของฉันเอง ฉันได้ลองทั้งภาพหน้าจอดีเลิศและภาพหน้าจอเว็บเพจ แต่พวกเขาไม่ทำงานบนหน้าเว็บที่ฉันพยายามจับภาพ เอฟเฟกต์พารัลแลกซ์จะทำลายภาพหน้าจอและองค์ประกอบที่ปรากฏขึ้นครั้งแรกเมื่อผู้ใช้เลื่อนลงไปที่ภาพนั้นจะไม่ปรากฏบนหน้าจอ ฉันได้ดูวิธีแก้ไขปัญหาเล็กน้อยที่สามารถแปลง css เป็นเวกเตอร์ซึ่งจะสมบูรณ์แบบ แต่พวกเขาดูเหมือนจะทำลายโครงสร้างของหน้าและไม่สามารถจัดการภาพได้
McKeene

1
parralax เป็นภาพเคลื่อนไหวที่ไม่สามารถจับภาพในภาพนิ่ง ลองปิดการใช้งานภาพพื้นหลังแล้วสร้างภาพคอมโพสิตโดยใช้ screencaps และไฟล์ต้นฉบับ
horatio

1
ฉันใช้สิ่งนี้ด้วย มันเจ๋งนะ. มันไม่ทำงานกับไฟล์ในตัวเครื่อง คุณต้องโฮสต์หน้า html ก่อน นอกจากนี้ยังมีหน้าจอพิมพ์ goog ol 'ด้วย หากคุณต้องการเป็นเครื่องมือจับภาพหน้าจอที่รวดเร็วในการจับภาพเคลื่อนไหว / Parallax ลองScreencast-o-matic มันเป็นเว็บและเอาท์พุทวิดีโอที่มีคุณภาพค่อนข้างดี
จอห์น

1

ฉันแนะนำFaststone Captureซึ่งคุณสามารถใช้ภายนอกเบราว์เซอร์เพื่อสิ่งอื่นได้ น่าเสียดายที่ @McKeene ดังกล่าวมีปัญหาในการผสานภาพเดียวเข้าด้วยกันเป็นภาพใหญ่เพราะเอฟเฟกต์การเลื่อน

เวอร์ชั่น 5.3 ฟรี (ดาวน์โหลดภาษาเยอรมัน) สำหรับผู้ใช้ตามบ้าน รุ่นล่าสุดอยู่ที่ประมาณ $ 20

จับภาพหน้าจอของ FastStone


1

ผู้ใช้ Firefoxเพียงเพิ่มปลั๊กอินชื่อ "ภาพหน้าจอดีเลิศ" หากต้องการดาวน์โหลด Addon นี้โปรดไปที่ลิงค์ต่อไปนี้https://addons.mozilla.org/en-US/firefox/addon/awesome-sc Screenshot-capture- /

ผู้ใช้ Chrome สามารถไปที่ https://chrome.google.com/webstore/detail/awesome-scurrency-captur/alelhddbbhepgpmgidjdcjakblofbmce?hl=th

addon นี้ช่วยให้ผู้ใช้สามารถจับภาพหน้าจอของส่วนที่มองเห็นได้เช่นเดียวกับหน้าเต็มคุณสามารถครอบตัดแทรกรูปร่าง ฯลฯ โดยไม่ต้องเปลี่ยนไปใช้โปรแกรมอื่น


1

ฉันเพิ่งเริ่มใช้Pagelayersสำหรับ mac และฉันค่อนข้างมีความสุขกับมัน

บางสิ่งที่ฉันชอบ:

  • สามารถสร้าง Psd ได้ที่ความกว้างที่กำหนดเองและความสูงไม่ จำกัด

  • psd ที่สร้างขึ้นถูกแบ่งออกเป็นกลุ่มและเลเยอร์

  • สามารถบันทึกเป็น PNG ได้โดยตรง

บางสิ่งที่รบกวนฉัน:

  • ต้องโหลดหน้าเว็บในแอป ไม่มีนามสกุลโครเมียม สิ่งนี้อาจค่อนข้างน่าเบื่อโดยเฉพาะเมื่อคุณต้องการภาพหน้าจอที่เรียบง่าย (จับที่ใหญ่ที่สุดของฉันกับมัน)
  • ไฟล์ psd ที่สร้างขึ้นอาจมีขนาดค่อนข้างใหญ่

สิ่งที่คุณอาจไม่ชอบ:

ราคา: 20 ปอนด์

ฉันมีกรณีการใช้งานที่แตกต่างกันดังนั้นฉันสามารถปรับราคาได้ แต่คุณอาจไม่ได้ถ้าคุณต้องการภาพหน้าจอธรรมดา

หวังว่านี่จะช่วยได้


1

ในกรณีที่บางคนใส่ใจที่จะอ่านคำตอบทั้งหมดและไม่พอใจกับคำตอบข้างต้นซึ่งยอดเยี่ยมก็มีปลั๊กอินสกรีนช็อตสำหรับ Firefox: "Screengrab!" . ฉันไม่ทราบว่าคุณจะได้รับความละเอียดเท่าใด แต่หน้าปัจจุบันทั้งหมดจะอยู่ในหน้าจอไม่ใช่เฉพาะส่วนที่มองเห็นได้ โดยปกติคุณสามารถไปและเลือกส่วนที่ระบุหรือเฉพาะส่วนที่มองเห็นได้ในปัจจุบันของหน้าจอเท่านั้นซึ่งจะบันทึกเป็นรูปแบบ png


ความละเอียดที่คุณได้รับขึ้นอยู่กับการกำหนดค่าการแสดงผลของจอภาพที่คุณใช้
Rafael
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.