> Markdown version of [/videos/1173-creating-compelling-cross-device-foldable-experiences-on-the-web?t=247](https://www.wearedevelopers.com/videos/1173-creating-compelling-cross-device-foldable-experiences-on-the-web?t=247). Every page supports `.md` or `Accept: text/markdown`. Links point to the HTML versions so they work for humans too. Agent guide: [/agents.md](https://www.wearedevelopers.com/agents.md).

---

# Creating compelling cross-device foldable experiences on the Web

Are foldables breaking your web layouts? Discover how the new Device Posture and Viewport Segments APIs let you build hardware-aware web experiences without overhauling your existing code.

- **Speakers:** [Matthew Atkinson](https://www.wearedevelopers.com/@matthew-atkinson)
- **Event:** 
- **Published:** August 22, 2024
- **Duration:** 25:38
- **URL:** https://www.wearedevelopers.com/videos/1173-creating-compelling-cross-device-foldable-experiences-on-the-web
- **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/f223fdac55f2c077d9d48cd3fe3d330f/thumbnails/thumbnail.jpg?time=249785ms

## Access

Playback and chapters for this video are available with a Free account.

## Related Moments

- [Adapting web design for foldable devices and wearables](https://www.wearedevelopers.com/videos/100363-wearedevelopers-live-playing-in-production) (from "WeAreDevelopers LIVE - Playing in Production")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/e6f89ca14ebcb8a0344cb9f91636f863/thumbnails/thumbnail.jpg?time=3244273ms
- [Exploring accessibility and responsive layouts across testing environments](https://www.wearedevelopers.com/videos/401-is-flutter-ready-for-the-web-yet-a-live-coding-comparison-between-flutter-and-react) (from "Is Flutter ready for the web yet? - A live coding comparison between Flutter and React")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/3e12007778d15762bd8877316acae318/thumbnails/thumbnail.jpg?time=153500ms
- [Identifying and exploring upcoming web API concepts](https://www.wearedevelopers.com/videos/316-explore-new-web-features-before-everyone-else) (from "Explore new web features before everyone else")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/975394daf8d5a98fa66aca5bb8f14727/thumbnails/thumbnail.jpg?time=220465ms
- [Expanding browser capabilities with modern web APIs](https://www.wearedevelopers.com/videos/289-pwas-in-2021) (from "PWAs in 2021")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/65847ce16c41590ee4ffb1475d8db582/thumbnails/thumbnail.jpg?time=79165ms
- [Understanding Interop 2025 and new CSS capabilities](https://www.wearedevelopers.com/videos/1299-new-browser-apis-end-of-react-create-app-smuggling-data-in-emoji-and-more-with-rowdy-rabouw) (from "New Browser APIs, End of React Create App, Smuggling Data in Emoji and more with Rowdy Rabouw")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/f7ee00d0ed3938cf179760e48c610492/thumbnails/thumbnail.jpg?time=369865ms
- [Strategies for keeping up with advanced CSS evolution](https://www.wearedevelopers.com/videos/835-what-s-new-in-css-for-designers) (from "What's new in CSS for Designers?")
  - **Thumbnail URL:** https://customer-goifxnzhrq3d0d54.cloudflarestream.com/42d7b191407a97170b9d975007c90bbd/thumbnails/thumbnail.jpg?time=130245ms

## Related Articles

- [Dev Digest 133 - Back to Front](https://www.wearedevelopers.com/magazine/474-dev-digest-133-back-to-front)
- [Dev Digest 139 - Soft and hard queries](https://www.wearedevelopers.com/magazine/487-dev-digest-139-soft-and-hard-queries)
- [Dev Digest 128 - Do not Google Monopoly](https://www.wearedevelopers.com/magazine/465-dev-digest-128-do-not-google-monopoly)
- [Declarative Design and a fresh take on collaboration with developers](https://www.wearedevelopers.com/magazine/595-declarative-design-and-a-fresh-take-on-collaboration-with-developers)

## Related Jobs

- [Product Designer, Web3 Fintech & AI Prototyping](https://www.wearedevelopers.com/jobs/ext/3903006-product-designer-web3-fintech-ai-prototyping) at **Bitpanda**
- [Staff Engineer - Web Platform](https://www.wearedevelopers.com/jobs/ext/3243034-staff-engineer-web-platform) at **Intercom, Inc.**
- [Senior Software Engineer, Angular (B2C Web Platform)](https://www.wearedevelopers.com/jobs/ext/3988925-senior-software-engineer-angular-b2c-web-platform) at **Bitpanda**
- [Senior Mobile Engineer-iOS](https://www.wearedevelopers.com/jobs/48539-senior-mobile-engineer-ios) at **Expedia**
- [Senior AI Frontend Engineer](https://www.wearedevelopers.com/jobs/ext/2552851-senior-ai-frontend-engineer) at **TeamViewer Germany GmbH,**
- [Senior Web Developer BundesMessenger](https://www.wearedevelopers.com/jobs/ext/3601840-senior-web-developer-bundesmessenger) at **BWI GmbH**