Η ανάπτυξη ενός καλού ιστότοπου που συμμορφώνεται με τις ευρέως αποδεκτές "βέλτιστες πρακτικές" μπορεί να είναι εξαιρετικά δύσκολη και μερικές φορές η σάρωση των σφαλμάτων στον κώδικα σας είναι ακόμη πιο δύσκολη.

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

Εδώ είναι έντεκα από τις καλύτερες επεκτάσεις του Chrome για τους σχεδιαστές ιστοσελίδων και τους προγραμματιστές:

Σχετικές : 7 από τις καλύτερες επεκτάσεις Chrome που πρέπει να δοκιμάσετε

1. WhatFont

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

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

2. StyleBot

Το StyleBot είναι μια επέκταση CSS για προγραμματιστές ιστού. Σας βοηθά να προσαρμόσετε την εμφάνιση οποιουδήποτε ιστότοπου επιλέγοντας το στοιχείο και αλλάζοντας το στυλ του από τον επεξεργαστή.

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

3. BuiltWith Technology Profiler

Το BuiltWith Profiler χρησιμοποιείται για να ελέγξει ποιες τεχνολογίες χρησιμοποιεί ένας ιστότοπος.

Αφού κάνετε κλικ στο εικονίδιο στη γραμμή Chrome, εμφανίζεται ένα δίσκο όπου μπορείτε να δείτε τις διαφορετικές τεχνολογίες που χρησιμοποιεί ένας ιστότοπος, όπως Web Server, Content Delivery Network, Σύστημα Διαχείρισης Περιεχομένου, Βιβλιοθήκες JavaScript και λειτουργίες και πολλά άλλα.

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

4. Web Developer

Ο Web Developer είναι μια επέκταση για το Chrome που μεταφέρθηκε από τη δημοφιλή έκδοση του Firefox.

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

Υπάρχει ένας τόνος καλών πρακτικών εδώ για τον έλεγχο του κώδικα ή τον πειραματισμό σας, οπότε φροντίστε να το ελέγξετε.

5. ColorZilla

Το ColorZilla είναι μια θαυμάσια επέκταση για τους σχεδιαστές ιστοσελίδων που θέλουν να ελέγξουν το ακριβές χρώμα των ιστοσελίδων που τους αρέσουν.

Με αυτό μπορείτε να πάρετε μια ανάγνωση χρώματος από οποιοδήποτε σημείο του προγράμματος περιήγησης και να αντιγράψετε την τιμή Hex ή RGB για να επικολλήσετε σε άλλο πρόγραμμα.

Υπάρχουν πολλά άλλα χαρακτηριστικά γνωρίσματα όπως το Σταγονόμετρο, το Palette Viewer, η CSS Gradient Generator, το Picked Color History και ένας αναλυτής χρώματος ιστοσελίδας που παρέχει μια παλέτα για κάθε ιστοσελίδα.

6. Στιγμιότυπο οθόνης λήψης (FireShot)

Το FireShot κάνει μια πολύ απλή δουλειά. Σας επιτρέπει να τραβήξετε ένα στιγμιότυπο διαφόρων τμημάτων μιας ιστοσελίδας ή ολόκληρης της ιστοσελίδας και να εξαγάγετε σε PDF, JPEG, GIF, PNG ή BMP.

7. Χάρακας σελίδας

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

Μπορείτε επίσης να αλλάξετε σε "Λειτουργία στοιχείου" για να περιγράψετε κάθε στοιχείο σε μια σελίδα όπως το ποντίκι πάνω από αυτά.

8. YSlow

Το YSlow σας βοηθά να επιταχύνετε τους ιστοτόπους σας αναλύοντας τη σελίδα σας και προτείνοντας τρόπους βελτίωσης της απόδοσης.

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

9. Λίστα ελέγχου προγραμματιστή ιστού

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

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

10. Υπέρβαση στοίβας αναζήτησης

Search Overflow Stack είναι μια πολύ απλή επέκταση που προσθέτει ένα πλαίσιο αναζήτησης στο πρόγραμμα περιήγησης που χρησιμοποιείτε για να αναζητήσετε θέματα σχετικά με την υπερχείλιση στοίβας.

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

11. Ελέγξτε τους συνδέσμους μου

Ελέγξτε τις συνδέσεις μου Η επέκταση του Chrome βοηθά στην ανίχνευση σπασμένων συνδέσεων στην ιστοσελίδα σας.

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

Επισημαίνει επίσης όλους τους καλούς δεσμούς σε πράσινο και σπασμένους κόκκινους για εύκολο εντοπισμό.

συμπέρασμα

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

Ποιες άλλες επεκτάσεις Chrome χρησιμοποιείτε; Μοιραστείτε τα μαζί μας στην παρακάτω ενότητα σχολίων.