Page MenuHomePhabricator

RSS feed link should have silly orange icon
Closed, ResolvedPublic

Assigned To
None
Authored By
brion
Aug 4 2005, 12:40 PM
Referenced Files
F2204: borked-in-ie7.png
Nov 21 2014, 8:44 PM
F2203: Picture_2.png
Nov 21 2014, 8:44 PM
F2201: feed-icon.png
Nov 21 2014, 8:44 PM
F2202: 3043-feedicon.diff
Nov 21 2014, 8:44 PM

Description

For consistency with other sites, the RSS and Atom feed links should use little icons in the common style.
The text links ("rss", "atom") are not very visible or standard.


Version: unspecified
Severity: enhancement
URL: http://en.wikipedia.org/wiki/Special:Recentchanges

Details

Reference
bz3043

Related Objects

StatusSubtypeAssignedTask
OpenFeatureNone
ResolvedNone

Event Timeline

bzimport raised the priority of this task from to Low.Nov 21 2014, 8:44 PM
bzimport set Reference to bz3043.
bzimport added a subscriber: Unknown Object (MLST).

rowan.collins wrote:

This depends how much attention we want to draw to the feeds, really. Browsers
such as Firefox can already garner the fact that there are feeds from tags in
the <head> element, and nothing else in the navigation gets an icon. If the
links *are* turned into icons rather than text, I would suggest not using a
"silly orange icon" (by which I presume you mean something like [1]), but
something slightly subtler - more on the lines of [2] or [3], perhaps, which are
equally "standard" in terms of look, but easier to tweak to not be *too* visible...

[1] - http://dmxzone.com/downloads/images/rss_button.jpg
[2] - http://www.kent.ac.uk/is/computing/img/rss-button.png
[3] - http://www.frontfrauen.de/bilder/button_rss.gif

mike wrote:

Regardless of whether we use the 'standard' buttons, I do think the rss and atom
links in the sidebar of recentchanges are a bit unlikely to be found unless sought.

I would recommend each (rss, atom) having it's own line, and the optional use of
icons.

xerol wrote:

I think the closest thing to a standard right now is this:
http://blogs.msdn.com/rssteam/archive/2005/12/14/503778.aspx
While still not an actual standard, per se, being adapted by both major browser camps puts it
close enough. (The orange text buttons are out, supposedly. Doesn't stop everyone from
continuing to use them though.)
However, I like the idea behind this site: http://feedicons.com/
The idea being that the IMAGE, and not the COLOR is what should be kept universal. I think
even more important is that the image in use should mesh well with the existing skin/theme,
and perhaps that having a feedicon parameter in the skin definition might be a good solution
to this (so it can be easily customised for whatever skin is being used).

tadpole9 wrote:

My preference would be to replace the list bullet with a small icon (10x10, even?) in any color. I don't
think we need them on separate lines, as the two feeds are essentially the same thing.

titoxd.wikimedia wrote:

I think the light blue icon in feedicons would match the Monobook and Cologne
Blue skins the most. Also, the 12x12 icon feedicons uses is the perfect size, IMO.

Created attachment 3292
Sample 12x12 feed icon colored to match monobook bullets

Derived from the 12x12px linked above...

Attached:

feed-icon.png (12×12 px, 578 B)

Created attachment 3293
Sample patch to monobook.css using icon for the list bullet

Attached:

Created attachment 3294
Screen shot of toolbox with the icon on the feeds line

Taken w/ Firefox 2.0.0.2 on Mac OS X.

The position looks a little funny to me (same in Safari).
Also I think it might be odd that the icon itself is not clickable;
additionally there is no equivalent list item in the current usage of the feed
links on Cologne Blue and other such skins.

Attached:

Picture_2.png (97×155 px, 7 KB)

ayg wrote:

It could perhaps be made clickable using some kind of voodoo-magic like

li#feedlinks { list-style: none; }
li#feedlinks a { display: list-item; list-style: square url(...); margin:
something; }

But who knows how browsers would take that (IE is especially persnickety with
display: anything). And CSS is completely vague on how to position list-items,
so if we want it to be positioned prettily we'll have to hope that all the
browsers position the same so we can use some pixel-specific image . . . or
maybe hack in different images for different browsers . . . yuck.

titoxd.wikimedia wrote:

