Subject: [alpine-devel] New alpinelinux.org website look

From: Carlo Landmeter <[email-masked]>
Date: Tue, 18 Oct 2016 17:53:58 +0200

Hello list,

This should probably belong to another list, but from my experience most of
our users are subscribed to alpine-devel.
I've been playing a bit with the design of our website and come up with the
following design:

http://alpine.nethq.org/

I would like to have input of our community about what we could improve.
For instance the "Selling Points" on the new download page could be vastly
improved.

I would like to launch this new design with our upcoming 3.5 release
(probably in November).

source is available in our git repo:
http://git.alpinelinux.org/cgit/alpine-mksite/?h=purecss-layout

And on github (which supports PR's):
https://github.com/alpinelinux/alpine-mksite/tree/purecss-layout

-carlo

---

From: Leo Unglaub <[email-masked]>
Date: Tue, 18 Oct 2016 18:06:51 +0200

Hey,

I think you did a great job with that site. The only think I noticed is the navigation on my phone. Maybe we should tweak the mobile navigation a little bit to work better on mobile devices.

Greetings

Leo

Carlo Landmeter <[email-masked]> schrieb am 18.10.2016 17:54:

Hello list,

This should probably belong to another list, but from my experience most of our users are subscribed to alpine-devel.

I've been playing a bit with the design of our website and come up with the following design:

http://alpine.nethq.org/

For instance the "Selling Points" on the new download page could be vastly improved.

I would like to launch this new design with our upcoming 3.5 release (probably in November).

-carlo

---

From: Cág <[email-masked]>
Date: Tue, 18 Oct 2016 17:55:16 +0100

> I've been playing a bit with the design of our website and come up with 

Hi,

Am I the only one to experience this[0]? Apart from that it looks neat.

Cheers,
Cág

[0]: https://i.sli.mg/aeXhq6.png

---
Unsubscribe:  [email-masked]
Help:         [email-masked]
---

---

From: 7heo <[email-masked]>
Date: Tue, 18 Oct 2016 17:16:56 +0000

It looks like this to me https://i.sli.mg/UTz6XN.jpg

On Tue Oct 18 18:55:16 2016 GMT+0200, Cág wrote:
>'���r��y�i�w�z����칻�&ޖ+-��i�w��{���zZZ���yׯz_�zZe��ljZb��b��h�

---

From: Jakub Jirutka <[email-masked]>
Date: Tue, 18 Oct 2016 19:22:05 +0200

Hi Carlo!

1. Download page: The download links don’t work for me (Firefox 49). The problem probably is that they are wrapped in <button> element (<a> inside <button>), that’s not correct IMHO.

2. As others already wrote, navigation bars are not responsible. You can make them wrap on mobile, or collapse into “hamburger menu” (but only when screen width is less than X!).

3. Community page: Top and bottom margins around h2 titles are currently in ratio 1:1, that doesn’t look good. Top margin should be higher than bottom, ideal would be probably golden ratio or just 3:2.

4. Community page: Line height inside unordered lists (ul) is significantly smaller than in the rest of the text.

5. Home page: I don’t like these shadow boxes in Alpine News and Latest Development, but can’t describe why. Just a subjective opinion.

Overall it looks very nice, especially the download page is much better than the current one.

Jakub

---

From: Carlo Landmeter <[email-masked]>
Date: Fri, 28 Oct 2016 12:25:41 +0200

On 18 October 2016 at 19:22, Jakub Jirutka <[email-masked]> wrote:

> Hi Carlo!
>
> 1. Download page: The download links don’t work for me (Firefox 49). The
> problem probably is that they are wrapped in <button> element (<a> inside
> <button>), that’s not correct IMHO.
>

This should be fixed now.

>
> 2. As others already wrote, navigation bars are not responsible. You can
> make them wrap on mobile, or collapse into “hamburger menu” (but only when
> screen width is less than X!).
>

Correct, if we want to use hamburger style menu's we will have to use
javascript (do we want to include js?)  like: http://purecss.io/
layouts/tucked-menu-vertical
Not sure how we would handle that with two menu's like we have now.

>
> 3. Community page: Top and bottom margins around h2 titles are currently
> in ratio 1:1, that doesn’t look good. Top margin should be higher than
> bottom, ideal would be probably golden ratio or just 3:2.
>

Margins increased.

>
> 4. Community page: Line height inside unordered lists (ul) is
> significantly smaller than in the rest of the text.
>

This is the default for purecss

>
> 5. Home page: I don’t like these shadow boxes in Alpine News and Latest
> Development, but can’t describe why. Just a subjective opinion.
>

I can remove the background color and borders, but im not sure it would be
any better. (suggestions welcome).

> Overall it looks very nice, especially the download page is much better
Thanks!

If you have some selling points for download sections, please share them.

---

From: Alba Pompeo <[email-masked]>
Date: Thu, 10 Nov 2016 13:02:37 -0200

PLEASE don't add JavaScript.
Alpine is about small, simple and secure.
JavaScript is *nothing* like that. Keep just simple html and css as it
has ever been until now.
Thank you.

On Fri, Oct 28, 2016 at 8:25 AM, Carlo Landmeter <[email-masked]> wrote:
> javascript (do we want to include js?)  like:
> http://purecss.io/layouts/tucked-menu-vertical

---

---

From: Carlo Landmeter <[email-masked]>
Date: Thu, 10 Nov 2016 16:27:56 +0100

> JavaScript is *nothing* like that. Keep just simple html and css as it
Thanks for your input.
You are welcome to send us patches to free us from the use of javascript.

-carlo

---

From: Alba Pompeo <[email-masked]>
Date: Thu, 10 Nov 2016 13:46:53 -0200

Well, why you need JS in first place?
It's for the menu? That can be done with CSS for example.
http://www.w3schools.com/css/css_dropdowns.asp

---

---

From: Carlo Landmeter <[email-masked]>
Date: Thu, 10 Nov 2016 16:59:05 +0100

> http://www.w3schools.com/css/css_dropdowns.asp

Sorry but im asking for patches not examples, and the example you showed is
not for responsive menu's.
The reason I have chosen this approach is because purecss suggest to use
them (the design is based on purecss):

Again, if you think it can be done without js, please provide us with
patches.

Thanks!

-carlo

> >> > I can remove the background color and borders, but im not sure it
> would
> >> > be
> >> >> Overall it looks very nice, especially the download page is much
> better
> >> >> than the current one.
> >> >>
> >> >
> >> > Thanks!
> >> >