Διαφήμιση

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

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

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

instagram viewer

Ευτυχώς, υπάρχουν πολλοί πόροι που μπορούν να βοηθήσουν προτού χρειαστεί να πάτε για έναν προγραμματιστή για βοήθεια. Εδώ στο MUO, λατρεύουμε το σχεδιασμό ιστοσελίδων και καλύπτουμε συχνά το θέμα, όπως το Ann's Αναθεώρηση Firebug Οδηγός της Ερασιτεχνικής για την προσαρμογή του Σχεδιασμού Ιστοσελίδας με το FireBug Διαβάστε περισσότερα , ή η λίστα με τα καταπληκτικά του Steve ιστολόγια σχεδιασμού ιστοσελίδων 6 καλύτερα ιστολόγια σχεδιασμού Ιστού για παρακολούθηση Διαβάστε περισσότερα .

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

Εργαλεία σχεδιασμού ιστοσελίδων Mudcu.be

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

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

εργαλεία σχεδιασμού ιστοσελίδων

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

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

εργαλεία σχεδιασμού ιστοσελίδων

Η σειρά εργαλείων COLRD περιλαμβάνει παρόμοιες εφαρμογές ιστού με την παραπάνω. Το μενού "Δημιουργία" σάς επιτρέπει να επιλέξετε από το παραπάνω εργαλείο χρώματος ή μπορείτε να πάτε με το Palette, το Gradient ή το DNA εικόνας.

Κάντε το Web Design πιο αποτελεσματικό με τα δωρεάν ηλεκτρονικά εργαλεία Mudcu.be mudcube4

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

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

εργαλεία σχεδιασμού ιστοσελίδων

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

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

Κάντε το Web Design πιο αποτελεσματικό με τα δωρεάν διαδικτυακά εργαλεία Mudcu.be mudcube6

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

εργαλεία σχεδιασμού ιστοσελίδων

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

εργαλεία σχεδιασμού ιστοσελίδων

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

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

εργαλεία σχεδιασμού ιστοσελίδων

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

Κάντε το Web Design πιο αποτελεσματικό με τα δωρεάν ηλεκτρονικά εργαλεία Mudcu.be mudcube11

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

εργαλεία σχεδιασμού ιστοσελίδων

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

Αντιμετωπίζετε ποτέ χρώματα με τις προσπάθειές σας στο σχεδιασμό ιστοσελίδων; Ποια εργαλεία ή τεχνικές χρησιμοποιείτε για να ταιριάξετε τα πράγματα; Μοιραστείτε τις σκέψεις και τις ιδέες σας στην παρακάτω ενότητα σχολίων!

Πιστωτική εικόνα: σχεδιασμός ιστοσελίδων Via Shutterstock

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