a thoughtful web.
Good ideas and conversation. No ads, no tracking.   Login or Take a Tour!
comment
Hyperseeker  ·  1400 days ago  ·  link  ·    ·  parent  ·  post: Show hubski: midnight.pub

> I went ahead and updated the username length to 20 character maximum. Let me know if you think I should increase that.

So, apparently, emails allow up to 64 characters for the username (the part before the @-sign). Twitter now allows 50 characters, with its previous 15-character limit based in its previous nature of being SMS-driven. I see no reason not to up the limit to somewhere up in that range.

There's also the concern of the minimum username length. Is there any particular reason to set it as high as 3 characters?

> I would love to get your feedback on other parts as well if you are interested. :)

I was going to write out a short list initially, but it didn't seem necessary. Now that you ask...

1. There's no immediately-obvious way to sign up, as there is with signing in. Whether registering an account right now is easy is irrelevant: it's best to provide the user with the initial opportunity to do so. User comes in, sees that registering is possible, tries it out – maybe they find the message of "Midnight is in alpha, key is required", but at least they know where to go.

1.1. Consider using two different terms for registration and logging in. There's this confusing-ass trend of "sign in" + "sign up" where you have exert effort to focus in order to distinguish which is which because the two look similar enough for your brain to mix them up unless they're in the focal point of your vision. Consider distinct wording. Apparently "log in" + "register" is not cool anymore, even though it works very well. How about "sign in" + "make an account"? "Log in" + "Make a blog"?

2. The main screen is in two-column layout, while Entries are single-column. Consider making both single-column, to avoid post-switch confusion: it's temporary but unpleasant.

3. The "midnight moon" symbol in the corner of the page is excellent. It even scales with the zoom level, which is a very nice detail. Keep it, whatever you do, unless you come up with something that's decidedly better.

4. Make sure to distinguish Entry body from whatever reference it makes. At the very least, mention that these are the references made by the Entry: this gives immediate clarity at very little cost otherwise.

4.1. Also make sure that the "next"/"previous" links are meaningful. You can't immediately tell what the "Previous" link is to when it's below References: is it the previous Entry? is it the previous page of References? is it previous on some form of bookmark list? Minimalism is good and all, but when it obscures meaning, you may want to consider employing a different practice. You want knobs and bells that most users can easily and immediately tell apart and use intentionally.

5. I would advise separating body text from Entry titling. Let users make in-Entry Markdown titles that don't affect the Entry's overall title. While I can see the appeal of using top-level heading from the body, there isn't a structure in the Entry making (as far as I can tell) that makes good use of it. It's a feature that dangles in the air, and it's confusing by default: I'd expect to have a separate input field where I'd name the Entry I'm making, and I'd also expect to be able to use semantic leveling in the body of my Entry starting from the top level (single #), rather than from level 2 (##).

6. Consider giving multiple inputs a meaningful amount of spacing, perhaps like this, with `0.5em`.

7. The HTML structure could use a little polishing. You're using `<section>` elements for simple pocketing of content, which is not its purpose. `<section>` is meant to be the foundation of semanic HTML structuring; while there are no tools to use it yet, it is its stated purpose, along with many other HTML5 elements, like `<main>` or `<header>`. Don't use it where you simply want to group two elements together, like in the sign-up page's `<form>`: use `<div>` for that.

7.1. The way I understand it, the best way to use `<section>`s is by making it a wrapper for related contextual elements. You can use `<article>` to hold the body of the Entry, and use `<section>`s for each heading-separated part of the text: `<section>` → `<hN>` + `<p>` + `<img>` + `<blockquote>` + whatever other content element there is.

7.2. Avoid empty elements for spacing. Add margins and padding to `:first-child`, or `:first-of-type`, or `:last-of-type` pseudo-elements, or to the wrapper elements themselves, or to the next element after the one you want to add space after (e.g. `section + section`).

8. Consider using `<time>` element for dates.

9. Consider adding some form of subtle delineation between Entries of a list. Fading out is good, but there's order in knowing where exactly it ends when you're faced with two Entries one after another.