30 χρήσιμα πλαίσια για σχεδιαστές
Μερικοί σχεδιαστές θεωρούν τα πλαίσια ως περιοριστικά και περιοριστικά στις δημιουργικές τους προσπάθειες. Κοιτάζουν ένα πλαίσιο ως κάτι που πρέπει να κάμψουν το έργο τους για να ταιριάζουν.
Και για πολλούς σχεδιαστές, αυτό δεν είναι κάτι που θέλουν να κάνουν. Αλλά με τις δωδεκάδες διαθέσιμες πλατφόρμες, γιατί να μην το κοιτάξετε το αντίστροφο: γιατί να μην βρείτε το πλαίσιο που ταιριάζει στα σχέδιά σας;
Για το σκοπό αυτό, έχουμε συντάξει 30 από τα καλύτερα πλαίσια σχεδίασης εκεί έξω. Αυτά τα πλαίσια είναι καθαρά σχεδιαστικά (δεν θα βρείτε εδώ πλαίσια JavaScript ή Ajax, τα οποία, ως επί το πλείστον, εμπίπτουν περισσότερο στο πλαίσιο ανάπτυξης).
Υπάρχει σχεδόν σίγουρα ένα πλαίσιο που παρατίθεται εδώ, το οποίο μπορεί να προσαρμοστεί στο συγκεκριμένο έργο σας, και όχι το αντίστροφο.
Γενικά πλαίσια CSS
Τα πλαίσια CSS εδώ προσφέρουν στους σχεδιαστές μια δομή που πηγαίνει στα έργα τους, έτσι ώστε να μην ξεκινούν εξ ολοκλήρου από το μηδέν. Κάποια καθοδήγηση προσανατολισμού προσφοράς, κυρίως μέσω της χρήσης πλέγματος, ενώ άλλα εστιάζουν μόνο σε πράγματα όπως η τυπογραφία, αφήνοντας τη διάταξη αποκλειστικά σε εσάς.
1KB CSS Grid
Το 1KB CSS Grid είναι ένα προσαρμόσιμο πλέγμα που μπορεί να ρυθμιστεί με πολλούς τρόπους πριν από τη λήψη. Επιλέγετε τον αριθμό των στηλών, το πλάτος της στήλης και το πλάτος υδρορροής προτού κατεβάσετε τα αρχεία. Είναι ένα απίστευτα εύκολο να κατανοηθεί πλέγμα, ακόμα και για όσους δεν είναι εξοικειωμένοι με τα πλαίσια CSS. Είναι επίσης ένα πολύ γυμνό-οστά πλαίσιο, με μόνο το CSS απαραίτητο για την κατασκευή των σχεδιαγραμμάτων (δεν περιλαμβάνεται επιπλέον μορφοποίηση).
YAML
Το YAML ("Ακόμα Διάφορα Διάταξη Πολλαπλών Υποστυλωμάτων") είναι ένα πλαίσιο CSS για τη δημιουργία ευέλικτων, επιπλεγμένων διατάξεων. Περιλαμβάνει σχέδια σχεδίασης για τυπογραφία, μικρομορφώματα, φόρμες και πολλά άλλα, καθώς και πλήρης προσβασιμότητα και συμμόρφωση με τα πρότυπα του ιστού. Είναι επίσης ένα πολύ σταθερό πλαίσιο, με τα περισσότερα σφάλματα του προγράμματος περιήγησης από το YAML. Υπάρχει επίσης ο YAML Builder, ο οποίος σας επιτρέπει να δημιουργήσετε γραφικά με βάση το YAML οπτικά.
Ένα από τα δείγματα YAML με βασικές επιλογές styling.
Απλά
Το Simpl είναι ένα αρθρωτό, ευέλικτο πλαίσιο CSS που έχει ως στόχο να καλύψει τα κενά κάποιων άλλων πλαισίων CSS. Είναι ρευστό (με την επιλογή των στατικών πλευρικών στηλών), εύκολο στην εκμάθηση και χρήση, και είναι nestable (αλλά δεν απαιτεί τη φωλιά). Περιλαμβάνει στυλ για φόρμες, πίνακες και άλλα κοινά στοιχεία.
Το χρυσό πλέγμα
Το Golden Grid είναι ένα πλαίσιο CSS βασισμένο στην αρχή του χρυσού σιτηρέσιου ή της θείας αναλογίας. Είναι πλάτος 970px, χρησιμοποιεί ένα σύστημα πλέγματος 6/12 και όταν είναι συμπιεσμένο λιγότερο από 1kb. Υπάρχει ένα σωρό μεγάλα demos, τόσο του πλέγματος όσο και των σελίδων του δείγματος που είναι χτισμένα πάνω στο πλέγμα. Υπάρχει επίσης ένα μίνι φροντιστήριο διαθέσιμο για να σας βοηθήσει να ξεκινήσετε.
Ένα παράδειγμα μιας διάταξης που δημιουργήθηκε με το Golden Grid.
SenCSs
Το SenCSs είναι ένα πλαίσιο που προσφέρει λογικό στυλ για όλα τα επαναλαμβανόμενα μέρη των αρχείων CSS. Δεν περιλαμβάνει κανένα είδος συστήματος διαμόρφωσης, σε αντίθεση με πολλά πλαίσια CSS, το οποίο καθιστά πιο ευέλικτο για μη τυποποιημένα σχέδια ιστοσελίδων. Περιλαμβάνει στυλ για πολλά άλλα πράγματα: γραμμής βάσης, γραμματοσειρών, περιθωρίων, blockquotes, padding και πολλά άλλα.
Στοιχεία
Τα στοιχεία περιλαμβάνουν μια ποικιλία φακέλων και αρχείων που συμβάλλουν στην επιτάχυνση της διαδικασίας σχεδιασμού ιστοσελίδων. Είναι ένα ελαφρύ πλαίσιο που είναι εύκολο στη χρήση, περιλαμβάνει έναν αριθμό προκαθορισμένων κλάσεων, μαζική επαναφορά και προσθέτει εικονίδια σε εξωτερικούς συνδέσμους (που βελτιώνει το στυλ και τη χρηστικότητα).
Blueprint CSS
Το Blueprint είναι ένα ελεύθερο πλαίσιο CSS που περιλαμβάνει μια επαναφορά CSS, ένα πλέγμα που υποστηρίζει σύνθετες διατάξεις, μορφοποιημένη τυπογραφία και μορφές και plugins για κουμπιά, καρτέλες και sprites. Υπάρχουν επίσης πολλές τεκμηρίωση για να ξεκινήσετε, καθώς και μια ομάδα συζήτησης και μια λίστα αλληλογραφίας.
Τρίπολις
Η Τρίπολη είναι ένα γενικό πλαίσιο CSS που επαναφέρει όλες τις προεπιλεγμένες ρυθμίσεις του προγράμματος περιήγησης. Έχει γίνει για να λειτουργήσει με HTML 4 και διαχωρίζει την τυπογραφία από τα στυλ διαμόρφωσης. Επιδιώκει επίσης να αυξήσει την αναγνωσιμότητα των ιστότοπων σας μέσω καλύτερης τυπογραφίας. Λειτουργεί επίσης με έναν αριθμό πρόσθετων για την επέκταση των γενικών προεπιλογών του πλαισίου.
Περιεχόμενο με πλαίσιο CSS πλαισίου στυλ
Το πλαίσιο περιεχομένου περιεχομένου με στυλ CSS προσφέρει μισή ντουζίνα διατάξεις, όπως κάθετη πλοήγηση με μία στήλη περιεχομένου, οριζόντια πλοήγηση με μία στήλη περιεχομένου, κάθετη πλοήγηση με δύο στήλες περιεχομένου και οριζόντια πλοήγηση με τοπική πλοήγηση και μία στήλη περιεχομένου. Καταχωρεί τον πηγαίο κώδικα λογικά, με το κύριο περιεχόμενο να έρχεται αμέσως μετά την κεφαλίδα μέσα στον κώδικα, ανεξάρτητα από την οπτική διάταξη της σελίδας.
960 σύστημα πλέγματος
Το 960 Grid System είναι ίσως το πιο γνωστό πλαίσιο CSS που έχει βγει τα τελευταία χρόνια και αποτέλεσε την έμπνευση για πολλά άλλα πλαίσια. Υπάρχουν δύο διαθέσιμα δίκτυα: ένα πλέγμα 12 στηλών με στήλες πλάτους 60 pixel και πλέγμα 16 στηλών με κολώνες πλάτους 40 pixel. Ένα μεγάλο πλεονέκτημα είναι ότι αυτές οι βασικές διαμορφώσεις πλέγματος μπορούν να χρησιμοποιηθούν χωριστά ή σε συνδυασμό. Το 960 εστιάζει στη διάταξη του χώρου και δεν δίνει ιδιαίτερη προσοχή σε θέματα όπως η τυπογραφία (αν και υπάρχουν βασικές διατάξεις για αυτούς).
Τυπογριφίδα
Το Typogridphy είναι ένα πλαίσιο CSS που επικεντρώνεται σε μεγάλο βαθμό στην τυπογραφία μέσα στη διάταξη. Βασίζεται στο 960 Grid System και έχει σημασιολογικό κώδικα συμβατό με τα πρότυπα. Η τυπογραφία βασίζεται στην αρχή του κάθετου ρυθμού, αλλά χρησιμοποιεί τα ems και όχι τα εικονοστοιχεία.
Emastic
Το Emastic είναι ένα ελαφρύ πλαίσιο CSS που σας επιτρέπει να προσαρμόσετε το πλάτος της σελίδας χρησιμοποιώντας ems, εικονοστοιχεία ή ποσοστά. Λειτουργεί σε σταθερή ή υγρή διάταξη και περιλαμβάνει μορφές τυπογραφίας πλέγματος γραμμής βάσης. Υπάρχει ένα διαθέσιμο σεμινάριο που θα σας διδάξει πώς μπορείτε να δημιουργήσετε σχεδιαγράμματα με το Emastic επίσης.
Μάλιο
Το πλαίσιο CSS Malo αποτελείται μόνο από 8 γραμμές κώδικα CSS. Είναι ευέλικτο και εύκολο στη χρήση, με προσαρμόσιμο πλάτος σελίδας. Ο Malo σάς επιτρέπει να δημιουργείτε διατάξεις που αποτελούνται από δύο, τρία, τέσσερα ή πέντε μέρη. Επιτρέπονται επίσης οι στήλες που έχουν τοποθετηθεί.
BlueTrip
Το BlueTrip είναι ένα πλαίσιο CSS που βασίζεται σε πλέγμα 24 στηλών. Περιλαμβάνει μορφές τυπογραφίας, ένα κενό φύλλο στυλ εκκίνησης, ένα φύλλο στυλ εκτύπωσης, στυλ φόρμας και πολλά άλλα. Υπάρχει εκτενής τεκμηρίωση διαθέσιμη, καθώς και μια βιτρίνα των τοποθεσιών που χτίστηκε στο BlueTrip.
Γραμμή πλέγματος CSS γραμμής 1 γραμμών
Αυτό είναι ένα κομμάτι ενός διαφορετικού πλαισίου CSS, επειδή χρησιμοποιεί μόνο μία γραμμή CSS. Χρησιμοποιώντας αυτή τη μοναδική γραμμή CSS, η οποία λειτουργεί με βάση τις αρχές της διαίρεσης των στηλών στη μέση, μπορείτε να δημιουργήσετε πλέγματα με 2, 4, 8 ή 16 στήλες. Είναι συμβατό με cross-browser, ακόμα και από την IE5.5.
Δωρεάν πλαίσια θεμάτων WordPress
Υπάρχουν πολλά μεγάλα πλαίσια WP διαθέσιμα δωρεάν. Ορισμένα είναι πολύ βασικά, με μόνο την πιο γενική δομή. Άλλα είναι μινιμαλιστικά θέματα από μόνα τους, αλλά εύκολα προσαρμόσιμα σε άλλα έργα. Αυτό που κάνουν όλοι, είναι η απλοποίηση της διαδικασίας κωδικοποίησης στην ανάπτυξη θεμάτων WP, εξαλείφοντας αποτελεσματικά την ανάγκη ενός σχεδιαστή να χειρίζεται PHP ή άλλο κώδικα.
Ερπων
Το Reptile είναι ένα πλαίσιο θεμάτων από το WP Bandit που λειτουργεί με παιδικά θέματα (δέρματα). Το WP Bandit το χρησιμοποιεί για όλα τα θέματα και το έχει κάνει διαθέσιμο για δωρεάν download. Δεν υπάρχουν πολλές πληροφορίες σχετικά με τον ιστότοπό τους εκτός από το ότι περιλαμβάνει διάφορες λειτουργίες βοήθειας για να διευκολυνθεί το θέμα σας να αλληλεπιδράσει με το WP.
Το θέμα της βανίλιας
Η βανίλια κατασκευάστηκε για να συνδυάσει τα "ατομικά" πρότυπα του Carrington, τα πρότυπα PHPTAL και το YUI CSS. Περιλαμβάνει επίσης πλήρη widgetization, συμπεριλαμβανομένων προσαρμοσμένων στοιχείων widget. Η βανίλια χρησιμοποιείται με παιδικά θέματα, οπότε δεν χρειάζεται να αγγίζετε τον βασικό κώδικα. Περιλαμβάνει επίσης έναν "μινιατούρα" HTML που συμπιέζει την έξοδο για να επιταχύνει τον ιστότοπό σας.
Λευκόπλακα
Ο πίνακας είναι ένα ελεύθερο πλαίσιο WP. Περιλαμβάνει όλα τα αρχεία θεμάτων που χρειάζεται για να δημιουργήσετε ένα θέμα WP, όπως: 404.php, archives.php, categories.php, comments.php, footer.php, functions.php, header.php, index.php, σελίδα. php, search.php, searchform.php, sidebar.php και style.css. Περιλαμβάνει επίσης την τοποθέτηση σελίδων για συνδέσμους και συνδέσεις κοινωνικοποίησης και είναι μόνο 72KB unzipped.
Sandbox
Το Sandbox είναι ένα πολύ βασικό θέμα που περιέχει μια βασική διάταξη δύο στηλών με ελάχιστο στυλ. Είναι πλήρως συμβατό με widget και έχει πολλούς επιλογείς, ώστε να είναι πλήρως προσαρμόσιμο με το CSS.
Το πλαίσιο του μπουφέ
Το Buffet Framework χρησιμοποιεί θέματα παιδιού για προσαρμογή και χρησιμοποιεί επίσης επεκτάσεις θεμάτων για περαιτέρω προσαρμογή. Είναι βελτιστοποιημένη μηχανή αναζήτησης, έχει υποστήριξη για μικρομορφήματα, τροφοδοτείται από jQuery, και είναι ακόμη συσκευασμένη με πλαίσια 960gs και Blueprint CSS. Απελευθερώνεται κάτω από το GPL v3.
Carrington
Το Carrington είναι ένα ελεύθερο πλαίσιο θεμάτων WP που κυκλοφόρησε κάτω από το GNU GPL v2. Ένα από τα μεγαλύτερα οφέλη της Carrington είναι η εκτενή τεκμηρίωση που διατίθεται στην ιστοσελίδα. Υπάρχουν τέσσερα βασικά θέματα που είναι διαθέσιμα στο πλαίσιο: το Blog (ένα παραδοσιακό θέμα στυλ blog), το κείμενο (ένα απλό θέμα κειμένου), το Mobile (για κινητά προγράμματα περιήγησης) και το JAM (Just Add Markup, . Ανάλογα με το επίπεδο προσαρμογής που θέλετε, υπάρχει σχεδόν σίγουρα μια επιλογή που θα λειτουργήσει για σας.
Το θέμα κειμένου Carrington.
Υβρίδιο
Το Hybrid είναι ένα δωρεάν θέμα που περιλαμβάνει 8 widgetized περιοχές και 15 προτεινόμενα πρότυπα σελίδων. Είναι δωρεάν και ανοικτή πηγή και μπορεί να χρησιμοποιηθεί τόσο για προσωπικά όσο και για εμπορικά έργα. Διατίθεται σε διάφορες γλώσσες (απλά κατεβάστε το πακέτο γλωσσών), συμπεριλαμβανομένων των αραβικών, κινέζικων, γαλλικών, ιταλικών, γερμανικών, ρωσικών, ισπανικών και τουρκικών. Η βασική τεκμηρίωση είναι διαθέσιμη δωρεάν, αλλά για πιο εκτεταμένη τεκμηρίωση θα πρέπει να συμμετάσχετε στο Theme Club ($ 25 / έτος).
Θεματικός
Το θεματικό είναι ένα ανοικτού κώδικα, επεκτάσιμο πλαίσιο WP με 13 περιοχές widgetized, δείγματα διάταξης με βάση το πλέγμα και στυλ για δημοφιλή plugins. Η θεματική έχει αρκετό στυλ έξω από το κιβώτιο για να το χρησιμοποιήσει χωρίς να το αναπτύξει περαιτέρω, αλλά κάνει επίσης ένα τέλειο γονικό θέμα (υπάρχουν και ελεύθερα και εμπορικά παιδικά θέματα ήδη διαθέσιμα γι 'αυτό). Περιλαμβάνει δείγμα Child Theme για να επιταχύνει την ανάπτυξη του θέματος. Είναι επίσης έτοιμο για μια σειρά από δημοφιλείς προσθήκες WP και διαθέτει μια σειρά εύχρηστων επιλογών διάταξης για σχέδια δύο και τριών στηλών.
Πλαίσια θεμάτων WordPress Premium
Τα πρωτόκολλα πλαισίων WP Premium μοιάζουν με τα διαθέσιμα δωρεάν πλαίσια, αν και τα περισσότερα διαθέτουν πρόσθετες λειτουργίες που δεν είναι διαθέσιμες στις ελεύθερες εκδόσεις. Πολλά από τα παρακάτω πλαίσια προσφέρουν πάνελ επιλογών που δίνουν στους μη κωδικοποιητές σχεδόν πλήρη έλεγχο του σχεδιασμού του ιστολογίου τους, ενώ παράλληλα είναι φιλικοί προς τους προγραμματιστές για όσους θέλουν να βουτήξουν στον κώδικα.
Άσφορντ
Το πλαίσιο θεμάτων Ashford WP είναι ένα απλό, εύχρηστο πλαίσιο που περιλαμβάνει οκτώ πρότυπα σελίδων (γκαλερί, blog, θέμα, συγγραφέα, κώδικα, λεπτομέρεια και καρτέλα ανάμεσά τους). Υπάρχουν περισσότερες από 250 πιθανές παραλλαγές σελίδων που μπορείτε να δημιουργήσετε και υπάρχουν τέσσερις επιλογές για τον τρόπο προβολής των αναρτήσεων (μικρογραφίες, διαγράμματα, αποσπάσματα και πλήρεις). Υπάρχει μια περιορισμένη δωρεάν έκδοση (που είναι ακόμα αρκετά ισχυρή) ή μπορείτε να αγοράσετε την επαγγελματική έκδοση για $ 49.
Στοιχειώδης
Το Elemental είναι ένα θεματικό πλαίσιο από το Pro Theme Design. Ακριβώς έξω από το κιβώτιο, το Elemental έχει ένα καθαρό, κομψό σχέδιο που μπορεί να χρησιμοποιηθεί όπως ακριβώς με τις επιλογές στον προσαρμοσμένο πίνακα ελέγχου (για θέματα όπως τυπογραφία, μέγεθος στήλης, πλοήγηση κλπ.) Ή μπορείτε να το προσαρμόσετε στο δικό σας περιεχόμενο της καρδιάς. Υπάρχουν τέσσερις ζώνες widgetized, προσαρμοσμένα widget, κινούμενα μενού πολλαπλών επιπέδων, υποστήριξη για Gravatars, αλλαγή μεγέθους μικρογραφιών εικόνας και πολλά άλλα. Το βασικό αντίγραφο (για έναν ιστότοπο) είναι $ 59,99 και το Multi Copy (για προγραμματιστές) είναι $ 149,99.
ΠΤΥΧΙΑΚΗ ΕΡΓΑΣΙΑ
Η διατριβή είναι ένα πλούσιο πλαίσιο WP που επικεντρώνεται στην ευελιξία, την ενσωματωμένη βελτιστοποίηση μηχανών αναζήτησης και τους γρήγορους χρόνους φόρτωσης. Οι πίνακες επιλογών παρέχουν μεγάλη ευελιξία χωρίς να χρειάζεται να βουτήξετε στον κώδικα. Υπάρχει ακόμη και μια γεννήτρια διάταξης που σας επιτρέπει να δημιουργείτε αυτόματα διατάξεις 1, 2 και 3 στηλών. Η Προσωπική Επιλογή (άδεια ενιαίου ιστότοπου) είναι $ 87 και η επιλογή του Προγραμματιστή (η οποία επιτρέπει πολλαπλές τοποθετήσεις τοποθεσιών) είναι $ 164.
Nerdist είναι ένα από τα δημοφιλή ιστολόγια που λειτουργούν στο πλαίσιο της διδακτορικής διατριβής.
Γένεση
Το Genesis είναι ένα premium WP πλαίσιο από το StudioPress. Η Genesis λειτουργεί με βάση τη χρήση των παιδικών θεμάτων για το στυλ περιεχομένου χωρίς να αλλάζει το γονικό θέμα / πλαίσιο. Περιλαμβάνει μερικά προσαρμοσμένα widget (συμπεριλαμβανομένου ενός για το Twitter, για προφίλ χρηστών και εμφανισμένες αναρτήσεις), καθώς και μια επιλογή επιλογών διάταξης. Περιλαμβάνει επίσης αριθμό αγκιστριών για περαιτέρω προσαρμογές. Η Γένεση είναι 59,95 δολάρια.
Πρόοδος
Το Headway είναι ένα πλαίσιο ειδικά για όσους δεν θέλουν να ασχοληθούν με την κωδικοποίηση. Έχει ένα εικονικό πρόγραμμα επεξεργασίας που ισχυρίζεται ότι σας επιτρέπει να δημιουργήσετε όλα τα είδη των ιστότοπων, από τα τυπικά ιστολόγια έως τους ιστότοπους ηλεκτρονικού εμπορίου. Ο πίνακας διαμόρφωσης για το Headway είναι εκτεταμένος και σας επιτρέπει να κάνετε τα πάντα από την εισαγωγή σεναρίων χωρίς κωδικοποίηση σε ρυθμίσεις δικαιωμάτων και προσαρμογή ρυθμίσεων για αναρτήσεις και σχόλια. Είναι ένα εξαιρετικό θέμα για όποιον θέλει απλώς να σχεδιάσει και δεν θέλει να ασχοληθεί με όλα τα back-end πράγματα. Υπάρχουν δύο διαθέσιμες επιλογές: Προσωπικά για $ 87 και Προγραμματιστής για $ 164.
WP Unlimited
Το WP Unlimited είναι ένα άλλο θεματικό πλαίσιο WP που σας επιτρέπει να πραγματοποιήσετε αρκετά σημαντικές προσαρμογές από δεξιά στον πίνακα επιλογών. Το WP Unlimited περιλαμβάνει μια γεννήτρια του AdSense για την προσαρμογή της εμφάνισης ή των διαφημίσεων AdSense και τη διευθέτησή τους στον ιστότοπό σας. Επίσης, σας επιτρέπει να προσαρμόσετε πλήρως το σχέδιο, και έχει ενσωματωμένες δυνατότητες SEO. Μια προσωπική άδεια είναι $ 59 και η άδεια προγραμματιστή είναι $ 150.
Ρομαντικό θέμα
Το Frugal είναι ένα εξαιρετικά προσαρμόσιμο θεματικό πλαίσιο με πάνω από 600 προσαρμοσμένες επιλογές που μπορείτε να αλλάξετε απευθείας από τον πίνακα εργαλείων WP. Μπορείτε να προσαρμόσετε σχεδόν κάθε πτυχή του Frugal μέσα στον πίνακα επιλογών. Οι προγραμματιστές θα βρουν επίσης Frugal χρήσιμο, καθώς υπάρχει αρκετός χώρος για προσαρμοσμένα CSS, λειτουργίες, widget και άλλα. Το Frugal διαθέτει μια ποικιλία επιλογών άδειας: Προσωπικά Βασικά για $ 89, Προγραμματιστής Βασικά για $ 169, Frugal MU (Multi-User) για $ 299, Frugal Unlimited για $ 399 και Frugal Complete για $ 499.
Γράφτηκε αποκλειστικά για WDD από Κάμερον Τσάπμαν
Έχετε ένα αγαπημένο πλαίσιο που δεν αναφέρεται παραπάνω; Ενημερώστε μας στα παρακάτω σχόλια ...