Rename documentation folder to docs and move FONT_SYSTEM_PLAN.md
This commit is contained in:
parent
39bb82ee3e
commit
6fa262655f
701
docs/FONT_SYSTEM_PLAN.md
Normal file
701
docs/FONT_SYSTEM_PLAN.md
Normal file
@ -0,0 +1,701 @@
|
||||
# Font System Erweiterung - Konzept & Implementierungsplan
|
||||
|
||||
**Datum:** 27. November 2025
|
||||
**Status:** Geplant
|
||||
**Ziel:** Erweiterte Font-Auswahl mit 11 hochwertigen Schriftarten für bessere Lesbarkeit
|
||||
|
||||
---
|
||||
|
||||
## 📋 Übersicht
|
||||
|
||||
### Aktuelle Situation (4 Fonts)
|
||||
- ❌ **System:** SF Pro (Apple)
|
||||
- ❌ **Serif:** Times New Roman (veraltet)
|
||||
- ❌ **Sans Serif:** Helvetica Neue (Standard)
|
||||
- ❌ **Monospace:** Menlo (Apple)
|
||||
|
||||
### Neue Situation (11 Fonts)
|
||||
- ✅ **5 Apple System Fonts** (bereits in iOS enthalten, 0 KB)
|
||||
- ✅ **8 Google Fonts** (OFL 1.1 lizenziert, ~1-2 MB)
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Ziele
|
||||
|
||||
1. **Bessere Lesbarkeit**: Moderne, für Langform-Texte optimierte Schriftarten
|
||||
2. **Konsistenz**: Matching mit Readeck Web-UI (Literata, Source Serif, etc.)
|
||||
3. **Sprachunterstützung**: Exzellenter Support für internationale Zeichen
|
||||
4. **100% Legal**: Alle Fonts sind frei verwendbar (Apple proprietär für iOS, Google OFL 1.1)
|
||||
|
||||
---
|
||||
|
||||
## 📚 Font-Übersicht (11 Fonts Total)
|
||||
|
||||
### Serif Fonts (5 Schriftarten)
|
||||
|
||||
#### 1. **New York** (Apple System Font)
|
||||
- **Quelle:** In iOS 13+ enthalten
|
||||
- **Lizenz:** Apple proprietär (frei für iOS Apps)
|
||||
- **Eigenschaften:**
|
||||
- 6 Gewichte
|
||||
- Variable optische Größen
|
||||
- Unterstützt Latin, Greek, Cyrillic
|
||||
- **Verwendung:** Premium Serif für Apple-native Ästhetik
|
||||
- **App-Größe:** 0 KB (bereits in iOS)
|
||||
|
||||
#### 2. **Lora** (Google Font)
|
||||
- **Quelle:** [GitHub - cyrealtype/Lora-Cyrillic](https://github.com/cyrealtype/Lora-Cyrillic)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Lora](https://fonts.google.com/specimen/Lora)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Olga Karpushina, Alexei Vanyashin (Cyreal)
|
||||
- **Eigenschaften:**
|
||||
- Gut ausbalancierte Brushes
|
||||
- Optimiert für Bildschirm-Lesbarkeit
|
||||
- Variable Font verfügbar
|
||||
- **Verwendung:** Elegante, lesbare Serif für Artikel
|
||||
- **App-Größe:** ~200-300 KB
|
||||
|
||||
#### 3. **Literata** (Google Font) ⭐
|
||||
- **Quelle:** [GitHub - googlefonts/literata](https://github.com/googlefonts/literata)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Literata](https://fonts.google.com/specimen/Literata)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** TypeTogether (für Google)
|
||||
- **Eigenschaften:**
|
||||
- Standard-Font von Google Play Books
|
||||
- Speziell für digitales Lesen entwickelt
|
||||
- Variable Font mit optischen Größen
|
||||
- **Verwendung:** **Readeck Web-UI Match** - Hauptschrift für Artikel
|
||||
- **App-Größe:** ~250-350 KB
|
||||
|
||||
#### 4. **Merriweather** (Google Font)
|
||||
- **Quelle:** [GitHub - SorkinType/Merriweather](https://github.com/SorkinType/Merriweather)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Merriweather](https://fonts.google.com/specimen/Merriweather)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Sorkin Type Co
|
||||
- **Eigenschaften:**
|
||||
- Designed für Bildschirme
|
||||
- 8 Gewichte (Light bis Black)
|
||||
- Sehr gute Lesbarkeit bei kleinen Größen
|
||||
- **Verwendung:** **Readeck Web-UI Match** - Alternative Serif
|
||||
- **App-Größe:** ~200-300 KB
|
||||
|
||||
#### 5. **Source Serif** (Adobe/Google Font)
|
||||
- **Quelle:** [GitHub - adobe-fonts/source-serif](https://github.com/adobe-fonts/source-serif)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Source+Serif+4](https://fonts.google.com/specimen/Source+Serif+4)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Adobe (Frank Grießhammer)
|
||||
- **Eigenschaften:**
|
||||
- Adobe's drittes Open-Source-Projekt
|
||||
- Companion zu Source Sans
|
||||
- Variable Font (Source Serif 4)
|
||||
- Professionelle, klare Serif
|
||||
- **Verwendung:** **Readeck Web-UI Match** - Adobe-Qualität
|
||||
- **App-Größe:** ~250-350 KB
|
||||
|
||||
---
|
||||
|
||||
### Sans Serif Fonts (5 Schriftarten)
|
||||
|
||||
#### 6. **SF Pro** (San Francisco - Apple System Font)
|
||||
- **Quelle:** In iOS enthalten
|
||||
- **Lizenz:** Apple proprietär (frei für iOS Apps)
|
||||
- **Eigenschaften:**
|
||||
- iOS Standard System Font
|
||||
- 9 Gewichte
|
||||
- Variable Widths (Condensed, Compressed, Expanded)
|
||||
- Unterstützt 150+ Sprachen
|
||||
- Dynamic optical sizes
|
||||
- **Verwendung:** Standard UI Font
|
||||
- **App-Größe:** 0 KB (bereits in iOS)
|
||||
|
||||
#### 7. **Lato** (Google Font)
|
||||
- **Quelle:** [GitHub - latofonts/lato-source](https://github.com/latofonts/lato-source)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Lato](https://fonts.google.com/specimen/Lato)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Łukasz Dziedzic
|
||||
- **Eigenschaften:**
|
||||
- Eine der beliebtesten Google Fonts
|
||||
- 9 Gewichte (Thin bis Black)
|
||||
- "Lato" = Polnisch für "Sommer"
|
||||
- Warm, freundlich, stabil
|
||||
- **Verwendung:** Beliebte, universelle Sans
|
||||
- **App-Größe:** ~200-300 KB
|
||||
|
||||
#### 8. **Montserrat** (Google Font)
|
||||
- **Quelle:** [GitHub - JulietaUla/Montserrat](https://github.com/JulietaUla/Montserrat)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Montserrat](https://fonts.google.com/specimen/Montserrat)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Julieta Ulanovsky
|
||||
- **Eigenschaften:**
|
||||
- Inspiriert von urbaner Typografie Buenos Aires
|
||||
- 18 Styles (9 Gewichte × 2)
|
||||
- Variable Font verfügbar
|
||||
- Geometric Sans
|
||||
- **Verwendung:** Moderne, geometrische Sans
|
||||
- **App-Größe:** ~200-300 KB
|
||||
|
||||
#### 9. **Nunito Sans** (Google Font)
|
||||
- **Quelle:** [GitHub - googlefonts/nunito](https://github.com/googlefonts/nunito)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Nunito+Sans](https://fonts.google.com/specimen/Nunito+Sans)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Vernon Adams, Cyreal, Jacques Le Bailly
|
||||
- **Eigenschaften:**
|
||||
- Balanced, humanistische Sans
|
||||
- Variable Font
|
||||
- 14 Styles
|
||||
- Freundlich, gut lesbar
|
||||
- **Verwendung:** Humanistische Alternative
|
||||
- **App-Größe:** ~200-300 KB
|
||||
|
||||
#### 10. **Source Sans** (Adobe/Google Font)
|
||||
- **Quelle:** [GitHub - adobe-fonts/source-sans](https://github.com/adobe-fonts/source-sans)
|
||||
- **Google Fonts:** [fonts.google.com/specimen/Source+Sans+3](https://fonts.google.com/specimen/Source+Sans+3)
|
||||
- **Lizenz:** SIL Open Font License 1.1
|
||||
- **Designer:** Adobe (Paul D. Hunt)
|
||||
- **Eigenschaften:**
|
||||
- Adobe's **erstes** Open-Source-Projekt
|
||||
- Variable Font (Source Sans 3)
|
||||
- 12 Gewichte
|
||||
- Professionelle UI-Font
|
||||
- **Verwendung:** **Readeck Web-UI Match** - Adobe-Qualität
|
||||
- **App-Größe:** ~250-350 KB
|
||||
|
||||
---
|
||||
|
||||
### Monospace Font (1 Schriftart)
|
||||
|
||||
#### 11. **SF Mono** (Apple System Font)
|
||||
- **Quelle:** In iOS enthalten
|
||||
- **Lizenz:** Apple proprietär (frei für iOS Apps)
|
||||
- **Eigenschaften:**
|
||||
- Xcode Standard-Font
|
||||
- 6 Gewichte
|
||||
- Optimiert für Code
|
||||
- Unterstützt Latin, Greek, Cyrillic
|
||||
- **Verwendung:** Code-Darstellung, technische Inhalte
|
||||
- **App-Größe:** 0 KB (bereits in iOS)
|
||||
|
||||
---
|
||||
|
||||
## 📥 Download & Installation
|
||||
|
||||
### Schritt 1: Google Fonts herunterladen
|
||||
|
||||
**Empfohlene Quelle: Google Fonts Website**
|
||||
1. Besuche [fonts.google.com](https://fonts.google.com)
|
||||
2. Suche nach jedem Font
|
||||
3. Klicke "Download family"
|
||||
4. Entpacke die `.ttf` oder `.otf` Dateien
|
||||
|
||||
**Alternative: GitHub Repos (für neueste Versionen)**
|
||||
```bash
|
||||
# Lora
|
||||
git clone https://github.com/cyrealtype/Lora-Cyrillic.git
|
||||
|
||||
# Literata
|
||||
git clone https://github.com/googlefonts/literata.git
|
||||
|
||||
# Merriweather
|
||||
git clone https://github.com/SorkinType/Merriweather.git
|
||||
|
||||
# Source Serif
|
||||
git clone https://github.com/adobe-fonts/source-serif.git
|
||||
|
||||
# Lato
|
||||
git clone https://github.com/latofonts/lato-source.git
|
||||
|
||||
# Montserrat
|
||||
git clone https://github.com/JulietaUla/Montserrat.git
|
||||
|
||||
# Nunito Sans
|
||||
git clone https://github.com/googlefonts/nunito.git
|
||||
|
||||
# Source Sans
|
||||
git clone https://github.com/adobe-fonts/source-sans.git
|
||||
```
|
||||
|
||||
### Schritt 2: Fonts zu Xcode hinzufügen
|
||||
|
||||
1. Erstelle Ordner in Xcode: `readeck/Resources/Fonts/`
|
||||
2. Füge `.ttf` oder `.otf` Dateien hinzu (Drag & Drop)
|
||||
3. Stelle sicher: **"Add to targets: readeck"** ist aktiviert
|
||||
4. Wähle für jeden Font nur **1-2 Gewichte** (Regular + Bold), um App-Größe zu minimieren
|
||||
|
||||
**Empfohlene Gewichte:**
|
||||
- **Regular** (400): Fließtext
|
||||
- **Bold** (700): Überschriften, Hervorhebungen
|
||||
|
||||
### Schritt 3: Info.plist konfigurieren
|
||||
|
||||
Füge zu `Info.plist` hinzu:
|
||||
```xml
|
||||
<key>UIAppFonts</key>
|
||||
<array>
|
||||
<!-- Lora -->
|
||||
<string>Lora-Regular.ttf</string>
|
||||
<string>Lora-Bold.ttf</string>
|
||||
|
||||
<!-- Literata -->
|
||||
<string>Literata-Regular.ttf</string>
|
||||
<string>Literata-Bold.ttf</string>
|
||||
|
||||
<!-- Merriweather -->
|
||||
<string>Merriweather-Regular.ttf</string>
|
||||
<string>Merriweather-Bold.ttf</string>
|
||||
|
||||
<!-- Source Serif -->
|
||||
<string>SourceSerif4-Regular.ttf</string>
|
||||
<string>SourceSerif4-Bold.ttf</string>
|
||||
|
||||
<!-- Lato -->
|
||||
<string>Lato-Regular.ttf</string>
|
||||
<string>Lato-Bold.ttf</string>
|
||||
|
||||
<!-- Montserrat -->
|
||||
<string>Montserrat-Regular.ttf</string>
|
||||
<string>Montserrat-Bold.ttf</string>
|
||||
|
||||
<!-- Nunito Sans -->
|
||||
<string>NunitoSans-Regular.ttf</string>
|
||||
<string>NunitoSans-Bold.ttf</string>
|
||||
|
||||
<!-- Source Sans -->
|
||||
<string>SourceSans3-Regular.ttf</string>
|
||||
<string>SourceSans3-Bold.ttf</string>
|
||||
</array>
|
||||
```
|
||||
|
||||
**Hinweis:** Exakte Dateinamen können variieren - prüfe nach Download!
|
||||
|
||||
---
|
||||
|
||||
## 💻 Code-Implementierung
|
||||
|
||||
### Schritt 4: FontFamily.swift erweitern
|
||||
|
||||
**Aktuell:**
|
||||
```swift
|
||||
enum FontFamily: String, CaseIterable {
|
||||
case system = "system"
|
||||
case serif = "serif"
|
||||
case sansSerif = "sansSerif"
|
||||
case monospace = "monospace"
|
||||
}
|
||||
```
|
||||
|
||||
**Neu:**
|
||||
```swift
|
||||
enum FontFamily: String, CaseIterable {
|
||||
// Apple System Fonts
|
||||
case system = "system" // SF Pro
|
||||
case newYork = "newYork" // New York
|
||||
case monospace = "monospace" // SF Mono
|
||||
|
||||
// Google Serif Fonts
|
||||
case lora = "lora"
|
||||
case literata = "literata"
|
||||
case merriweather = "merriweather"
|
||||
case sourceSerif = "sourceSerif"
|
||||
|
||||
// Google Sans Serif Fonts
|
||||
case lato = "lato"
|
||||
case montserrat = "montserrat"
|
||||
case nunitoSans = "nunitoSans"
|
||||
case sourceSans = "sourceSans"
|
||||
|
||||
var displayName: String {
|
||||
switch self {
|
||||
// Apple
|
||||
case .system: return "SF Pro"
|
||||
case .newYork: return "New York"
|
||||
case .monospace: return "SF Mono"
|
||||
|
||||
// Serif
|
||||
case .lora: return "Lora"
|
||||
case .literata: return "Literata"
|
||||
case .merriweather: return "Merriweather"
|
||||
case .sourceSerif: return "Source Serif"
|
||||
|
||||
// Sans Serif
|
||||
case .lato: return "Lato"
|
||||
case .montserrat: return "Montserrat"
|
||||
case .nunitoSans: return "Nunito Sans"
|
||||
case .sourceSans: return "Source Sans"
|
||||
}
|
||||
}
|
||||
|
||||
var category: FontCategory {
|
||||
switch self {
|
||||
case .system, .lato, .montserrat, .nunitoSans, .sourceSans:
|
||||
return .sansSerif
|
||||
case .newYork, .lora, .literata, .merriweather, .sourceSerif:
|
||||
return .serif
|
||||
case .monospace:
|
||||
return .monospace
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
enum FontCategory {
|
||||
case serif
|
||||
case sansSerif
|
||||
case monospace
|
||||
}
|
||||
```
|
||||
|
||||
### Schritt 5: FontSettingsViewModel.swift erweitern
|
||||
|
||||
```swift
|
||||
var previewTitleFont: Font {
|
||||
let size = selectedFontSize.size
|
||||
|
||||
switch selectedFontFamily {
|
||||
// Apple System Fonts
|
||||
case .system:
|
||||
return Font.system(size: size).weight(.semibold)
|
||||
case .newYork:
|
||||
return Font.system(size: size, design: .serif).weight(.semibold)
|
||||
case .monospace:
|
||||
return Font.system(size: size, design: .monospaced).weight(.semibold)
|
||||
|
||||
// Google Serif Fonts
|
||||
case .lora:
|
||||
return Font.custom("Lora-Bold", size: size)
|
||||
case .literata:
|
||||
return Font.custom("Literata-Bold", size: size)
|
||||
case .merriweather:
|
||||
return Font.custom("Merriweather-Bold", size: size)
|
||||
case .sourceSerif:
|
||||
return Font.custom("SourceSerif4-Bold", size: size)
|
||||
|
||||
// Google Sans Serif Fonts
|
||||
case .lato:
|
||||
return Font.custom("Lato-Bold", size: size)
|
||||
case .montserrat:
|
||||
return Font.custom("Montserrat-Bold", size: size)
|
||||
case .nunitoSans:
|
||||
return Font.custom("NunitoSans-Bold", size: size)
|
||||
case .sourceSans:
|
||||
return Font.custom("SourceSans3-Bold", size: size)
|
||||
}
|
||||
}
|
||||
|
||||
var previewBodyFont: Font {
|
||||
let size = selectedFontSize.size
|
||||
|
||||
switch selectedFontFamily {
|
||||
// Apple System Fonts
|
||||
case .system:
|
||||
return Font.system(size: size)
|
||||
case .newYork:
|
||||
return Font.system(size: size, design: .serif)
|
||||
case .monospace:
|
||||
return Font.system(size: size, design: .monospaced)
|
||||
|
||||
// Google Serif Fonts
|
||||
case .lora:
|
||||
return Font.custom("Lora-Regular", size: size)
|
||||
case .literata:
|
||||
return Font.custom("Literata-Regular", size: size)
|
||||
case .merriweather:
|
||||
return Font.custom("Merriweather-Regular", size: size)
|
||||
case .sourceSerif:
|
||||
return Font.custom("SourceSerif4-Regular", size: size)
|
||||
|
||||
// Google Sans Serif Fonts
|
||||
case .lato:
|
||||
return Font.custom("Lato-Regular", size: size)
|
||||
case .montserrat:
|
||||
return Font.custom("Montserrat-Regular", size: size)
|
||||
case .nunitoSans:
|
||||
return Font.custom("NunitoSans-Regular", size: size)
|
||||
case .sourceSans:
|
||||
return Font.custom("SourceSans3-Regular", size: size)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**Wichtig:** Font-Namen müssen **exakt** mit PostScript-Namen übereinstimmen!
|
||||
|
||||
### Schritt 6: PostScript Font-Namen ermitteln
|
||||
|
||||
Nach dem Import der Fonts, teste mit:
|
||||
```swift
|
||||
// In einer View, temporär hinzufügen:
|
||||
let _ = print("Available fonts:")
|
||||
for family in UIFont.familyNames.sorted() {
|
||||
let names = UIFont.fontNames(forFamilyName: family)
|
||||
print("Family: \(family) - Names: \(names)")
|
||||
}
|
||||
```
|
||||
|
||||
Suche nach den exakten Namen wie `Lora-Regular`, `Literata-Bold`, etc.
|
||||
|
||||
### Schritt 7: FontSelectionView.swift optimieren (Optional)
|
||||
|
||||
Gruppiere Fonts nach Kategorie:
|
||||
```swift
|
||||
Section {
|
||||
Picker("Font family", selection: $viewModel.selectedFontFamily) {
|
||||
// Apple System Fonts
|
||||
Text("SF Pro").tag(FontFamily.system)
|
||||
Text("New York").tag(FontFamily.newYork)
|
||||
|
||||
Divider()
|
||||
|
||||
// Serif Fonts
|
||||
ForEach([FontFamily.lora, .literata, .merriweather, .sourceSerif], id: \.self) { font in
|
||||
Text(font.displayName).tag(font)
|
||||
}
|
||||
|
||||
Divider()
|
||||
|
||||
// Sans Serif Fonts
|
||||
ForEach([FontFamily.lato, .montserrat, .nunitoSans, .sourceSans], id: \.self) { font in
|
||||
Text(font.displayName).tag(font)
|
||||
}
|
||||
|
||||
Divider()
|
||||
|
||||
// Monospace
|
||||
Text("SF Mono").tag(FontFamily.monospace)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📊 App-Größen-Kalkulation
|
||||
|
||||
### Font-Datei-Größen (Schätzung)
|
||||
|
||||
| Font | Regular | Bold | Total |
|
||||
|------|---------|------|-------|
|
||||
| Lora | 150 KB | 150 KB | 300 KB |
|
||||
| Literata | 180 KB | 180 KB | 360 KB |
|
||||
| Merriweather | 140 KB | 140 KB | 280 KB |
|
||||
| Source Serif | 160 KB | 160 KB | 320 KB |
|
||||
| Lato | 130 KB | 130 KB | 260 KB |
|
||||
| Montserrat | 140 KB | 140 KB | 280 KB |
|
||||
| Nunito Sans | 150 KB | 150 KB | 300 KB |
|
||||
| Source Sans | 150 KB | 150 KB | 300 KB |
|
||||
| **TOTAL** | | | **~2.4 MB** |
|
||||
|
||||
**Optimierung:**
|
||||
- Verwende **Variable Fonts** (1 Datei statt 2): ~40% Ersparnis
|
||||
- Oder nur **Regular** Gewicht: ~50% Ersparnis (aber weniger Flexibilität)
|
||||
|
||||
**Empfohlene Konfiguration:**
|
||||
- Variable Fonts wo verfügbar → **~1.5 MB**
|
||||
- Oder Regular + Bold → **~2.4 MB**
|
||||
|
||||
---
|
||||
|
||||
## ✅ Implementierungs-Checkliste
|
||||
|
||||
### Phase 1: Vorbereitung
|
||||
- [ ] Google Fonts von fonts.google.com oder GitHub herunterladen
|
||||
- [ ] Font-Dateien organisieren (1 Ordner pro Font-Familie)
|
||||
- [ ] Gewichte auswählen (Regular + Bold empfohlen)
|
||||
|
||||
### Phase 2: Xcode Integration
|
||||
- [ ] Ordner `readeck/Resources/Fonts/` erstellen
|
||||
- [ ] Font-Dateien zu Xcode hinzufügen (Target: readeck)
|
||||
- [ ] `Info.plist` mit `UIAppFonts` aktualisieren
|
||||
- [ ] Build testen (Fonts müssen kopiert werden)
|
||||
|
||||
### Phase 3: Code-Änderungen
|
||||
- [ ] `FontFamily.swift` erweitern (11 cases)
|
||||
- [ ] `FontCategory` enum hinzufügen
|
||||
- [ ] `displayName` und `category` Properties implementieren
|
||||
- [ ] `FontSettingsViewModel.swift` aktualisieren:
|
||||
- [ ] `previewTitleFont` erweitern
|
||||
- [ ] `previewBodyFont` erweitern
|
||||
- [ ] `previewCaptionFont` erweitern
|
||||
|
||||
### Phase 4: Testing & Validierung
|
||||
- [ ] PostScript Font-Namen validieren (mit UIFont.familyNames)
|
||||
- [ ] Alle 11 Fonts in Preview testen
|
||||
- [ ] Font-Wechsel in Settings testen
|
||||
- [ ] Font-Persistenz testen (nach App-Neustart)
|
||||
- [ ] Prüfen: Werden Fonts korrekt in Bookmark-Detail angezeigt?
|
||||
|
||||
### Phase 5: UI-Verbesserungen (Optional)
|
||||
- [ ] `FontSelectionView.swift` mit Gruppierung erweitern
|
||||
- [ ] Font-Preview für jede Schrift hinzufügen
|
||||
- [ ] "Readeck Web Match" Badge für Literata, Merriweather, Source Sans
|
||||
|
||||
### Phase 6: Dokumentation
|
||||
- [ ] App Store Release Notes aktualisieren
|
||||
- [ ] `RELEASE_NOTES.md` erweitern
|
||||
- [ ] User-facing Font-Namen auf Deutsch übersetzen (optional)
|
||||
|
||||
---
|
||||
|
||||
## 🔍 PostScript Font-Namen (Nach Installation zu prüfen)
|
||||
|
||||
**Diese Namen können variieren!** Nach Import prüfen mit `UIFont.familyNames`:
|
||||
|
||||
| Font | Family Name | Regular | Bold |
|
||||
|------|-------------|---------|------|
|
||||
| Lora | Lora | Lora-Regular | Lora-Bold |
|
||||
| Literata | Literata | Literata-Regular | Literata-Bold |
|
||||
| Merriweather | Merriweather | Merriweather-Regular | Merriweather-Bold |
|
||||
| Source Serif | Source Serif 4 | SourceSerif4-Regular | SourceSerif4-Bold |
|
||||
| Lato | Lato | Lato-Regular | Lato-Bold |
|
||||
| Montserrat | Montserrat | Montserrat-Regular | Montserrat-Bold |
|
||||
| Nunito Sans | Nunito Sans | NunitoSans-Regular | NunitoSans-Bold |
|
||||
| Source Sans | Source Sans 3 | SourceSans3-Regular | SourceSans3-Bold |
|
||||
|
||||
---
|
||||
|
||||
## 📝 Lizenz-Compliance
|
||||
|
||||
### SIL Open Font License 1.1 - Zusammenfassung
|
||||
|
||||
**Erlaubt:**
|
||||
✅ Privater Gebrauch
|
||||
✅ Kommerzieller Gebrauch
|
||||
✅ Modifikation
|
||||
✅ Distribution (embedded in App)
|
||||
✅ Verkauf der App im AppStore
|
||||
|
||||
**Verboten:**
|
||||
❌ Verkauf der Fonts als standalone Produkt
|
||||
|
||||
**Pflichten:**
|
||||
- Copyright-Notice beibehalten (in Font-Dateien bereits enthalten)
|
||||
- Lizenz-Text beifügen (optional in App, aber empfohlen)
|
||||
|
||||
### Attribution (Optional, aber empfohlen)
|
||||
|
||||
Füge zu "Settings → About → Licenses" oder ähnlich hinzu:
|
||||
|
||||
```
|
||||
This app uses the following open-source fonts:
|
||||
|
||||
- Lora by Cyreal (SIL OFL 1.1)
|
||||
- Literata by TypeTogether for Google (SIL OFL 1.1)
|
||||
- Merriweather by Sorkin Type (SIL OFL 1.1)
|
||||
- Source Serif by Adobe (SIL OFL 1.1)
|
||||
- Lato by Łukasz Dziedzic (SIL OFL 1.1)
|
||||
- Montserrat by Julieta Ulanovsky (SIL OFL 1.1)
|
||||
- Nunito Sans by Vernon Adams, Cyreal (SIL OFL 1.1)
|
||||
- Source Sans by Adobe (SIL OFL 1.1)
|
||||
|
||||
Full license: https://scripts.sil.org/OFL
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🎨 Design-Empfehlungen
|
||||
|
||||
### Font-Pairings für Readeck
|
||||
|
||||
**Für Artikel (Reading Mode):**
|
||||
- **Primär:** Literata (matches Readeck Web)
|
||||
- **Alternativ:** Merriweather, Lora, Source Serif
|
||||
|
||||
**Für UI-Elemente:**
|
||||
- **Primär:** SF Pro (nativer iOS Look)
|
||||
- **Alternativ:** Source Sans (matches Readeck Web)
|
||||
|
||||
**Für Code/Technisch:**
|
||||
- **Monospace:** SF Mono
|
||||
|
||||
### Default-Font-Einstellung
|
||||
|
||||
Vorschlag für neue Nutzer:
|
||||
```swift
|
||||
// In Settings Model
|
||||
var defaultFontFamily: FontFamily = .literata // Matches Readeck Web
|
||||
var defaultFontSize: FontSize = .medium
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Migration & Rollout
|
||||
|
||||
### Bestehende Nutzer
|
||||
|
||||
**Problem:** User haben aktuell `.serif` (Times New Roman) gesetzt
|
||||
|
||||
**Lösung:** Migration in `SettingsRepository`:
|
||||
```swift
|
||||
func migrateOldFontSettings() async throws {
|
||||
guard let settings = try await loadSettings() else { return }
|
||||
|
||||
// Alte Fonts auf neue mapping
|
||||
var newFontFamily = settings.fontFamily
|
||||
switch settings.fontFamily {
|
||||
case .serif:
|
||||
newFontFamily = .literata // Upgrade zu besserer Serif
|
||||
case .sansSerif:
|
||||
newFontFamily = .sourceSans // Upgrade zu besserer Sans
|
||||
default:
|
||||
break // .system, .monospace bleiben
|
||||
}
|
||||
|
||||
if newFontFamily != settings.fontFamily {
|
||||
try await saveSettings(fontFamily: newFontFamily, fontSize: settings.fontSize)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Release Notes
|
||||
|
||||
```markdown
|
||||
## Font System Upgrade 🎨
|
||||
|
||||
- **11 hochwertige Schriftarten** für besseres Lesen
|
||||
- **Konsistenz** mit Readeck Web-UI
|
||||
- **Serif-Fonts:** New York, Lora, Literata, Merriweather, Source Serif
|
||||
- **Sans-Serif-Fonts:** SF Pro, Lato, Montserrat, Nunito Sans, Source Sans
|
||||
- **Monospace:** SF Mono
|
||||
|
||||
Alle Fonts sind optimiert für digitales Lesen und unterstützen
|
||||
internationale Zeichen.
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📚 Referenzen
|
||||
|
||||
### Offizielle Font-Repositories
|
||||
|
||||
**Google Fonts:**
|
||||
- Alle Fonts: https://fonts.google.com
|
||||
|
||||
**Adobe Open Source:**
|
||||
- Source Serif: https://github.com/adobe-fonts/source-serif
|
||||
- Source Sans: https://github.com/adobe-fonts/source-sans
|
||||
|
||||
**Apple Developer:**
|
||||
- SF Fonts: https://developer.apple.com/fonts/
|
||||
- Typography Guidelines: https://developer.apple.com/design/human-interface-guidelines/typography
|
||||
|
||||
### SIL Open Font License
|
||||
- Lizenz-Text: https://scripts.sil.org/OFL
|
||||
- FAQ: https://scripts.sil.org/OFL-FAQ_web
|
||||
|
||||
### SwiftUI Font-Dokumentation
|
||||
- Custom Fonts: https://developer.apple.com/documentation/swiftui/applying-custom-fonts-to-text
|
||||
- Font Design: https://developer.apple.com/documentation/swiftui/font/design
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Nächste Schritte
|
||||
|
||||
1. **Download Google Fonts** (von fonts.google.com)
|
||||
2. **Font-Dateien auswählen** (Regular + Bold empfohlen)
|
||||
3. **Zu Xcode hinzufügen** (readeck/Resources/Fonts/)
|
||||
4. **Info.plist konfigurieren** (UIAppFonts)
|
||||
5. **Code implementieren** (siehe oben)
|
||||
6. **Testen & Validieren**
|
||||
7. **Release**
|
||||
|
||||
---
|
||||
|
||||
**Geschätzte Implementierungszeit:** 2-3 Stunden
|
||||
**App-Größen-Erhöhung:** ~1.5-2.4 MB
|
||||
**User-Benefit:** Deutlich bessere Lesbarkeit & Readeck-Konsistenz ✨
|
||||
Loading…
x
Reference in New Issue
Block a user