Yesterday the front page was brought more in line with the fonts and colors that graced the diyAudio homepage for the last 20 years. Which is to say, thread titles appear as nice easy to read regular text and have a bright purple link color. This made the classic theme "more classic" and truer to the pre-migration version of the site.
Much teeth gnashing ensued, with several members voicing their fervent enthusiasm for the bold version of the font to remain for unread threads. The particular font that the pre-migration site used (and the classic theme has always used) is Verdana. It does not have a "medium bold" version. It's either a lovely easy to read screen font as regular (which is how it was pre-migration) or a very thick "extra bold" intended for article titles.
Anyway, a non binding quick poll for those who use the classic theme (only). How do you like your thread titles to look on the classic theme?
Much teeth gnashing ensued, with several members voicing their fervent enthusiasm for the bold version of the font to remain for unread threads. The particular font that the pre-migration site used (and the classic theme has always used) is Verdana. It does not have a "medium bold" version. It's either a lovely easy to read screen font as regular (which is how it was pre-migration) or a very thick "extra bold" intended for article titles.
Anyway, a non binding quick poll for those who use the classic theme (only). How do you like your thread titles to look on the classic theme?
Last edited:
I almost forgot there's an artform using 50 shades of beige :
https://unsplash.com/s/photos/beige
More purple, less blue...less sleepless nights.Thank you!
Seeing my chances to stay awake getting slimmer by the minute
https://unsplash.com/s/photos/beige
More purple, less blue...less sleepless nights.Thank you!
Seeing my chances to stay awake getting slimmer by the minute
Attachments
Last edited:
Something I noticed after the fact is that all of my browser-based e-mail interfaces use a pretty heavy bold for unread messages. And standalone Outlook uses both a bold and a color difference. That's probably part of what's driving my preference for the larger contrast.
But since the last round of color adjustments for the classic theme, I did state that usability had increased greatly even without the bold. I'm not fervent on the topic, it's just more similar to what I'm used to. If others are happier without the bold, I can also get used to just having the higher contrast color difference that's now in effect.
Thanks again for the energy you put into these things. I know content management systems can be a painful at times.
But since the last round of color adjustments for the classic theme, I did state that usability had increased greatly even without the bold. I'm not fervent on the topic, it's just more similar to what I'm used to. If others are happier without the bold, I can also get used to just having the higher contrast color difference that's now in effect.
Thanks again for the energy you put into these things. I know content management systems can be a painful at times.
Honestly IMO none of those three are great in the view as seen from here:
https://www.diyaudio.com/community/
I am not a fan of the bold rounded text for any state of the links. Using the same color for unread and read links (and choosing purple for that color) is a head-scratcher. I guess if there is a need for it, "Bold" would be OK if it was a little less bold that it is now. Maybe that is a matter of font choice? How about regular black font (like the one used for "Replies:" on the community page) for unread links and a color (red, orange, or whatever you like) and normal line weight for read links?
OTOH, within the thread itself I do like the bolded thread title! Go figure.
I always read the forums using a web browser on a desktop computer, and perhaps these font-related choices are more optimized for mobile devices?
https://www.diyaudio.com/community/
I am not a fan of the bold rounded text for any state of the links. Using the same color for unread and read links (and choosing purple for that color) is a head-scratcher. I guess if there is a need for it, "Bold" would be OK if it was a little less bold that it is now. Maybe that is a matter of font choice? How about regular black font (like the one used for "Replies:" on the community page) for unread links and a color (red, orange, or whatever you like) and normal line weight for read links?
OTOH, within the thread itself I do like the bolded thread title! Go figure.
I always read the forums using a web browser on a desktop computer, and perhaps these font-related choices are more optimized for mobile devices?
I have attached an image of regular and bold text in Verdana, Arial, and Calibri (all 11 point) that I generated in Word.
I always noticed that Verdana is a little larger in size than other fonts when in the same point size. It looks a little clumsy to me, and this is worse when in bold.
Both Arial and Calibri are better IMO and the bold titles would look better. All my opinion, of course. You may have different priorities/needs for the site.
I always noticed that Verdana is a little larger in size than other fonts when in the same point size. It looks a little clumsy to me, and this is worse when in bold.
Both Arial and Calibri are better IMO and the bold titles would look better. All my opinion, of course. You may have different priorities/needs for the site.
Attachments
Well very interesting poll results so far!
Me too. The reason is that Verdana bold is really made for titles, proper titles. Not a whole page of Verdana bold.
Yes, it's not meant to be forced too large either. It's designed to be displayed small.
Until some point recently, the defacto link color for all links was bright and saturated blue, with an underline. A visited link would be a different, duller, less saturated color. This was the standard metaphor on the web for links and nobody thought any different.
More recently, the use of a bold-er variation of a font for a non-visited link, rather than "saturated blue with an underline", has taken hold. But I can guarantee you nobody sane ever chose Verdana as the font for this.
The solution is, IMO, not to try to browbeat diyAudio classic Verdana font into doing what it isn't meant to do. We should stick with what it does well - non-bold, or alternatively, we should use a different font that has a less over the top bold. This would not be "classic" but the poll suggests plenty of people have gotten quite used to the bold as unread metaphor.
The font-stack that the light/dark theme use looks "fine" for this purpose, which appears to be "-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"". This may be the best compromise.
It's not being determined by the browser as/using "visited link". That might change in the future. I'd personally prefer things to change to "visited" as soon as I click on something.
Me too. The reason is that Verdana bold is really made for titles, proper titles. Not a whole page of Verdana bold.
Yes, it's not meant to be forced too large either. It's designed to be displayed small.
Verdana (and Tahoma) were designed specifically to be excellent general fonts for reading plain text on a computer monitor. They excel at that.
Until some point recently, the defacto link color for all links was bright and saturated blue, with an underline. A visited link would be a different, duller, less saturated color. This was the standard metaphor on the web for links and nobody thought any different.
More recently, the use of a bold-er variation of a font for a non-visited link, rather than "saturated blue with an underline", has taken hold. But I can guarantee you nobody sane ever chose Verdana as the font for this.
The solution is, IMO, not to try to browbeat diyAudio classic Verdana font into doing what it isn't meant to do. We should stick with what it does well - non-bold, or alternatively, we should use a different font that has a less over the top bold. This would not be "classic" but the poll suggests plenty of people have gotten quite used to the bold as unread metaphor.
The font-stack that the light/dark theme use looks "fine" for this purpose, which appears to be "-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"". This may be the best compromise.
If you're talking about visited links, I would mention that at present (I assume this is the XF default), this is being determined by XF as true if you have read the last post.
It's not being determined by the browser as/using "visited link". That might change in the future. I'd personally prefer things to change to "visited" as soon as I click on something.
I use the classic theme not because I’m resistant to change, but because it has a distinct visual identity over other sites. I find the light/dark themes look too generic, whereas the “traditional” blue on blue is very much diyaudio. Plus it’s full-width and high I like when viewing on my desktop.
That said, I don’t see any need to make the classic theme “more classic” by reproducing the old site exactly. If better font and colour choices are available then let’s use those!
That said, I don’t see any need to make the classic theme “more classic” by reproducing the old site exactly. If better font and colour choices are available then let’s use those!
To be specific, #2e2e9e.
This has now been implemented - the main text font remains classic verdana, the front page font has been switched to the one used by the light and dark theme. On OSX, at least, this provides for a much better demi-bold that is not such an eyesore as a Verdana bold.
I think this is a suitable compromise for the short term.
Being DIY, I'd like for everyone to be able to enjoy the site how they want. I will look into providing options in the account settings area that allow you to customise how the titles look in the classic theme (as they are now, or "true classic").
Last edited:
I am with you on this, though I must say I don't mind the light theme in general and do now absolutely prefer it to the classic theme myself.
I agree that a lot of the unique diyAudio "flavour" was lost. I would like to add that back, either some of the original flavour, or a new and unique one. And probably more blue and less royal purple... in general.
During the migration process, I reached an impasse with the designers regarding the new styles. After months of to-and-fro, we had not really got anywhere in terms of the design, but we needed to migrate more than ever. A decision was made to just get on with the migration and "deal with the design later". As is wont to happen in these situations, that item (dealing with the design) never got dealt with and we found ourselves again at an impasse with the site ready to migrate but the design, in my humble opinion, not being where it needed to be. So we just bit the bullet and migrated with the design(s) released... prematurely.
Fast forward 418 days, and here we are, finally starting the process of dealing with the design. I do apologize for this year long wait, but arrangements needed to be made for me to be able to get myself into a position where I was able to make these changes myself.
From now on, things will get better, and there will be progress, day by day...
Now that we are using a bold for unread, the original very saturated classic unvisited link color of the pre-migration site which was 2e2e9e was really a bit eye piercing in bold, even in this demi-bold. I have softened it up a bit (desat and darken) to 3a3a8b, almost a blue, pretty easy on the eye. I think that needed to be done if we are going to stick with bold, even if it is a demi-bold.
One other thing is that on modern monitors I always have brightness turned way down. Other people seem to like theirs set to "ringside at a supernova" intensity, so subtle color differences are probably more obvious to them.
I have a similar issue with Chrome's minuscule incognito active tab color difference. It's easily lost if your monitor isn't set to cook your retinas.
I have a similar issue with Chrome's minuscule incognito active tab color difference. It's easily lost if your monitor isn't set to cook your retinas.
I have to agree with Charlie that none are actually perfect, for instance the difference between bold and non-bold is too large, and while I did try alter the font weight (boldness) nothing actually happens if I use a value equal or lower than 549 (= regular font) or, equal or higher than 550 (= bold font), too coarse steps.
I played a bit also with the colors also for the text that goes underneath the thread title (member name, sub-forum name, page selector) and toned down them considerably so the thread titles stands out more, see the two attached pics, 1st is original and 2nd is modified, just some examples.
This makes it much easier for the eye to pick up the titles while scrolling.
Those who are a bit handy with web designing can try it for themselves (and also set their own color and font weight of preference, just make the changes on those lines marked up with "<-- Change Here", the result is permanent in your browser as long as the style is enabled in the Stylus extension, and can be turned off too) which can be added to Firefox and Chrome, and then paste in the following:
I played a bit also with the colors also for the text that goes underneath the thread title (member name, sub-forum name, page selector) and toned down them considerably so the thread titles stands out more, see the two attached pics, 1st is original and 2nd is modified, just some examples.
This makes it much easier for the eye to pick up the titles while scrolling.
Those who are a bit handy with web designing can try it for themselves (and also set their own color and font weight of preference, just make the changes on those lines marked up with "<-- Change Here", the result is permanent in your browser as long as the style is enabled in the Stylus extension, and can be turned off too) which can be added to Firefox and Chrome, and then paste in the following:
Code:
.structItem-title a {
/*color: #685a83;*/
color: rgba(104, 90, 131, .5); /* <-- Change Here */
}
.is-unread div div.structItem-title a {
/*color: #2e2e9e;*/
color: #520de8; /* <-- Change Here */
font-weight: 500 !important; /* <-- Change Here */
}
.structItem-minor {
font-size: 1.0rem;
color: rgb(90 92 104 / 60%); /* <-- Change Here */
}
.feedItem .label--ajaxCustom {
font-size: 1.0rem !important;
color: rgb(90 92 104 / 60%) !important; /* <-- Change Here */
padding-left: 0;
}
.structItem-pageJump a {
color: #6443ab; /* <-- Change Here */
background: #e7e7e7; /* <-- Change Here */
border: 1px solid rgba(100, 67, 171, .3); /* <-- Change Here */
display: inline-block;
max-width: 100%;
padding: 0 6px 1px;
margin: 0 0 2px;
border-radius: 3px;
text-decoration: none;
border-radius: 0px;
padding: 0 3px;
opacity: .5;
-webkit-transition: all .2s ease;
transition: all .1s ease;
}Attachments
Last edited:
Not quite my taste but very happy you are able to customize things to your taste!
FYI the font stack looks considerably better on OSX/iPhone which does use a font with a nice demi-bold. Not sure what device/OS you're using (in your second image), but possibly one from your non-apple system that has a demi-bold can be added to the font stack.
FYI the font stack looks considerably better on OSX/iPhone which does use a font with a nice demi-bold. Not sure what device/OS you're using (in your second image), but possibly one from your non-apple system that has a demi-bold can be added to the font stack.
This was Chrome on Ubuntu 18.04.
But to be honest I am primarily using dark theme to save my eyes, and did even more modifications there.
But to be honest I am primarily using dark theme to save my eyes, and did even more modifications there.
:)
