Cemetech's existing front-end styling is a bit of a pain point for long-time users, for new members, and even for visitors just stopping by. What was once the only way of solving a problem is now an unnecessary bodge; what was once a solid upgrade is now somewhat obtrusive.
I've been invested in improving the state of affairs for
quite some time, and others have
some mockups.
Let's think about how we could make our site better.
Overall, the theme should maintain a strong identity for Cemetech. It should be
immediately clear to someone coming back after a 10-year hiatus that this is fundamentally the same site they were invested in a decade ago, cleaned up for more modern eyes. Simultaneously, it shouldn't repulse new users; indeed, it should welcome them and guide them to the places they probably want to go.
Because Cemetech is in the middle of a major backend rewrite being spearheaded by Tari, let's focus on restyling the pages which are already ported. This includes:
- The front page
- User pages
- The archives
- SAX
Here's the project roadmap:
- Discuss what to change, make mockups, test things out (You are here!)
- Host some "public beta", where the theme is available in user profiles for people to try for themselves.
- Apply the style to new C7 pages as they come out and fix what breaks.
- Eventually migrate to this as a default.
What sticks out to you on Cemetech as being difficult to navigate or find? What's ugly or dated? What do you suggest as a fix, or as guiding principles for our new look? What should we keep? How can we make our site better for your use cases?
As you know, cemetech has been due for a revamp for at least 10 years now. I am happy to see some progress beiong made in that direction.
Of course, my userstyle already makes the site more appealing to me, but I remain distraught every time I lay eyes on the vanilla cemetech theme.
To me, the fact that everyone is making userstyles to tweak the site to their liking suggests that the site is not providing a good enough user experience.
Here are some changes that come to mind:
- As I stated 8 years ago, Latest archive uploads on the front page
- Delete "RSS & Social Media" and "Latest Headlines" in the sidebar
- Make everything flat
- Dark mode
- Make things wider (everyone's screens are wide nowadays)
- New banner with the 84+ CE Python, the original CE has been out for almost a decade now.
1. I think making the calculator resources (wiki, SC3, buying guide, etc) should be moved because it isn't immediately obvious where the 5 links are located. I think they should be placed on the sodebar.
2. I don't think a new Cemetech style should be too flat and "modern", but that is just my taste. It isn't too bad as it is, but solely a restructuring of elements wouldn't hurt.
3. The site [url]beta.cemetech.net[/url] exists for some reason, so that should be a good place to put it.
4. This is more of a BBCode suggestion, but I would like to see the [s]strikethrough text[/s] feature added.
1: I personally prefer the current gradient style over a "modern" non gradient style.
2: Move the Latest Forum Posts into a box on the sidebar replacing the RSS and Social Media and Latest Headlines boxes
3: Make the headlines/articles on the home page collapsible.
4: Replace the quick reply with the "full" reply (the "cemetech.net/forum/posting.php" page).
5: I would love to have dark mode, but I think that it would work better by just inverting the background and text colors, rather than inverting the colors of everything.
6: Extend everything to the edge of the window, which would allow for a wider sidebar.
7: Extend the banner to line up with everything else.
8: make the SAX pop up page take the full screen and not have a scrollable box on a page that scrolls.
Frankly, I think we should get rid of full reply and make the quick reply the full editor. My userstyle has a "focus" mode which has a live preview side-by-side with the bbcode editor (with resizable columns!), which pops out on the page. But these tweaks are sort of out of scope for now, because the forums aren't migrated over to C7 yet.
I do question a little bit just
how much wider we should make things; it's a constant tradeoff between readability and efficient use of screen space. Longer lines are harder to read, this is well documented in accessibility guidelines, etc.
And yes, the left sidebar is far to narrow.
My userstyle (which I am sorta sick of referencing already) adds 2 rem to the sidebar, but I imagine we could even go a little farther.
Note for future readers: it's probably past April 2025 and the site still looks exactly the same if you're wondering.
mr womp womp wrote:
- As I stated 8 years ago, Latest archive uploads on the front page
- Delete "RSS & Social Media" and "Latest Headlines" in the sidebar
Having these just on the homepage seems reasonable.
Quote:
Disagree; the white-to-red gradients are fine, but there might be too many of them because there are a lot of visual boxes on every page. Combine some of the boxes so there are fewer gradients and maybe make them more subtle, but don't give in to the currently-popular-and-difficult-to-parse trend of low contrast and completely flat colors.
Quote:
Pretty easy, just need to keep it in mind while writing stylesheets. These days it's probably reasonable to use CSS variables to make it easier.
mr womp womp wrote:
Make things wider (everyone's screens are wide nowadays)
iPhoenix wrote:
I do question a little bit just how much wider we should make things; it's a constant tradeoff between readability and efficient use of screen space. Longer lines are harder to read, this is well documented in accessibility guidelines, etc.
I agree that unbounded width is probably not a good idea, but there's probably room in the layout to let some parts become wider than they currently are.
Long-established typographical practice says lines are most readable with maximum length in the range of 55-75 characters which is already shorter than we currently allow (and that aligns pretty well with the classic 80-character terminal!). It might be interesting to experiment with multi-column layout.
Quote:
New banner with the 84+ CE Python, the original CE has been out for almost a decade now.
All the old calculators are still around and interesting. You're thinking too small: have a couple different calculators that can be represented in the banner and select them semi-randomly.
Quote:
1. I think making the calculator resources (wiki, SC3, buying guide, etc) should be moved because it isn't immediately obvious where the 5 links are located. I think they should be placed on the sodebar.
I think these are more useful on the homepage, since they're useful to point new users towards some of our resources but they aren't when you're already looking at a different page so you don't need them in the sidebar.
Quote:
4. This is more of a BBCode suggestion, but I would like to see the [s]strikethrough text[/s] feature added.
We already have that: [strike]: see?
Quote:
4: Replace the quick reply with the "full" reply (the "cemetech.net/forum/posting.php" page).
Changing the quick reply is rather challenging since it requires significant changes to how the server handles viewing topics. The "full" posting page can definitely stand to be improved however: at least by making the topic review box larger, and possibly by reorganizing it. Potentially even make the message composition tools sit on top of the topic review instead of putting them in completely separate boxes.
iPhoenix wrote:
these tweaks are sort of out of scope for now, because the forums aren't migrated over to C7 yet.
I mostly wouldn't want to make large changes to the server-side code, but there's plenty of room to change the styling in ways that needs minor or no changes to the server's code.
A live preview is feasible to implement without any server changes; that was one of my goals in that library I wrote, but somebody would need to implement it.
MateoConLechuga wrote:
Note for future readers: it's probably past April 2025 and the site still looks exactly the same if you're wondering.
Your confidence in us is appreciated, but I note you're not offering any input either so clearly these questions aren't ones that you find important.
My main pain point was always navigation.
Especially early on, there was a lot of "what page? Where?"
The gradient is great, the site not looking insanely slick feels better than if it looked minimalist. Might just be nostalgia talking, though.
Also, I feel the site's wide as it is, if anything, make width a user choice, like dark mode.
Fot changes:
I second putting calculator resources in a more prominent position. I'd swap it where rss/social media currently is.
For styling, I'd say restyling some links that make more sense as buttons (view previous/next topic).
Tari wrote:
Disagree; the white-to-red gradients are fine, but there might be too many of them because there are a lot of visual boxes on every page.
The current use of white-to-red gradients seems to be intended to evoke the then-trend of skeuomorphic design. I think the below simply looks sleeker and looks less immediately from back when the YouTube app was brown. (Note- I do want to combine more boxes too, but this is just changing the corners and reducing the intensity of the gradient).
Tari wrote:
Combine some of the boxes so there are fewer gradients and maybe make them more subtle, but don't give in to the currently-popular-and-difficult-to-parse trend of low contrast and completely flat colors.
Womp and I had a discussion on this last night; "flat" is the wrong word. Depth is an important piece of information when examining a webpage. Reducing boxes is definitely good, though I think Cemetech does a pretty good job of separating information on most of the important pages.
While I would vouch for removing the gradient entirely (it's a big pain on my eyes and looks very outdated to me, not in a nostalgic retro way but in a "this site looks like it probably hasn't been used since 2010 kind of way"), I can think of a few possible compromises:
- Toggleable gradient for people who still appreciate it, but this is not the default so it doesn't scare new users away (keep in mind that the majority of new users coming to Cemetech will always be younger and younger) the second they see it.
- Or, a much more subtle gradient which still gives a bit of the 3D feel (which I honestly like) but also doesn't jump out or feel like it's been neglected for 15 years. In this example, I swapped out the current gradient color (#A2685E) for a much softer #8C2F22, and I actually think it looks quite nice:
After some discussion in SAX, maybe offering a few different themes for users to chose from (I've seen a few other forums do this and Cemetech already has an option under "Board Style") would be a good solution.
I also think renaming some things could make navigating the site easier. What currently comes to mind is "Edit Profile" -> "Settings", since there's a lot more than just profile editing which makes it a little misleading. "Board Language" and "Board Style" could make more sense as "Language" and "Theme", and "No unread messages" could just become "Private Messages" (so it's clear that is also where you send them) and update when new messages are received, for example "Private Messages (3 unread)".
I've been using iPhoenix's user style ever since it came out and I really like all the styling elements. I like gradiants but I also believe the white to red is a bit outdated looking. Having a more subtle gradiant sounds like a good middle ground to me.
The only thing I would like to see removed is the post confirmation screen. If I click post and Cemetech immediately loads the topic and jumps to what I just posted (as if I clicked 'click here to view your message'), that's confirmation enough for me.
Strongly agree on that. Just take me to the post!
I vouch for TIny_Hacker's gradient. Looking at the current Cemetech gradient, it would be better with a more subtle gradient. The current gradient looks like someone colored with a whole lot of white crayon on the edges. The current titlebar(?) looks like it is just barely missing the Cemetech Red.
Whether or not the site is looks modern or not, you can't deny that it is immediately recognizable, and I'd like to preserve as much of the current look as possible. With that said, a few points to make here after reading through everyone's posts:
- I like the current gradient, but would be fine with it being a bit more subtle, like iPhoenix suggested
- I really like Tari's suggestion of putting random calculators in the title bar
- Having there be both a quick reply and a full reply box is perfectly fine, in my opinion, but I would welcome having a live preview for the full reply
- At the bottom of the page, the "Watch this topic for replies" link would be better put at the top of the page as its own button next to the "Reply to topic" button
- Latest archive uploads on the front page as mrwompwomp suggested would be good
- Not sure why there needs to be a "Back to top" button on every post, that would probably be better put as a floating element on the bottom right corner of the page
- The quick reply box should really take up the whole area available to it, and I think the "Message body" text could be removed
- The unstyled "Say" and "Configure notifications" buttons in the SAX sidebar widget look pretty bad
Besides these, I'd really like to avoid making a bunch of unnecessary adjustments to the site's frontend. I think that for the most part, the site is perfectly fine as it is; we should be focusing on incremental improvements rather than changing the whole look and functionality of the site for the sake of making it more modern. EDIT: iPhoenix pointed out to me that this probably wouldn't be viable because of the large amount of legacy code in Cemetech--that code should be reworked, but I'd like to retain as much of the current functionality of the site as possible.
While we're on the topic of site improvements (and since user pages is listed) I think
this topic about profile links should be mentioned as well.
One thing i think would be cool is to have custom styles, without any external extensions/scripts. So if people want a redesign, they get it, but if they don't, they can keep the old one.
Coder07 wrote:
One thing i think would be cool is to have custom styles, without any external extensions/scripts. So if people want a redesign, they get it, but if they don't, they can keep the old one.
Why not install a userscript manager for custom scripts? That is the purpose of userscript managers. Otherwise, Tari would essentially be reinventing the wheel with this. But I do think that custom styles that are popular enough, like iPhoenix's userstyle, should be shown in the list of themes.
I'm on a managed chromebook most of the time and they don't allow me to install extensions.
Since I happened to notice it while doing some other things today:
a previous version of this discussion.
I was just reminded of
this topic, which I made a while ago--it suggested allowing program authors to reply to program reviews. Not sure if it's relevant to put here or not, but it's still something I'd like to see.
Tari wrote:
There's a few good suggestions in there, like the last one about making the sidebar a bit wider when in SourceCoder, but most of it looks pretty outdated now.