Page 1 of 1

Sabayon website makeover

Posted: Fri Jan 15, 2016 0:01
by svantoviit
In another discussion mudler has asked on opinions on the new web for Sabayon they are working on. So here are my three cents:
  1. The first impression is just bootstrap-boring. Bootstrap is a practical solution (see Gentoo, Fedora, OpenSuse), the danger is uniformity.
  2. Colours - the hottest topic of every design :wink: It would be just great if Sabayon finally would find its colour palette so one would at the first glance know it's Sabayon.
  3. And what about the style tag between head and body? :shock:
In my eyes Sabayon is an elegant distro and this should be obvious when you visit the website.

Re: Sabayon website makeover

Posted: Fri Jan 15, 2016 14:30
by mudler
First of all, thanks very much for your feedback it's really appreciated.

1) yes, for this indeed we *really* need designer
2) this is too much subjective, cannot speak myself since my tastes are barely acceptable
3) can you be more specific?

I'd like anyway to move this discussion to Github https://github.com/Sabayon/sabayon-website-next/issues
So we can actually manage TODOs, enhancement and contributions :)

Re: Sabayon website makeover

Posted: Fri Jan 15, 2016 22:24
by svantoviit
mudler wrote:3) can you be more specific?
I speak about this part of the code in /layouts/index.html:

Code: Select all

{{ partial "header.html" . }}
<style>
body {
margin-top: 0px; /* 100px is double the height of the navbar - I made it a big larger for some more space - keep it at 50px at least if you want to use the fixed top nav */
}

.btn-primary {
  margin: 1px !important;
}

</style>
<body>
The style element has to be placed inside <head>. Or move the styles into the stylesheet.

But this is actually just one of several misplaced tags/nesting issues. You can't nest <a> tags this way:

Code: Select all

          <a href="/desktop">
          <div>
          <button type="button" class="btn btn-danger btn-circle btn-xl"><i class="fa fa-desktop fa-3x"></i></button>
          </div>

          <h2>Desktop</a> <span class="label label-warning">Edition</span></h2>
You should check the code with some validator.

BTW Why Hugo? Do you plan to ditch Drupal?

PS: I'm happy to see new active devs coming to Sabayon. Thank you for your effort!

Re: Sabayon website makeover

Posted: Fri Jan 15, 2016 22:49
by mudler
The style it's needed to enforce the body to stay up. try to run it otherwise: just the index differs from the others, that's why you see that style over here while the others site sections are fine (yes, you just discovered my temporary hack :P ). misplaced tags isn't an issue, they will be automatically formatted on the way to go with automatic programs, it's just an handmade-alpha draft as for now, just to have feedback and also trying to involve other people.

Hugo it's a website static generator written in Golang: extremely portable, very powerful and light. There is no need to actually have a CMS for the frontpage. The deploys are automatic, so content is just fetched by the github repository.

The whole point here was to have a feedback on the visual effect of the site, and you perfectly made your point clear (i want to hear all feedbacks, we actually want to do a good looking, accessible site), because what is good looking for me, can't be good looking for everyone.

If you know HTML/JS/CSS and want to help, you are very welcome to open a pull request or an issue @Github

Re: Sabayon website makeover

Posted: Fri Jan 15, 2016 23:23
by wolfden
KISS is what I like, Keep it Simple Stupid

People need a clean interface with easy to find info without having to drill down link after link. So I do like the interface of this as it stands.

Maybe a better description of what Sabayon is. I know most want to know what it is based on, source vs binary, package manager, # of packages available, DE, etc.. It's hard for someone like me to give feedback as I know what it is all about and have a hard time looking at it as a first time ever discovery.

Does the user have the proper amount of information to say "this sounds and looks great" without them saying " wow, information overload, I am confused" or "what is this and does it come with sauce" I believe it presents it's self with information very well, but it definitely needs more of what is Sabayon. Maybe a section like
Sabayon Features
- item
- item
- item
- item
- item

Also, one thing I always want to see is a default screenshot of the desktop. When I look at other distros, I always use google image search to see what it looks like upon boot. If I see desktop of hello kitty and rainbows, I'm like, pass. I'm not saying we need a full size image on the main page, but maybe something like 200x400 or thumbnail that can be clicked to a full size image. A section with a screen shot of each DE we offer.

Re: Sabayon website makeover

Posted: Sat Jan 16, 2016 12:19
by sabayonino
Hi guys.

I'm not a web designer but ...

what about something like this web page ?
(This is news article that describe improved sign-up to the WCG community)

I know . it is a different world too ...

my 2c. :cyclops:

Re: Sabayon website makeover

Posted: Mon Jan 18, 2016 0:45
by wolfden
Wow, that is some pretty fancy stuff IBM world has, a bit too much in my humble opinion, but it is pretty cool. Have you seen the Kali Linux website? https://www.kali.org/ I like that, but would hate to copy it.

Re: Sabayon website makeover

Posted: Mon Jan 18, 2016 12:08
by sabayonino
wolfden wrote:Wow, that is some pretty fancy stuff IBM world has, a bit too much in my humble opinion, but it is pretty cool. Have you seen the Kali Linux website? https://www.kali.org/ I like that, but would hate to copy it.

Site(s) are specifically designed for mobile devices also ... :roll: