Πώς να φτιάξετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο

Πίνακας περιεχομένων:

Πώς να φτιάξετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο
Πώς να φτιάξετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο

Βίντεο: Πώς να φτιάξετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο

Βίντεο: Πώς να φτιάξετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο
Βίντεο: (Word) Διαφορετική κεφαλίδα και υποσέλιδο σε μονές και ζυγές σελίδες και στην πρώτη σελίδα 2024, Απρίλιος
Anonim

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

Πώς να δημιουργήσετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο
Πώς να δημιουργήσετε μια κεφαλίδα από καουτσούκ για έναν ιστότοπο

Οδηγίες

Βήμα 1

Στο πρώτο βήμα της δημιουργίας μιας τέτοιας κεφαλίδας για έναν ιστότοπο, ανοίξτε στο Photoshop την εικόνα που έχετε ήδη προετοιμάσει για δημοσίευση στον Ιστό και, στη συνέχεια, κόψτε την σε κομμάτια χρησιμοποιώντας το Slice Tool στη γραμμή εργαλείων. Κόψτε την κεφαλίδα έτσι ώστε το κεντρικό τμήμα να είναι κενό, έτσι ώστε να καταλήξετε με τρία γραφικά στοιχεία. Αυτό θα επιτρέψει στην κεφαλίδα να τεντωθεί για οποιαδήποτε ανάλυση οθόνης.

Βήμα 2

Αφού κόψετε την κεφαλίδα, αποθηκεύστε τη βελτιστοποιώντας τα αρχεία κατά την αποθήκευση για τη μορφή ιστού (Αποθήκευση για web). Ορίστε την επιθυμητή μορφή αρχείου για αποθήκευση - για παράδειγμα, gif, jpeg ή png. Για να αλλάξετε κάθε τμήμα της εικόνας, κάντε κλικ στην επιλογή Slice Select Tool στο μενού και αλλάξτε το μέγεθος των εικόνων έτσι ώστε το μέγεθός τους να είναι όσο το δυνατόν μικρότερο με την ελάχιστη απώλεια στην ποιότητα της οπτικής εμφάνισης της εικόνας στην οθόνη. Αποθηκεύστε τις επεξεργασμένες εικόνες σας ως html και εικόνες.

Βήμα 3

Μετά την αποθήκευση των εικόνων, επεξεργαστείτε τον κώδικα HTML ανοίγοντας το αποθηκευμένο έγγραφο html με το Σημειωματάριο. Στο σημειωματάριο, διαγράψτε όλες τις περιττές γραμμές κώδικα. Αφήστε μόνο τις απαραίτητες γραμμές - δεδομένα σχετικά με τον πίνακα στον οποίο είναι ενσωματωμένες οι εικόνες σας:

Βήμα 4

Σε αυτές τις γραμμές, αντί του yourimage.gif, θα πρέπει να καθοριστεί η διαδρομή προς τις εικόνες σας με το κατάλληλο πλάτος και ύψος.

Βήμα 5

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

Βήμα 6

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

Συνιστάται: