Re: Website proposal for usability

[Devin Samarin <eboyjr14 gmail com>]

On Thu, Aug 26, 2010 at 3:22 AM, Martyn Russell <martyn lanedo com> wrote:
> On 21/08/10 12:12, Devin Samarin wrote:
>> I finished the re-design of the GTK-Doc area:
>> http://eboyjr.homelinux.org:8080/gtk/gtk-doc/
>
> I agree with most of the comments here, I also don't really think it looks
> great to have a sub-menu at the top of the page like that.

Okay I have updated it to use a global navigation at the top of the
page labeled "Part of the GTK+ Project". I think this fits really well
and it is similar to how BBC's news section does this.

>> I made it usable for mobile devices and people with smaller screens
>
> Actually, this is not really what I had in mind for smaller devices, a lot
> of websites have a /mobile implementation which is less horizontally
> challenging ;)

What's horizontally challenging about it? For handset devices and when
the width of the browser window is less then 650 pixels, every part of
the document flows, as there is no width set on any of the elements.
The sidebar collapses into a normal section of the page.

>> The only page left--in my opinion--that needs polishing is the features
>> page.
>
> Actually, this is one of my favourite pages, it looks great. What did you
> want to polish here?
>

Well I think is good so far, but I was thinking of adding some useful
screenshots of the widgets, but that is going above and beyond and I
won't do it if no one wants me to.



On Thu, Aug 26, 2010 at 3:49 AM, Martyn Russell <martyn lanedo com> wrote:
> On 12/08/10 11:02, Devin Samarin wrote:
>>
>> On Thu, Aug 12, 2010 at 1:50 AM, Martyn Russell<martyn lanedo com>  wrote:
>>>
>>> So my comments:
>
>>> 4. The "Downloads" page feels the wrong way round to me. I always prefer
>>> more content on the left side where there are multiple columns - must be
>>> my OCD kicking in ;) can we switch these around?
>
> Actually, I quite like that idea of removing the columns. If we do that, I
> would put the "stable" downloads first.

Done.

>>> b) the shadow on the git commands don't look good hear, I would prefer
>>> it was the way we had it before to be honest. As it currently looks it
>>> feels like I need new glasses :P
>
> I see you updated it, but to be honest, I still prefer the way it was. The
> black background for the git commands really feels like a terminal and
> that's what I love about it. It looks as I would use it. The font as it is
> now is just too subtle

Done.

>>> 5. The "Screenshots" page has an odd number of images, I would prefer
>>> this to look like a grid, so we should either remove the Windows image
>>> at the bottom or find 2 more to go beside it.

Done.

>>> 7. The "Success Stories" page has a heading "More Applications" which
>>> should really be under all the grey boxes. The Maemo and GNOME
>>> paragraphs should line up too IMO (vertically). Arguably Maemo should be
>>> changed to MeeGo everywhere.

I think MeeGo uses QT for everything and only has GTK+ installed for
Moblin compatibility. I think we should just leave Maemo?

>> Okay I made the "More applications" box into a 'bubble', but I've left
>> the name of it as a header. What do you think?
>
> It looks a bit out of place if I am honest. The title is blue which is the
> same as the larger titles at the top while confusing the situation by
> placing it in a bubble.
>
> I think I would prefer it was a regular heading like the ones at the top.
> Perhaps also changing the title to "Community Applications" since
> gtkfiles.org is more about that really.

Done.

>>> 8. The "OverView" page has the same indentation issue with the icons.
>>> And the columns look a lot closer than say the Downloads page, this
>>> again triggers my OCD :)
>>
>> Well they are actually exactly the same :P... It probably looks like
>> that because the text is crammed together... I added space to the list
>> of libraries, but I don't know if it really helped. Maybe I can put
>> that into a sidebar bubble?
>
> Hmm, not sure that would work. This is the fundamental part of this page.
> Additionally, the icon top is still higher than the text and that should be
> aligned if possible.

Fixed the icon positioning. I think that page is fine the way it is right now.

> Perhaps a subtext in the title mentioning "*G*IMP
> *T*ool*K*it". At the very least explaining this on the front page makes
> sense.

Done. It's in the first paragraph on the About page.

> I also like what you did with the shade difference in the background there
> ;)

Thanks!

>>> d) I prefer the title in Red rather than Blue, it looks more colourful,
>>> cheerful, etc.
>>
>> I kinda disagree here too because the color red makes people more
>> tense as opposed to a calming blue...
>
> That's one way of looking at it, my way is, it looks more bland and less
> expressive. To use the BBC as an example again, their site has much more
> colour on it and I like that. It does make it harder to get the balance
> right, but I think it is worth it.
>
>> I also think the blue goes very
>> well with the grey, and when I think of GTK+ I think of clearlooks for
>> some reason and clearlooks doesn't have any red in it :P
>
> I agree, it does go quite well, but splashing another colour in there
> (especially one of the colours used in the icon above) still has a synergy
> about it which I like.
>
> Can we try it at least for a short time? Perhaps others can comment on this
> to get more feedback.

Okay I will set it red for now, but I think I have a solution that
will bring some color into the page while leaving the header colors
the same. I am thinking of a medium-to-thin ribbon on the grey page
background that uses the colors of the GTK+ Logo in vertical stripes
as the ribbon twists down for about 600 pixels or so. That may be all
it needs. :) When I get on my Windows machine I'll work on it.

>>> So a couple of other things.
>>>
>> I'll check the pages for validity.
>
> Apart from the obvious violations sure, but fixable issues should at least
> be processed.

Actually every single page should now be XHTML 1.1 Strict validated
perfectly. There are two CSS files: global.css which is CSS validated,
and browser.css which is everything that is not accepted by the
validator (CSS3 and browser-specific styling)

>> I can add [Bitstream Vera Sans as the main font] if you
>> would like.
>
> I agree.

Done.

> A final note, from today, just the last things that are niggling me :)
>
> - The text under headings like "Where can I use it?" on the main page are
> all indented for some reason and it really shouldn't be. It looks out of
> place to me.

I am gonna leave it, because the indentation greatly increases
readability. The answers to the questions should be indented because
when you see the question, you know where the answer is. If it is not
indented, it's harder to tell where the answer ends and the normal
paragraphs begin. If someone else think I should fix it, I will. I
could also indent only the first line? I really think it's good the
way it is.

> - As said previously, the git commands should have a black background I
> think as they were.

Done. Agreed.

> - 2 more images on the screenshots page would be nice (perhaps some more up
> to date ones?) to make it look like a table of images. The bottom row looks
> a bit out there on its own right now.

Done. Agreed.

> - I would perhaps rearrange the Development page a little, but having in the
> sidebar: "Bug Reporting", moving the "Best Practices" out to the main page,
> moving "Donations" down to the bottom of the page and moving "Language
> Bindings" to the main part of the page. When I think about what would be
> accessed quickly from that page, it is usually things like, reporting a bug,
> looking in the wiki, writing to a mailing list. The rest is not really
> something that is done that frequently IMO.

Done. Agreed.

> - The "Platforms" page for "Success Stories" should really have MeeGo in
> there I think. It should also include the N900 under the "Maemo" section.

Wikipedia tells me that they use either Mx or Qt for the main
applications and only has GTK+ to support Moblin :/

> - The "Downloads" page doesn't have the unstable tarballs listed there, the
> "unstable" part of the page should perhaps be renamed to "Bleeding Edge" :)
> since we do actually have unstable tarballs too.

Done.

> Looks great though, would love to move to this new design soon.

:)

Devin.