Want to take part in these discussions? Sign in if you have an account, or apply for one below
Vanilla 1.1.10 is a product of Lussumo. More Information: Documentation, Community Support.
Wouldn’t it be better if you remove the underlines for the words with hyperlinks? (at least within the paragraphs)
I think this is one of the major css design issues, which actually slows you down while reading. A color code is adequate in my opinion.
As it is, it looks a bit crowded. Check for example, compared to a wiki page
I think that’s a good point.
Yes. Also on the subject, I find wiki’s shade of blue much easier to detect than our green.
Or is something strange happening with my browser? Some pages are appearing with non-underlined links in a darker green.
Okay, I have experimentally implemented this, removing the underline.
(I had done this on my personal web long ago. I forget if back then there was some opposition to the idea on the main web).
I find wiki’s shade of blue much easier to detect than our green.
If the idea is not to get the link decoration into the way when reading then it seems good to have a color that doesn’t stick out. On my personal web I have link color
005000
so that the links are only ever so slightly of a different shade.
Right now I implemented
0070000
on the main nLab. But let me know your favorite color code, and we can try it out.
For the record, below is the CSS code for links which we presently have. If anyone has suggestions for other changes/improvements, send me the code and we can try it.
I am ignorant about much of this. For instance, what does the “[title]” clause below do? First I guessed it affects the links coded as
[link name](WikiWord)
but presently these still come out underlined (?) Here is the CSS code, expert opinion is welcome:
a.existingWikiWord {
color: #007000;
text-decoration: none;
}
a.existingWikiWord:visited {
color: #007000;
text-decoration: none;
}
a.existingWikiWord[title] {
border: 0px;
color: #aa0505;
text-decoration: none;
}
a.existingWikiWord[title]:visited {
border: 0px;
color: #551111;
text-decoration: none;
}
a[href^="http://"] {
border: 0px;
color: #003399;
}
a[href^="http://"]:visited {
border: 0px;
color: #330066;
}
a[href^="https://"] {
border: 0px;
color: #003399;
}
a[href^="https://"]:visited {
border: 0px;
color: #330066;
}
div.dropDown .hide {
display: none;
}
div.dropDown:hover .hide {
display:block;
}
div.clickDown .hide {
display: none;
}
div.clickDown:focus {
outline:none;
}
div.clickDown:focus .hide, div.clickDown:hover .hide {
display: block;
}
div.clickDown .clickToReveal, div.clickDown:focus .clickToHide {
display:block;
}
div.clickDown:focus .clickToReveal, div.clickDown .clickToHide {
display:none;
}
div.clickDown .clickToReveal:after {
content: "\A(Hover to reveal, click to \"hold\")";
font-size: 60%;
}
div.clickDown .clickToHide:after {
content: "\A(Click to hide)";
font-size: 60%;
}
div.clickDown .clickToHide, div.clickDown .clickToReveal {
white-space: pre-wrap;
}
.un_theorem, .num_theorem, .un_lemma, .num_lemma, .un_prop, .num_prop, .un_cor, .num_cor, .un_defn, .num_defn, .un_example, .num_example, .un_note, .num_note, .un_remark, .num_remark {
margin-left: 1em;
}
span.theorem_label {
margin-left: -1em;
}
.proof span.theorem_label {
margin-left: 0em;
}
:target {
background-color: #BBBBBB;
border-radius: 5pt;
padding: 0 10pt;
}
First of all, please don’t say “wiki” to mean “wikpedia”. The nLab is a wiki too.
Personally, I prefer underlined links. But I won’t stand in the way of a change that everyone else wants. I detest the overall aesthetic direction of the Internet these days too. (-:O
For instance, what does the “[title]” clause below do?
It is called an ’attribute selector’, it matches any link which looks like
<a class="existingWikiWord" title='something' ....>
(or even just a plain ’title’ without any definition will do, I think). As far as I can see, the nLab doesn’t have any such links. The only ones with ’title’ in are those in the bar at the top of the page, like ’Home’, etc.
The reason that some links, like ’Size issues’ at category, come out unformatted is because they are just plain links,
<a href="something">.
They fall under the css for links in the snippet where there is no text-decoration defined.
I would have expected more discussion about this change. I find myself in two minds now.
Having seen the change, I prefer having the underlines, although that might be because I now find the green much harder to detect without them.
The new style sucks.
I suggest we either bring back the underlining or change the current green color to something more easily distinguishable from the black color of the text.
The present format has underlined links for sections of other pages. There seems to me no reason to distinguish such links from those to full pages.
I’m inclining to the return to underlining option.
Let’s try an easily recognizable color code. It is true that the underlinig makes texts with many hyperlinks look very crowded.
I have tried color code
0000A0
now. Check it out.
I have posted the relevant code in #5. Let me know your suggestions, and I’ll paste them in, to try them out.
I made it a bit brighter, 0000C0. But maybe it’s better to mix in other colors.
I tried to grab the blue color code for the links in Wikipedia, but I am getting inconsitent results.
If anyone knows a good color code, let me know.
I prefer previous green or at least more neutral to this bright blue. It is staring in the eyes so that the links dance and one gets dizzy. Previous experience was much more calm and I could concentrate without being distracted by link. The present color looks nice for a one second glance but for work which goes for hours it is more tiresome and distracting.
As I said, please propose some RGB color code.
I think that bright colors look more “crowded” than muted colors with underlines.
Okay, now it’s color 005000 and underlined. Hoe does that look?
That’s good for me.
I like it, thanks.
Looks fine to me.
With underlining I don’t really care that much about colors, looks fine to me.
I’m okay with it.
All right, thanks. Now I’d be interested in hearing what “umut” from #1 thinks.
hello again,
with wiki pages this general, after awhile almost every word links to a page on its own.
in usual academic and casual reading I tend to underline what is important and previously unknown to me. so once you start with a new topic almost every word is a buzz word, and after a while you cover most of them. in this regard, i think underline-ing drown out my own judgement about the words. everyone look at this page, almost every word is hyperlink.
i thought the first revised version was good enough, yet i missed the discussion stage. so may be leave it be and attack from other aspects. reading this stackexchange:
umut, I agree with your points. Let’s see if we can convince others here.
On my personal web (here) I have something like you suggest: color code for links (green) with underlining only when hovering the mouse over a link.
It seems that this generated opposition here because my color code was too dark. So let’s try no-underline with brighter color code for links.
I have implemented brighter color code (00A010) now on my personal web, just for testing. Everybody please have a look, say at the example
Introduction to Homological Algebra (schreiber)
Might something like this seem like an option for the main Lab to you (all of you)?
If not everybody can be satisfied, you can always just use browser addons to style the pages to your desires. Or you can use them to test out styles before proposing one to be the one true style default.
Right now the best bet seems to be “stylus”
I mention this and gave links to 2 online relevant styles in:
Rod, good point, But we need also a style that works well for the masses. We want the Lab to be perceived well by a broad audience of bypassers, not just by a few expert readers who have the energy to fine-tune their experience.
In this sense I feel that umut addresses a real problem: To most bypassers, the style of generic Lab pages may not seem inviting, due to all those lines in there.
So far, I’m fine with the proposal of #25. The chosen color seems gentle to my eyes (so, no crowding effect) and yet distinguishable from surrounding text. I’d be interested to know what Zoran thinks.
I’m not sure what point you’re making in #24: are you saying that you like to print out nLab pages on paper and underline them by hand as you read? We could have a separate style for printing that has no underlines.
We could have a separate style for printing that has no underlines.
Do you know what it takes to do that?
I don’t know how it’s done technically inside instiki, but the “print” button at the bottom of the page already displays things with a modified style that puts nonexistent links in italics rather than with a dark background. So presumably wherever this is done, we could add an additional change there to remove the underlines.
i was just comparing regular reading habits with those in digital media. nothing about printing.
In that case I don’t see the relevance of the fact that underlines are also used for something else to the question of whether hyperlinks should be underlined.
The colour code 00A010 looks too bright to me. It’s a tricky optimization problem, finding a shade which is suitably close to standard black text while having it distinguishable at the same time.
Mike, umut is simply saying that in a printed text everyone would find it weird and hard to read if every second word is underlined, so why do this on a webpage?
The thing is that before the advent of web-pages, underlining used to be a way of emphasis, like italics of all-capitals.
As long as there are only very few hyperlinks, marking them may coincide with the purpose of emphasizing them, which is probably where the habit of underlining hyperlinks originates in.
But in an ecyclopedic body of hypertext such as the Lab, where each keywords is meant to be hyperlinked, the emphasis suggested by the underlining becomes potentially problematic.
In my experience no one uses underlines to indicate emphasis in printed text, or has since long before the Internet. In handwritten text, yes, but in printed text emphasis is almost exclusively indicated by italics, and since nearly all the text I read nowadays is printed, underlines don’t really automatically indicate “emphasis” any more — especially now that the Internet has taught me to associate them with “hyperlink” instead. That’s why I think it was a good idea to choose underlines to indicate hyperlinks, because they are an essentially unused text decoration, free to be given a new meaning.
I don’t find it at all weird or hard to read if every other word is underlined; the underlines don’t change the look of the text itself (unlike color or italics), so they don’t get in the way of reading it. I just ignore them until I want to know whether a word is a hyperlink, in which case it is immediately obvious. Whereas on (say) Wikipedia, where hyperlinks are indicated only by a color that’s rather hard to distinguish from black (especially at nighttime with my monitor on low-brightness and f.lux enabled), I often have to move my mouse to hover over text in order to tell what is a hyperlink and what isn’t: rather more annoying.
Irrespective of the above discussion, our colors upon mouse hovering need fixing. On mouse-over the background of a link turns black (or dark blue). I don’t find this nice in general, but specifically for external links which are darker in themselves it makes the appearance of just one big black box with no discernible text left. (Check what I dropped into the Sandbox just now.)
But somehow I don’t see which line in our CSS causes this.(?)
1 to 37 of 37