My implementation of the redesign is pretty much complete.

Check it out: http://d-ag0aep6g.rhcloud.com/

This is an implementation of a design done by one Ivan Smirnov, brought forward by Jacob Carlborg [1].

The dark forum widgets on the home page are in iframes. Their styling will need to be updated at the source, which is forum.dlang.org.

Another external dependency is the This Week in D script. Adam, it would be nice if the `setTwid` function could take the date separately. That would allow me to word the text without having "This Week in D" there twice.

Other than those two little things I consider this done. From my side it could be merged immediately.

But I'm sure there are a thousand things wrong with this. Here are some topics to get you started:

1) Legalities

I mentioned this before, but noone reacted. Can we use Ivan's work? Do we have his ok? Do we need it? Jacob mentioned that he can't in contact with him anymore. Is that a problem?

2) Reviewing the code

https://github.com/aG0aep6G/dlang.org/commits/Ivan-Smirnov's-redesign

This is just one giant commit (the others are independent minor fixes). GitHub refuses to show the diff for the style.css file, because it's too big. Is this acceptable, or do I need to split it up somehow? If I need to split it up, any advice on how to do that?

3) New Pages

Aside from the overall style changes and menu reorganization, I also added overview pages for the articles and for the tools:

http://d-ag0aep6g.rhcloud.com/articles.html
http://d-ag0aep6g.rhcloud.com/tools.html

They feature new text that should be proofread.

4) Fonts

Vladimir Panteleev has spoken out against web fonts [2]. His argument is that they can look fine on one system but bad on another. Indeed the recently changed code font on dlang.org looks pretty bad for me while the default 'monospace' looks just fine, which is why I reverted that in the redesign.

The redesign uses a web font for its main font, though: Roboto Slab. It looks good for me, but I'm not able to test it on a large variety of device/OS/browser combinations. Maybe it's fine, or maybe we should stay away from web fonts categorically. I don't really have an opinion on this.

5) Justified Text

Andrei loves it, everybody else hates it. I killed it as the mockup didn't have it. Is that ok, or is justified text a must?

6) Red For Clickables Only?

Currently, the site uses red almost exclusively for clickable stuff. But it's also used as a highlight color for non-clickable things. For example in phobos signatures:

http://d-ag0aep6g.rhcloud.com/phobos/object.html#.Object

The left borders of the signature boxes are red, and the documented symbol is highlighted with red.

Red does not signal clickability here. I don't like that and I'd prefer to go with another color for generic highlighting, reserving red for clickable stuff.

7) The Logo

As requested by Andrei, this does not feature a logo change for now. I'm going to make a pull request for the slicker logo variant [3] when this is through.


[1] http://forum.dlang.org/post/n53ps0$2j8f$1@digitalmars.com
[2] http://forum.dlang.org/post/xezfeilxblfkibldvsgg@forum.dlang.org
[3] https://gist.github.com/aG0aep6G/0803ec5ae49f6afb0196

On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
> My implementation of the redesign is pretty much complete.
> check it out: http://d-ag0aep6g.rhcloud.com/

Well I think it's very good, the layout is clean and very presentable.

I know that isn't your fault, but that logo needs a change. ;)

Matt.

On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
> Another external dependency is the This Week in D script. Adam, it would be nice if the `setTwid` function could take the date separately. That would allow me to word the text without having "This Week in D" there twice.

Once it goes live, I can change it to be whatever you want.

In the mean time btw, you could scan the string for parens. I always use the same format: "This Week in D (date)" so you could slice that string to get the date.

On 2016-01-08 23:32, anonymous wrote:
> My implementation of the redesign is pretty much complete.
>
> Check it out: http://d-ag0aep6g.rhcloud.com/

I'm not sure that I like that some of the headers (learn, packages) are clickable on the main page. This also causes some icons to be black (gray?) and some to be red. How about a link at the end of the section with the title "Read more", or similar?

> [3] https://gist.github.com/aG0aep6G/0803ec5ae49f6afb0196

I like it :)

Ideally we should make something like a base logo with only two colors. The logo needs to be recognizable with this basic design. Then it should be fine to create different variations with different colors, backgrounds, shadows and so on, if necessary.

The point is that one would recognize the core from the base logo in all of the variants, then we would have a more flexible logo.

-- 
/Jacob Carlborg

On 1/8/16 5:32 PM, anonymous wrote:
> My implementation of the redesign is pretty much complete.
>
> Check it out: http://d-ag0aep6g.rhcloud.com/
>
> This is an implementation of a design done by one Ivan Smirnov, brought
> forward by Jacob Carlborg [1].
>
> The dark forum widgets on the home page are in iframes. Their styling
> will need to be updated at the source, which is forum.dlang.org.
>
> Another external dependency is the This Week in D script. Adam, it would
> be nice if the `setTwid` function could take the date separately. That
> would allow me to word the text without having "This Week in D" there
> twice.
>
> Other than those two little things I consider this done. From my side it
> could be merged immediately.

I give it my seal of approval. It's a large change but something familiar enough in style that current maintainers can continue maintaining.

> 1) Legalities
>
> I mentioned this before, but noone reacted. Can we use Ivan's work? Do
> we have his ok? Do we need it? Jacob mentioned that he can't in contact
> with him anymore. Is that a problem?

Please reach out to Ivan by email. If he comes later, I'm sure he'll love seeing his work implemented with credit. The worst he can do is ask us to take down the page.

> 2) Reviewing the code
>
> https://github.com/aG0aep6G/dlang.org/commits/Ivan-Smirnov's-redesign
>
> This is just one giant commit (the others are independent minor fixes).
> GitHub refuses to show the diff for the style.css file, because it's too
> big. Is this acceptable, or do I need to split it up somehow? If I need
> to split it up, any advice on how to do that?

I think we're fine.

> 3) New Pages
>
> Aside from the overall style changes and menu reorganization, I also
> added overview pages for the articles and for the tools:
>
> http://d-ag0aep6g.rhcloud.com/articles.html
> http://d-ag0aep6g.rhcloud.com/tools.html
>
> They feature new text that should be proofread.

Nice touch.

> 4) Fonts
>
> Vladimir Panteleev has spoken out against web fonts [2]. His argument is
> that they can look fine on one system but bad on another. Indeed the
> recently changed code font on dlang.org looks pretty bad for me while
> the default 'monospace' looks just fine, which is why I reverted that in
> the redesign.
>
> The redesign uses a web font for its main font, though: Roboto Slab. It
> looks good for me, but I'm not able to test it on a large variety of
> device/OS/browser combinations. Maybe it's fine, or maybe we should stay
> away from web fonts categorically. I don't really have an opinion on this.

I'd say go with the webfont and let us change it based on forward experience.

> 5) Justified Text
>
> Andrei loves it, everybody else hates it. I killed it as the mockup
> didn't have it. Is that ok, or is justified text a must?

Justified font only looks good in conjunction with hyphenation. I'd say make text justified on browsers that support css hyphenation (all but Chrome I recall?) and left align on the others.

> 6) Red For Clickables Only?
>
> Currently, the site uses red almost exclusively for clickable stuff. But
> it's also used as a highlight color for non-clickable things. For
> example in phobos signatures:
>
> http://d-ag0aep6g.rhcloud.com/phobos/object.html#.Object
>
> The left borders of the signature boxes are red, and the documented
> symbol is highlighted with red.
>
> Red does not signal clickability here. I don't like that and I'd prefer
> to go with another color for generic highlighting, reserving red for
> clickable stuff.

Up to you.

> 7) The Logo
>
> As requested by Andrei, this does not feature a logo change for now. I'm
> going to make a pull request for the slicker logo variant [3] when this
> is through.

Sounds good.


Thanks. Let's put this in motion!!

Andrei

