How to display a floating window on a web page using Safari

Who I am
Marie-Ange Demory
Author and references

The internet made us hate floating windows. Well, not the Internet, but webmasters and designers who used floating windows intrusion which prevented browsing until some sort of action was performed on them.

A bit of the same thing that happens now with bathrooms that seem to fill the entire screen and above it hiding or hiding the close button as much as possible, so that you make a mistake and click.

Obviously behind it all is the profound disregard for the customer and the content, where the only thing that matters is to generate money, even if it is destroying the experience, loyalty and image of the brand. But that's another topic.

The fact is that floating windows aren't always navigational intrusions, and they can sometimes contain warnings or fields to fill in data that make it imperative to see them in order to get what we need.

I know, the usability makes it almost unbelievable that not everyone has already redesigned their websites to not use these kinds of dialogs, but there are still legitimate websites that use them. And maybe - you never know - one day you will have to log in and have them blocked.

Block (or allow) pop-ups in Safari

When you first open Safari, you have the option in Program Preferences to define what you want to happen when Safari encounters a pop-up (or floating) window. You have to go to the tab Web sites and in the sidebar you will find a bunch of categories on how you want Safari to treat web pages.

Of course, we recommend that you go through each category one by one to find out what options you have and to better understand the system you use, but in this case you have to go all the way to the end, where it says “Pop-windows up”.

As you can see in the image below, when you open Safari for the first time, the “Block and notify” option (bottom right corner) is enabled by default. You can change it to Block or Allow.

As you visit the web pages, the main window will fill up, so you can individually go and change the setting of each.

In this second image you will see how, in alphabetical order, the pages are saved so that you can individually change the setting or, if you wish, change the general behavior of Safari by changing the selection in the lower right corner.

How to know if a pop-up window has been blocked

The warning is so subtle that if you don't pay attention, you are likely to miss it. In the area where the URL (or the address of the web page you are visiting) is displayed, the message “Popup blocked” will appear for a few seconds.

After that time the message will disappear and you will probably be perplexed without understanding why the web is not working. You could also reload the page to see if something didn't work as it should, with identical results.

The reality is that the page displays a dialog box in a window that Safari doesn't display. 

Sometimes Safari offers the option to show the pop-up window

When you click on a link that leads to a floating dialog box, a different message such as “show popup” (which disappears even after a few seconds) may appear instead of “blocked popup”. If you see it and click on it, Safari will allow the window to appear on that occasion (but every time you come back it will block it).

How to change the pop-up window settings for a specific website

While you've probably figured it out on your own already, good practices dictate that you write it down step by step:

  1. From the menu  Safari, select  Pref Renze
  2. click on  Web sites
  3. Scroll down the list  General  to the left
  4. click on  Popup
  5. From the list in the center window, find the page you want to change the setting for
  6. click on  Block and notify and change it to  Allow

This way you create an exception for this specific web page. Yes, it's a bit hidden to be something you discover every now and then and that could very well be on one of the bar menus, but ...

add a comment of How to display a floating window on a web page using Safari
Comment sent successfully! We will review it in the next few hours.