Πίσω στο blog

Πώς να κάνετε πλήρη στιγμιότυπο οθόνης: πώς να κάνετε πλήρη στιγμιότυπο οθόνης σε οποιαδήποτε συσκευή

Μάθετε πώς να κάνετε πλήρη στιγμιότυπα οθόνης με τον εύκολο οδηγό μας—εξερευνώντας τα ενσωματωμένα εργαλεία του προγράμματος περιήγησης, τις επεκτάσεις και τις μεθόδους για κινητά για τέλειες καταγραφές.

Πώς να κάνετε πλήρη στιγμιότυπο οθόνης: πώς να κάνετε πλήρη στιγμιότυπο οθόνης σε οποιαδήποτε συσκευή

Όταν χρειάζεται να καταγράψετε μια ιστοσελίδα, συνήθως θέλετε να έχετε την ολόκληρη ιστορία, όχι μόνο το κομμάτι που χωράει στην οθόνη σας. Η λήψη ενός στιγμιότυπου οθόνης πλήρους σελίδας σημαίνει ότι θα καταγράψετε τα πάντα από την κορυφή της μπάντας μέχρι το κάτω μέρος της σελίδας σε μία καθαρή λήψη. Τα καλά νέα; Μπορείτε να παραλείψετε τη χρονοβόρα διαδικασία λήψης πολλών στιγμιότυπων και ραφής τους μαζί. Οι δύο καλύτερες επιλογές σας είναι μια απλή επέκταση προγράμματος περιήγησης για λήψεις με ένα κλικ ή τα δικά σας εργαλεία προγραμματιστών του προγράμματος περιήγησης για μια εγγενή λύση.

Γιατί η Λήψη Στιγμιότυπου Οθόνης Πλήρους Σελίδας Είναι Μια Σύγχρονη Ανάγκη

Έχετε προσπαθήσει ποτέ να αποθηκεύσετε ένα μακρύ άρθρο ή μια ηλεκτρονική απόδειξη, μόνο και μόνο για να καταλήξετε με ένα μπερδεμένο παζλ από μερικές εικόνες; Είναι μια συνηθισμένη απογοήτευση. Δεν χάνετε μόνο μέρη της σελίδας; χάνετε την πλήρη εικόνα. Τα κανονικά στιγμιότυπα οθόνης απλά δεν μπορούν να διαχειριστούν τις ατελείωτες ιστοσελίδες που κυλούν σήμερα, αποτυγχάνοντας να καταγράψουν το πλήρες πλαίσιο.

Αυτός είναι ακριβώς ο λόγος που το να γνωρίζετε πώς να πάρετε ένα στιγμιότυπο οθόνης πλήρους σελίδας έχει γίνει μια τόσο ζωτική δεξιότητα. Δεν είναι απλώς ένα ωραίο κόλπο; είναι ένα πρακτικό εργαλείο για σχεδιαστές, marketers και πραγματικά οποιονδήποτε χρειάζεται να τεκμηριώσει το περιεχόμενο του ιστού με ακρίβεια.

Πέρα από το Ορατό Παράθυρο

Ένα κανονικό στιγμιότυπο οθόνης καταγράφει μόνο ό,τι βλέπετε τη στιγμή εκείνη. Αντίθετα, μια λήψη πλήρους σελίδας αποθηκεύει ολόκληρο το μήκος της σελίδας σε μία συνεχόμενη, υψηλής ποιότητας εικόνα. Αυτό είναι ένα σημαντικό πλεονέκτημα για μια σειρά καθημερινών εργασιών:

  • Αξιολογήσεις Σχεδίασης και UX: Φανταστείτε να προσπαθείτε να κριτικάρετε τη ροή χρήστη μιας σελίδας προϊόντος με μόνο μερικές αποσπασματικές εικόνες. Η καταγραφή ολόκληρης της διαδρομής δίνει στην ομάδα σας το πλήρες πλαίσιο.
  • Αρχειοθέτηση Περιεχομένου: Βρήκατε ένα φανταστικό μακροσκελές άρθρο που θέλετε να διαβάσετε εκτός σύνδεσης; Μια λήψη πλήρους σελίδας το αποθηκεύει όλα για αργότερα.
  • Τήρηση Αρχείων: Ιδανικό για την τεκμηρίωση μιας πλήρους ιστορίας συναλλαγών ή μιας εκτενούς αλληλογραφίας για τα αρχεία σας χωρίς να χάσετε ούτε μία λεπτομέρεια.
  • Αναφορά Σφαλμάτων: Όταν εντοπίσετε μια οπτική δυσλειτουργία, η παρουσίαση στους προγραμματιστές της ολόκληρης της σελίδας τους βοηθά να εντοπίσουν το πρόβλημα πολύ πιο γρήγορα.

Αυτό το δέντρο απόφασης μπορεί να σας βοηθήσει να καταλάβετε γρήγορα την καλύτερη μέθοδο με βάση τις ανάγκες σας και πόσο άνετα νιώθετε με διάφορα εργαλεία.

Ένα διάγραμμα ροής που περιγράφει μια διαδικασία λήψης αποφάσεων για την επιλογή μεταξύ διαφορετικών μεθόδων με βάση τις προτιμήσεις του χρήστη.

Όπως δείχνει το διάγραμμα ροής, αν η ταχύτητα και η απλότητα είναι οι κορυφαίες προτεραιότητές σας, μια επέκταση είναι πιθανώς η καλύτερη επιλογή σας. Αν είστε εντάξει με μερικά επιπλέον κλικ και προτιμάτε μια ενσωματωμένη λύση, τα εργαλεία του προγράμματος περιήγησης είναι μια καλή επιλογή.

Η ανάγκη για αυτήν την τεχνική πραγματικά αυξήθηκε με την άνοδο του responsive design. Καθώς οι ιστοσελίδες γίνονταν πιο μακρές και δυναμικές, οι ομάδες QA ανακάλυψαν ότι η καταγραφή της ολόκληρης αποδοθείσας σελίδας ήταν κρίσιμη για τη δοκιμή. Στην πραγματικότητα, μέχρι το 2015, πολλοί ανέφεραν ότι αυτή η μέθοδος μείωσε τα σφάλματα οπτικής υποβάθμισης κατά 30–40% σε σύγκριση με στιγμιότυπα οθόνης ενός μόνο παραθύρου. Γιατί; Επειδή εντόπισε εκείνα τα δύσκολα στοιχεία εκτός οθόνης και το περιεχόμενο που φορτώνεται αργά και αλλιώς θα χάνονταν. Μπορείτε να εμβαθύνετε σε αυτά τα ευρήματα δοκιμών ιστού στο Research and Markets.

Γρήγορος Οδηγός για Μεθόδους Στιγμιότυπου Οθόνης Πλήρους Σελίδας

Για να σας βοηθήσουμε να αποφασίσετε με μια ματιά, αυτός ο πίνακας αναλύει τις πιο κοινές μεθόδους, τις ιδανικές περιπτώσεις χρήσης τους και τι απαιτείται.

Μέθοδος Καλύτερα Για Τεχνική Δεξιότητα Απαιτεί Εγκατάσταση
Εργαλεία DevTools του Προγράμματος Περιήγησης Γρήγορες, μίας χρήσης λήψεις χωρίς να εγκαταστήσετε τίποτα. Βασικές Όχι
Επεκτάσεις Προγράμματος Περιήγησης Συχνή χρήση, πρόσθετες δυνατότητες όπως επεξεργασία και αποθήκευση στο cloud. Καμία Ναι
Δυνατότητες Mobile OS Καταγραφή περιεχομένου στο τηλέφωνο ή το tablet σας. Καμία Όχι
Εφαρμογές Τρίτων Προηγμένες δυνατότητες, αυτοματοποίηση και συνεργασία ομάδας. Διαφέρει Ναι

Κάθε μία από αυτές τις προσεγγίσεις έχει τη θέση της. Η σωστή για εσάς εξαρτάται πραγματικά από το πόσο συχνά θα κάνετε λήψεις και τι σκοπεύετε να κάνετε με αυτές αργότερα.

Χρήση Ενσωματωμένων Εργαλείων Προγράμματος Περιήγησης για Καθαρές Λήψεις

Μερικές φορές, το καλύτερο εργαλείο για τη δουλειά είναι αυτό που ήδη έχετε. Πριν αρχίσετε να ψάχνετε για άλλη επέκταση, αξίζει να γνωρίζετε ότι προγράμματα περιήγησης όπως το Google Chrome και το Microsoft Edge διαθέτουν μια ισχυρή, ενσωματωμένη δυνατότητα για λήψεις στιγμιότυπων οθόνης πλήρους σελίδας. Είναι αγαπημένο μεταξύ των προγραμματιστών και άλλων τεχνολογικά καταρτισμένων ατόμων επειδή είναι ακριβές και εντελώς χωρίς ακαταστασία.

Αυτό το εγγενές εργαλείο είναι κρυμμένο μέσα στο πάνελ Εργαλεία Προγραμματιστή. Αυτό μπορεί να ακούγεται λίγο τρομακτικό, αλλά η διαδικασία είναι εκπληκτικά απλή. Χωρίς λήψεις, χωρίς εγγραφές και χωρίς επιπλέον εικονίδια να γεμίζουν τη γραμμή εργαλείων σας. Απλά αποκτάτε μια λήψη pixel-perfect της ολόκληρης σελίδας, ακριβώς όπως την βλέπει το πρόγραμμα περιήγησης.

Πρόσβαση στην Εντολή Στιγμιότυπου

Πρώτα πρώτα, πρέπει να ανοίξετε τα Εργαλεία Προγραμματιστή στη σελίδα που θέλετε να καταγράψετε. Υπάρχουν μερικοί γρήγοροι τρόποι για να το κάνετε αυτό:

  • Συντόμευση Πληκτρολογίου: Ο ταχύτερος δρόμος είναι να πατήσετε Cmd+Option+I σε Mac ή Ctrl+Shift+I σε Windows.
  • Μενού Δεξιού Κλικ: Μπορείτε επίσης απλά να κάνετε δεξί κλικ οπουδήποτε στη σελίδα και να επιλέξετε "Επιθεώρηση" από το μενού που εμφανίζεται.

Με το πάνελ DevTools ανοιχτό, το επόμενο βήμα είναι να εκτελέσετε μια εντολή.

Μην ανησυχείς, δεν θα γράψεις κανένα κώδικα. Απλώς άνοιξε το μενού εντολών πατώντας Cmd+Shift+P (Mac) ή Ctrl+Shift+P (Windows).

Μια μπάρα αναζήτησης θα εμφανιστεί στην κορυφή της οθόνης σου. Απλώς άρχισε να πληκτρολογείς "screenshot," και θα δεις μια λίστα επιλογών να εμφανίζεται αμέσως.

Συμβουλή: Θα δεις μερικές επιλογές, αλλά για μια πλήρη καταγραφή, αγνόησε τις επιλογές "area" ή "node". Αυτό που ψάχνεις είναι Capture full size screenshot. Αυτή η εντολή λέει στον περιηγητή να ενώσει ολόκληρη τη σελίδα σε μία αδιάσπαστη εικόνα.

Επίλεξε αυτή την επιλογή, πάτησε Enter, και αυτό είναι. Ο περιηγητής θα χρειαστεί λίγο χρόνο για να επεξεργαστεί ολόκληρη τη σελίδα και στη συνέχεια θα κατεβάσει αυτόματα το screenshot, συνήθως ως αρχείο PNG, απευθείας στον φάκελο λήψεών σου. Είναι μια εξαιρετικά καθαρή και άμεση μέθοδος.

Φυσικά, ενώ αυτή η ενσωματωμένη επιλογή είναι φανταστική για μια γρήγορη, χωρίς κόπο καταγραφή, έχει τα όριά της. Αν χρειάζεσαι περισσότερες δυνατότητες όπως άμεση επεξεργασία, σημειώσεις ή αποθήκευση στο cloud, ένα ειδικό εργαλείο όπως η ShiftShift Full Page Screenshot extension μπορεί πραγματικά να επιταχύνει τη ροή εργασίας σου.

Καταγραφή Συγκεκριμένων Κινητών Εμφανίσεων

Εδώ είναι που η μέθοδος DevTools πραγματικά ξεχωρίζει: καταγράφοντας ακριβώς πώς φαίνεται μια ιστοσελίδα σε μια συγκεκριμένη κινητή συσκευή. Αυτό είναι ένα καθοριστικό σημείο για σχεδιαστές ιστοσελίδων, προγραμματιστές και testers QA που χρειάζονται να τεκμηριώσουν responsive σχέδια χωρίς να μαντεύουν.

Πριν εκτελέσεις την εντολή screenshot, πρέπει απλώς να αλλάξεις σε Device Mode.

Με το πάνελ DevTools σου ανοιχτό, κοίταξε για ένα μικρό εικονίδιο που μοιάζει με τηλέφωνο και tablet (Toggle device toolbar) και κάνε κλικ πάνω του. Η ιστοσελίδα σου θα συρρικνωθεί αμέσως σε μια κινητή εμφάνιση.

Από εκεί, μπορείς να χρησιμοποιήσεις το αναπτυσσόμενο μενού στην κορυφή της οθόνης για να επιλέξεις μια συγκεκριμένη συσκευή, όπως ένα "iPhone 14 Pro" ή ένα "Pixel 7."

Μόλις έχεις την εμφάνιση που θέλεις, απλώς εκτέλεσε την εντολή Capture full size screenshot ακριβώς όπως έκανες πριν.

Το αποτέλεσμα είναι μια τέλεια, πλήρους μήκους εικόνα της ιστοσελίδας σου όπως εμφανίζεται στην οθόνη της συγκεκριμένης συσκευής. Είναι μια εξαιρετικά ακριβής μέθοδος για τη δημιουργία στιγμιότυπων για αναφορές σφαλμάτων, mockups σχεδίασης ή παρουσιάσεις πελατών, όλα χωρίς να χρειάζεται να έχεις τη φυσική συσκευή στο χέρι σου.

Οι ενσωματωμένα εργαλεία του περιηγητή είναι χρήσιμα σε μια δύσκολη στιγμή, αλλά ας είμαστε ειλικρινείς—δεν είναι φτιαγμένα για μια βαριά ροή εργασίας. Όταν χρειάζεσαι να καταγράφεις πλήρη screenshots τακτικά, τίποτα δεν πλησιάζει την ταχύτητα και την ευκολία μιας καλής επέκτασης περιηγητή. Αυτά τα εργαλεία τοποθετούνται ακριβώς στην εργαλειοθήκη του περιηγητή σου, μετατρέποντας μια δύσκολη, πολυάσχολη διαδικασία σε ένα μόνο, ικανοποιητικό κλικ.

Σκέψου τις πραγματικές καταστάσεις. Μπορεί να είσαι σχεδιαστής που αρχειοθετεί ιστοσελίδες ανταγωνιστών για μια mood board, ένας marketer που αποθηκεύει μεγάλες άρθρα για έρευνα, ή ένας υποστηρικτής που προσπαθεί να τεκμηριώσει ένα δύσκολο πρόβλημα χρήστη από την αρχή μέχρι το τέλος. Σε αυτές τις περιπτώσεις, η ασάφεια με τα εργαλεία προγραμματιστών απλά δεν θα είναι αρκετή. Η ταχύτητα είναι αυτό που χρειάζεσαι, και οι επεκτάσεις το παρέχουν.

Η σουίτα ShiftShift Extensions είναι ένα τέλειο παράδειγμα αυτού του είδους αποδοτικότητας. Το εργαλείο Full Page Screenshot είναι κρυμμένο μέσα σε μια ενιαία παλέτα εντολών, οπότε είναι πάντα έτοιμο όταν το χρειάζεσαι αλλά ποτέ δεν γεμίζει την οθόνη σου. Είναι μια ιδανική ρύθμιση για επαγγελματίες που απαιτούν ισχυρά εργαλεία χωρίς να θυσιάζουν έναν καθαρό, εστιασμένο χώρο εργασίας. Αν ψάχνεις να απλοποιήσεις τη δουλειά σου, μπορείς να εξερευνήσεις περισσότερα από τα ισχυρά εργαλεία επεκτάσεων περιηγητή μας.

Επιλέγοντας την Κατάλληλη Επέκταση για τις Ανάγκες σου

Μια γρήγορη αναζήτηση στο Chrome Web Store θα αποκαλύψει δεκάδες εργαλεία screenshot. Πώς μπορείς λοιπόν να ξεχωρίσεις τα καλά από τα εξαιρετικά; Στην πραγματικότητα, όλα καταλήγουν σε μερικούς βασικούς παράγοντες.

  • Απόδοση και Ταχύτητα: Πόσο γρήγορα καταγράφει πραγματικά τη σελίδα; Ορισμένες επεκτάσεις καθυστερούν σε μεγάλες, πολύπλοκες σελίδες ενώ άλλες είναι σχεδόν άμεσες.
  • Δυνατότητες Επεξεργασίας: Έχει ενσωματωμένο επεξεργαστή; Τα καλύτερα εργαλεία σου επιτρέπουν να περικόψεις, να προσθέσεις κείμενο, να σχεδιάσεις βέλη ή ακόμη και να θολώσεις ευαίσθητες πληροφορίες αμέσως μετά τη λήψη της φωτογραφίας.
  • Επιλογές Εξαγωγής: Μπορείς να το αποθηκεύσεις ως PNG ή JPG; Ακόμη καλύτερα, μπορείς να το εξάγεις ως αναζητήσιμο PDF; Η ευελιξία είναι το κλειδί.
  • Πολιτική Απορρήτου: Αυτό είναι σημαντικό. Η επέκταση μπορεί τεχνικά να "βλέπει" τη σελίδα στην οποία βρίσκεσαι, οπότε μια σαφής, πολιτική απορρήτου είναι μη διαπραγματεύσιμη. Εργαλεία που κάνουν όλη την επεξεργασία τοπικά στον υπολογιστή σου είναι πάντα η ασφαλέστερη επιλογή.

Η εύρεση του κατάλληλου εργαλείου συχνά καταλήγει σε προσωπικές προτιμήσεις και τις συγκεκριμένες ανάγκες σου, αλλά οι κριτικές και οι βαθμολογίες χρηστών μπορούν να σου πουν πολλά.

Ένας κομψός ασημένιος φορητός υπολογιστής που παρουσιάζει μια διεπαφή λογισμικού με μενού πλάγιας γραμμής, σε καθαρό λευκό φόντο.

Είναι επίσης καλό να γνωρίζεις λίγα για το τι συμβαίνει κάτω από την επιφάνεια. Πολλές επεκτάσεις χρησιμοποιούν μια τεχνική "scroll-and-stitch". Προγραμματίζουν την κύλιση προς τα κάτω, τραβούν μια φωτογραφία κάθε τμήματος και στη συνέχεια τις συνδυάζουν. Άλλες χρησιμοποιούν την εγγενή μηχανή απόδοσης του περιηγητή για να δημιουργήσουν μια ενιαία, άψογη εικόνα από την αρχή.

Η διαφορά απόδοσης είναι αρκετά έντονη. Οι αναφορές benchmark δείχνουν ότι οι εγγενείς μέθοδοι απόδοσης είναι συχνά πολύ πιο γρήγορες, παίρνοντας μόλις 0.8–1.6 δευτερόλεπτα κατά μέσο όρο. Αντίθετα, η προσέγγιση scroll-and-stitch μπορεί να πάρει 1.8–3.5 δευτερόλεπτα και έχει πολύ μεγαλύτερη πιθανότητα αποτυχίας σε σελίδες με δύσκολες διατάξεις.

Θα το παρατηρήσεις πραγματικά σε σελίδες με κολλώδεις κεφαλίδες ή κινούμενα σχέδια. Η μέθοδος scroll-and-stitch μπορεί εύκολα να μπερδευτεί, αφήνοντάς σε με περίεργες οπτικές γκλίτσες ή διπλασιασμένα στοιχεία στην τελική σου εικόνα.

Μια Πρακτική Οδηγία με μια Επέκταση

Η εκκίνηση με μια επέκταση είναι απίστευτα απλή.

Μόλις εγκαταστήσετε μία που σας αρέσει από το κατάστημα του προγράμματος περιήγησής σας, το εικονίδιο της συνήθως θα εμφανιστεί δίπλα από τη γραμμή διευθύνσεων.

Από εκεί, η διαδικασία είναι πανεύκολη. Απλά πλοηγηθείτε στη σελίδα που θέλετε να καταγράψετε και κάντε κλικ στο εικονίδιο της επέκτασης. Τα περισσότερα ποιοτικά εργαλεία θα σας δώσουν αμέσως μερικές επιλογές:

  • Καταγραφή Ολόκληρης Σελίδας: Το κύριο γεγονός. Αυτή είναι η επιλογή με ένα κλικ που καταγράφει τα πάντα.
  • Καταγραφή Ορατής Περιοχής: Μια γρήγορη λήψη μόνο του τι είναι στην οθόνη σας αυτή τη στιγμή.
  • Καταγραφή Επιλεγμένης Περιοχής: Σας επιτρέπει να κάνετε κλικ και να σύρετε για να ορίσετε την ακριβή περιοχή που θέλετε.

Μόλις πατήσετε Καταγραφή Ολόκληρης Σελίδας, η επέκταση αναλαμβάνει, επεξεργαζόμενη αυτόματα ολόκληρη τη σελίδα. Σε λίγο, μια νέα καρτέλα θα ανοίξει με το τελικό σας στιγμιότυπο οθόνης, έτοιμο προς επεξεργασία. Μπορείτε να χρησιμοποιήσετε τα ενσωματωμένα εργαλεία για να προσθέσετε σημειώσεις ή να το περικόψετε πριν το αποθηκεύσετε στον υπολογιστή σας ως PNG, JPG ή PDF. Αυτή η απρόσκοπτη ροή είναι ακριβώς ο λόγος που οι επεκτάσεις είναι αναπόσπαστο μέρος του εργαλείου μου.

Κατα mastering Scrolling Screenshots σε Κινητά

Ας το παραδεχτούμε, ζούμε στα τηλέφωνά μας. Η καταγραφή περιεχομένου εν κινήσει δεν είναι απλώς μια ωραία προσθήκη; είναι απαραίτητη. Το να γνωρίζετε πώς να κάνετε scrolling screenshot στο τηλέφωνό σας είναι μια σύγχρονη υπερδύναμη, ιδανική για την αποθήκευση τα πάντα από μακριές συνομιλίες κειμένου μέχρι λεπτομερείς διαδικτυακές συνταγές.

Ευτυχώς, δεν χρειάζεστε πια μια εφαρμογή τρίτου μέρους για αυτό. Η διαδικασία είναι λίγο διαφορετική μεταξύ iOS και Android, αλλά και οι δύο έχουν μερικά εκπληκτικά ισχυρά ενσωματωμένα εργαλεία που κάνουν τη δουλειά.

Καταγραφή Ολόκληρων Σελίδων σε iPhone

Η Apple διαθέτει μια εντυπωσιακή δυνατότητα πλήρους οθόνης για στιγμιότυπα οθόνης ενσωματωμένη απευθείας στο iOS, αλλά πραγματικά λάμπει όταν χρησιμοποιείτε το Safari. Είναι λίγο κρυμμένος θησαυρός αν δεν ξέρετε πού να κοιτάξετε.

Αρχικά, απλώς τραβήξτε ένα στιγμιότυπο οθόνης όπως πάντα:

  • Για iPhones με Face ID: Πατήστε ταυτόχρονα το Πλευρικό κουμπί και το Αύξηση Έντασης κουμπί.
  • Για iPhones με κουμπί Home: Πατήστε ταυτόχρονα το Πλευρικό κουμπί και το Home κουμπί.

Μια μικρή προεπισκόπηση θα εμφανιστεί στην κάτω αριστερή γωνία. Πρέπει να είστε γρήγοροι και να την πατήσετε πριν εξαφανιστεί. Μόλις μπείτε στον επεξεργαστή, κοιτάξτε στην κορυφή της οθόνης. Θα δείτε δύο καρτέλες: Οθόνη και Ολόκληρη Σελίδα.

Πατήστε την Ολόκληρη Σελίδα. Ένας ρυθμιστής θα εμφανιστεί στα δεξιά, επιτρέποντάς σας να προεπισκοπήσετε ολόκληρη την ιστοσελίδα που μόλις καταγράψατε.

Αυτό είναι το κόλπο: Η εγγενής δυνατότητα του iOS αποθηκεύει αυτές τις καταγραφές ολόκληρης σελίδας ως PDF, όχι ως τυπικό αρχείο εικόνας όπως PNG ή JPG. Αυτό είναι φανταστικό για την αποθήκευση άρθρων ή εγγράφων, αλλά είναι κάτι που πρέπει να έχετε υπόψη σας αν ελπίζατε για μια εικόνα.

Λήψη Στιγμιότυπου Οθόνης με Σκρολάρισμα σε Android

Το οικοσύστημα Android είναι λίγο σαν άγρια Δύση με όλους τους διαφορετικούς κατασκευαστές, αλλά η βασική λειτουργία είναι αρκετά συνεπής στα περισσότερα σύγχρονα τηλέφωνα από Google, Samsung και OnePlus. Συνήθως θα το δείτε να ονομάζεται Scroll Capture ή Scrolling Screenshot.

Ξεκινήστε τραβώντας ένα κανονικό στιγμιότυπο οθόνης, το οποίο σχεδόν πάντα γίνεται πατώντας ταυτόχρονα τα κουμπιά Ενέργειας και Μείωση Έντασης.

Μόλις το κάνετε, μια μικρή γραμμή εργαλείων θα εμφανιστεί στο κάτω μέρος της οθόνης σας. Κρατήστε το μάτι σας σε ένα εικονίδιο με βέλη που δείχνουν προς τα κάτω—μπορεί να είναι επισημασμένο ως "Capture more" ή απλώς να δείχνει ένα σύμβολο σκρολαρίσματος. Πατήστε το. Το τηλέφωνό σας θα σκρολάρει αυτόματα προς τα κάτω και θα ράψει την επόμενη ενότητα στο στιγμιότυπο οθόνης σας.

Μπορείτε να συνεχίσετε να πατάτε αυτό το κουμπί για να συνεχίσετε να καταγράφετε περισσότερα από τη σελίδα. Όταν έχετε όλα όσα χρειάζεστε, απλώς πατήστε την προεπισκόπηση του στιγμιότυπου οθόνης ή περιμένετε να εξαφανιστεί η γραμμή εργαλείων. Σε αντίθεση με τα iPhones, τα τηλέφωνα Android συνήθως αποθηκεύουν αυτές τις μεγάλες καταγραφές ως ένα μόνο, ψηλό αρχείο εικόνας (όπως PNG), το οποίο είναι πολύ πιο εύκολο για κοινή χρήση σε συνομιλίες ή στα μέσα κοινωνικής δικτύωσης.

Γιατί Μερικές Φορές Αποτυγχάνει