On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
> My implementation of the redesign is pretty much complete.
>
> Check it out: http://d-ag0aep6g.rhcloud.com/
>
> This is an implementation of a design done by one Ivan Smirnov, brought forward by Jacob Carlborg [1].

Very nice work. Thank you for doing this.

> The dark forum widgets on the home page are in iframes. Their styling will need to be updated at the source, which is forum.dlang.org.

Once this is merged, would you be OK with working together on updating the forum to the new design?

> 2) Reviewing the code
>
> https://github.com/aG0aep6G/dlang.org/commits/Ivan-Smirnov's-redesign
>
> This is just one giant commit (the others are independent minor fixes). GitHub refuses to show the diff for the style.css file, because it's too big. Is this acceptable, or do I need to split it up somehow? If I need to split it up, any advice on how to do that?

I think this is fine as it is.

> 3) New Pages
>
> Aside from the overall style changes and menu reorganization, I also added overview pages for the articles and for the tools:
>
> http://d-ag0aep6g.rhcloud.com/articles.html
> http://d-ag0aep6g.rhcloud.com/tools.html
>
> They feature new text that should be proofread.

Perhaps also link to (or even replace with) the wiki pages:

http://wiki.dlang.org/Articles
http://wiki.dlang.org/Development_tools

BTW, I've been meaning to make a MediaWiki skin based on the dlang.org design for a while.

> 4) Fonts
>
> Vladimir Panteleev has spoken out against web fonts [2]. His argument is that they can look fine on one system but bad on another. Indeed the recently changed code font on dlang.org looks pretty bad for me while the default 'monospace' looks just fine, which is why I reverted that in the redesign.
>
> The redesign uses a web font for its main font, though: Roboto Slab. It looks good for me, but I'm not able to test it on a large variety of device/OS/browser combinations. Maybe it's fine, or maybe we should stay away from web fonts categorically. I don't really have an opinion on this.

It looks good here (Firefox/Linux), and I agree that it fits the design nicely. I'll agree with Andrei, let's use it unless we run into some issues.

> 5) Justified Text
>
> Andrei loves it, everybody else hates it. I killed it as the mockup didn't have it. Is that ok, or is justified text a must?

IIRC the main point of contention was hyphenation (IMO hyphenated text is unusual and harder to read on the web). I agree that if hyphenation is a must, then justified text can be an improvement, but generally it seems to be a highly situational question.

> 6) Red For Clickables Only?
>
> Currently, the site uses red almost exclusively for clickable stuff. But it's also used as a highlight color for non-clickable things. For example in phobos signatures:
>
> http://d-ag0aep6g.rhcloud.com/phobos/object.html#.Object
>
> The left borders of the signature boxes are red, and the documented symbol is highlighted with red.
>
> Red does not signal clickability here. I don't like that and I'd prefer to go with another color for generic highlighting, reserving red for clickable stuff.

It's important to have some way to distinguish links from non-links, e.g. by underlining links (and only links). Unfortunately, in some places underlining all links doesn't work well, e.g. the "Jump to" indices in Phobos docs. I guess it's something that warrants some experimentation.

Perhaps just use bold without a color change for symbol highlighting? The red borders look fine to me, I don't think they present any ambiguity.

> 7) The Logo
>
> As requested by Andrei, this does not feature a logo change for now. I'm going to make a pull request for the slicker logo variant [3] when this is through.

Ironically, the current "official" logo is in the same legal position as the current design - we never got a confirmation from its author whether and how we can use it.

On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
> My implementation of the redesign is pretty much complete.
>
> Check it out: http://d-ag0aep6g.rhcloud.com/

Looks great!

> 3) New Pages
>
> Aside from the overall style changes and menu reorganization, I also added overview pages for the articles and for the tools:
>
> http://d-ag0aep6g.rhcloud.com/articles.html
> http://d-ag0aep6g.rhcloud.com/tools.html
>
> They feature new text that should be proofread.

Also great.

> 4) Fonts
>
> Vladimir Panteleev has spoken out against web fonts [2]. His argument is that they can look fine on one system but bad on another. Indeed the recently changed code font on dlang.org looks pretty bad for me while the default 'monospace' looks just fine, which is why I reverted that in the redesign.

One nitpick here: can you change the function signatures to use a monospace font (any will do really)? Also, can you institute this change to the function signatures as well: https://github.com/D-Programming-Language/dlang.org/pull/1169

> 5) Justified Text
>
> Andrei loves it, everybody else hates it. I killed it as the mockup didn't have it. Is that ok, or is justified text a must?

See my arguments here: https://github.com/D-Programming-Language/dlang.org/pull/1152

> 6) Red For Clickables Only?
>
> Currently, the site uses red almost exclusively for clickable stuff. But it's also used as a highlight color for non-clickable things. For example in phobos signatures:
>
> http://d-ag0aep6g.rhcloud.com/phobos/object.html#.Object
>
> The left borders of the signature boxes are red, and the documented symbol is highlighted with red.
>
> Red does not signal clickability here. I don't like that and I'd prefer to go with another color for generic highlighting, reserving red for clickable stuff.

I would take the converse of your conclusion because I have to disagree with the use of red for links. People expect links to be blue and underlined and darker when they are already visited; it's one of the only design standards that exists on the web.

If you change links to be blue, then you can keep red as a highlight color.

On 09.01.2016 23:36, Jack Stouffer wrote:
> On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
[...]
>> 4) Fonts
[...]
> One nitpick here: can you change the function signatures to use a
> monospace font (any will do really)?

Done.

> Also, can you institute this change
> to the function signatures as well:
> https://github.com/D-Programming-Language/dlang.org/pull/1169

It's already in. You have to look at the pre-release docs. The release docs are built with an older dmd.

Example: http://d-ag0aep6g.rhcloud.com/phobos-prerelease/std_algorithm_searching.html#.commonPrefix

>> 5) Justified Text
[...]
> See my arguments here:
> https://github.com/D-Programming-Language/dlang.org/pull/1152

I'm going the conservative route for now, keeping the text justified. I don't think hyphenation/justification is worth the troubles, but Andrei is the one that would have to be convinced here.

>> 6) Red For Clickables Only?
[...]
> I would take the converse of your conclusion because I have to disagree
> with the use of red for links. People expect links to be blue and
> underlined and darker when they are already visited; it's one of the
> only design standards that exists on the web.
>
> If you change links to be blue, then you can keep red as a highlight color.

I think that standard is pretty weak, more of a default really.

We want a red site, not a blue one. Links are the site's number one source of color. Blue links would make for a blue site with a red bar on top.

Re visited links: I removed the :visited styling without thinking too much about it, as I don't consider it very important. Am I wrong?

On 09.01.2016 23:24, Vladimir Panteleev wrote:
> On Friday, 8 January 2016 at 22:32:59 UTC, anonymous wrote:
[...]
> Once this is merged, would you be OK with working together on updating
> the forum to the new design?

Sure.

>> 3) New Pages
[...]
> Perhaps also link to (or even replace with) the wiki pages:
>
> http://wiki.dlang.org/Articles
> http://wiki.dlang.org/Development_tools

Added links. About replacing, let's see later.

>> 6) Red For Clickables Only?
[...]
> Perhaps just use bold without a color change for symbol highlighting?

That works pretty well with the new de-emphasized template constraints and a monospaced font (as per Jack Stouffer's request). So uncolored, bold symbols and red borders it is.

On 09.01.2016 22:43, Andrei Alexandrescu wrote:
> On 1/8/16 5:32 PM, anonymous wrote:
[...]
>> 5) Justified Text
[...]
> Justified font only looks good in conjunction with hyphenation. I'd say
> make text justified on browsers that support css hyphenation (all but
> Chrome I recall?) and left align on the others.

I.e., revert the change. Done.

By the way, in Ubuntu I don't see any hyphenation in Firefox. It works in Windows, though.