Static Web Site Design Tools
-
It's been a while since I worked on static (non-database driven / non-CMS) web sites and am a bit out of touch. I know that some awesome new tools have cropped up like Hugo, Gatsby, Jekyll, and such have come about and they mostly look really cool. But they are all command line driven and while useful, would be pretty difficult for a web designer to work with. Big learning curve, and not a style that web people would be very comfortable using, I don't think.
I know that you can use WordPress and generate static sites from that. That has a "common workflow" advantage with non-static site design, so that's nice, too. But it's also quite a heavy process.
Wondering if anyone knows of other tools that might make sense. Could be a server side tool. Could be a desktop tool. Looking to see what is out there for making modern, nice websites, but static HTML.
-
-
@black3dynamite said in Static Web Site Design Tools:
Whoa, downloading now. Glad I asked, this looks amazing.
-
@black3dynamite already installed. Trying it out now.
For those that care.. using the AppImage version on Fedora 30. It is GPLv3 licensed.
-
-
@scottalanmiller said in Static Web Site Design Tools:
It's been a while since I worked on static (non-database driven / non-CMS) web sites and am a bit out of touch. I know that some awesome new tools have cropped up like Hugo, Gatsby, Jekyll, and such have come about and they mostly look really cool. But they are all command line driven and while useful, would be pretty difficult for a web designer to work with. Big learning curve, and not a style that web people would be very comfortable using, I don't think.
I know that you can use WordPress and generate static sites from that. That has a "common workflow" advantage with non-static site design, so that's nice, too. But it's also quite a heavy process.
Wondering if anyone knows of other tools that might make sense. Could be a server side tool. Could be a desktop tool. Looking to see what is out there for making modern, nice websites, but static HTML.
What's the issue with Hugo being a cli tool? You don't really interact with it that way. For local dev you just run
hugo server -Dand it runs a local instance. From there on you would develop like normal. -
@stacksofplates said in Static Web Site Design Tools:
@scottalanmiller said in Static Web Site Design Tools:
It's been a while since I worked on static (non-database driven / non-CMS) web sites and am a bit out of touch. I know that some awesome new tools have cropped up like Hugo, Gatsby, Jekyll, and such have come about and they mostly look really cool. But they are all command line driven and while useful, would be pretty difficult for a web designer to work with. Big learning curve, and not a style that web people would be very comfortable using, I don't think.
I know that you can use WordPress and generate static sites from that. That has a "common workflow" advantage with non-static site design, so that's nice, too. But it's also quite a heavy process.
Wondering if anyone knows of other tools that might make sense. Could be a server side tool. Could be a desktop tool. Looking to see what is out there for making modern, nice websites, but static HTML.
What's the issue with Hugo being a cli tool? You don't really interact with it that way. For local dev you just run
hugo server -Dand it runs a local instance. From there on you would develop like normal.Hardly. If you do that you just get a blank page. It might not be a huge amount, but the amount of command line work a designer would need to do to even get Hugo to bring up a site is a bit...
https://discourse.gohugo.io/t/hugo-101-slowstart-for-beginners/18383
And the documentation is pretty bad. That there even is any kind of GUI is not something I've seen anywhere. It appears to be completely CLI or nearly so.
-
@stacksofplates just went through this example too...
https://opensource.com/article/18/3/start-blog-30-minutes-hugo
And finally Hugo displays something, but absolutely all editing is done from the CLI. The Hugo server is just there to show the output of your changes. Which is handy, for sure. If you want to do CLI work and quickly see changes, Hugo seems to work great. But for a designer who wants to make changes, enter stuff at a GUI, it doesn't appear to have anything like that. Not that Publii is a WYSIWYG kind of tool, but it is a lot less intimidating for a non-dev/IT person to start making a website.
Although I could see Hugo being really great for a heavily pre-built site and just making basic tweaks.
-
If hugo is too complicated, why not something like lightsail?
-
@IRJ said in Static Web Site Design Tools:
If hugo is too complicated, why not something like lightsail?
I'm lost. Lightsale is a VPS service. They have a completely unrelated web design toolkit for designing sites graphically? That would be some crazy branding. They don't mention web design anywhere on their site, only their VPS products.
-
@scottalanmiller said in Static Web Site Design Tools:
@IRJ said in Static Web Site Design Tools:
If hugo is too complicated, why not something like lightsail?
I'm lost. Lightsale is a VPS service. They have a completely unrelated web design toolkit for designing sites graphically? That would be some crazy branding. They don't mention web design anywhere on their site, only their VPS products.
Yeah my bad. Reading about Hugo briefly in the previous comments had me think it was doing actually provisioning.
-
@IRJ said in Static Web Site Design Tools:
@scottalanmiller said in Static Web Site Design Tools:
@IRJ said in Static Web Site Design Tools:
If hugo is too complicated, why not something like lightsail?
I'm lost. Lightsale is a VPS service. They have a completely unrelated web design toolkit for designing sites graphically? That would be some crazy branding. They don't mention web design anywhere on their site, only their VPS products.
Yeah my bad. Reading about Hugo briefly in the previous comments had me think it was doing actually provisioning.
Oh, I guess it kind of does... if you wanted to run the site from their embedded server, lol. That's just meant for previewing, though, from what I can tell. Not for any editing or production usage.
Hugo is neat overall, it allows you to rapidly edit and preview a site, then generate static HTML from it to deploy via GIT or whatever. WP will do this but is crazy cumbersome as you need a running server and a live database-backed site that works and use that for every update or change. Great for a single site, bad for any number of them.
-
@scottalanmiller said in Static Web Site Design Tools:
The Hugo server is just there to show the output of your changes
Yeah I mean you have to have some files there for it to display. But once you generate the site, it's just markdown and HTML/CSS/JS. You can do that in VSCode or anything to have linting and other tools. It doesn't have to be cli.
-
Plus you should just start with a theme. You can just take their config.toml and add your specific info and then your pages.
-
@stacksofplates said in Static Web Site Design Tools:
Plus you should just start with a theme. You can just take their config.toml and add your specific info and then your pages.
Yeah, I've done that. And it definitely gets you a lot farther. But it's still a lot to train a designer on.
What I'm hoping for is something akin to working in Wordpress, but to just produce a static site. WordPress is perfectly easy for a normal designer to work on. But producing a dynamic web application for every little site isn't practical at all.
-
I think Publii is perfect for what @scottalanmiller is looking for. Seriously, I can see why something like this would make since for certain users.
Choosing what server type to deploy too is pretty straight forward.
-
What @black3dynamite is mentioning is probably best.
I guess I just don't see how a WYSIWYG is helping with "web design". For content creators I can see the point, but if you're actually doing design you're not using a WYSIWYG editor.
-
@stacksofplates said in Static Web Site Design Tools:
I guess I just don't see how a WYSIWYG is helping with "web design". For content creators I can see the point, but if you're actually doing design you're not using a WYSIWYG editor.
That's true. But there is a pretty big chasm in complexity between what the majority of web designers are used to using, which is mostly WordPress, and what tools like Hugo do. One gives you graphical feedback instantly, one requires a lot of confusing work before you can even tell something exists.
Designers, by their very nature, are graphical. We are IT people the CLI is our native environment. Designers are the opposite. Hugo might actually be easier for me, rather than harder. But for a traditional designer, it's hard enough to induce panic. Whereas WordPress is just "pick it up and start playing".
-
There's also an experimental WordPress importer too.
-
@scottalanmiller said in Static Web Site Design Tools:
@stacksofplates said in Static Web Site Design Tools:
I guess I just don't see how a WYSIWYG is helping with "web design". For content creators I can see the point, but if you're actually doing design you're not using a WYSIWYG editor.
That's true. But there is a pretty big chasm in complexity between what the majority of web designers are used to using, which is mostly WordPress, and what tools like Hugo do. One gives you graphical feedback instantly, one requires a lot of confusing work before you can even tell something exists.
Designers, by their very nature, are graphical. We are IT people the CLI is our native environment. Designers are the opposite. Hugo might actually be easier for me, rather than harder. But for a traditional designer, it's hard enough to induce panic. Whereas WordPress is just "pick it up and start playing".
Well that's what I mean though. Say you edit a CSS file in the theme you're using for Hugo, if you're using the local server you immediately see those changes. And at least in my experience, most of that is done in the browser first with the browsers developer tools, and then transferred to your source when you get it how you like it.