Έχετε προσπαθήσει ποτέ να τραβήξετε ένα στιγμιότυπο οθόνης με σκρολάρισμα και η επιλογή απλώς... δεν είναι εκεί; Συμβαίνει. Αυτό συμβαίνει συνήθως επειδή η εφαρμογή στην οποία βρίσκεστε έχει μια περίεργη, μη τυπική διάταξη ή έναν προσαρμοσμένο τρόπο σκρολαρίσματος. Αν το λειτουργικό σύστημα δεν μπορεί να ανιχνεύσει ένα απλό, σκρολάρισμα παράθυρο, δεν θα προσφέρει τη δυνατότητα.

Όταν χτυπήσετε αυτόν τον τοίχο, η μόνη πραγματική λύση είναι να επιστρέψετε στην παλιά σχολή: να τραβήξετε μια σειρά από επικαλυπτόμενα στιγμιότυπα οθόνης χειροκίνητα και να τα ενώσετε αργότερα αν χρειαστεί.

Πώς να Αντιμετωπίσετε Κοινά Ζητήματα Στιγμιότυπων Οθόνης

Έχετε τραβήξει το στιγμιότυπο οθόνης, αλλά όταν ανοίγετε το αρχείο, κάτι δεν πάει καλά. Ίσως να λείπει μέρος της σελίδας, να υπάρχουν περίεργα οπτικά σφάλματα ή το αρχείο να είναι απλώς πολύ μεγάλο για να το στείλετε μέσω email. Έχω βρεθεί εκεί. Η λήψη της καταγραφής είναι το ένα πράγμα; Η λήψη της σωστής είναι άλλο.

Ας δούμε μερικά από τα πιο κοινά προβλήματα και πώς να τα διορθώσουμε.

Επιλέγοντας τη Σωστή Μορφή Αρχείου: PNG vs. JPG

Πρώτα πρώτα, ας μιλήσουμε για τις μορφές αρχείων. Η επιλογή μεταξύ PNG και JPG (ή JPEG) δεν είναι απλώς μια τεχνική λεπτομέρεια—επηρεάζει άμεσα την ποιότητα και το μέγεθος της τελικής σας εικόνας.

  • PNG (Portable Network Graphics): Σκεφτείτε το αυτό ως την επιλογή υψηλής πιστότητας. Το PNG χρησιμοποιεί απώλεια συμπίεσης, που σημαίνει ότι διατηρεί κάθε pixel τέλεια ανέπαφο. Είναι η καλύτερη επιλογή για στιγμιότυπα οθόνης ιστοσελίδων, διεπαφών χρήστη ή οτιδήποτε με καθαρό κείμενο και καθαρές γραμμές. Δεν θα έχετε καμία θολούρα εδώ.
  • JPG (Joint Photographic Experts Group): Αυτό είναι το go-to σας όταν το μέγεθος του αρχείου είναι η κορυφαία προτεραιότητα. Το JPG χρησιμοποιεί συμπίεση με απώλειες, που έξυπνα απορρίπτει κάποια δεδομένα εικόνας για να μειώσει το αρχείο. Είναι εξαιρετικό για φωτογραφίες, αλλά μπορεί να κάνει το κείμενο και τις καθαρές άκρες σε ένα στιγμιότυπο οθόνης να φαίνονται λίγο θολά.

Μερικές φορές καταγράφετε ένα τέλειο PNG αλλά συνειδητοποιείτε αργότερα ότι χρειάζεστε ένα μικρότερο αρχείο για μια παρουσίαση ή μια ανάρτηση στο blog. Κανένα πρόβλημα. Μπορείτε εύκολα να μετατρέψετε από PNG σε JPG για να μειώσετε το μέγεθος του αρχείου χωρίς να χρειαστεί να ξανατραβήξετε τη φωτογραφία.

Δύο κινητά τηλέφωνα που παρουσιάζουν αφηρημένα περιεχόμενα ιστοσελίδας ή εφαρμογής με κείμενα και εικονίδια θέσης εικόνας.

Διορθώνοντας Αποκομμένες ή Ατελείς Καταγραφές

Είναι ένα από τα πιο απογοητευτικά πράγματα: τραβάτε ένα στιγμιότυπο οθόνης ολόκληρης της σελίδας μόνο για να διαπιστώσετε ότι το κάτω μισό είναι απλώς μια κενή λευκή κενότητα.

Αυτό σχεδόν πάντα οφείλεται στον τρόπο με τον οποίο είναι κατασκευασμένες οι σύγχρονες ιστοσελίδες. Πολλές χρησιμοποιούν μια τεχνική που ονομάζεται lazy loading, όπου οι εικόνες και άλλο περιεχόμενο δεν φορτώνονται πραγματικά μέχρι να τις σκρολάρετε στην οθόνη. Είναι εξαιρετικό για την απόδοση, αλλά μπορεί να εξαπατήσει τα εργαλεία στιγμιότυπων οθόνης που κινούνται πιο γρήγορα από ότι εμφανίζεται το περιεχόμενο.

Η λύση είναι εκπληκτικά απλή. Πριν πατήσετε το κουμπί καταγραφής, απλώς σκρολάρετε μέχρι το κάτω μέρος της σελίδας μόνοι σας. Πάρτε το χρόνο σας. Αυτό αναγκάζει κάθε στοιχείο που φορτώνεται με καθυστέρηση να εμφανιστεί, δίνοντας στο εργαλείο σας μια πλήρη, πλήρως αποδομένη σελίδα για να εργαστείτε.

Αυτό το μικρό κόλπο προ-σκρολαρίσματος είναι επίσης το μυστικό για την καταγραφή σελίδων με άπειρο σκρολάρισμα, διασφαλίζοντας ότι θα πάρετε όλα όσα χρειάζεστε.

Αντιμετωπίζοντας Κολλημένα Κεφαλίδες και Υποσέλιδα

Ξέρετε αυτές τις γραμμές πλοήγησης που παραμένουν κολλημένες στην κορυφή ή στο κάτω μέρος της οθόνης σας καθώς σκρολάρετε? Ονομάζονται "κολλητά" στοιχεία και μπορούν να προκαλέσουν χάος σε εργαλεία λήψης οθόνης που λειτουργούν με κύλιση και "ραφή" εικόνων μαζί.

  • DevTools του προγράμματος περιήγησης: Οι ενσωματωμένες εντολές στο Chrome ή το Edge είναι συνήθως αρκετά έξυπνες για να το διαχειριστούν. Απεικονίζουν ολόκληρη τη σελίδα ταυτόχρονα, οπότε βλέπουν την κολλητή κεφαλίδα ως ένα μόνο στοιχείο στη σωστή της θέση.
  • Προηγμένες Επεκτάσεις: Οι καλύτερες επεκτάσεις λήψης οθόνης είναι ειδικά προγραμματισμένες για να αναγνωρίζουν τα κολλητά στοιχεία και να τα χειρίζονται σωστά, είτε καταγράφοντας τα μόνο μία φορά είτε αφαιρώντας τα εντελώς για μια καθαρή λήψη.

Ακολουθεί ένας γρήγορος πίνακας αναφοράς που έχω συντάξει με βάση χρόνια εμπειρίας με αυτά τα ακριβή προβλήματα. Καλύπτει τα πιο συχνά ζητήματα που συναντούν οι άνθρωποι και τον ταχύτερο τρόπο για να τα επιλύσουν.

Συχνά Προβλήματα Λήψης Οθόνης και Λύσεις

Πρόβλημα Πιθανή Αιτία Συνιστώμενη Λύση
Λείπον Περιεχόμενο/Κενές Χώρες Lazy loading ή άπειρη κύλιση δεν φόρτωσαν όλα τα στοιχεία πριν από την καταγραφή. Κάντε κύλιση χειροκίνητα μέχρι το κάτω μέρος της σελίδας πριν ξεκινήσετε τη λήψη οθόνης για να αναγκάσετε όλα τα περιεχόμενα να φορτωθούν.
Επαναλαμβανόμενες Κεφαλίδες/Υποσέλιδα Κολλητά στοιχεία στη σελίδα μπερδεύουν τα εργαλεία λήψης οθόνης που "ραφούν" τις εικόνες μαζί. Χρησιμοποιήστε μια πιο προηγμένη μέθοδο καταγραφής, όπως τα ενσωματωμένα DevTools του προγράμματος περιήγησης ή μια ειδική επέκταση που μπορεί να χειριστεί τα κολλητά στοιχεία.
Θολό Κείμενο ή Θολές Λεπτομέρειες Η λήψη οθόνης αποθηκεύτηκε ως JPG με υψηλή συμπίεση, γεγονός που υποβαθμίζει την ποιότητα. Αποθηκεύστε τη λήψη οθόνης ως PNG για μέγιστη καθαρότητα. Αν το μέγεθος του αρχείου είναι κρίσιμο, χρησιμοποιήστε ένα JPG αλλά με ρυθμίσεις υψηλότερης ποιότητας.
Εξαιρετικά Μεγάλο Μέγεθος Αρχείου Μια μεγάλη σελίδα αποθηκεύτηκε ως μη συμπιεσμένο PNG, με αποτέλεσμα ένα τεράστιο αρχείο. Αποθηκεύστε ως JPG ή χρησιμοποιήστε ένα διαδικτυακό εργαλείο για να συμπιέσετε το PNG. Μπορείτε επίσης να μετατρέψετε το PNG σε JPG για ένα μικρότερο αρχείο.
Αποτυχία Λήψης σε Πολύπλοκες Σελίδες Η σελίδα έχει πολύπλοκα διαδραστικά στοιχεία, κινούμενα σχέδια ή σενάρια που παρεμβαίνουν στο εργαλείο. Δοκιμάστε να απενεργοποιήσετε το JavaScript προσωρινά μέσω των DevTools ή χρησιμοποιήστε μια διαφορετική επέκταση λήψης οθόνης που μπορεί να είναι πιο συμβατή.

Ελπίζω αυτός ο πίνακας να σας δώσει μια σαφή κατεύθυνση για την επόμενη φορά που η λήψη οθόνης σας δεν θα βγει όπως πρέπει. Λίγη γνώση επίλυσης προβλημάτων μπορεί να σας εξοικονομήσει πολύ χρόνο και απογοήτευση.

Έχετε Ερωτήσεις; Έχουμε Απαντήσεις

Δύο φορητοί υπολογιστές δίπλα-δίπλα που απεικονίζουν ένα πρόβλημα ιστοσελίδας με ένα κολλητό σημείωμα και μια σταθερή, καθαρή ιστοσελίδα.

Ακόμα και με τα καλύτερα εργαλεία στα χέρια σας, είναι αναπόφευκτο να συναντήσετε μερικές δύσκολες καταστάσεις κατά την καταγραφή πλήρων λήψεων οθόνης. Ας αντιμετωπίσουμε μερικές από τις πιο συχνές ερωτήσεις που ακούω ώστε να μπορείτε να αποκτήσετε μια τέλεια λήψη κάθε φορά.

Ποια είναι η Καλύτερη Μορφή για να Αποθηκεύσω τη Λήψη Οθόνης μου;

Εννέα φορές στις δέκα, PNG είναι η καλύτερη επιλογή σας. Χρησιμοποιεί αυτό που ονομάζεται χωρίς απώλειες συμπίεση, που είναι απλώς ένας φανταχτερός τρόπος να πούμε ότι η εικόνα σας δεν θα χάσει καμία ποιότητα. Κάθε γραμμή κειμένου θα είναι κοφτερή και κάθε στοιχείο σχεδίασης θα φαίνεται ακριβώς όπως στην οθόνη. Αυτό είναι μη διαπραγματεύσιμο για mockups σχεδίασης, αναφορές σφαλμάτων ή οποιαδήποτε επαγγελματική εργασία όπου η λεπτομέρεια είναι βασιλιάς.

Οπότε, πότε θα χρησιμοποιούσατε κάτι άλλο; Το JPG είναι πραγματικά μόνο για όταν το μέγεθος του αρχείου είναι η απόλυτη μεγαλύτερη ανησυχία σας και είστε εντάξει με λίγο θόλωμα. Για την αρχειοθέτηση άρθρων ή τη συσκευασία πολλών λήψεων, το PDF είναι μια φανταστική επιλογή, ειδικά όταν το εργαλείο που χρησιμοποιείτε διατηρεί το κείμενο επιλέξιμο.

Μπορώ Πραγματικά να Κάνω Λήψη Οθόνης μιας Σελίδας που Απαιτεί Σύνδεση;

Μπορείτε απολύτως. Κάθε μέθοδος που έχουμε μιλήσει—από τα DevTools μέχρι τις επεκτάσεις προγράμματος περιήγησης—λειτουργεί καταγράφοντας αυτό που είναι αυτή τη στιγμή στην οθόνη σας. Η διαδικασία συμβαίνει εξ ολοκλήρου στον υπολογιστή σας.

Επειδή είστε ήδη συνδεδεμένοι, το πρόγραμμα περιήγησής σας έχει απεικονίσει τη σελίδα με όλα τα αυθεντικά περιεχόμενα. Το εργαλείο λήψης οθόνης απλώς τραβάει μια φωτογραφία αυτού που είναι ήδη εκεί. Δεν αλληλεπιδρά με τον διακομιστή, οπότε δεν υπάρχει κανένας κίνδυνος ασφάλειας.

Το βασικό πράγμα που πρέπει να θυμάστε είναι αυτό: Αν μπορείτε να το δείτε στο πρόγραμμα περιήγησής σας, ένα εργαλείο λήψης οθόνης μπορεί να το καταγράψει. Αυτό καθιστά αυτά τα εργαλεία απολύτως ασφαλή για την τεκμηρίωση πραγμάτων όπως ιδιωτικές πίνακες ελέγχου λογαριασμών ή εσωτερικές πύλες εταιρειών.

Γιατί οι Λήψεις Οθόνης μου Φαίνονται Σαθρές ή Έχουν Λείπουσες Εικόνες;

Αυτό είναι πιθανώς ο πιο κοινός πονοκέφαλος και σχεδόν πάντα προκαλείται από τον τρόπο που είναι κατασκευασμένες οι σύγχρονες ιστοσελίδες. Ορισμένες συγκεκριμένες τεχνικές είναι διαβόητες για το ότι μπερδεύουν τα εργαλεία λήψης οθόνης:

  • Lazy Loading: Αυτό συμβαίνει όταν οι εικόνες δεν φορτώνονται πραγματικά μέχρι να τις κυλήσετε στην οθόνη.
    • Είναι εξαιρετικό για την ταχύτητα φόρτωσης της σελίδας, αλλά κακό για τις στιγμιότυπες οθόνης.
    • Parallax Scrolling: Αυτά τα ωραία εφέ όπου το φόντο κινείται με διαφορετική ταχύτητα από το προσκήνιο μπορεί να μπερδέψουν τα εργαλεία καταγραφής.
    • Sticky Elements: Σκεφτείτε επικεφαλίδες, υποσέλιδα ή πλαϊνές μπάρες που παραμένουν στη θέση τους ενώ κάνετε κύλιση. Μερικές φορές μπορεί να επαναληφθούν ή να καλύψουν περιεχόμενο στην τελική εικόνα.

    Η λύση είναι εκπληκτικά απλή. Πριν ενεργοποιήσετε το στιγμιότυπο οθόνης, αφιερώστε λίγο χρόνο για να κάνετε κύλιση μέχρι το κάτω μέρος της σελίδας και στη συνέχεια πίσω στην κορυφή. Αυτό αναγκάζει τον περιηγητή να φορτώσει τα πάντα, δίνοντας στο εργαλείο μια πλήρη, πλήρως αποδομένη σελίδα για εργασία. Είναι ένα μικρό βήμα που λύνει το πρόβλημα τις περισσότερες φορές.


    Αν ψάχνετε για ένα εργαλείο που να χειρίζεται αυτές τις πολύπλοκες σελίδες χωρίς την επιπλέον εργασία, η σουίτα ShiftShift Extensions αξίζει να την δείτε. Το εργαλείο Full Page Screenshot με ένα κλικ είναι σχεδιασμένο να αντιμετωπίζει τις ιδιαιτερότητες του σύγχρονου σχεδιασμού ιστοσελίδων με χάρη, όλα από μια ενιαία, ενοποιημένη παλέτα εντολών. Είναι μια σοβαρή αναβάθμιση από τις βασικές ενσωματωμένες επιλογές. Μπορείτε να εξερευνήσετε το οικοσύστημα ShiftShift για να δείτε πώς μπορεί να απλοποιήσει τη ροή εργασίας σας.

    Άρθρο δημιουργημένο χρησιμοποιώντας Outrank

Αναφερόμενες Επεκτάσεις