Ξέρετε για εικόνες με ανταπόκριση. Πρόκειται για τη σύνταξη εικόνας σε HTML. Εάν της δώσετε τις σωστές πληροφορίες στη σωστή σύνταξη, μπορείτε να κάνετε το πρόγραμμα περιήγησης να κατεβάσει ακριβώς τη σωστή εικόνα που χρειάζεται, χωρίς να του δώσετε πάρα πολλά ή πολύ λίγα δεδομένα εικόνας. Είναι φανταστικό για την απόδοση.
Γνωρίζετε ότι για να αξιοποιήσετε στο έπακρο τις αποκριτικές εικόνες, θα πρέπει να το συμπληρώσετε με το Picturefill. Το κατεβάζετε, το συμπεριλαμβάνετε στη σελίδα σας.
Έχετε ένα σχέδιο. Ξέρετε τι θέλετε να αρέσει η σελίδα σας σε συγκεκριμένα σημεία διακοπής ερωτήματος πολυμέσων. Όλα τα χλευάστηκαν στο Sketch ή στο Photoshop.
Ξέρετε πώς είναι η σύνταξη για τις αποκριτικές εικόνες. Θα χρειαστείτε κάτι όπως τη σύνταξη srcset / size για να περιγράψετε την κατάστασή σας.
![Sunset]()
Αυτό το screencast αφορά όλα αυτά τα πράγματα. Πρόκειται για δέσιμο όλων μαζί. Πρόκειται για τη σύνδεση μεταξύ της ροής εργασίας του σχεδιασμού και του λογισμικού που χρησιμοποιείται εκεί με τη ροή εργασίας διεπαφής και τη σύνταξη που χρησιμοποιείται εκεί. Πρέπει να γνωρίζετε πώς να εξάγετε τις εικόνες με τις μορφές και τα μεγέθη που χρειάζεστε. Πρέπει να γνωρίζετε πότε θα έχετε ποιοτική παραγωγή και πότε δεν θα. Πρέπει να γνωρίζετε πώς να μετράτε αυτές τις εικόνες και να χρησιμοποιείτε τους σωστούς αριθμούς όπου. Πρέπει να γνωρίζετε πώς να συνδέσετε τις επιλογές διάταξης και τα ερωτήματα πολυμέσων με αυτούς τους αριθμούς. Είναι όλα εδώ.
Δείτε το Pen Demo για το Screencast στο Getting the Numbers for Responsive Images από τον Chris Coyier (@chriscoyier) στο CodePen.