I gårdagens keynote på Apple WWDC fremkom to nye operativsystemer. Den nye MacOS hedder El Capitan efter en rockformation i Yosemite (som er blevet taget af de fleste kommentatorer for at angive, at Apple ser sit næste OS som en mindre, end en større version). MacOS El Capitan, og iOS 9 er nu tilgængelige for Apple-udviklere, vil blive udgivet til offentlig beta næste måned, og vil gå live om efteråret.

Skjult blandt de undervældende annoncer om, at Apple betalte ud til en hel del lande (Canada og Det Forenede Kongerige) og Apples streaming musik service, var en række spor om, hvordan Apple ser på nettet og Safari's rolle, der udvikler sig i de kommende år ...

1) Scroll snapping

En af de største annoncer for webdesignere er implementeringen af ​​CSS scroll snapping. Scroll snapping - som i øjeblikket opnås med JavaScript - er en metode til justering af lempelsen på en rulle, så rullen snaps til en foruddefineret position. Hvis du nogensinde har rullet en enkelt side side, der glider til næste afsnit, i modsætning til et vilkårlig antal pixels, har du oplevet scroll snapping.

Apple forventer, at tendensen til sider med enkelt sider ... fortsætter

Det er en indikation på, at Apple forventer trenden for enkeltsider, med sektioner, der fylder hele visningsporten, for at fortsætte uformindsket.

Safari 9 introducerer følgende CSS -scroll-snapegenskaber : -webkit-scroll-snap-type, -webkit-scroll-snap-point-y, -webkit-scroll-snap-point-x, -webkit-scroll-snap-destination, og -webkit-scroll-snap-koordinat.

Da scroll snapping stort set ses som en progressiv forbedring, kan det snart være praktisk at skifte denne effekt fra JavaScript til CSS.

2) Pinned sites

Safari 9 introducerer pinned sites. Pinned sites er en måde at holde dine yndlingswebsteder åbne i browseren for hurtig adgang uden at lade en fane faktisk være åben. Hvis du vil bruge pinned sites i Safari 9, skal du blot trække en åben fane til venstre og et lille ikon oprettes i bogmærkebjælken, så du hurtigt kan få adgang til siden.

Brugere vil utvivlsomt forvente at bruge denne funktion, så alle websteder skal være forberedt. For at være klar er alt, du behøver at lave, et ikon: gør det solidt sort, med en gennemsigtig baggrund og gem den som en SVG. Du kan derefter linke til ikonet i hovedet på dit HTML-dokument, som sådan:

Hvis du vil farve ikonet for at matche dit mærke, skal du tilføje dette metatag umiddelbart efter det:

3) HTML5 videoforbedringer

Safari 9 introducerer et par forbedringer til HTML5 video.

Airplay tillader brugerdefinerede kontroller til HTML5 medier. Ved hjælp af JavaScript kan du opdage Airplay tilgængelighed og hvor det er muligt (dvs. i Safari 9) levere brugerdefinerede kontroller. Ideel til alle andre, der er trætte af standardkontrol, bryder brandkonsistensen.

PiP (Picture in Picture) er en videoformat, der bruges i vid udstrækning på tv. PiP indebærer at afspille en video i hjørnet af skærmen, mens andet indhold ses andetsteds gennemsøger kanalguiden på en Tivo-boks, mens den aktuelle kanal spiller i hjørnet, er et godt eksempel.

Safari 9 introducerer PiP er en utrolig innovation for alle, der kan lide at se live events (som Apple WWDC keynote), mens de rent faktisk arbejder. Imidlertid er PiP ligesom de fleste teknologier åbne for misbrug; du vil sandsynligvis se de første PiP-annoncer dukker op i hjørnet af din browser i de næste 6 måneder. Heldigvis indeholder Safari 9 også muligheden for at dempe al lyd på tværs af alle faner med et hurtigt klik.

4) Force touch events

Apples nye MacBooks-funktion styrer styrespor trackpads der opdager ikke kun vandhaner, men den kraft, som du trykker på. Safari 9 introducerer flere nye JavaScript-begivenheder - ironisk klassificeret som musevents - for at håndtere funktionen: webkitmouseforcewillbegin, webkitmouseforcedown, webkitmouseforceup og webkitmouseforcechanged.

Force touch events er kun sandsynligvis nyttige til supplerende navigation på dette tidspunkt, da teknologien ikke kun er software, men også hardware, begrænset. Men hvis de bruges som en progressiv forbedring, åbner de nogle interessante muligheder, især inden for spil og eksperimentelle UI-design.

5) SFSafariViewController

Ved første øjekast synes SFSafariViewController at være mere interesseret for appdesignere end webdesignere. Det vil tillade apps at vise webindhold i en app ved hjælp af Safari's gengivelse.

Designet til strømlining af scenarier som f.eks. Åbning af en indbygget app og oprettelse af en konto på en virksomheds webside, før den vender tilbage til en app for at logge ind på kontoen, er den væsentlige ting om SFSafariViewController, der gør det muligt for web, snarere end indfødte at være keystone i et virksomheds online-systemer. Det er et lille stykke software, der gnister et meget stort skridt i retning af tættere integration af indfødte og web.

6) ECMAScript 6

JavaScript er et skridt tættere på at blive det OOP-sprog, som det virkelig burde være

JavaScript-udviklere vil være begejstrede for at lære at Safari 9 indeholder fuld understøttelse af klasser, beregnede egenskaber, svage sæt , tallobjektet , oktal og binære bogstaver, symbolobjekter og skabelonbogstaver. Denne støtte betyder, at JavaScript er et skridt tættere på at blive det OOP-sprog, som det virkelig burde være i øjeblikket.

7) CSS-filtre

CSS-egenskaben for baggrundsfilter er blevet tilføjet til Safari 9. Blur, lysstyrke, kontrast, drop-shadow, gråtoner, hue-rotere, inverter, opacitet, mætning og sepia- filtre er alle tilgængelige.

8) Udviklertilstandsopdateringer

Responsive design mode er blevet introduceret i Safari 9 som en måde at give hurtig skift af layouter på tværs af forskellige visningsporte. Alle Apple-enheder er inkluderet som forudindstillinger, men det er mere et nyttigt præsentationsværktøj til klientmøder end et dev-værktøj, da bedste praksis favoriserer indhold, i modsætning til visning, breakpoints. Det er vigtigt at bemærke, at responsiv design mode kun ændrer visningsporten, det simulerer ikke forskellige enheder. Det kan være nyttigt som en hurtig test, når nye Apple-enheder bliver lanceret, før enhedssimulatorer indhenter.

Webinspektøren er blevet omdesignet. Sammen med nogle UI-tweaks for at forbedre UX er der større vægt på rammegengivelse og ydeevne.

9) Unprefixed CSS

Nogle opdateringer er mere velkommen end andre. En af de mest velkomne, men mindre tilbøjelige til at blive bemærket, er at droppe browseren præfikser til over 45 CSS egenskaber. Selvom det ikke gør det på kort sigt med gamle browsere, der stadig er i brug, slipper de tidligere browsere præfikser, jo hurtigere vil vi sige farvel til dem for godt.

Det vigtigste for at gå uden præfiks er flexegenskaberne , overgangsegenskaberne , transformationsegenskaberne og animationsegenskaberne .