iPad Viewport-Größen: Vollständiger Leitfaden
Dieser umfassende Leitfaden bietet detaillierte Viewport-Größen und Bildschirmauflösungen für alle iPad-Modelle. Unverzichtbare Informationen für Webentwickler und Designer, die an responsiven Websites und Anwendungen arbeiten.
Viewport-Größen Tabelle
| Modell | Viewport-Größe | Bildschirmauflösung | DPR | Erscheinungsjahr |
|---|---|---|---|---|
| iPad Pro 12,9" (2024) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2024 |
| iPad Pro 11" (2024) | 834 × 1194 | 1668 × 2388 | 2.0 | 2024 |
| iPad Air (2024) | 820 × 1180 | 1640 × 2360 | 2.0 | 2024 |
| iPad Pro 12,9" (2022) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2022 |
| iPad Pro 11" (2022) | 834 × 1194 | 1668 × 2388 | 2.0 | 2022 |
| iPad Air (2022) | 820 × 1180 | 1640 × 2360 | 2.0 | 2022 |
| iPad 10. Generation | 820 × 1180 | 1640 × 2360 | 2.0 | 2022 |
| iPad Mini (2021) | 768 × 1024 | 1536 × 2048 | 2.0 | 2021 |
| iPad 9. Generation | 810 × 1080 | 1620 × 2160 | 2.0 | 2021 |
| iPad Pro 12,9" (2021) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2021 |
| iPad Pro 11" (2021) | 834 × 1194 | 1668 × 2388 | 2.0 | 2021 |
| iPad Air (2020) | 820 × 1180 | 1640 × 2360 | 2.0 | 2020 |
| iPad 8. Generation | 810 × 1080 | 1620 × 2160 | 2.0 | 2020 |
| iPad Pro 12.9" (2020) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2020 |
| iPad Pro 11" (2020) | 834 × 1194 | 1668 × 2388 | 2.0 | 2020 |
| iPad 7th Gen | 810 × 1080 | 1620 × 2160 | 2.0 | 2019 |
| iPad Air (2019) | 834 × 1112 | 1668 × 2224 | 2.0 | 2019 |
| iPad Mini (2019) | 768 × 1024 | 1536 × 2048 | 2.0 | 2019 |
| iPad Pro 12.9" (2018) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2018 |
| iPad Pro 11" (2018) | 834 × 1194 | 1668 × 2388 | 2.0 | 2018 |
| iPad 6th Gen | 768 × 1024 | 1536 × 2048 | 2.0 | 2018 |
| iPad Pro 10.5" | 834 × 1112 | 1668 × 2224 | 2.0 | 2017 |
| iPad Pro 12.9" (2017) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2017 |
| iPad 5th Gen | 768 × 1024 | 1536 × 2048 | 2.0 | 2017 |
| iPad Pro 9.7" | 768 × 1024 | 1536 × 2048 | 2.0 | 2016 |
| iPad Pro 12.9" (2015) | 1024 × 1366 | 2048 × 2732 | 2.0 | 2015 |
| iPad Mini 4 | 768 × 1024 | 1536 × 2048 | 2.0 | 2015 |
| iPad Air 2 | 768 × 1024 | 1536 × 2048 | 2.0 | 2014 |
Viewport-Größen verstehen
Viewport-Grundlagen
- Viewport-Größe: Der sichtbare Bereich in CSS-Pixeln, den Ihre Website nutzen kann
- Bildschirmauflösung: Die tatsächliche Anzahl physischer Pixel auf dem Gerät
- Device Pixel Ratio (DPR): Das Verhältnis zwischen physischen Pixeln und CSS-Pixeln
- Ausrichtung: iPad unterstützt sowohl Hoch- als auch Querformat
Design-Überlegungen
- Entwerfen Sie für Hoch- und Querformat
- Berücksichtigen Sie die größere Bildschirmfläche des iPads
- Optimieren Sie für Touch-Interaktionen
- Verwenden Sie geeignete Media Queries für verschiedene iPad-Modelle
- Berücksichtigen Sie faltbare Geräte
Verwandte Ressourcen
Wird geladen...