I think links should look different than plain underlined text

[Jean-Philippe Ouellet]

Entirely a personal preference thing, but I find it somewhat bothersome that what looks like emphasis is sometimes a link and vice versa.

Might I suggest making links a different color than normal text, even if just slightly so as a dark grey or something keeping with the style so far. I don't think I would go all-out and make them blue, just something (perhaps minimal) to distinguish them.

It's entirely a personal preference/stylistic thing, but functionality wise I believe a visitor should be able to tell whether or not something is a link without mouseovering it.

[Steffen]

good point, I am agreeing.

I as well would very much like to have a different color for links, please...

And, remember, there's a second color for links you've already visited, that's also something I'd like to have, please.

[Philippe Hurbain]

+1
Philo

[Tim Gould]

I agree too. Unfortunately I don't know/can't get to the CSS to change this but I'm sure Orion will as soon as he sees it.

Tim

[Orion Pobursky]

Color suggestions?

I could just use the colors from the beta site.

[Jean-Philippe Ouellet]

It depends. I remember some talk from a while ago about theming phorum to look like the main LDraw site, and I think the consensus was that it would be best to wait first to see what the new site would finally look like. Now that we have a pretty good idea, is there still support for having a universal "LDraw Look" beyond just the logo?

[Orion Pobursky]

Yes. At some point, after the beta site goes live (and would therefore no longer be the beta site), we'll transition the forums to look similar.

[Steffen]

for now it just would be sufficient to use the "classic" link colors blue and purple
for new resp. visited links.
can easily be changed later.

[Orion Pobursky]

This is now implemented.

[Jean-Philippe Ouellet]

Great. Thanks!

EDIT: Not to be pickey... but it's still black underlined text in the print view css.

EDIT 2: As pointed out by Tim, black a good thing in this case, but I still believe some visual differentiator would be nice (like the dotted underline).

[Tim Gould]

I think the cascading of stylesheets might be overriding things for various special cases.

I've developed a fondness for using dotted underlines for links (which will also show up on an underlined link, as much as those shouldn't really be used).

Basically you just set the font to have no underline, and add a border-bottom: dotted 1px; to the CSS for a links

Tim

[Orion Pobursky]

I think the cascading of stylesheets might be overriding things for various special cases.

In what way? I purposely set it up so that links outside the message were unaffected since there are a lot of links in the template and making them all turn a different color was visually jarring (to me).

I've developed a fondness for using dotted underlines for links (which will also show up on an underlined link, as much as those shouldn't really be used).

Basically you just set the font to have no underline, and add a border-bottom: dotted 1px; to the CSS for a links

I like that. I'll alter the CSS.

[Orion Pobursky]

P.S. Wouldn't the border also affect linked img tags? I guess I can compensate by removing it for imgs inside an a tag

[Jean-Philippe Ouellet]

I think my point may be being misinterpreted (or perhaps not).

To be a bit clearer, I'm talking about the css of the page when it's being printed. If you look at any page on these forums, you'll see that there are actually two stylesheets being included.
The normal one:

Code:

<link rel="stylesheet" type="text/css" href="http://forums.ldraw.org/css.php?23,css" media="screen" />

And the one used when printing the page (which is what I was referring to in this post):

Code:

<link rel="stylesheet" type="text/css" href="http://forums.ldraw.org/css.php?23,css_print" media="print" />

I purposely set it up so that links outside the message were unaffected since there are a lot of links in the template and making them all turn a different color was visually jarring (to me).

Agreed. In particular, I think the Edit, Reply, Quote, and Report "links" looked better black, but again, that's just my personal preference, there are probably some that would argue in favor of having the separate colour for visited links on those too because it's a quicker way of telling whether or not you've edited/replied to/quoted/reported a message.

