Well, I have come up with a solution to remove the underline from bbc images but not text, or anything else.
Here is a working demo:
http://jsfiddle.net/MadLittleMods/Ln4KG/
The only catch is that you have to put some tag around the plain text nodes like a span tag.
I am trying to come up with the regex to find the plain text nodes and add spans around them but i thought i would just get it out there in case someone can whip up the regex.
why not doing it with css?
<img src="url" class="no_line"....
.no_line
{
border:none;
}
Quote from: Suki on December 24, 2011, 08:04:38 PM
why not doing it with css?
<img src="url" class="no_line"....
.no_line
{
border:none;
}
Go ahead and try(doesn't work):
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Favatars.simplemachinesweb.com%2Fsmf%2Favatar_261314_1304804143.png&hash=14b339ce72096189671b6e4e1b6b5555b2907a4a) (http://visualpulse.net/)
what browser are you using?
http://perishablepress.com/press/2008/10/14/css-remove-link-underlines-borders-linked-images/
Quote from: Suki on December 24, 2011, 08:09:13 PM
what browser are you using?
http://perishablepress.com/press/2008/10/14/css-remove-link-underlines-borders-linked-images/
Chrome 16 - Does on any browser...
That solution does not work this case. That is more targeting links that target images.
@MAS - It doesn't work because the LINK is what has the line, NOT the image. So hacking the image up itself won't do anything, you have to get it at the source.
Here is how to match bbc but we want the opposite. Just posting this for anyone working on the regex:
Normal:
\[(.*?)\](.*?)\[\/\g{1}\]
Relative version:
\[(.*?)\](.*?)\[\/\g{-2}\]
Named version:
\[(?'tag'(.*?))\](.*?)\[\/\g{tag}\]
Quote from: MLM on December 24, 2011, 08:07:15 PM
Quote from: Suki on December 24, 2011, 08:04:38 PM
why not doing it with css?
<img src="url" class="no_line"....
.no_line
{
border:none;
}
Go ahead and try(doesn't work):
(https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Favatars.simplemachinesweb.com%2Fsmf%2Favatar_261314_1304804143.png&hash=14b339ce72096189671b6e4e1b6b5555b2907a4a) (http://visualpulse.net/)
That's a linked image. The underline is coming from the link, not the image itself. It's still an easy fix though...
a img
{
border: 0;
}If that doesn't work, try this:
a img
{
text-decoration: none;
}
Neither of those work, Oldies. The fix isn't that simple, or it would have been included in SMF 2.0.
Quote from: Oldiesmann on December 28, 2011, 12:13:31 PM
That's a linked image. The underline is coming from the link, not the image itself. It's still an easy fix though...
a img
{
border: 0;
}
If that doesn't work, try this:
a img
{
text-decoration: none;
}
That does not work because it targets the img not the a.
The simplest fix I've found is to use javascript and to see if the only child node of those links is an image. If it is then remove the border and if not leave it be.
Quote from: Thantos on December 28, 2011, 04:43:52 PM
The simplest fix I've found is to use javascript and to see if the only child node of those links is an image. If it is then remove the border and if not leave it be.
Why not have it so it works for everyone without js. All you have to do is use my solution and use some regex to put <span> tags around plain text.
Hmm, so revisiting this.
It doesn't seem to have been a major issue, mostly just an aesthetic one - and honestly, there is value to knowing that an image can be clicked on.
Splicing in span tags everywhere in links is not actually a good idea. There are other considerations like SEO at work (more tags, especially in links, is not smart)
I don't know what to do for the best on this one. I'm tempted to chalk it up to 'not a big deal' but I can see why it might bother some people.
Quote from: Arantor Beeblebrox the First on December 30, 2013, 11:13:04 PM
Splicing in span tags everywhere in links is not actually a good idea. There are other considerations like SEO at work (more tags, especially in links, is not smart)
`span` tags will not hurt seo. See this SO question (http://stackoverflow.com/questions/2274611/do-span-tags-hurt-in-regards-to-seo) - `span` has no semantic meaning and is for visual effects. SMF uses spans when styling bbc so why not have blank `span` around text nodes.
In markdown, the parser puts `<p></p>` tags around text nodes
P tags have semantic meaning, funnily enough. Makes an SEO difference. In fact so does all extraneous markup. That's why HTML5 introduced a buttload of new tags that all were largely identical for presentational purposes but semantically different.
If I understood you correctly, and it's hard to be sure from the weaving about you were doing, you were suggesting putting span in the text part of a link, which is extremely sensitive SEO wise.
Quote from: Arantor Beeblebrox the First on December 31, 2013, 01:06:47 AM
Makes an SEO difference. In fact so does all extraneous markup.
span tags do not affect anything and have no semantic meaning.
- http://webmasters.stackexchange.com/questions/6990/seo-of-span-in-h1-header
- http://productforums.google.com/forum/#!topic/webmasters/XpSF9zO8AEQ
- http://stackoverflow.com/questions/11228368/does-breaking-a-word-with-a-span-tag-effect-seo
- http://www.pitstopmedia.com/sem/complete-html-reference-guide-for-seo-tags-with-no-seo-influence
The only thing I could find that a spider may make a link inside a span or p have less weight but this does not apply to this situation: http://seoblackhat.com/2005/08/29/devalue-link-google-algorithm/
Except we're not arguing about span inside H1 (link 1), nor did you get advice from Google (link 2, all respondants were regular users, plus Google has changed its algorithm multiple times since then), nor are we using it to break a word when a proper CSS fix exists (link 3), nor using it to group or break inline elements (link 4) and other than broad generalities, SEO advice from 2005 is going to be very out of date (link 5)
So, we're back to this. Putting a span inside a link text (which none of your sources actually cover), just because you want to make an image not look like a link inside a post.
SEO issue 1: signal to noise is increasingly being used as a measuring tool, as well as things like download and rendering time. Extra tags do not help here.
SEO issue 2: a link's text is still more relevant in terms of ranking than other things, cluttering it up with markup is not going to help that, span or otherwise.
Flipside issue 1: usability is important, and people having some kind of UI hinting that something is clickable is better than not.
The bottom line, we have what amounts to a minor aesthetic issue, that pretty much you were the only complainant of (if not, please feel free to show me where the other complaints are), that requires nasty hacks that all have side effects to resolve, be they adding markup or rewriting it somewhere between page start and page end.
The google product forums link did speak about a span being in a link even if it isn't from the most authoritative source.
Here are some people wondering about the border:
- http://www.simplemachines.org/community/index.php?topic=482589.0
- http://www.simplemachines.org/community/index.php?topic=423661.0 - Arantor posted in this one...
Quote from: Arantor Beeblebrox the First on December 31, 2013, 01:30:55 AM
SEO issue 1: signal to noise is increasingly being used as a measuring tool, as well as things like download and rendering time. Extra tags do not help here.
SEO issue 2: a link's text is still more relevant in terms of ranking than other things, cluttering it up with markup is not going to help that, span or otherwise.
/me wonders where the guy that wrote this (http://www.simplemachines.org/community/index.php?topic=427913.0) is.
Quote from: Arantor Beeblebrox the First on December 31, 2013, 01:30:55 AM
Flipside issue 1: usability is important, and people having some kind of UI hinting that something is clickable is better than not.
And I wonder why the heck people do not want links to actually look like links... ::) (Just so that you don't misunderstand I'm agreeing with your sentence above)
Because while the concept of trying to optimise user generated content is inane as I pointed out, that doesn't negate the fundamentals. There are things SMF does not get right, and has not done for years, one of which I fixed in 2.0.6, and more will be fixed in 2.1.
Right, so we have a handful of people, including one guy who gave me a headache. So what if I posted in those other topics? You'll notice that my attitude over this issue hasn't changed in that time. I'm trying to be convinced that I shouldn't just close this and write it off as a non issue, and arguing by various logical fallacies doesn't help with that.
Quote from: emanuele on December 31, 2013, 02:57:59 PM
Quote from: Arantor Beeblebrox the First on December 31, 2013, 01:30:55 AM
Flipside issue 1: usability is important, and people having some kind of UI hinting that something is clickable is better than not.
And I wonder why the heck people do not want links to actually look like links... ::) (Just so that you don't misunderstand I'm agreeing with your sentence above)
I agree that usability is extremely important and although the underline is a great UI hint for users, I would say that an image should suggest itself that it can be clicked.
This issue only applies to images that are transparent. You can not see the underline on images that are opaque.