Νέοι πόροι για σχεδιαστές ιστοσελίδων και προγραμματιστές (Φεβρουάριος 2016)

Το 2015 ήταν ένας σπουδαίος χρόνος για τον ιστό: οι τεχνολογίες ιστού ήταν που υιοθετήθηκε σε πολλούς τύπους πέραν του γεγονότος για την οικοδόμηση ενός δικτυακού τόπου ή μιας εφαρμογής στο διαδίκτυο. Πολλές εφαρμογές για κινητά και επιτραπέζιους υπολογιστές δημιουργούνται τώρα χρησιμοποιώντας HTML, CSS και JavaScript. Αυτό καθίσταται εφικτό από τη φύση της φορητότητας των τεχνολογιών του Διαδικτύου και των βιβλιοθηκών όπως React.js, Angular και Node.js.

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

Κάντε κλικ για περισσότερες πηγές

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

Flat Slider

Το jQuery UI συνοδεύεται από μια συλλογή κοινής διεπαφής ιστού που περιλαμβάνει ένα Slider - ένα UI που επιτρέπει στο χρήστη να επιλέξει ένα εύρος αριθμητικών τιμών. ο Flat Slider είναι ένα εργαλείο ιστού που κάνει την προσαρμογή του στυλ jquery UI, το οποίο ήταν κάποτε ένα πολύ δύσκολο έργο, πολύ πιο εύκολο τώρα.

Βοηθητικό πρόγραμμα Open-type

Βοηθητικό πρόγραμμα Open-type είναι μια συλλογή drop-in στις κατηγορίες εφαρμόστε προηγμένες λειτουργίες τυπογραφικού στοιχείου CSS Τέτοιες συνδέσεις γραμματοσειράς, μικρό κεφαλαίο γράμμα και πολλά άλλα. Βασικά δίνουν την καλύτερη δυνατή εμπειρία ανάγνωσης για τους χρήστες σας με λεπτομέρειες. Αποικοδομεί ωραία τα παλαιότερα, μη υποστηριζόμενα προγράμματα περιήγησης.

ResponsifyJS

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

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

Γραμμικός

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

StickyStack

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

Θεατής

Θεατής είναι το plugin jQuery για το lightbox εικόνας - ένα φανταχτερό δημοφιλές τρόπο για τη μεγέθυνση εικόνων στον ιστό. Το plugin έρχεται με μια συντριπτική επιλογές που σας επιτρέπει να προσαρμόστε κάθε κομμάτι του lightbox διεπαφή.

Το plugin παρέχει επίσης ένα σύνολο API και προσαρμοσμένων συμβάντων για πλήρη έλεγχο του lightbox απόκριση και συμπεριφορά. Επιπλέον, λειτουργεί με τον Internet Explorer 8.

DeviceMock

DeviceMock είναι μια βιβλιοθήκη JavaScript που σας επιτρέπει να δημιουργήστε πλαίσια πλαισίων ή mockups όπως ένα τηλέφωνο, ένα tablet και μια επιφάνεια εργασίας. Ομοίως, η βιβλιοθήκη παρέχει επιλογές για να ρυθμίσετε το χρώμα του θέματος, το μέγεθος, καθώς και τον προσανατολισμό του πλαισίου.

Μπορεί να είναι μια καλή εναλλακτική λύση για την προβολή του ιστού και της εφαρμογής σας αντί για χρήση του Photoshop.

Clrs

Clrs είναι μια πρωτοβουλία επαναπροσδιορίστε τα προεπιλεγμένα χρώματα του ιστού σε έναν πιο φιλικό και μοντέρνο χρωματικό τόνο. Επιπλέον, υποστηρίζει ένα σύνολο συνδυασμών χρωμάτων για καλύτερη προσβασιμότητα. Μπορείτε να αναπτύξετε αυτά τα χρώματα μέσω των δειγμάτων χρωμάτων NPM, Gem (Ruby) και των χρωμάτων του Photoshop και του Illustrator.

Χρωματίστε

Χρωματίστε είναι μια εξαιρετικά ελαφριά βιβλιοθήκη JavaScript (3kb minified) στο Αποκτήστε τα κυρίαρχα χρώματα από μια εικόνα με πολλά API για χειρισμό των χρωμάτων. Μπορείτε να χρησιμοποιήσετε το εξαγόμενο χρώμα ως σύμβολο κράτησης θέσης ενώ περιμένετε να φορτωθεί τελείως η εικόνα, να δημιουργήσετε ένα φόντο κλίσης ή να ρυθμίσετε τη γειτονική διεπαφή για να καλύψετε το χρώμα της εικόνας.

BookBlock

BookBlock είναι plugin jQuery δημιουργήστε ένα φυλλάδιο με το εφέ της σελίδας-flip. Είναι μια όμορφη εναλλακτική λύση για την εμφάνιση πολλαπλών εικόνων στον ιστότοπό σας, ειδικά εάν υπάρχει μια ακολουθία ή ροή που θέλετε να παρουσιάσετε.

Μπορείτε να δείτε το demo εδώ για να πάρετε μια ιδέα για το πώς λειτουργεί το BookBlock.