How do you accommodate the notch on the iPhone X in your designs?

Hey guys! This is my first time posting on the Figma community, pleasure to meet you all! 😊

So my question is…

If you’re designing a product for a web browser and you want to test it on a phone, how do you personally accommodate for the phones notch and the browser header and footer that would usually be on the page?

When I load my design on a template or on my iPhone, the content goes behind the notch and I’m not sure of the most efficient way to design around this.

• Is it as simple as ading in fake browser headers and footers into every design?
• If so, would you submit designs to developers with these included in, or remove them at the end?

Thanks in advance!
Tom