apple-touch-startup-image (iOS Splash Screens)
apple-touch-startup-image एक link tag है जो वह splash screen सेट करता है जिसे iOS एक home-screen web app के लॉन्च होते समय दिखाता है। आइकन के विपरीत, यह एक फ़ाइल नहीं है: iOS प्रति device resolution और orientation एक अलग, बिल्कुल-सही-आकार की image चाहता है, हर एक को एक media query से चुना जाता है। यह इतना झंझट भरा है कि कई साइटें इसे छोड़ देती हैं या पूरा सेट एक tool से generate करती हैं।
प्रति device एक image, media query द्वारा चुनी गई
iOS एक अकेली splash image को फ़िट करने के लिए स्केल नहीं करेगा। यह सटीक device pixel dimensions और orientation पर मैच करता है, इसलिए हर device को उस screen को target करने वाली एक media query के साथ अपना apple-touch-startup-image link चाहिए। कोई catch-all fallback नहीं है।
इसका मतलब है कि एक उचित सेट एक दर्जन या उससे अधिक link tags है, और सूची तब बदलती है जब Apple नए screen sizes भेजता है, यही वजह है कि इसे आमतौर पर हाथ से लिखने के बजाय generate किया जाता है।
सेट में से एक entry
<link
rel="apple-touch-startup-image"
media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3)"
href="/splash/iphone-12.png"
/>हर target device और orientation के लिए एक बार दोहराया जाता है, हर एक अपनी media query और बिल्कुल-सही-आकार की image के साथ।
iOS splash screen FAQ
apple-touch-startup-image क्या है?
एक link tag जो वह splash screen परिभाषित करता है जिसे iOS एक home-screen web app के लॉन्च होते समय, page के रेंडर होने से पहले, दिखाता है।
मुझे इतने सारे की ज़रूरत क्यों है?
iOS हर device के resolution और orientation से एक media query के साथ एक सटीक image मैच करता है, और एक image को फ़िट करने के लिए स्केल नहीं करेगा, इसलिए हर target device को अपनी entry चाहिए।
क्या मुझे एक splash screen की ज़रूरत भी है?
सिर्फ़ तभी जब आपकी साइट iOS home screen में इंस्टॉल हो और आप एक branded launch चाहें। एक सामान्य website के लिए यह कुछ नहीं करता, इसलिए अधिकांश साइटें इसे छोड़ देती हैं।