Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Two questions about the <a> element #26

Closed
tigt opened this issue Oct 2, 2015 · 11 comments
Closed

Two questions about the <a> element #26

tigt opened this issue Oct 2, 2015 · 11 comments

Comments

@tigt
Copy link

tigt commented Oct 2, 2015

1. Are links allowed to be nested?

https://svgwg.org/svg2-draft/linking.html#Links

The ‘a’ element may contain any element that its parent may contain, except itself.

And then its content model description states it can contain <a> elements. Am I misunderstanding the spec? If the ability to nest links is being removed, why?

2. Should the <a> element gain the additional attributes it has from HTML?

In particular:

  • rel has a very popular use with the nofollow value
  • download
  • referrer

type, hreflang, and media are rather useless, but leaving them out while allowing the above would be a bit inconsistent.

@nikosandronikos
Copy link
Member

@heycam
Copy link
Contributor

heycam commented Jan 30, 2016

For 1., the HTML spec has an authoring requirement that <a> elements are not nested, so I think we should do the same.

@heycam
Copy link
Contributor

heycam commented Jan 30, 2016

Regarding the action, quick testing shows that in HTML the inner link is activated, so again I think we should just require that.

@nikosandronikos
Copy link
Member

Think I'm missing some terminology here.
What do you mean by activated? That the inner link is treated as a well formed link and not ignored? That's what I'm seeing, but it seems to contradict making the requirement that not be nested.

@heycam
Copy link
Contributor

heycam commented Feb 18, 2016

Activated as in when you click it it's that element's href that is navigated to.

@nikosandronikos
Copy link
Member

RESOLUTION: the content model of the a element in SVG will allow nested a elements
https://www.w3.org/2016/02/18-svg-minutes.html#item02
Decision based on the following points:

  • This is a useful semantic tool and there's no reason to forbid it
  • Browsers do support this even though the HTML spec disallows nested a elements so interop already exists

The plan is also to bring the other attributes onto the SVG a element.

@AmeliaBR
Copy link
Contributor

Looking again at @heycam's test. I'm assuming the reason the nested link is inserted by script is because the HTML 5 parser would treat this as an authoring error, and close off the outer link when you start the inner link. So I don't think that should really be used as an example of "it works in HTML, so it should work in SVG".

That said, the HTML 5 parser is much less fussy once it gets to SVG, so if we say it is OK, it's OK. It is definitely useful to be able to define an image map with specific link regions as well as a generic "background" link. (Although that doesn't require nested links, it could be done simply with layering.)

@AmeliaBR
Copy link
Contributor

AmeliaBR commented Jun 22, 2016

Test case for SVG links inside links: http://jsbin.com/nidixomute/1/edit?html,output
Variation with focus styles: http://output.jsbin.com/quvuyaxace/1

Currently, Chrome and Safari do not render the content inside the nested link (the orange ellipse is visible, no blue link to the GitHub issue). Firefox, Edge, and Batik Squiggle render the blue ellipse and link it as specified by the nested <a>; they also have no problem with the tab order (nested link comes after outer link). rSVG and Inkscape also render the blue, although Tav said the nested links seemed to confuse element selection dialogs.

Technically, Chrome & WebKit are correct by SVG 1.1: don't render SVG elements that are in places they don't belong, and don't put a link inside a link. However, given the lack of compatibility, I don't see a problem with making the Firefox/Edge/etc behavior correct for SVG 2.

@AmeliaBR
Copy link
Contributor

On adding attributes: the whole purpose is consistency with HTML, but we already have an existing inconsistency that href and target are implemented on SVGAElement as animated strings, so the IDL is of the form linkElement.target.animVal = "_blank".

Which means either I introduce the new properties in a way that's inconsistent with HTML (make them also animated string) or inconsistent with the existing properties).

@AmeliaBR
Copy link
Contributor

Closed by 33f85d2

I made the new IDL attributes consistent with the old SVG ones; see #175 for a possible way to address this mess.

I added a "at risk" warning for nested links. I'm worried it could cause problems in the accessible representation.

@AmeliaBR
Copy link
Contributor

Important: The resolution above about "allowing nested links" was revised based on accessibility testing:
#178 (comment)

Current advice (and SVG 2 spec) is that the nested link should render but would not be treated as an actual link.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants