[webarch-websites] Framework for a Nikola site

[Mark Nielsen]

Thanks for all this, Chris.

I haven't yet installed Nikola, so I'll make installing and learning that
the subject of my evening fun over the next few nights. I'm currently on OS
X, but I've got the homebrew package manager so it may well prove almost as
easy as with apt.

I've sometimes used Bootstrap for prototyping, but I've never felt very
comfortable with it as it requires a lot of presentational classes and tag
soup in your HTML, as well as mahoosive amounts of extra code and
libraries.  So although it can be expedient, I didn't want to foist that on
you.

Instead, I was going to use SASS/Bourbon, and incorporate various mixins
(essentially CSS functions) that I've developed to handle things like type
scale, mobile menus and CSS drop-down menus.

If others wanted to alter the CSS, they'd potentially need to install Ruby
and then the SASS and Bourbon gems.  That can be a bit of a ball-ache if
you're running Debian Stable, as Ruby stuff seems to move quite quickly and
version conflicts are not fun.  So to mitigate this, I could create an
additional blank 'tmp.css' file that's not processed by SASS, so people
without up-to-date SASS installed could add quick and dirty CSS which could
be folded back into the SASS codebase later.  Does this sound OK?  There
are so many benefits to building CSS with SASS that it's well worth the
overhead (if you're mainly a CSS developer).

Other that that - really grateful for the guidance you've written up,
Chris.  That should avoid me shooting off in directions that aren't what
you want.

Best wishes,
Mark.



On 13 November 2014 12:50, Chris Croome <chris at webarchitects.co.uk> wrote:

> Hi Mark
>
> On Thu 13-Nov-2014 at 09:29:25AM +0000, Mark Nielsen wrote:
> > I'll try and have a play around with this over the weekend and
> > add some better foundation CSS.
>
> Nice one.
>
> I like the CSS this set of templates uses in terms of the page content:
>
> - http://jekyllthemes.org/themes/pixyll/
> - http://pixyll.com/jekyll/pixyll/2014/06/10/see-pixyll-in-action/
>
> But wouldn't want to load external content like fonts, we need to use
> free ones we can serve ourselves.
>
> For navigation I think the way it works at http://jekyllrb.com/ could be
> suitable -- see the right hand navigation menu on pages like these:
>
> - http://jekyllrb.com/docs/home/
> - http://jekyllrb.com/news/
>
> When the pages is accessed with a narrow browser window the right hand
> navigation changes to a select box at the top of the page and even works
> with javascript disabled (though I can't see why, isn't this JS?
> <select onchange="if (this.value) window.location.href=this.value">).
>
> There is some discussion in the comments here regarding the
> semantics of using a form for navigation and some alternatives:
>
> - http://css-tricks.com/responsive-menu-concepts/
>
> I'm undecided if having separate navigation menus for these 3 parts of
> the site (I think it makes sense to view it as 3 sections like this)
> would be best of if we should look at having nested menus:
>
> - /docs/  Documentation   (should have lots of content added here..)
>
> - /news/  News            (should have lots of content added here...)
>
> - /       Everything else (limited amount of content, hosting, sysadmin,
>                            about pages)
>
> The advantage of having 3 separate sets of navigation links is that we
> wouldn't need nested navigation -- none of the Multi-level Navigation
> examples listed here are really that great:
>
> - https://bradfrost.github.io/this-is-responsive/patterns.html#nav-complex
>
> I'll continue playing with Nikola...
>
> > Do you have my current ssh public key (mark at howl)?
>
> Yes thanks, I have added it to the git repo webarch-nikola and the
> webarch-dev account so that "nikola deploy" should work for you.
>
> All the best
>
> Chris
>
> --
> Webarchitects Co-operative
> http://webarchitects.coop/
> +44 114 276 9709
> @webarchcoop
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webarch.co.uk/pipermail/webarch-websites/attachments/20141113/96bbf6a6/attachment.html>