"Το πλέγμα είναι ένα σύστημα βοήθειας, αλλά δεν αποτελεί εγγύηση, αλλά έχει απλώς μια σειρά από πιθανές χρήσεις, και κάθε σχεδιαστής μπορεί να βρει μια λύση που ταιριάζει στο δικό του στυλ. Αλλά πρέπει να μάθει κανείς να χρησιμοποιεί το πλέγμα. Είναι μια τέχνη που απαιτεί εξάσκηση».

— Joseph Müller-Brockmann

Στην πραγματικότητα, η ίδια η χρήση ενός πλέγματος σχετίζεται με μια από τις παλαιότερες και πιο βασικές αρχές σχεδιασμού: την ευθυγράμμιση. Ο εγκέφαλός μας θέλει να απλοποιήσει τα πάντα και να τα κάνει πιο κατανοητά. Γι' αυτό προσπαθούμε να βάλουμε τάξη σε πράγματα που φαίνονται χαοτικά.

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

Εξετάστε τις δύο διατάξεις σελίδων που φαίνονται στο παρακάτω σχήμα:

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

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

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

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

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

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

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

Αξίζει να σημειωθεί ότι υπάρχουν δύο τρόποι για να δημιουργήσετε ένα πλέγμα προτύπων:

Μέθοδος #1: Δημιουργήστε το δικό σας πλέγμα

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

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

Ίσως τα παρακάτω άρθρα να σας βοηθήσουν σε αυτό:

• How You Make A Grid (βιβλίο στο αγγλική γλώσσασε μορφή .pdf)

Ακολουθούν μερικά παραδείγματα δικτύων που δημιουργήθηκαν στο Photoshop χρησιμοποιώντας οδηγούς ( Προβολή>Νέος οδηγός):

Πρόσθετα για τη δημιουργία πλεγμάτων στο Photoshop

5. Grid System Generator - γεννήτρια δημοφιλών δικτύων όπως 960.gs, Golden Grid, 1Kb Grid, Simple Grid / ορίστε τις απαραίτητες παραμέτρους και κάντε κλικ στο "GENERATE".

Πλέγματα για ρευστούς/ανταποκριτικούς ιστότοπους

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

1. - προσαρμοστική γεννήτρια πλέγματος

2. Αριθμομηχανή πλέγματος υγρών - μια υπηρεσία που σας επιτρέπει να δημιουργήσετε ένα ελαστικό πλέγμα. Εισαγάγετε τις παραμέτρους και λάβετε τον τελικό κωδικό.

Αρθρωτό πλέγμα - eένα σχέδιο, μοτίβο, μέγεθος ή αναλογία που επαναλαμβάνεται πολλές φορές. Θυμηθείτε τις φωτογραφίες του Escher. Σαύρες, ψάρια, πουλιά σε ορισμένα έργα - αυτή είναι η ενότητα. Κάθε χρήστης του Διαδικτύου βλέπει ενότητες με τη μορφή φόντου.

Η πρώτη επιλογή για τη χρήση μονάδων στο σχεδιασμό είναι η ίδια όπως στο Διαδίκτυο, δηλαδή μια εικόνα φόντου. Σε ποικίλες μορφές, τόσο ανεξάρτητα όσο και σε διάφορους συνδυασμούς. Και οι ίδιες εικονογραφήσεις του Escher.

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

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

Ο Φειδίας (ο δημιουργός της Ακρόπολης) και ο Ικτίνος (Παρθενώνας) επέδειξαν επίσης γνώση του νόμου της χρυσής τομής. Η ουσία αυτού του νόμου είναι ότι το μικρότερο τμήμα σχετίζεται με το μεγαλύτερο, όπως το μεγαλύτερο είναι σε όλο το μήκος. Δεν θυμάμαι αν αυτός ο νόμος μελετάται στο σχολείο, αλλά σε σχολές τέχνης, καλλιτεχνικά και αρχιτεκτονικά ινστιτούτα είναι σαν "Πάτερ ημών..." Σε έναν αριθμό αυτή η τιμή εκφράζεται ως 1,618..... αλγεβρικά μοιάζει με : b=b:( a+b). Το θέμα είναι ότι μια τέτοια αναλογία είναι ευεργετική για το μάτι λόγω των ψυχικών και σωματικών χαρακτηριστικών της δομής του ματιού, των συχνοτήτων λειτουργίας του εγκεφάλου και πολλών, πολλών... (Εικόνα 4.2.)

