10 ελαφριές εναλλακτικές λύσεις για το Bootstrap & Foundation

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

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

Εδώ είναι 10 ελαφρές εναλλακτικές λύσεις για το Bootstrap και το Foundation για τα οποία πρέπει να χρησιμοποιήσετε οικοδόμηση ιστοσελίδων μικρότερης κλίμακας.

Περισσότερα για το Hongkiat.com:

• Ξεκινώντας με το Bootstrap του Twitter
• Χρησιμοποιώντας το Bootstrap 3 με το Sass
• Εργαλείο εκκίνησης: Δημιουργία διάταξης εκκίνησης HTML
• Εργασία με το πρόσθετο "Bootstrap": Παράθυρο διαμόρφωσης
• Εργαλείο εκκίνησης: Δημιουργήστε το Megamenu με το YAMM3

1. Σκελετός

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

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

2. CardinalCSS

Το CardinalCSS είναι ένα πλαίσιο CSS χτισμένο με έμφαση στην απόδοση, την αναγνωσιμότητα και κυρίως τη συντηρησιμότητα. Το CardinalCSS υιοθετεί μερικές σύγχρονες προσεγγίσεις όπως το κινητό-πρώτα για τη διαμόρφωση του δικτύου. και CSS Box Model που σας επιτρέπει να προσδιορίσετε εύκολα το πλάτος και το ύψος των στοιχείων.

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

3. ConciseCSS

Το ConciseCSS είναι ένα πλαίσιο CSS - χωρίς το bloat. Πρόκειται για ένα άπαχο πλαίσιο που είναι χτισμένο πάνω από τα Sass, LESS και Stylus, το οποίο ανοίγει το χρυσό μονοπάτι για τη συντηρησιμότητα του CSS. Αλλά, αν προτιμάτε απλό απλό βανίλιας CSS, μπορείτε να το έχετε και αυτό.

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

4. PowertoCSS

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

5. Φυσικός

Το Furtive είναι ένα πρωτότυπο CSS για κινητά που χτίστηκε γύρω από τα πρότυπα web αιχμής, όπως η χρήση του Flexbox για το πλέγμα και rem μονάδα μεγέθους στοιχείων (συμπεριλαμβανομένου του μεγέθους γραμματοσειράς). Το Furtive διατηρεί ένα μικρό αποτύπωμα CSS, επειδή δεν υποστηρίζει παλαιότερα προγράμματα περιήγησης (* βήχας * Internet Explorer), καθώς απαιτεί κάποια παραβίαση του CSS. Ως εκ τούτου Furtive είναι ένα τέλειο πλαίσιο, αν σχεδιάζετε μια ιστοσελίδα για το μέλλον.

6. BassCSS

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

7. Mueller

Το Mueller είναι ένα αρθρωτό σύστημα ανταποκρινομένων πλέγματος που είναι χτισμένο πάνω από το Sass και την Compass. Με το Mueller, μπορείτε να δημιουργήσετε το πλέγμα είτε προσθέτοντας τάξεις κατευθείαν στα στοιχεία HTML, είτε προτιμάτε τα στοιχεία HTML να είναι καθαρά και καθαρά, χρησιμοποιώντας το πλέγμα() λειτουργία. Το πλέγμα Mueller μπορεί να χρησιμοποιηθεί σε συνδυασμό με τη βιβλιοθήκη Javascript Masonry για να δημιουργήσει μια διάταξη Pinterest.

8. Tuktuk

Το Tuktuk είναι ένα πολύ μοναδικό όνομα για ένα πλαίσιο. Σε σύγκριση με το Bootstrap ή το Ίδρυμα, το Tuktuk είναι πολύ ελαφρύτερο καθώς έρχεται μόνο με το σωστό ποσό των εξαρτημάτων για να φτιάξει έναν εμφανή δικτυακό τόπο, συμπεριλαμβανομένου του συστήματος πλέγματος, βασικό στυλ για τυπογραφία, πίνακες και ένα ζευγάρι UI όπως το navbar modals.

9. Βάση

Η βάση είναι χτισμένη πάνω από τα LESS και Sass και περιλαμβάνει μόνο τα πιο σημαντικά συστατικά για την κατασκευή ιστοσελίδων: το πλέγμα και το βασικό στυλ των στοιχείων HTML. Η βάση δεν συνοδεύεται από στοιχεία του Javascript, αλλά παρέχει εξαιρετική συμβατότητα με το πρόγραμμα περιήγησης τόσο πολύ ώστε να λειτουργεί ακόμα και με το IE7.

10. Τοστ

Η τελευταία από τη λίστα μας είναι το Toast. Μέσω του φύλλου στυλ SCSS περιλαμβάνεται στο πακέτο, το Toast σάς επιτρέπει να ρυθμίσετε εύκολα τα ονόματα των κλάδων πλέγματος, την υδρορροή και ακόμη και τη βάση στηλών. Για παράδειγμα, εάν θέλετε το πλέγμα να είναι μια στήλη 9 βάσεων αντί για 12, μπορείτε να το κάνετε αυτό. Το toast είναι ένα ελάχιστο πλαίσιο CSS με πολύ ευέλικτες διαμορφώσεις που ικανοποιούν τις απαιτήσεις σας.