A mobil eszközök már sok webhely óriási részét, ha nem is többségét képviselik az online olvasói körből, ezért alapvető fontosságú annak biztosítása, hogy webhelye megfelelő kinézetet és megfelelő működést biztosítson egy iPhone-on vagy táblagépen. Számos olyan szolgáltatás kínál mobil elrendezési előnézeteket egy adott URL-hez, de az Apple sokkal könnyebbé tette a webhelyek mobilkészülékének tesztelését a Safari 9 segítségével az OS X El Capitanban. Az Responsive Design Mode elnevezésű új funkció gyorsan áttekintheti a webhely kinézetét számos különféle Apple-eszközön, valamint a közös mobil képernyőfelbontást. Így működik.
Fontos megismételni, hogy a Responsive Design Mode egy új szolgáltatás, amely kizárólag a Safari 9-hez tartozik az OS X El Capitanban, ezért a böngésző és az operációs rendszer legalább ezeknek a verzióinak a futtatásához szüksége van. Ha a Mac megfelel ennek a követelménynek, először engedélyeznie kell a Safari Fejlesztői módját. Ehhez indítsa el a Safari szoftvert, és kattintson a menüsorban a Safari elemre. Ezután válassza a Beállítások> Speciális lehetőséget .
A Safari Preferences ablak Speciális lapon jelölje be a „Show Develop Menu in menüsáv megjelenítése” négyzetet. Mivel az opció neve azt sugallja, a Safari menüsor jobb oldalán egy új „Develop” menü jelenik meg. „Könyvjelzők”.
Ezután zárja be a Safari Preferences ablakot, és keresse meg a webhelyet, amelyet adaptív tervezési módban tesztelni szeretne. Miután a webhelyet teljesen betöltötte a böngészőjében, használja a Command-Option-R billentyűparancsot, és a böngészőablak átvált a több mobil eszköz felbontásának előnézetére (a Responsive Design Mode módba akkor is beléphet, ha a Fejlesztés elemre kattint. a Safari menüsor és az Enter Responsive Design Mode kiválasztása).
A Safari Responsive Design Mode segítségével megnézheti, hogyan néz ki egy webhely az Apple összes mobilkészülékén, a 3, 5 hüvelykes iPhone 4S-től a 12, 9 hüvelykes iPad Pro-ig. A felhasználók választhatják az 1x, 2x vagy 3x „Retina” felbontást is, és a böngésző ügynökét megváltoztathatják a legnépszerűbb böngészők, például a Chrome, a Firefox és az Edge viselkedésének utánozására.
Az egyes eszközökre és képernyőméretekre a felhasználók rákattinthatnak az eszközikonra az álló és fekvő tájolás közötti váltáshoz, vagy olyan eszközök esetében, mint például az iPad Air és az iPad Pro, amelyek támogatják a megosztott nézetet, akkor kattintással válthatnak a különféle osztott nézet elrendezések között.
Míg a Safari Responsive Design Mode-ban hiányzik a hasonló, már létező eszközök néhány lehetősége, a közvetlenül a Safariba épített eszköz hatalmas időmegtakarítást jelenthet a webtervezők számára, és nagyszerű tanulási és tesztelő eszköz webhelytulajdonosok számára, akik meg akarják győződni arról, hogy mobil látogatói a legjobb élményt kapják, függetlenül a képernyő felbontásától és méretétől.
Miután befejezte a tesztelést, kiléphet a reagáló tervezési módból a böngészőablak vagy a fül bezárásával, vagy a Command-Option-R parancsikon ismételt megnyomásával.