Πώς να σχεδιάσει ιστοσελίδες χρησιμοποιώντας το Adobe Photoshop

Παρά το γεγονός ότι οι σχεδιαστές χρησιμοποιούν συνήθως Photoshop για να δημιουργήσετε έργα τέχνης και φωτογραφίες του προϊόντος , το πρόγραμμα μπορεί επίσης να χρησιμοποιηθεί για το σχεδιασμό ιστοσελίδων . Δεν υποστηρίζει την πραγματική δημιουργία της HTML ή CSS , αλλά, αντίθετα, παρέχει εργαλεία για να κάνουν τα γραφικά στοιχεία της σελίδας σας και να σχεδιάζετε την εμφάνιση της σελίδας σας . Παρέχει ακόμη ένα εργαλείο εξοικονόμησης που βελτιστοποιεί τις εικόνες σας ειδικά για το διαδίκτυο . Τα πράγματα που θα χρειαστείτε
Υπολογιστών
Photoshop
Η Εμφάνιση Περισσότερες οδηγίες
Η

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

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

Πηγαίνετε στο μενού Layers και επιλέξτε New Layer . Δημιουργία οποιαδήποτε πλαίσια κειμένου , πίνακες , και σε άλλους τομείς χρώμα σε αυτό το στρώμα .
Η

4 Επιλέξτε το εργαλείο κειμένου από τη γραμμή εργαλείων και κάντε κλικ σε ένα από τα χρωματικά πεδία . Προσθέστε το κείμενο που θέλετε να υπάρχει στην ιστοσελίδα σας . Μπορείτε να ρυθμίσετε το ύφος και το μέγεθος της γραμματοσειράς του κειμένου σας μέσω ενός μενού στην πάνω αριστερή γωνία του Photoshop . Να είστε βέβαιος να προσθέσετε έναν τίτλο στην κορυφή της σελίδας σας σε μια μεγάλη γραμματοσειρά .
5

Πηγαίνετε στο μενού Layers και επιλέξτε ξανά νέο στρώμα . Χρησιμοποιήστε αυτό το νέο στρώμα για να προσθέσετε τις εικόνες και άλλα στοιχεία γραφικών στην ιστοσελίδα σας . Ένα ωραίο λογότυπο με κύριο τίτλο σας θα σας βοηθήσει για να καλλωπίζω . Για να προσθέσετε εικόνες στην ιστοσελίδα σας , την εισαγωγή τους στο Photoshop μέσω του μενού File . Επιλέξτε κάθε εικόνα με το ορθογώνιο εργαλείο επιλογής και κάντε δεξί κλικ πάνω στην εικόνα . Επιλέξτε Αντιγραφή από το αναπτυσσόμενο μενού . Πηγαίνετε στο αρχείο της ιστοσελίδας σας και επιλέξτε Επικόλληση από το μενού Επεξεργασία . Μπορείτε να κάνετε κλικ και να σύρετε την εικόνα σας σε οποιοδήποτε μέρος του έργου σας .
Η 6

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

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

Πηγαίνετε στο μενού Layers και επιλέξτε Συγχώνευση Ορατό . Όλα τα στρώματα σας θα συγχωνευθούν σε μία .
Η 9

Πηγαίνετε στο μενού Αρχείο και επιλέξτε Αποθήκευση για το web . Επιλέξτε τον τύπο της εικόνας που θέλετε να χρησιμοποιήσετε στην ιστοσελίδα σας , κατά προτίμηση είτε . Jpeg ή . Gif . Κάντε κλικ στο Αποθήκευση . Photoshop τώρα θα μοιράσουν την εικόνα σας ένα αποθηκεύσετε κάθε φέτα ως μια μοναδική εικόνα σε ένα φάκελο αφιερωμένο στο έργο σας . Μπορείτε στη συνέχεια να τοποθετήσετε κάθε εικόνα σε ένα πρόγραμμα επεξεργασίας ιστοσελίδων , επανασυναρμολόγηση τις φέτες σε ένα ενιαίο σύνολο . Στη συνέχεια μπορείτε να προγραμματίσετε μεμονωμένες φέτες να ενεργεί ως σύνδεσμος κουμπιά .
Η
εικόνων