Another place the links are still black (and arguably shouldn't be) is in the preview provided when you mouseover a link to another message on the forums. Although IMO it's really not that important to fix if the forums are going to undergo a visual overhaul anyway.

[Jean-Philippe Ouellet]

Yup. That's just karma for abusing standards

[Tim Gould]

The standards aren't versatile enough

Besides which, you can cascade to remove the problem via

a img { border-style: none; }

Voila!

[Tim Gould]

For the printed page you should rely bare minimally on colour since many still print on B&W. Thus dotted underlines are even better there. Which is why I say the standards aren't versatile enough

Tim

[Orion Pobursky]

I changed both the regular CSS and the print CSS. Recent Messages seems to not inherit the styling so I'll look into that later.

[Tim Gould]

Excellent. Thanks.

A few points



* Unfortunately the image resizer seems to use some form of silly trickery and gains a line through the image.

* It looks like you need to change the a:hover too

[Orion Pobursky]

I can't figure out why since the CSS inspector I use isn't showing the img styling overridden.

[Steffen]

Try looking at the page with SRWare Iron (a de-googled Chrome branch)
http://www.srware.net/en/software_srware...wnload.php
, choose "inspect element" there.
Their DOM inspector is simply marvellous and just better than everything I've seen in Firefox.

[Jean-Philippe Ouellet]

You know that iron is really just normal chrome with a small patch to hardcode some settings and change the name everywhere, right?

And, at this point, its set of "developer tools" is lagging behind chrome's.

EDIT: Oh, another place the link color still needs to be changed is in the post preview.

EDIT 2: More about the questionable nature of iron can be read on its wikipedia talk page.

EDIT 3: I too have always been rather suspicious of google (If information is power, why aren't they ruling the world yet?), I use GoogleSharing and when that is unavailable, I try to stick to using scroogle. When you turn off all the fancy url bar stuff and turn off the "anonymous" statistics reporting and disable flash and whatnot, chrome is actually relatively safe to use (although I'm certainly not a fan of its secret auto-updating). Still, my favorite browser is xxxterm, I even submitted a patch for its "favorites" code it in its earlier stages.

[Tim Gould]

You may need to add !important to them.

Many site and forum software use id="" instead of class="" to label things. Which in CSS means that they become top of the list (in most browsers) behind only style="". But adding !important to an element will override cascading unless another !important is encountered. I nearly ripped my hair out recently before discovering this trick.

Tim

[Steffen]

I'll have to read more about the "Iron is a scam" claim,
but up to now I did not think that: Here's a list of things which Iron claims to have removed from Chromium:
http://www.srware.net/en/software_srware...s_iron.php
Since the sourcecode can be downloaded, you can verify that the changes are there.
Your article puts that into a different light, I'll read it.
Let's cancel the "Iron vs Chrome" discussion here, as it is off-topic, and I do have to read more about the "scam claim"
before I could continue. Looking at the number of posts in this thread, it is a little funny to me how
a question like "can we please have underlined hyperlinks?" can lead to such a big thread :-D

[Orion Pobursky]

I use both Chrome and Firefox with Firebug. Both aren't showing me anything useful but I will try Tim's suggestion with the important tag to see if that works.

[Orion Pobursky]

That didn't work. Looking into this some more.

[Travis Cobbs]

Looking at it in Chrome's inspector, the underline isn't present in the image element itself at all, but only in the parent A element. The underline appears to be underlining the nonexistent text portion of the A element.

[Orion Pobursky]

I was thinking the same thing. I guess I'll just have to class all linked imgs.

[Travis Cobbs]

I think it's interesting to note that IE 9, Firefox 9, and Chrome 16 all render the lines differently. Firefox places them at a position that would be underneath text, if text were present along with the image. Chrome puts them above the image. IE puts them above the image, but then erases one text line's worth of space above the line (see the info links on the left of all the Announcements entries on the main page).

I'm not much of a CSS expert, but this seems to indicate that whatever is being used to get the lines in the first place, it's something that just about nobody else is doing, because if it were common, I can't see having completely different rendering on the three top browsers.

[Tim Gould]

Hi Travis,

I've done a fair bit of research into CSS and good UI design. I'm certainly no expert but I have looked up the theory of how it should work and now have a pretty good idea of common problems.

The underline trick should work as a standard and does work on many sites. It's definitely valid CSS with a standardised(ish) behaviour (border behaviour is pretty standardised with the exception of whether they're considered 'inside' space or 'outside' space). The problem here is that much of the forum uses pointless CSS trickery all over the place to, I assume, ensure each little bit looks identical on many browsers. And of course each module is written by a different author who uses their own different tricks, so there's not even a nice standard way to fix the problem.

For example the images next to the announcements aren't 'img' tags. They're simply 'a' links set with a background image and presumably a fixed size. What is worse is that they are inheriting this behaviour from the table they're contained in which makes debugging them hard.

Unfortunately there's little we could do about this aside from a) overriding each problem bit individually and hoping it works or b) abandoning the dots and going back to regular underlining.

Tim

[Orion Pobursky]

Or C) trashing this theme and replacing it with a derivative of the beta site theme. Even better, seeing if I can link to the sites stylesheets from within the forums. I'll work on that once I'm home from this road trip.