-
Notifications
You must be signed in to change notification settings - Fork 14
Webpage layout #229
Comments
I like the styling here better than on http://ioos.github.io. The lettering is too big, and the big red text should be either green, grey, black, blue, but not red: |
@rsignell-usgs , @ocefpaf , @kwilcox , it is quite interesting, that about a year ago, when I started that series of IOOS GitHub Pages, and asked for comments on styling, colors, and layout, it was just Shane who provided some. Naturally, I assumed that everyone else was OK with the style. Since then, we have dressed around 10 GitHub Pages in that style; however, it's never too late to mend, and I guess that now is as good as any other time to agree on some particular theme/color palette/etc. |
Indeed. We must strive for a common style. Right now the system-test page is the standard pelican-octopress theme. This theme is used in so many places, my personal blog included, that makes it hard to associate the system-test with the IOOS identity. I will make this a priority and we can work a new style out together. |
And I promise to provide timely input this time. 😊 |
Apart from the font size and color, I believe that the current layout of the IOOS Pages is better for one big reason - it has a sliding sidebar that allows the content to use all page space. It may not seem important for a blog but it is very important for a documentation with images and large XML inclusions. |
@abirger, I agree that is nice. I think my main problem is with the colors and the number of different size fonts. I think Tufte had a rule that no more than 3 different combinations of font type/font size should be showing at any time. So with some minor tune up, I think this would be fine:
|
@rsignell-usgs , Thanks for pointing to the variety of fonts, it is definitely a mistake: while I've set the header font type to Helvetica, I've just overlooked that the paragraph font remained Times New Roman. I will fix that along with the header color. |
It sure can, although "regular web pages" may be quite different. Even the message you've referred to has different sizes for writing and publishing. |
This is a first test with the pelican lanyon mentioned by @abirger above. It looks like an IOOS page now. The main issue is the one-page layout. I like the summary+click-to-read better for navigation. We are missing:
I am clueless which will be less painful: (a) tweak the pelican-octopress layout to look like this, or (b) implement those missing features in the pelicanyan theme. |
@ocefpaf, where do we see this new one? |
I did not publish it because it is not working 100%. (We need at least the syntax highlight.) I just pushed this version to https://ocefpaf.github.io/system-test, if you want to inspect it, but it will take a while for GitHub to render it properly. |
@rsignell-usgs , @ocefpaf , @kwilcox , please check the http://ioos.github.io/ now. Is that better? |
@abirger Is there a way to get a Table of Contents on the right hand side (similar to a Wiki) or in the pop-out on the left? The font-size appears to be 20px: html {
font-size: 20px;
}
|
@abirger you beat me to it! That looks good, but maybe a bit too small (see The CSS change didn't effect many other content pages like: http://ioos.github.io/sos-guidelines/template/SML-DescribeSensor-Network/ |
@abirger, much better. But I agree the text is a bit too small now. |
@kwilcox , I updated just one page for now. I will change the others as soon as this page looks good enough. Will make the font larger right now. |
@kwilcox , @rsignell-usgs , what about now? Still too small? |
I like the size now |
@kwilcox , then I will propagate the style change to the rest of IOOS pages. |
@kwilcox , @rsignell-usgs , @ocefpaf , all IOOS GitHub Pages have been brought to the updated style. Should there be any other issues that need to be fixed, please let me know. |
The choice for pelican is the close integration with the IPython notebook. We write only notebooks and they get converted to HTML posts automatically. I will see what I can do to get the styles as close as possible. If not... re-invent the wheel using Hugo. |
Alexander Birger mentioned:
That is something we must do. I am guessing that right now the layout is something like this:
http://ioos.github.io/
White background, red headings, etc.
The text was updated successfully, but these errors were encountered: