Accessify Forum: target="_blank" alternative issue

30 Jan 2007 12:31 am

P: 87

I'll begin by asking why target="_blank" doesn't validate. Is there an accessibility/usability issue? I've tried various browsers and it works splendid. It's an extremely useful feature to keep visitors on your website while still sharing external links (as long as you don't overuse it).
My alternative is window.open(), and I use it in a way that it still opens the links in the same window if JavaScript is disabled. One problem is that it still doesn't open in a new window. The other problem is that the new window is missing the BACK button, FORWARD button, address bar, etc.
I have:

Code:

function newWindow(URL) {
window.open(URL, null, "resizable=yes, top=100, left=100, scrollbars=yes, width=550, height=500, status=yes, menubar=yes, directories=yes");
}
var i;
for (i = 12; i <= document.links.length; i++) {
document.links[i] = document.links[i].setAttribute('onclick', 'newWindow(this.href); return false');
}

I don't know of any parameters to display those buttons. Does anyone know of one that is well supported?
_________________
DJ Music

Share:

Back to Top

30 Jan 2007 12:49 am

lsw

P: 958
L: Juneau Alaska

It is a standards issue. Target was created to have files open is framed segments. So Target only validates when using the Frame DOCTYPE or Transitional DOCTYPEs.

As for the why in using it, you are forcing a new window on people, that is not good. You are overriding a users preferences as we will open links in new tabs or windows as we wish or need,

Forcing new windows can confuse people when it opens behind the window and they do not realize it and it is really iritating when we are reading and it blocks our view.

Many user agents do not support multiple windows - we are beyond simple browsers like IE and Firefox. We have to design for screenreaders, PDAs, Cell Phones, potable game pads like Playstation portable...

In theory at least by forcing a new window, a screenreader could be activated anew and two voices speak out two contents... but I think this can be corrected in preferences.

I hate new windows and open the links I wish in tabs as I wish. If I want to return to your site, I will... either back button or because usually I open links in new tabs.

But if I am just using your site as a jump off point to somewhere else... then i do not wish to remain at your site and you should not force me to.

As designers we should give the user the choice how, when and where they see our content. The web site is for them.
_________________
Kyle J. Lamson
Analyst/Programmer III, State of Alaska
--
LSW-WebDesign.com & DarkShadow-Designs.com

Share:

Back to Top

30 Jan 2007 07:23 am

Bill Posters

P: 993

hypnoticvibe wrote:

Code:

function newWindow(URL) {
window.open(URL, null, "resizable=yes, top=100, left=100, scrollbars=yes, width=550, height=500, status=yes, menubar=yes, directories=yes");
}
var i;
for (i = 12; i <= document.links.length; i++) {
document.links[i] = document.links[i].setAttribute('onclick', 'newWindow(this.href); return false');
}

It's certainly commendable that you're seeking to replace the use of target attribute with something more considerate.

Your script seems a little indiscriminate and seems to aim to open the first 12 links in a new window of 550*500px. Is this really what you're after?
Are these internal or external links? If external, I'd personally refrain from stipulating the size and position of the new window. Omitting this info means the new window is more likely to spawn according to the size and position that the user themselves prefers.
Why only the first 12 links? What's that about?
Are they gallery links?

Anyhoo…

Code:

As authors, the web is for us too. Wink

So long as you leave users the ability to over-ride your defaults, you're doing as much as can reasonably be expected of us.

If the targeted links are external, then it might be a good idea to give the new window a name (second argument of the window.open method). This means that the external links will only ever spawn a single new window. That window will be reused by any subsequent clicks on external links. i.e. you don't potentially keep adding new windows to the users screen.

The above script still applies to all links on a page, but without knowing more about how you intend to implement new windows, it's not possible to make the script more focussed.
If you tell us more about the nature of how and when you wish to apply new windows, then I can tweak the script to accomodate that.

HTH Smile

btw, you might get some joy out of this…
Toggle new windows for off-site links

Share:

Back to Top

30 Jan 2007 08:40 am

Ben Millard

P: 3830
L: Hampshire, UK

Bill Posters wrote:

I'd personally refrain from stipulating the size and position of the new window. Omitting this info means the new window is more likely to spawn according to the size and position that the user themselves prefers.

Indeed. And omitting the new window entirely is more likely to make the link operate how the user themselves prefer.
_________________
My CV type thing and my Life of Ben (Blog). Nigel Peck's Accessify Forum Requirements.

Share:

Back to Top

30 Jan 2007 09:37 am

Bill Posters

P: 993

Cerbera wrote:

Bill Posters wrote:

I'd personally refrain from stipulating the size and position of the new window. Omitting this info means the new window is more likely to spawn according to the size and position that the user themselves prefers.

Indeed. And omitting the new window entirely is more likely to make the link operate how the user themselves prefer.

...assuming they are familiar enough with their options to have a preference - and assuming that it's right to deny authors any say on the subject.

But, that particular topic has been done to death already. Wink

Still, I agree that choice is preferable. If you can make the choice clear to users, then I don't think it's necessary to decide for them (though, providing the options are equally available to the user, I also don't feel there's much harm in it, either).

Share:

Back to Top

31 Jan 2007 06:02 pm

hypnoticvibe

P: 87

Bill Posters wrote:

It's certainly commendable that you're seeking to replace the use of target attribute with something more considerate.

Your script seems a little indiscriminate and seems to aim to open the first 12 links in a new window of 550*500px. Is this really what you're after?

Yes. It is experimental and incomplete, but here's the idea:
My friend's del.icio.us account
My pointless experiment to access it, other than to learn basic PHP
I still have to tweak it for page 1 since it is the only 1 with an 11-link navigation.

Quote:

Are these internal or external links? If external, I'd personally refrain from stipulating the size and position of the new window.[.quote]
External. Thanks for the tip. I'll change that.

Omitting this info means the new window is more likely to spawn according to the size and position that the user themselves prefers.

Quote:

Why only the first 12 links? What's that about?

It targets all after the 12 links because the 12-link navigation is consistent all but 1 page. This is really just for learning/fun.

Quote:

Code:

newWin.focus()

I wasn't aware you could use focus for a whole window. That's awesome. Smile

[code]If the targeted links are external, then it might be a good idea to give the new window a name (second argument of the window.open method). This means that the external links will only ever spawn a single new window.[/quote]
Well, they're generated and vary, so I'll have to make the name of each have a number at the end that increases per iteration - like "link1", "link2"
I can't think of anything better and that seems improper for some reason. Maybe not. What do you think?

Quote:

The above script still applies to all links on a page, but without knowing more about how you intend to implement new windows, it's not possible to make the script more focussed.
If you tell us more about the nature of how and when you wish to apply new windows, then I can tweak the script to accomodate that.

Well, I'm pretty familiar with the bits and pieces. I just didn't know the right technique to employ them. I'll try and improve it based on ideas from your example and a critique is ideal if you think I should do it differently. Thank you for the example.
_________________
DJ Music

Share:

Back to Top

31 Jan 2007 06:29 pm

Bill Posters

P: 993

hypnoticvibe wrote:

Quote:

Why only the first 12 links? What's that about?

It targets all after the 12 links because the 12-link navigation is consistent all but 1 page. This is really just for learning/fun.

Quote:

If the targeted links are external, then it might be a good idea to give the new window a name (second argument of the window.open method). This means that the external links will only ever spawn a single new window.

Well, they're generated and vary, so I'll have to make the name of each have a number at the end that increases per iteration - like "link1", "link2"
I can't think of anything better and that seems improper for some reason. Maybe not. What do you think?

Could you not sub-divide them into a group or list of their own?
That way, you could address them all as anchor children of a specific parent element.

e.g.

Code:

Code:

…

function setAnchors() {

var aEls = document.getElementById('myDynamicLinks').getElementsByTagName('a');

for (var i=0, aEl; aEl=aEls[i]; i++) {
taEl.onclick = function() { newWindow(this.href); return false; }
}

}

…

This way, no matter how many links are dynamically created, the script can always accomodate them.

Share:

Back to Top

31 Jan 2007 07:06 pm

hypnoticvibe

P: 87

There are 2 problems with that method.

The "Earlier" and "Later" buttons are using a separate background image for sliding doors, so unless I use JavaScript or Flash for the rollovers, how can I accomplish that without unique IDs?
On page one, there is only 1 button so it is not a list. I have the link in a p element.

I was thinking maybe:

Code:

var pageNumber = document.URL.substring(indexOf('p=')+2, indexOf('&c'));
if (pageNumber == '1') {
...
}

(not sure if that works but that idea maybe?)
_________________
DJ Music

Share:

Back to Top

31 Jan 2007 07:41 pm

Bill Posters

P: 993

hypnoticvibe wrote:

There are 2 problems with that method.

The "Earlier" and "Later" buttons are using a separate background image for sliding doors, so unless I use JavaScript or Flash for the rollovers, how can I accomplish that without unique IDs?

Tbh, I've never actually dipped into the sliding doors technique, so I'm not too familiar with how that might impact on what you're doing (or what I'm suggesting).
I'm also not entirely sure what you mean by the 'earlier' and 'later' buttons.
Is it possible to see the page online? It would give me a better idea of where you're currently at and a better chance of helping you get where you want to go.

If the 'earlier' and 'later' buttons are the first and last in the list, then that can easily be worked around in the js. It's certainly possible to set the js to exclude the first and last items in the array from whatever function is to be performed.

Fwiw, if you're using a server-side language to dynamically generate the menu items, then it should be relatively simple to slip in unique id attributes for each list item during the menu creation script.

Quote:

On page one, there is only 1 button so it is not a list. I have the link in a p element.

Even with one item, I personally would still mark it up as a list and not lose any sleep over it.
It's part of a dynamic menu, which, more often than not, has multiple items.
I'd feel that it's more appropriate to 'suffer' having one page where the list has only one item than to define a menu item by other means on that one page and thereby create an inconsistency in the semantic nature of the menu/nav across different pages.

Quote:

I was thinking maybe:

Code:

var pageNumber = document.URL.substring(indexOf('p=')+2, indexOf('&c'));
if (pageNumber == '1') {
...
}

(not sure if that works but that idea maybe?)

I'd be reluctant to use js to support a css effect, as the css effect fails if the UA doesn't have js available and enabled.

With a proper look at the current code, I'd hopefully be able to be more helpful in putting forward robust and effective solutions.

Share:

Back to Top

31 Jan 2007 08:04 pm

hypnoticvibe

P: 87

I meant using my code example (the most recent piece of code I posted) for looping through links and making them open in a new window rather than styling.
This is my experiment where I intend to revise the JavaScript.
(It just extracts and changes content from my friend's del.icio.us bookmarks account.)
You'll see what I mean by the "earlier" and "later" buttons.

Quote:

Fwiw, if you're using a server-side language to dynamically generate the menu items

(yes, I am)

Quote:

Even with one item, I personally would still mark it up as a list and not lose any sleep over it.

I'm definitely being too pedantic. Haha.

Quote:

I'd be reluctant to use js to support a css effect, as the css effect fails if the UA doesn't have js available and enabled.

I agree. That's why I'm sticking to sliding doors.
_________________
DJ Music

Share:

Back to Top

01 Feb 2007 12:14 am

hypnoticvibe

P: 87

Quote:

for (var i=0, aEl; aEl=aEls[i]; i++)

I've never seen a comma used like that. How does that work? (I'm assuming it wasn't a typo)
_________________
DJ Music

Share:

Back to Top

01 Feb 2007 06:36 am

Bill Posters

P: 993

hypnoticvibe wrote:

Quote:

for (var i=0, aEl; aEl=aEls[i]; i++)

I've never seen a comma used like that. How does that work? (I'm assuming it wasn't a typo)

You can initialise multiple variables in one var statement by separating them with a comma.

e.g.

Code:

var i=0, aEl, txt='blah', docHead=document.getElementsByTagName('head')[0];

…is simply a more efficient way of writing…

Code:

var i=0;
var aEl;
var txt='blah';
var docHead=document.getElementsByTagName('head')[0]

My approach to creating loops changed after reading this article on techniques to make javascript more efficient…
userjs.org: Efficient JavaScript code

(I'll take another look at the main issue later today, if I get some time.)[/url]

Share:

Back to Top

01 Feb 2007 12:06 pm

hypnoticvibe

P: 87

Thank you. Cool

_________________
DJ Music

Share:

Back to Top

Accessify Forum - Accessibility Discussion

Latest Tweets

Currently Online

target="_blank" alternative issue

Partners