Το δεύτερο ενεργό στοιχείο στην οικοδόμηση κάποιων οπτικά ευνοϊκών σχέσεων είναι το τετράγωνο. Κατασκευάζοντας από αυτό είναι εύκολο να ληφθούν οι αναλογίες 1:2, 2:3, 3:4.

Εικόνα 4.2.

Εικόνα 4.3.

Για τον Ιστό, η κατασκευή αρθρωτών σελίδων μπορεί να οργανωθεί χρησιμοποιώντας πίνακες. Ως λειτουργική μονάδα, μπορείτε να πάρετε την αναλογία διαστάσεων της οθόνης (σε 800x600 είναι 4:3) (Εικόνα 4.3.). Το τυπικό μέγεθος ενός φύλλου χαρτιού Α4 είναι επίσης μια ενότητα στο σχέδιο και την τυπογραφία

Ο συντριπτικός αριθμός των τυπογραφικών πλεγμάτων βασίζεται στη μορφή ενός φύλλου χαρτιού, που λαμβάνεται ως βάση για τη δημοσίευση. Ο σχεδιασμός του πλέγματος εξαρτάται από το περιεχόμενο και την πρόθεση του έργου, καθώς και από το μεμονωμένο στυλ ενός συγκεκριμένου καλλιτέχνη. Και αν ο σχεδιασμός γίνει με χρήση υπολογιστή, τότε η διαδικασία γίνεται αρκετά γρήγορη, ειδικά στο στάδιο της υλοποίησης. Τα περισσότερα γραφικά (κυρίως εκδοτικά) προγράμματα έχουν ενσωματωμένες επιλογές για τη δημιουργία ενός αρθρωτού πλέγματος και σχεδόν όλα έχουν ένα αρκετά μεγάλο σύνολο προτύπων αρθρωτών πλέγματος με τα αρκετά κοινά ονόματα «Βιβλιάριο», «Ημερολόγιο» κ.λπ.

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

Εικόνα 4.4.

Εικόνα 4.5. Αρθρωτό πλέγμα των υπόλοιπων λωρίδων

Όπως μπορείτε να δείτε, εκτός από ένα σαφώς καθορισμένο επάνω μπλοκ, η λωρίδα έχει ένα σαφώς καθορισμένο "υπόγειο" - αυτό αποκαλούν οι δημοσιογράφοι το κάτω μέρος της λωρίδας. Βοηθά στη διαίρεση των πληροφοριών στη σελίδα σε θεματικές ζώνες. Το κύκλωμα διαμόρφωσης ζώνης είναι ορατό στα δύο χρωματικά διαγράμματα.

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

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

Εικόνα 4.6.

Στο σχεδιασμό ιστοσελίδων, το αρθρωτό πλέγμα χρησιμοποιείται πολύ πιο συχνά από ό,τι φαίνεται με την πρώτη ματιά. Εάν χρησιμοποιείτε

για να σχηματίσετε στοιχεία στη σελίδα - χρησιμοποιείτε ήδη ένα αρθρωτό πλέγμα, ειδικά αν επαναλάβετε αυτό το πλέγμα όχι σε μία σελίδα, αλλά σε πολλές. Μερικές φορές το πλέγμα μπορεί να είναι κρυφό, μερικές φορές μπορεί να είναι σαφές (όταν χρησιμοποιείτε διαφορετικό χρώμα ως φόντο του κελιού, διαφορετικό από το κύριο φόντο) (Εικόνα 4.6.)

Θα πρέπει να προστεθεί ότι η ουσία του πλέγματος είναι η ίδια, εκτός από το ότι το πλέγμα Ιστού μπορεί να περιέχει δυναμικές (με δυνατότητα αλλαγής) παραμέτρους κελιών. Η σελίδα μπορεί να έχει διαφορετικό ύψος, το οποίο εξαρτάται από την ποσότητα του κειμένου και των εικόνων σε αυτήν, και να επεκτείνεται αυτόματα (ή να μην επεκτείνεται) ανάλογα με την ανάλυση της οθόνης που χρησιμοποιείται.

Μεγέθη οθόνης

ΜΕ

Πλάτος καμβά

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

Ανάλυση της οθόνης
Μεγέθη καμβά

Το μέγεθος της οθόνης μπορεί να προσδιοριστεί χρησιμοποιώντας απλά προγράμματα (βλ. εργαστηριακή πρακτική).

Ας δούμε ένα παράδειγμα αρθρωτού πλέγματος και προσδιορίζοντας διαστάσεις, οργανωμένο χρησιμοποιώντας έναν πίνακα

Σε HTML, μπορείτε να επισημάνετε ολόκληρο το περιεχόμενο ενός πίνακα με μια ετικέτα . Στη συνέχεια, η κεφαλίδα του πίνακα υποδεικνύεται από την ετικέτα και το συμπέρασμα με την ετικέτα . Και οι τρεις ετικέτες είναι ετικέτες κλεισίματος και έχουν χαρακτηριστικά. Τα κελιά κεφαλίδας πίνακα χρησιμοποιούν την ετικέτα .

Ωστόσο, ο ευκολότερος τρόπος για να μην εξαρτάστε από το μέγεθος του καμβά είναι να χρησιμοποιήσετε σχετικά μεγέθη, δηλαδή να ορίσετε τα μεγέθη σε %.

Ένα εξαιρετικά χρήσιμο άρθρο για τους κανόνες δημιουργίας διάταξης περιοδικού! Συνιστώ ανεπιφύλακτα να το διαβάσετε.

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

Μονάδα μέτρησηςείναι μια πολλαπλή επαναλαμβανόμενη εικόνα, μέγεθος ή αναλογία. – αυτή είναι η δομή (πλαίσιο, πρότυπο) της διάταξης των γραφικών στοιχείων στις σελίδες. Η βάση ενός αρθρωτού πλέγματος είναι το "module", με άλλα λόγια, το κύριο βήμα του πλέγματος, το οποίο καθορίζεται οπτικά από το πλάτος και το ύψος του κελιού (modular unit). Τα κελιά κατασκευάζονται χρησιμοποιώντας κάθετες στήλες και οριζόντιες γραμμές.

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

Το πλέγμα δημιουργείται για ολόκληρο το spread, όχι για κάθε σελίδα ξεχωριστά. Αυτό γίνεται έτσι ώστε ολόκληρη η διάδοση του περιοδικού να γίνεται αντιληπτή ως ενιαίο σύνολο και να μην χωρίζεται σε δεξιά και αριστερά μέρη και ολόκληρη η έκδοση να μην μοιάζει με βιβλιοδεσία ανόμοιων σελίδων. Το πλέγμα αντιστροφής μπορεί να αποτελείται από 2, 3, 4 κ.λπ. στήλες ίσου και άνισου πλάτους.

Στήλες ίσου πλάτους δημιουργούνται στο παράθυρο δημιουργίας εγγράφου ή στον πίνακα "Περιθώρια και Στήλες". Εάν πρέπει να ορίσουμε 3 στήλες, τότε εισάγουμε τον αριθμό 3 στο αντίστοιχο πεδίο κ.λπ.

Τι γίνεται όμως αν, σύμφωνα με το σχέδιό μας, δεν πρέπει όλες οι στήλες να έχουν το ίδιο πλάτος; Για παράδειγμα, τι γίνεται αν το κείμενο και οι εικόνες τοποθετούνται σε 2 ευρείες στήλες και οι επεξηγηματικές πληροφορίες τοποθετούνται σε μια πλαϊνή στενή στήλη;

Σε αυτήν την περίπτωση, το αρθρωτό πλέγμα μας θα κατασκευαστεί στη βάση διάφορααριθμός αυτόματων στηλών προγράμματος. Για παράδειγμα, εάν ορίσουμε 8 αυτόματες στήλες για μια σελίδα, τότε οι 2 ευρείες στήλες που έχουμε σχεδιάσει (για κείμενο και εικόνες) θα καταλαμβάνουν 3 αυτόματες στήλες και η στενή πλαϊνή στήλη θα κατασκευαστεί με βάση 2 αυτόματες στήλες.

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

Επικεφαλίδεςμπορεί να χωρέσει σε μία στήλη ή να εκτείνεται σε πολλές στήλες. Δεν είναι ασυνήθιστο ο τίτλος να είναι το μόνο στοιχείο για ολόκληρη τη σελίδα. Όλα εξαρτώνται από τη δημιουργική ιδέα και τις προσωπικές προτιμήσεις του σχεδιαστή.

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

-

Ένα αρθρωτό πλέγμα δεν κατασκευάζεται απαραίτητα από κάθετες γραμμές. Μερικές φορές ο σχεδιαστής αποφασίζει να γείρει το πλέγμα ή ακόμα και να του δώσει ένα πρωτότυπο σχήμα.Αν θέλετε να ξεπεράσετε τα συνηθισμένα, προχωρήστε!
Απλώς προσπαθήστε να διασφαλίσετε ότι στην επιδίωξη της πρωτοτυπίας η δουλειά σας δεν θα μετατραπεί σε Σισύφεια εργασία. Φανταστείτε πώς θα ήταν να απλώναμε 40-50 σελίδες με ένα κεκλιμένο ή σγουρό πλέγμα...

-

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

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

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

Όλα όσα μας περιβάλλουν έχουν τις δικές τους αναλογίες. Ακόμα και ως παιδί, το κινούμενο σχέδιο "38 Parrots" μας δίδαξε ότι τα πάντα μπορούν να χωριστούν σε μέρη ίσα μεταξύ τους (το μήκος του βόα συσφιγκτήρα αποτελούνταν από 38 παπαγάλους). Όλοι γνωρίζουμε επίσης ότι το ύψος ενός ατόμου είναι ίσο με επτά από τα κεφάλια του, ένα εκατοστό αποτελείται από δέκα χιλιοστά, ένα μέτρο αποτελείται από εκατό εκατοστά, και ούτω καθεξής. Έτσι, ένας παπαγάλος κινουμένων σχεδίων, ένα ανθρώπινο κεφάλι, ένα χιλιοστό και ένα εκατοστό είναι ενότητες.

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

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

Ας δούμε τι είναι τα πλέγματα.

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

Πλέγμα μπλοκ

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

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

Λοιπόν, πώς να δημιουργήσετε ένα αρθρωτό πλέγμα.

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

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

3. Ξεκινάμε την κατασκευή του πλέγματος προσδιορίζοντας τις διαστάσεις χώρο εργασίας. Στη συνέχεια πρέπει να φτιάξουμε το πλέγμα γραμματοσειρών. Για να το κάνετε αυτό, επιλέξτε το ύψος της σειράς, το οποίο θα πρέπει να είναι το ίδιο για ολόκληρη τη διάταξη. Σε στοιχεία που έχουν μέγεθος γραμματοσειράς διαφορετικό από το μέγεθος γραμματοσειράς του κύριου κειμένου, ο χώρος γραμμής πρέπει να είναι πολλαπλάσιο του ύψους της γραμμής μας.

Έτσι, παίρνουμε τη βάση του μελλοντικού μας πλέγματος. Όλο το κείμενο θα στηριχθεί σε αυτό το θεμέλιο.

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

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

Υπάρχει μια προειδοποίηση - πρέπει να επιλέξετε τα σωστά μεγέθη μονάδων, γιατί αν είναι πολύ μεγάλα, η ευελιξία του πλέγματος θα εξαφανιστεί και αν είναι μικρά, το πλέγμα απλά θα χαθεί.

5. Η οριζόντια διαίρεση είναι αρκετά απλή. Το ύψος του πρέπει να είναι πολλαπλάσιο του ύψους της πετονιάς μας. Και πόσες γραμμές θα εισαγάγετε σε μία διαίρεση εξαρτάται από το σκίτσο σας.

Πριν από λίγο καιρό, ενώ εργαζόμουν σε ένα άλλο μάθημα για το μάθημα «Γραφιστική. Basics» (προγραμματίστηκε να κυκλοφορήσει στις αρχές Ιανουαρίου), συνειδητοποίησα ότι το θέμα της χρήσης και της κατασκευής αρθρωτών πλεγμάτων σπάνια καλύπτεται.

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

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

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

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

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

