SitePoint Sponsor

User Tag List

Results 1 to 17 of 17
  1. #1
    SitePoint Member
    Join Date
    Apr 2006
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Web Forms & Pop-up blockers

    The number of customer contacts indicating that they can't use our forms because of their security settings has increased.
    I've seen a number of sites offering tutorial information on how to set their spam filters toallow pop-ups, however we would like to offer our forms in the parent window to ensure nothing is missed.
    Would anybody know of any major websites that have built their forms like this? Or any articles on best practice to mitigate forms being blocked by spam filters?

  2. #2
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Why are you making them use pop-up's in the first place, the very nature of using popup windows is obtrusive, inaccessible and damaging to usability. It's very simple to have forms which don't use popup's, simply have all the required components that need to be filled in on the one page.

  3. #3
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Would anybody know of any major websites that have built their forms like this?
    If you want to see forms that work for everyone, just look at any successful online retailer. Amazon for example. I have no scripts on and I guess my FF blocks popups (I never changed whatever settings it has, I think it blocks by default tho I have no plug-ins for popups), but Amazon's forms work just fine for me. Possibly they work "better" or quicker or prettier for those with scripts, or maybe I wouldn't have to fill stuff out as much, but it works. One of these days I'm going to try out ordering in Lynx : )

    If you have a popup you want for pretty effects, consider a Javascripted extra, something like a lightbox, to present it instead of an actual popup. When I have scripts on, lightboxes seem to work fine (if slower than just going to the image itself, lawlz) and popup blockers don't seem to consider them popups.

    Like a lightbox, if the user has no scripts they just have either another GET request (they can always hit their back buttons if they don't want to go through with it) or have the part of the form on the page by default. Those with scripts on may get a more cleaned-up-looking page and goofy lightbox-type effects. Nothing wrong with that.

    Another thing to keep in mind with forms is, try to keep all text, explanations and links outside the form. I've goofed this up pretty bad rewriting an existing form which had links and onclick explanitory text already in the form, and we ended up with a lot of target=blank links. Basically it was bad design. Those things should have all just been in front of the form.

    If customers need to read something before filling out a question, and it's more than a few lines of text, then best to have them read that before answering the form. Of course, users don't read instructions, ever, and so your error-handling will have plenty of explanations as well, and you must have an excellent filtering system on the back end.

  4. #4
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Lightbox, yesss precious.

  5. #5
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    We hateses the lightboxes. HATESES THEM.

  6. #6
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by AlexDawson View Post
    Why are you making them use pop-up's in the first place, the very nature of using popup windows is obtrusive, inaccessible and damaging to usability. It's very simple to have forms which don't use popup's, simply have all the required components that need to be filled in on the one page.
    I agree, also it beats my why authors would even chance having important information in a popup when it could be blocked.

  7. #7
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,862
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    We hateses the lightboxes. HATESES THEM.
    There are places where a lightbox has its uses but most of the places I have seen them used it would have been better to just include the info in the main page.

    One example of a site taking a backward step with their form processing it Twitter where their login form used to be a part of their main page but now operates as a popin script or as a separate page for those who don't have JavaScript - in botrh cases they have made it a longer process to be able to login than it was before. Stupid, stupid, stupid.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  8. #8
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Off Topic:

    I loathe lightboxes; usually because they are inappropriately deployed and get in the way, or on the website they don't mention the fact they'll be be using one. Plus
    they aren't that accessible.

  9. #9
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Lightboxes are actually useful and it's wrong to claim them as inaccessible, as long as the information can be accessed with scripting disabled (I have yet to see a lightbox which doesn't allow this) it's perfectly fine to load the information using such a method. I am actually using them in my new look website to load "micro-profiles" for each project I have undertaken so they have their own dedicated project page built within the single page design.

  10. #10
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    I am dyslexic; and yes I find them slightly esoteric (please note I didn't say they were totally or technically inaccessible) whether or not they function with or without JavaScript is basically irrelevant. If you don't warn the user you are placing barriers there...

    Hopefully, that clears that up and was why I placed it within an off-topic rather than directly.

  11. #11
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Actually lightboxes as they come "out of the box" tend to have some accessibility issues, which are usually easily fixed but it's more a matter of, people just dl them and use them without fixing them.

    I did just read an article recently about making them more accessible (if/when they open, have the focus go first to a "close" button... setting when the Back button goes back to the page where the lightbox was first opened or to the previous X shown in the lightbox (depending on what makes sense for your setup) etc).

    Hm, I don't think it was Roger's site itself but I know I read the mondaybynoon page:
    http://www.456bereastreet.com/archiv...accessibility/

  12. #12
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Actually I think the accessibility advantages of lightboxes tend to outweigh the dangers, as long as you try to ensure that the lightbox itself isn't a barrier (by making the ability to remove it easy, by enabling it to work without scripting and by making sure it's laid out in such a method that it won't inhibit navigation - along with the stuff stomme poes has mentioned) it can be an aid to accessibility. Take people who suffer from attention disorders, lightboxes actually have a positive effect on that highly manipulatable (visually) group of individuals as it's focus and fading of background components gives those people less to distract them on the canvas which means they are more likely to be able to read the content without being affected by other components on the page.

  13. #13
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    I tend to lump them together with the whole direction the web is going:
    make a web site act like a desktop application.

    Lightboxes are totally imitations of what Ubuntu does when it is asking you for a root password or administration rights. I'm sure Windows has something similar. People like the effect because it says "the only thing that you should be looking at right now is this light part right here".

    I'm not sure I'm going to benefit from people trying to make my browser act like a web app (at least until JS gets fully compiled and HTML5 makes browsers act like servers, bleh). Lightboxes are always slower, and I really notice it when I actually turn javascript on and see how much longer I have to sit and wait for the damn picture to load. I do like the ones that have built-in gallery buttons tho: those are so much easier to work with then clicking on a thumb, seeing an image full-size, then hitting the back button and trying to remember which one you've already seen.
    If I know a site has a lightbox, but one with next and prev buttons, I will turn on JS for the lightbox feature. Otherwise I won't.

    Off Topic:

    I haven't figured out how to turn JS off in Chrome for Unix. wtf? There are like hardly any controls on that browser.

  14. #14
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Going onto the previous tangent let's consider Lightboxes more closely as it interests me more than such unproductive-nonsense as; "Do you write your HTML or CSS first?" has turned into.

    Plus I am only slightly dyslectic or dyslexic, whichever way you want to spell the word. However, within the UK there are approximately 1 in 10 people with dyslexic-like syndromes so I have a slighter better insight into some issues.

    Form my experience of dealing with people on-line with Attention-deficit Hyperactivity Disorder (ADHD). That is more a "neurological description" than an actual disability (depending upon country) is that the Lightbox is very unlikely to aid them significantly.

    However, it clearly alters the page to such an extent that it "forces the user" to focus on the box and restricts them from easily interacting with the rest of the page. That in itself can cause various reading problems and can create confusion in some users as to how to remove the box.

    If you click upon an Image Light box surfing 'without images turned on' you may get nothing but a completely dark page (with no indication of how to remove the darkness) again hardly ideal.

    Once activated; by 'default' if you want to close the window via the TAB key it means you have to tab through a WHOLE page while the focus is plunged into darkness. This will result in another "barrier" to the 'keyboard user' assuming they haven't been implemented correctly this also will effect some users with Cognitive disabilities or even Visual.

    Then we have the non standard 'close' button, which again possibly causes issues with assistive technologies.

    Has anyone got an example of a Lightbox in normal context (not a demo) that they would consider truly accessible or has been nicely implemented?

    Because so far I haven't come across one than hasn't annoyed me or caused an issue; they may be a nice idea but they certainly result in "creating barriers" even if considered small by some.

  15. #15
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    Keeping to this very interesting tangent on the (usual) popup message thread... Don't take this as something against you but you probably shouldn't state things like "I have a slightly better insight" as it sounds slightly egotistical. As it's relevant to the conversation I am, myself dyslexic and spent my school days in "special needs" classes because it seriously affected my work. As it's also relevant (to the topic) I also have experience with working with people with such needs. I studied health and social care and psychology at college, spent some time as part of the course working in a range of environments such as schools with mixed needs pupils as a teaching assistant, day care centres and a care home with elderly or disabled individuals and in a hospital environment. So I have some relevent experience personally and otherwise (excluding my current job role in user-experience, accessibility and usability engineering) which is partly where my viewpoint has been correlated.

    While I agree that disorders such as ADHD are neurologically descriptive rather than what would commonly qualify as a disability, I see any contributing factor which is related to how the human body works (physically, intellectually, emotionally or socially) as qualified to be considered in the context of the web as a disability. It might be a broad stroke definition but it works, for instance emotional problems (such as aggression or stress) isn't technically a disability yet it can be debilitating to the sufferer to the point they become unable to make rational decisions (and on the web this is a very important point). As such anything you can do to aid people suffering those sorts of problems qualifies in the context of web accessibility. Back to the case in point for ADHD, many people who suffer attention disorders are (as such) easily distracted (obviously), the lightbox by fading the surrounding region gives that person a set of guidelines to "focus" their attention to what appears in the foreground by giving it such added emphasis. That assistance with focus can be a useful tool in helping someone stay on track with their progression through the website. Giving someone with ADHD a whole playground of choice can prove distracting and under any other circumstance, they could find themselves diverting from their primary goal. Removing the box can of course be an issue if they use the jQuery style closure method however if a button which looks and acts in the same way as a window (in your OS) was presented in the conventional location, this would provide a closure convention which meets practical usability guidelines. Also there is no reason why you should use lightboxes only for images (I have used them to show modular dialog boxes with content) and as they act in the same way as an applications dialog box it follows a well established route of conventional design. I actually do agree with the issue about the TAB keys and to counter this it might be prudent when offering a lightbox to have the close button appear after the content in the lightbox so once the lightbox event is triggered, it naturally tabs through the contents of that lightbox and then reaches close (in reading order), you should also provide a skip-link for those not interested in it's contents (which helps screen reader users). I do understand your perspective however I think the issue with lightboxes have nothing to-do with what they actually achieve but how people currently implement them. I believe they could be made accessible (like anything else) and as such I consider them as a feasible option for users with varying needs.

    I have ironically been working on a pure CSS lightbox (which has a bit of JavaScript because unfortunately IE doesn't support CSS3 effectively) but it works by using anchor links and the target pseudo selector. This I believe is pretty accessible because it uses fragment links to launch the event (skip link to the segment for screen readers), the tabs are of course relational as the information appears in the document flow right where it would naturally occur and the close button appears at the end of the container element so when it's triggered it'll jump back to where it was referenced (which is good if you apply an ID to the anchor as then it'll read where it left off!), not only this but as it uses anchor links, its bookmark and back button friendly. My implementation is pretty rough at the moment but I can't see why it wouldn't be considered accessible (though currently I do admittedly have the close mechanism set to just clicking anywhere outside the dialog box - not explanatory but gives a much wider click region for motor impaired users). I think the problem is whatever audience you try to assist, other's get counterbalanced so it's a never ending battle. Either way it works, it's pretty clean (HTML, CSS) and it's not dependant on scripting for the general consensus of people... At least I'm trying!

  16. #16
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    I could have sworn I've seen one of those, though without JS help for the, uh, "less abled" browsers.

  17. #17
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    [...] Don't take this as something against you but you probably shouldn't state things like "I have a slightly better insight" as it sounds slightly egotistical.
    Don't worry I wasn't referring to you (Alex) or anyone in particular what I was referring to was first-hand experience helps to give a "slightly better insight" - not that you become "magically" more knowledgeable on the subject - because you don't! Does that paragraph make any sense?

    Off Topic:

    My writing style is sometimes considered "caustic" but isn't meant to be. It took them until University before I was diagnosed so the result is I have a weird writing style.


    In fact unfortunately you got the totally wrong end of the stick regarding my paragraph [1] and [2]. We both know it is irrelevant whether or not you have a (dis)ability with regards for the need for "web accessibility". We were actually singing from the same sheet.

    So rather than get both our wires mixed up [again] shall we ignore we both misunderstood each other? As I see you took offence by my selection of words they weren't meant to read as "condescending" if you knew me better you wouldn't have come to the above conclusion.

    I think the issue with lightboxes have nothing to-do with what they actually achieve but how people currently implement them.
    I'd agree mostly with that since that's what I hinted; that people were just using them "because they can" and they aren't "so-called evil pop-ups".

    However, at the moment we can control pop-ups far better than we can control - prevent - Lightboxes (as with regards to the user(agent)).

    I believe they could be made accessible (like anything else) and as such I consider them as a feasible option for users with varying needs.
    I didn't discount that but in their current state it is seriously worrying I could find those drawbacks within seconds and probably more if I tried.

    I have ironically been working on a pure CSS lightbox [...]At least I'm trying!
    Send me a copy - seriously (and that is NOT meant to read as a challenge).

    Shall we close the case as I think we have agreed they have drawbacks but you have evaluated some of them slightly different to me.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •