3 ms·

"Ugly" might not be the best one-word description but there are a lot of basic accessibility issues with the Django admin. The general user experience could als

"Ugly" might not be the best one-word description but there are a lot of basic accessibility issues with the Django admin. The general user experience could also really benefit from using more modern design patterns (for example modal windows over pop-up windows).

modo_mario 3y ago
Why would modal windows be better than pop-up ones?
- ThibWeb 3y ago
  I’d say because you can lose context more easily when having to move to a separate browser tab / window to complete a task? And I suspect the multi-window paradigm is also harder to navigate for keyboard / screen reader users (as opposed to an in-page modal which correctly captures the keyboard focus while open).
  - Nextgrid 3y ago
    Is that a real problem for professional users or just a kluge to work around the ever-decreasing IT skills of today's generation that can no longer do basic things such as window management? I think an OS-managed popup window is superior to a page-managed modal since it allows you to move the window out of the way or even switch away from it, where as a page-managed modal is generally fixed in place, blanks out the parent page, and the only way to get back that parent page would be to dismiss the modal which discards your input. I'm also not sure whether the accessibility concerns are substantiated - surely window management would be a well-trodden path for any screen-reader user and whatever you build yourself in-browser would have different and unexpected semantics that would require the user to get used to it.
Joker_vD 3y ago
But... transition from modals to pop-ups was a part of "going web 2.0" design switch. Now we're going back to modals and hail it as "modern"?
- kccqzy 3y ago
  I think you remembered it wrong. Going from pop-ups was earlier than modals. Pop-ups were supported by things like window.open() which has been around forever (perhaps NetScape 2.0?). In contrast designing a modal requires some slightly more recent CSS like absolute positioning (I believe CSS2 so still within the previous century).
- ThibWeb 3y ago
  Sorry I’m not sure I understand your question? I wasn’t on the internet before web 2.0, by modals I mean things like custom-styled <dialog> element[1] and the `dialog` ARIA role, which I would say are a more recent pattern than pop-up windows. "Modern" might not be the best term here, I should have just said more "usable" perhaps. [1]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog https://developer.mozilla.org/en-US/docs/Web/HTML/Element/di...
  - Joker_vD 3y ago
    From the link you posted: The HTML <dialog> element is used to create both modal and non-modal dialog boxes. Modal dialog boxes interrupt interaction with the rest of the page being inert, while non-modal dialog boxes allow interaction with the rest of the page. The modal dialogs are easier for the programmer to use but they're quite inconvenient because generally, they ask you a question you can answer only by looking at/interacting with the rest of the page. Which you can't do (the modal dialogs on web also almost never can be dragged around).
    - ThibWeb 3y ago
      Gotcha, thank you. The reasons you mentioned are excellent, definitely a pattern that’s best avoided unless there are no other alternatives.
  - Izkata 3y ago
    The term "modal" pre-dates <dialog> by a huge amount, and generally refers to a popup within the same window that prevents interacting with what's behind the popup (I believe the term comes from how you "change modes" when it appears). On the web they used to be implemented using <div> and CSS, often with some sort of javascript library so you didn't have to do it yourself.

modo_mario 3y ago

Why would modal windows be better than pop-up ones?

ThibWeb 3y ago
I’d say because you can lose context more easily when having to move to a separate browser tab / window to complete a task? And I suspect the multi-window paradigm is also harder to navigate for keyboard / screen reader users (as opposed to an in-page modal which correctly captures the keyboard focus while open).
- Nextgrid 3y ago
  Is that a real problem for professional users or just a kluge to work around the ever-decreasing IT skills of today's generation that can no longer do basic things such as window management? I think an OS-managed popup window is superior to a page-managed modal since it allows you to move the window out of the way or even switch away from it, where as a page-managed modal is generally fixed in place, blanks out the parent page, and the only way to get back that parent page would be to dismiss the modal which discards your input. I'm also not sure whether the accessibility concerns are substantiated - surely window management would be a well-trodden path for any screen-reader user and whatever you build yourself in-browser would have different and unexpected semantics that would require the user to get used to it.

Joker_vD 3y ago

But... transition from modals to pop-ups was a part of "going web 2.0" design switch. Now we're going back to modals and hail it as "modern"?

kccqzy 3y ago
I think you remembered it wrong. Going from pop-ups was earlier than modals. Pop-ups were supported by things like window.open() which has been around forever (perhaps NetScape 2.0?). In contrast designing a modal requires some slightly more recent CSS like absolute positioning (I believe CSS2 so still within the previous century).
ThibWeb 3y ago
Sorry I’m not sure I understand your question? I wasn’t on the internet before web 2.0, by modals I mean things like custom-styled <dialog> element[1] and the `dialog` ARIA role, which I would say are a more recent pattern than pop-up windows. "Modern" might not be the best term here, I should have just said more "usable" perhaps. [1]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog https://developer.mozilla.org/en-US/docs/Web/HTML/Element/di...
- Joker_vD 3y ago
  From the link you posted: The HTML <dialog> element is used to create both modal and non-modal dialog boxes. Modal dialog boxes interrupt interaction with the rest of the page being inert, while non-modal dialog boxes allow interaction with the rest of the page. The modal dialogs are easier for the programmer to use but they're quite inconvenient because generally, they ask you a question you can answer only by looking at/interacting with the rest of the page. Which you can't do (the modal dialogs on web also almost never can be dragged around).
  - ThibWeb 3y ago
    Gotcha, thank you. The reasons you mentioned are excellent, definitely a pattern that’s best avoided unless there are no other alternatives.
- Izkata 3y ago
  The term "modal" pre-dates <dialog> by a huge amount, and generally refers to a popup within the same window that prevents interacting with what's behind the popup (I believe the term comes from how you "change modes" when it appears). On the web they used to be implemented using <div> and CSS, often with some sort of javascript library so you didn't have to do it yourself.