Για λόγους σαφήνειας, θα δώσω ένα παράδειγμα αρθρωτού πλέγματος ενός έντυπου περιοδικού. Εάν σχεδιάζουμε ένα περιοδικό, τότε τα δομικά στοιχεία μπορεί να είναι τίτλος, υπότιτλος, κείμενο και εικονογραφήσεις. Συνήθως στα περιοδικά υπάρχουν ΔΙΑΦΟΡΕΤΙΚΟΙ ΤΥΠΟΙάρθρα όπου ο ρόλος του τμήματος κειμένου μπορεί να αλλάξει. Σε τέτοιες περιπτώσεις, για να κάνω το πλέγμα πιο ευέλικτο, χρησιμοποιώ 5-7 ενότητες (οριζόντια):

Ο συνδυασμός μονάδων μπορεί να γίνει σχεδόν σε οποιαδήποτε μορφή βολική για εσάς:

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

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

Στην περίπτωση των ιστοσελίδων, ο βέλτιστος αριθμός στηλών θεωρείται 12, 16 και 24, γεγονός που οφείλεται στις ιδιαιτερότητες της διάταξης της ιστοσελίδας και στη χρήση των δυνατοτήτων πλαισίου. Θεωρώ ότι το ελάχιστο ύψος μιας ενότητας για το web είναι 20 px, γεγονός που οφείλεται στο βέλτιστο μέγεθος γραμματοσειράς (12-14pt) και στην αναγνωσιμότητά της.

Τώρα ήρθε η ώρα να μιλήσουμε για την τεχνική πλευρά του θέματος.

Δημιουργία αρθρωτού πλέγματος στο

• Ο πρώτος και ευκολότερος τρόπος είναι να ενεργοποιήσετε το ίδιο το πλέγμα γραφικός επεξεργαστής(Ctrl+’) και, καθοδηγούμενοι από αυτό, ρυθμίστε τους οδηγούς. Θα πάρει πολύ χρόνο και με μεγάλη πιθανότητα σφαλμάτων.
• Εγκαταστήστε ειδικά πρόσθετα για το Photoshop ( Οδηγός Οδηγός , Αρθρωτό μοτίβο πλέγματος , GridMaker 2).
• Κατεβάστε ένα έτοιμο πρότυπο από μια από τις δωρεάν γεννήτριες πλέγματος, όπως 960.gs, Golden Grid, 1Kb Grid, Simple Grid. Ρυθμίστε τις επιθυμητές παραμέτρους και κάντε κλικ στο "GENERATE".

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

Δημιουργία αρθρωτού πλέγματος στο

Σε αντίθεση με το Photoshop, το InDesign έχει τα δικά του εργαλεία δημιουργίας αρθρωτού πλέγματος. Στο μενού Διάταξηπρέπει να επιλέξετε ένα στοιχείο Δημιουργία οδηγώνκαι εισαγάγετε τις παραμέτρους που χρειάζεστε στο παράθυρο διαλόγου:

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

Δημιουργία αρθρωτού πλέγματος στο

• Η πρώτη μέθοδος (παρόμοια με το Photoshop) είναι να ενεργοποιήσετε το πλέγμα του ίδιου του προγράμματος επεξεργασίας γραφικών και, καθοδηγούμενοι από αυτό, να ορίσετε τους οδηγούς. Είναι επίσης δυνατό να κάνετε οποιοδήποτε σχήμα οδηγό, που θα βοηθήσει στην οργάνωση ενός κεκλιμένου πλέγματος.
• Κατεβάστε έτοιμα πρότυπαπλέγματα Πού - η αναζήτηση θα σας πει. Μπορείτε να βρείτε πολλά από αυτά στο Διαδίκτυο.

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

Ο κόσμος των δωρεάν προγραμμάτων και χρήσιμες συμβουλές
2024 whatsappss.ru

τίτλος
μενού	ενότητα 1		Ενότητα 2	ενότητα 3	ενότητα 4
	συμπέρασμα