Perhaps include the bullet, as it is currently done, and then put the icon to
the right of the RSS / Atom link? That way, a hard <a href="..."> can be used,
and all of those problems with the bullet are bypassed.

Well, now you've got the problem of which feed version are you linking? Just
RSS, just Atom? Or an icon for each?

Try delimiting them so:

Icon ":" "RSS<link>" &bull; "Atom<link>"

Then it's more obvious that this is a "list of links" and further flavours can be added
later if needed.

ayg wrote:

Then clicking the icon won't get you the link, though, which is unexpected.

#feed-atom a, #feed-rss a
{
background: url("http://upload.wikimedia.org/wikipedia/commons/thumb/4/43/Feed-icon.svg/12px-Feed-icon.svg.png") center left no-repeat;
padding-left: 16px;
}

seems sane in all Monobook based skins.

Classic based skins would need to add appropriate id to such links.

Then I'd also suggest to remove the unnecessary waste - wrapping <span> of feed links in Monobook skins in favor of moving the id attribute to <a>. Then all skins could have the same code which would be

#feed-atom, #feed-rss
{
background: url("http://upload.wikimedia.org/wikipedia/commons/thumb/4/43/Feed-icon.svg/12px-Feed-icon.svg.png") center left no-repeat;
padding-left: 16px;
}

The URL to image should be to the /skins directory (or its subdir) of course where the image should be stored, here it is just for simple copypaste to see how it looks.

Changing padding and image position to right seems fine as well. Icon color - choose whatever, but I'd prefer the standard orange one since it will shout out "here are the links you're looking for".

Looks cute! Any browser compat or RTL issues?

I did not notice any cross-browser problems but I noticed issues in RTL.

However as far as can I see on random RTL wikis, they don't even use those link icons for external, mailto:, https:, irc: etc. links, which are based on the same principle, so I guess it's known issue. Thus I'd suggest to have the RTL wikis without those icons as well. Thus perhaps some override in rtl.css would have to be done, such as

#feed-atom a, #feed-rss a
{
background-image: none;
padding-left: 0;
}

(or without a's depending on which selector will be used - see comment #14)

As far as I tested known CSS constructions, the wrong displaying seems to me rather like browser issues, which I guess is why those icons are disabled on RTL wikis.

(In reply to comment #17)

However as far as can I see on random RTL wikis, they don't even use those link
icons for external, mailto:, https:, irc: etc. links, which are based on the
same principle, so I guess it's known issue. Thus I'd suggest to have the RTL
wikis without those icons as well...

See bug 16502.

Fixed for Monobook and Modern skins in r46058.

Improved r46058, now works in all skins.

ahmad.m.sherif wrote:

The icons is still shown in RTL wikis (e.g. Arabic and Hebrew wikipedia). It looks good in FF3 and Konqueror (and perhaps Safari since it acts like FF3). But in Opera 9 (and perhaps the rest of browsers), the text overrides the icons and there is an ugly padding to the right. As mentioned in comment 18 and bug 16502, the problem also exists for the external links icons. Those lines in common_rtl.css are useless /* feed links */
a.feedlink {
background: none;
padding-left: 0;
}
since common_rtl.css is not loaded in RTL wikis for some reason. Instead, They need to be placed in rtl.css with the !important keyword like external icons in the same file, which maybe like
a.feedlink {
background: none !important;
padding: 0 !important;
}

Wiki.Melancholie wrote:

Although comment #21 is much more important, could those icon(s) be made a little bit smaller, slightly more discreet?
Let's say 2px less in height?!

Created attachment 5740
Screen shot IE7 showing borked display

Attached:

borked-in-ie7.png (76×162 px, 2 KB)

z9z8z-wps wrote:

This is a vote against displaying feed icons.

Except Monobook no skin used any icons until now. These flashy orange feed icons are in strong contrast to the rest of the mostly blue/gray/black colored skins, draw too much attention to them and distract from more important parts of the page and other links. The effect is worse in skins less playful than Monobook. There's no reason to emphasize just the feed links and not any of the other two dozen or more.

Broken by r47615 or some of it followups. Reopening until fixed again.

Doesn't seem particularly broken. Re-resolving FIXED. Please open a new, specific bug if there are new problems.

The icon no longer appears again. I was unable to find the revision which caused that, though.

Reopening until fixed again.

Should be related to r57119.

It does now. No idea which rev