Πώς προσθέτουμε σε έναν εικονικό ιστότοπο για iPhone, iPad και iPod Touch

Favicon.ico – Εικονίδιο ιστότοπου στο πρόγραμμα περιήγησης

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

Ρυθμίσεις μυστικότητας Favicon
Ρυθμίσεις stealth favicon σε σαφάρι
Favicon στην εργασία
Favicon στην εργασία

Μέχρι πρόσφατα αυτό το αρχείο έπρεπε να έχει σχήμα “Favicon.ico“, να ταυτοποιηθεί από το πρόγραμμα περιήγησης στο Web. Chrome, Internet Explorer, Opera, Safari, Firefox κ.λπ.
Για αρκετά χρόνια, με την πρόοδο των νέων ιστοσελίδων, HTML9 και CSS3, favicon μπορεί να είναι ένα Fisier .png ή .JPG. Η κατάσταση είναι ότι στην κεφαλίδα του ιστότοπου, προτού </κεφάλι>, να παρουσιάσει τη γραμμή:

<σύνδεσμος rel =”εικονίδιο συντόμευσης” HREF =”/Images/favicon.ico” τύπος =”εικόνα/x-icon” />

Εικονίδιο ιστότοπου για iOS – iPhone, iPad Si iPod Touch

Σε ios Μπορούμε να προσθέσουμε Συντομεύσεις ιστοσελίδων ΡΕ Αρχική οθόνη-uliPher, iPad και iPod Touch.

Πώς προσθέτουμε τη συντόμευση ενός ιστότοπου στο iPhone, το iPad και το iPod αρχική οθόνη

Το κάνουμε αυτό ανοίγοντας μια ιστοσελίδα στο iPhone (Safari, Chrome, κ.λπ. “μερίδιο” Στο iOS), τότε η επιλογή “Προσθήκη στην αρχική οθόνη“.

Εάν ο ιστότοπος έχει οριστεί για το πρόγραμμα περιήγησης, αλλά δεν έχει οριστεί εικονίδιο ειδικά για συσκευές iOS, στην οθόνη θα εμφανιστεί ένα εικονίδιο που σχηματίζεται από ένα Φανταστείτε προεπισκόπηση της ιστοσελίδας.

Πώς να προσθέσετε εικονίδια ιστού για iPhone, iPad και Android.

Το πρώτο βήμα είναι δικό τουΔημιουργούμε μια εικόνα για το iconita, που εμφανίζεται στις Αρχική οθόνηΗ ιδέα. Προκειμένου το εικονίδιο του ιστού να είναι συμβατό σε όλες τις συσκευές και να δούμε καθαρά, πρέπει να δημιουργήσουμε την εικόνα Για όλες τις αναλύσεις iPhone και iPad.

Τυπικά ψηφίσματα και μεγέθη εικονιδίων για iPhone, iPad, iPod και Android

  • Κλασικά μοντέλα iPhone / iPod / 57×57
  • ipad = 76×76
  • iPhone / iPod Retina = 120×120
  • iPad Retina = 152×152
  • iPhone 6/6s Plus = 180×180

Apple Ενημέρωση τακτικά Συνιστώμενες διαστάσεις για εικονίδιοUrls αιτήσεις και ιστοσελίδες ΡΕ Αυτή η σελίδα.

Για συσκευές Android, τα εικονίδια είναι δύο μεγέθη:

  • Android Classic = 128 × 128
  • Android με υψηλή ανάλυση (Hi-Res) = 192 × 192
εικονίδια

Αφού έχουμε πάρει τις εικόνες, ανεβαίνουμε στον διακομιστή ιστού και στην πηγή HTML του ιστότοπου, πριν κλείσουμε </κεφάλι>, προσθέστε τις ακόλουθες γραμμές:

<σύνδεσμος href =”/Apple-touch-icon.png” rel =”apple-touch-icon” /> <σύνδεσμος href =”/Apple-Touch-ICON-76×76.png” rel =”apple-touch-icon” μεγέθη =”76×76″ /> <σύνδεσμος href =”/Apple-Touch-ICON-120×120.png” rel =”apple-touch-icon” μεγέθη =”120×120″ /> <σύνδεσμος href =”/Apple-Touch-ICON-152×152.png” rel =”apple-touch-icon” μεγέθη =”152×152″ /> <σύνδεσμος href =”/Apple-Touch-ICON-180×180.png” rel =”apple-touch-icon” μεγέθη =”180×180″ /> <σύνδεσμος href =”/” rel =”εικόνισμα” μεγέθη =”192×192″ /> <σύνδεσμος href =”/-normal.png” rel =”εικόνισμα” μεγέθη =”128×128″ />

Για συσκευές Apple, όνομα εικόνας .png και “rel =” Πρέπει να περιέχει το πρόθεμα “μήλο-“. Για το Android, τα ονόματα αρχείων θα είναι “εικονίδιο-hires.png” και “εικονίδιο-normal.png” με rel =”εικόνισμα”.

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

iPhone-Website-Icon

Το εικονίδιο συντόμευσης στον ιστότοπο θα μοιάζει με αυτό οποιουδήποτε Εφαρμογές για iOS.

Παθιασμένος με την τεχνολογία, γράφω με ευχαρίστηση στο stealthsetts.com ξεκινώντας από το 2006. Έχω μια πλούσια εμπειρία στα λειτουργικά συστήματα: MacOs, Windows και Linux, αλλά και σε γλώσσες προγραμματισμού και πλατφόρμες blogging (WordPress) και για ηλεκτρονικά καταστήματα (WooCommerce, Magento, Presashop).

Σπίτι Η πηγή σας σε μαθήματα, χρήσιμες συμβουλές και νέα. Πώς προσθέτουμε σε έναν εικονικό ιστότοπο για iPhone, iPad και iPod Touch
Αφήστε ένα σχόλιο