Ακονισμένες συνταγές InDesign

Συμβουλές και κόλπα για το Adobe InDesign: Εξαγωγή γραφικών με σωστή ανάλυση για το web.

Όλα τα βίντεο του μαθήματος

Υπάρχουν άνθρωποι που πραγματικά δημιουργούν γραφικά για τον ιστό στο Adobe InDesign. Αυτό είναι δυνατό.

Κάποια στιγμή, ένας φίλος με ρώτησε πώς είναι δυνατόν, όταν εξάγω μια γραφική ως JPG και τη βλέπω στο Photoshop, να μην είναι σωστή η ανάλυση. Έπρεπε να κοιτάξω ο ίδιος πώς γίνεται αυτό.

Βήμα 1

Ας δείξω απλά πώς πρέπει να γίνει σωστά:

Πηγαίνω σε Αρχείο>Νέο>Έγγραφο και εκεί μπορώ να επιλέξω ήδη στη Σύνταξη αν το θέλω για Εκτύπωση, Web ή Ψηφιακή Δημοσίευση. Χρειάζομαι το Web.

Ως μονάδα μέτρησης χρησιμοποιούνται εικονοστοιχεία, αυτό είναι σωστό. Θα μπορούσα να πω και την ακριβή ανάλυση που θέλω στο Μέγεθος Σελίδας ή μπορώ να το εισάγω απευθείας σε Πλάτος και Ύψος. Ας πούμε 800 × 200 Px και επιβεβαιώνω με ΟΚ.

Συμβουλές & Κόλπα για το Adobe InDesign: Εξαγωγή Γραφικών με Σωστή Ανάλυση για το Web

Βήμα 2

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

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

Στη συνέχεια χρειάζεται να υπάρχει και ένας Διαβάλλον από επάνω προς τα κάτω. Επιλέγω λοιπόν Τύπος: Γραμμικός και Γωνία: 90°.

Για να μην έχω Περίγραμμα, το ρυθμίζω μέσω Χρωματικά Πεδία.

Συμβουλές και Κόλπα για το Adobe InDesign: Εξαγωγή γραφικών για το web με σωστή ανάλυση

Βήμα 3

Φυσικά μπορώ να ρυθμίσω το χρώμα μόνος μου αν δεν μου αρέσει. Αλλά εδώ δεν είναι το θέμα.

Αλλά αν όμως είναι, τότε μπορώ να διαλέξω το χρώμα πηγαίνοντας μέσω Χρωματικά Πεδία>Νέο Πεδίο Διαβάλλοντος. Δημιουργείται αμέσως και μπορώ να μπω μέσα με Διπλό Κλικ και να μετακινήσω, για παράδειγμα, τον ρυθμιστή Μαύρο ελαφρώς προς τα δεξιά, ώστε να μην πηγαίνει απευθείας στο πλήρες λευκό.

Συμβουλές & Κόλπα για το Adobe InDesign: Εξαγωγή γραφικών για το web με σωστή ανάλυση.

Βήμα 4

Θα ήθελα επίσης να το έχω και εστιασμένο, οπότε πηγαίνω σε Αντικείμενο>Οποιαδήποτε Γωνία.

Αυτό το κάνω πάντα με Προεπισκόπηση, ώστε να το βλέπω αμέσως. Και μετά ρυθμίζω Εστιασμένο και 20 px.

Έτσι είναι το τελικό αποτέλεσμα:

Συμβουλές και Κόλπα για το Adobe InDesign: Εξαγωγή γραφικών με σωστή ανάλυση για τον ιστό

Βήμα 5

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

Συμβουλές και κόλπα για το Adobe InDesign: Εξαγωγή γραφικών για το web με σωστή ανάλυση.

Βήμα 6

Θέλω τώρα να το εξάγω, οπότε πηγαίνω σε Αρχείο>Εξαγωγή και το ονομάζω "κουμπί".

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

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

Επιπλέον, μπορώ να ρυθμίσω την Ποιότητα. Στην Ανάλυση πάντα είναι ρυθμισμένα τα 300 ppi - τα ppi είναι Εικονοστοιχεία ανά Ίντσα.

Επίσης είναι σημαντικό το Διαφανές Φόντο και πηγαίνω σε Εξαγωγή.

Συμβουλές & Κόλπα για το Adobe InDesign: Εξαγωγή γραφικών με σωστή ανάλυση για το web.

Βήμα 7

Ανοίγω τώρα αυτό το αρχείο στο Photoshop και βλέπω αμέσως ότι είναι λίγο μεγάλο.

Και αν κοιτάξω στο Εικόνα>Μέγεθος Εικόνας, τότε είναι 3334 × 834 εικονοστοιχεία. Αυτό όμως δεν το είχα ρυθμίσει καν κατά τη δημιουργία του εγγράφου!

Συμβουλές & Κόλπα για το Adobe InDesign: Εξαγωγή γραφικών για το web με τη σωστή ανάλυση.

Βήμα 8

Για αυτό επανέρχομαι στο InDesign και πηγαίνω σε Αρχείο>Εξαγωγή. Την φορά αυτή το ονομάζω "κουμπι2".

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

Συμβουλές και κόλπα για το Adobe InDesign: Εξαγωγή γραφικών για το web με σωστή ανάλυση

Και στο Photoshop έχει τα επιθυμητά 800 × 200 εικονοστοιχεία.

Συμβουλές & Κόλπα για το Adobe InDesign: Εξαγωγή Γραφικών για το Web με την σωστή ανάλυση.



Αυτά ήταν περίπου. Δεν είναι κάτι περισσότερο. Βασικά χρειάζεται μόνο να προσέχετε ότι κατά την εξαγωγή εισάγετε 72 ppi.