> "<svg> may not work for people like me who disable javascript. It introduces potential security issues"
SVG works for me with JS disabled (using Firefox on OS-X). Do you have any pointers on when/why SVG wouldn't work without JS?
I looked into it further and I think I'm mostly wrong about <svg>. You can embed javascript into it, but if you don't, then as far as I can tell it works fine for me. Sorry!
That makes sense…and I think that's where the potential security vulnerability comes into play - if you allow untrusted users to upload SVGs, then they could potentially be uploading javascript to your site, offering a vector for XSS. As far as I can tell, adding your own SVGs to your site doesn't open up any novel security issues.
Re:A few HTML tips
by madeofpalk on Wednesday August 24, 2016 @08:48AM
(#12351598)
svg is no more accessible or simple than an icon font.
You have the same resources and APIs (can you call HTML attributes an 'API'?) available to make the usage of icon fonts friendly for screen readers.
SVG is considered more accessible because it's an image, not text. 'f' doesn't mean aeroplane (even though it looks like an aeroplane in a 2010-style graphical font) but img alt="plane" does.
That's an argument for not using an icon font which remaps normal characters but the most common ones use private-use characters which are ignored by screen readers. In which case are these not equally accessible?
<i class="fa fa-globe" aria-label="Picture of a globe"></i>
<img svg="globe.svg" alt="Picture of a globe">
Apologies if this is a massively ignorant question, but isn't the <i> tag an inline text span? In which case, isn't it wrong to have it be empty?
The i element represents a span of text offset from its
surrounding content without conveying any extra emphasis or
importance, and for which the conventional typographic
presentation is italic text; for example, a taxonomic
designation, a technical term, an idiomatic phrase from
another language, a thought, or a ship name.
Using it without text strikes me as a hack, and one that is hostile to usability, among other problems. I understand why it would work, but it's abusing the technology as far as I can tell.
Since I've seen this in at least two comments now, can somebody explain to me why it's not considered an anti-pattern in 2016?
[edit: formatting]
I would agree with that – it's a convention which the FontAwesome project uses for reasons I haven't looked into (I'm assuming not wanting to type 6 more characters).
I use <span> on all of my projects.
Yes but shouldn't a <span> also always have content? Am I missing something here?
There's nothing that requires it to have content, no. Absent other styles, an empty <span> would be invisible and have no effect though.
<svg> may not work for people like me who disable javascript. It introduces potential security issues (in my understanding). It's complex, meaning it's hard to guess how it will interact with tools that want to access the page (like for visually impaired or for other purposes).
I don't like these things, so I'll try to make a stand and not use it. Of course, I only have that luxury because I don't make websites for a living.