Το Chrome δεν είναι πολύ μεγάλο στα εργαλεία προγραμματιστών καιαυτός είναι ένας από τους λόγους για τους οποίους ο Firefox είναι ο περιηγητής περιήγησης για τους περισσότερους προγραμματιστές. Ωστόσο, για εκείνους που χρησιμοποιούν το Chrome, υπάρχουν πολλές επεκτάσεις που είναι διαθέσιμες για να τους βοηθήσουν σε αυτό το θέμα. Υπεύθυνος επιθεωρητής είναι μια επέκταση του Chrome που μπορεί να ανταγωνιστεί σωστά τοΑνταπόκριση σχεδίασης Προβολή ότι το Mozilla παρουσιάστηκε στον Firefox 15. Ο υπεύθυνος επιθεωρητής είναι ένα εργαλείο δύο σε ένα. σας δείχνει τα μεγέθη οθόνης που έχει βελτιστοποιηθεί για έναν ιστότοπο και γρήγορα σας επιτρέπει να μεταβείτε σε διαφορετικό από το αναδυόμενο παράθυρο. Επιπλέον, μπορεί να πάρει screenshots μιας ιστοσελίδας προσαρμοσμένη σε οποιοδήποτε από αυτά τα μεγέθη. Για ιστότοπους που έχουν ήδη βελτιστοποιηθεί για συγκεκριμένα μεγέθη οθόνης, μπορείτε να δείτε τον υπεύθυνο κώδικα CSS, καθιστώντας το ένα εξαιρετικό εργαλείο εκμάθησης για υπεύθυνους προγραμματιστές σχεδιασμού.
Ο υπεύθυνος επιθεωρητής προσθέτει ένα τετράγωνο κουμπί δίπλα στοτη γραμμή URL που ανοίγει ένα αναδυόμενο παράθυρο. Η επέκταση σάς δείχνει όλα τα μεγέθη οθόνης που έχει βελτιστοποιηθεί για τους δικτυακούς τόπους που έχουν φορτωθεί. Το μέγεθος της οθόνης γράφεται στο τέλος κάθε ράβδου και μια κλίμακα πίξελ στην κορυφή σας δείχνει διαφορετικά μεγέθη οθόνης. Μετακινήστε το ποντίκι πάνω από την κλίμακα και για κάθε γραμμή βαθμονόμησης θα εμφανιστεί ένα pop για να εμφανιστεί το μέγεθος της οθόνης που αντιπροσωπεύει. Σε αυτό το ίδιο αναδυόμενο παράθυρο, υπάρχει ένα κουμπί αλλαγής μεγέθους καθώς και ένα κουμπί της κάμερας. Κάνοντας κλικ στο προηγούμενο θα αλλάξει αυτόματα το παράθυρο του προγράμματος περιήγησης σε αυτό το πλάτος. Στη συνέχεια, μπορείτε να κάνετε κλικ στο κουμπί της κάμερας για να τραβήξετε ένα στιγμιότυπο οθόνης, αν θέλετε. Το στιγμιότυπο οθόνης μπορεί να αποθηκευτεί στην τοπική σας μονάδα δίσκου ή να μεταφορτωθεί στο Behance.net. Αν αισθάνεστε την ανάγκη για μια λεπτότερη κλίμακα εικονοστοιχείων, κάντε κλικ στο κουμπί μεγέθυνσης για μεγέθυνση.
Για να δείτε το CSS που χρησιμοποιείται για τον κωδικό των επιλογών προβολής,τοποθετήστε το δείκτη του ποντικιού πάνω από μία από τις μπάρες που αντιπροσωπεύουν μέγεθος οθόνης που έχει βελτιστοποιηθεί για τον ιστότοπο και στο τέλος θα εμφανιστεί ένα κουμπί {}. Κάντε κλικ σε αυτό για να δείτε τον κώδικα CSS σε μια νέα καρτέλα. Ο κώδικας δεν είναι άμεσα επεξεργάσιμος, αλλά μπορείτε να τον αντιγράψετε ή να χρησιμοποιήσετε το εργαλείο επιθεώρησης για να κάνετε αλλαγές. Ο υπεύθυνος επιθεωρητής μιμείται αρκετά την Αισθητική Προβολή του Σχεδίου στον Firefox. στην πραγματικότητα, δεν θα ήταν λάθος να πούμε ότι η επέκταση είναι μια περικοπή πάνω από το εργαλείο. Όπου ο Firefox σας δίνει προεπιλογές μεγέθους οθόνης, το Responsive Inspector σας δίνει μια ολόκληρη κλίμακα και μια μεγάλη ελευθερία και έπειτα υπάρχει το εργαλείο screenshot. Οι προεπιλογές θα καθιστούσαν τον Responsive Inspector πολύ πιο χρήσιμο και θα έπρεπε να προστεθούν. Αν και χωρίς αυτές, η επέκταση λειτουργεί εξαιρετικά καλά.
Εγκαταστήστε τον υπεύθυνο επιθεωρητή από το Chrome Web Store
Σχόλια