20 ms·
Static web – back to the roots?
- mrzool 7y agoAdmittedly just bikeshedding, but the author is using a blockquote tag instead of an h2/h3 right under the h1 title for the summary of the article. Makes me think he probably doesn’t have that firm of a grasp on the fundamentals of semantical HTML and markdown, let alone web development in general. This is, by the way, something I see a lot out in the wild, especially in Medium articles but also in READMEs on GitHub. Please stop using blockquote tags for emphasis purposes.
- icebraining 7y agoThe lede is not a heading, why should the author use an <h*>?
- mrzool 7y agoI see your point, an h* would probably also be inappropriate. What would you use? Just a normal p tag with some styling?
- ravenstine 7y ago`role="heading"`?
- detaro 7y agono, that's the same as <hX> I'd probably go with just a styled text, maybe with an aria-label.
- techntoke 7y agoAgree. Hugo is a great tool for static sites, and GitLab offers free pipelines for the conversion and SSL with Let's Encrypt. Don't forget to gzip your content as the final step.
- mathgladiator 7y agoWhat I love best is that you don't need much to get started with generating a static web site, and you can be confident that once you deploy you don't have to worry that much about security or other production issues. This greatly lowers the bar for entry, and I was doing this back in the 90s with Microsoft Access 95 and VBA for my school's website.
- neya 7y agoI'm at present working with a client who is on Wordpress. It's a huge company with 100s of employees in just one of their locations and they don't actually have dedicated manpower to maintain their homepage. This is where I got in. Once I audited their site, I found a ton of issues, particularly - their stale Wordpress version, themes and plugins. I updated them all one by one and migrated them to Wordpress.com which doesn't suffer this upgrading pain. Then, I found out the theme provider had actually stopped supporting the theme and there were a bunch of security flaws in it. But, the client wanted something like push and forget. So, I painstakingly migrated them off of Wordpress and made a custom Jekyll site with Jekyll admin running on Netlify. They're immensely happy now knowing that their site is virtually unhackable (it's just a static site). Static site builders are more powerful than we think. I have a travel platform running on it right now actually and none of the end users know its a static site they're on top of. There's no plugins to manage, no software versions or security loopholes to keep track of. The only way someone can hack into your site if they hacked your identity provider (Eg. Netlify). Otherwise, it's simply just a boon.
- HatchedLake721 7y agoWhat about keeping Wordpress under the hood to manage and update the pages, but then generate static pages off that?
- neya 7y agoAt some point your Wordpress installation version will be so far ahead that it may break your unmaintained theme eventually. Which is why I avoid this route if I can. It's hard to make promises to clients based off something so fragile.
- mediascreen 7y agoWell, you have just built a custom theme to support the data from Netlify. I guess you could just as well have built a custom theme for Wordpress to avoid being stuck with an unsupported theme.
- dmje 7y agoIt's an interesting piece, and lots of good reasons to "go static". But. They're developer reasons. What almost everyone who piles into this support of static stuff seems to completely ignore is the audience here. Who do you think is editing your website? Amy the developer who has no problem committing stuff to Git or learning Markdown or Dave, who is a marketing manager and spends most of his life in Word writing press releases and social media posts? The entire point of a WYSIWYG editor is that it doesn't require any developer experience. If you genuinely think a corporate website can be run out of a Git workflow or a requirement to learn Markdown, you're basically in the wrong room. This is the whole "IT bottleneck" that content teams have been battling for years: it's back to the early 90's days of "yeh, we want to update our homepage but we need IT to do it for us". Somewhere in the middle is the holy grail: performant sites that are also editor friendly.
- adrianN 7y agoI don't think that a static website necessarily requires a developer workflow that a marketing manager can't use. You just need a tool that turns things into static HTML once.
- dmje 7y agoCompletely agree - with this and previous couple of comments. The frustration for me is not that it can / can’t be done, it’s the fact that developers and content people are still (I’m 20+ years in the web industry and this was a problem in 1995 too..) not properly understanding each others’ skills and needs. The more generic point here is that developers build better tools when they properly understand their audiences. In this case, the audience is almost always “a non technically skilled editor”. IMO most young technical startups would do well to remember this too.
- onion2k 7y agoGatsby can pull content from WordPress[1], so nothing changes for your content workflow but you get all the speed and security benefits of a static site. It's a pretty common workflow these days. [1] or dozens of other sources.
- 7y ago
- eitland 7y agoBonus: If you write plain, valid HTML your site will just work across all mainstream browsers and it will probably work reasonably wrt accessibility as well, -out of the box. It will also be reasonbly fast. You might be able to eke out more performance from a site that has a lot of interaction but I'd not take that for granted.
- kragen 7y agoI think this is a reasonable thing to do. For Dercuano, I hacked together a basic static site generator in Python 2 in a weekend (70% of the current static site generator code dates from the first three days, according to git blame); I've spent more time hacking on the CSS than on the Python, and immensely more time writing the text than either. In case it's useful to someone else, as inspiration if nothing else, it's at https://gitlab.com/kragen/dercuano https://gitlab.com/kragen/dercuano, in the public domain. The latest version of the output is at http://canonical.org/~kragen/dercuano-20190525.tar.gz http://canonical.org/~kragen/dercuano-20190525.tar.gz.
- jjjbokma 7y agoWhy Python 2 if I may ask? I wrote my static site generator in Python 3.7 by manually translating the Perl version I had written earlier. Both are available at github https://github.com/john-bokma/tumblelog https://github.com/john-bokma/tumblelog Example of this set up: http://plurrrr.com/ http://plurrrr.com/
- kragen 7y agoNo real reason for using Python 2 — it was just an expedient choice in the moment. Amusingly, your tumblelog.py is about the same size as dercuano.py, while the intersection of features is almost exactly empty. We managed to do even the most basic things differently — for example, yours reads a single long file with % lines separating the entries (like a fortune file!) and produces a passel of output files, while mine reads a passel of input files and produces a single multi-megabyte output file. This diversity of choices perhaps demonstrates the need for experimentation to see what works best for different people and in different circumstances. (Or it could just mean I'm insane.)
- reacharavindh 7y agobut sometimes you legit need dynamic capabilities. I'm now pondering about selling a few items through my website(built with Hugo). But, how? So, I'm stepping into Wordpress realm because that's where the payment processing stuff are. Anyone here know/have done a shopping website built with Hugo and a simple third party service for payment processing?
- walterstucco 7y agoHave you tried PayPal ?
- vector_spaces 7y agoI haven't used them, but I was evaluating SnipCart as an option for adding e-commerce capabilities to a static site. Other requirements made us ultimately decide to port everything to Squarespace, but I've been thinking about turning on a small static site store of my own with these guys. https://snipcart.com/ https://snipcart.com/
- icebraining 7y agoYou can use Stripe Checkout without a server - all you need is to configure the products on the Stripe account, then use JS on your site to pass the product SKUs when redirecting to the Checkout page: https://stripe.com/docs/stripe-js/reference#stripe-redirect-to-checkout https://stripe.com/docs/stripe-js/reference#stripe-redirect-...
- thirdsun 7y agoI currently run a static website with a shop using Shopify's JavaScript SDK. All the benefits of Shopify's excellent backend and admin interface while still using a performant website that can be designed however I please. Another option is Snipcart, which explicitely works as a drop-in shop for any website[2]. [1] https://shopify.github.io/js-buy-sdk/ https://shopify.github.io/js-buy-sdk/ [2] https://snipcart.com/ https://snipcart.com/
- md1204 7y agoSnipcart has been mentioned a few times already, but you should check this tutorial on their blog: > https://snipcart.com/blog/hugo-tutorial-static-site-ecommerce https://snipcart.com/blog/hugo-tutorial-static-site-ecommerc... It shows exactly the use case you're mentioning with Hugo.
- alfonsodev 7y agoAren't static pages similar to a cache ? Wouldn't you obtain the same benefits while still keeping Wordpress if you would use something like Varnish[1] or CloudFlare Edge cache[2] ? [1] https://www.varnish-software.com/wiki/content/tutorials/wordpress/index.html https://www.varnish-software.com/wiki/content/tutorials/word... [2] https://wordpress.org/plugins/cloudflare-page-cache/ https://wordpress.org/plugins/cloudflare-page-cache/
- jakozaur 7y agoStatic website is a controlled cache to the extreme, when you prepopulate cache when you create the content. Benefits on top of regular cache: + maintenance cost: you need to upgrade wordpress, why my static website doesn't require any work over years + security: small vulnerability surface + cost: hosting even popular static website is cheap
- ivanhoe 7y agoYou certainly would. I had very good results on clients' sites using a combination of varnish, cdn for images, and firewall to block any external probing - basically allowing only clean url GET requests to predefined set of urls, and blocking admin area access to anyone except whitelisted IPs. It's just as fast as a static site would be, and almost as secure. It takes more maintenance and costs a lot more to setup, but you get the benefits of CMS that all content authors/editors know how to use, so clients didn't mind it.
- pacifika 7y agoThe main issue I have with static sites is that publishing from mobile isn’t simple. That said I also have this issue with WordPress, so I’m using Known now
- indigodaddy 7y agoI checked out Known and it looks quite interesting. Surprised I’d never heard of it. How are you liking it? Is it well maintained/frequent releases?
- JeanMarcS 7y agoThere was an article yesterday on a french tech web site about a member of parliament asking if there was a way to encourage developers to make less bloated softwares for ecological reasons (less power consumption). The text was around 5.5ko on a page weighting around 3mo... Edit : link to the post (in French) https://www.numerama.com/tech/518848-un-depute-souhaite-que-les-developpeurs-codent-mieux-au-nom-de-lenvironnement.html https://www.numerama.com/tech/518848-un-depute-souhaite-que-... Edit 2 : replaced encline with encourage
- eguanlao 7y agoWhat does "encline" mean?
- JeanMarcS 7y agoStrictly nothing in this sentence so I replaced it with encourage. Thanks ! (For the record, the word I wanted to use was incite. I don’t know why it pops out that way)
- bArray 7y agoPlease share the link!
- mlok 7y agoIn this article, another article in English is cited : "Software Disenchantment" already discussed on HN : https://news.ycombinator.com/item?id=18012334 https://news.ycombinator.com/item?id=18012334
- lazyjones 7y agoThere is a misconception in the article: static websites aren't guaranteed to be small and dynamic websites aren't necessarily big (in size of assets / load times). Most of the bulk in modern websites comes from JavaScript (frameworks, tracking, ads), images, videos. All these can and are used both with static and dynamic websites. Static websites may be mostly hassle-free for developers/devops, but they're typically more of a hassle for content producers. I don't see a convincing case for them overall, because one of their bigger advantages - that they are easier to cache (or rather: to keep cacheable when developers add stuff) upstream than dynamic websites - is mostly gone from the web infrastructure.
- icebraining 7y agoI don't see why they would be more of a hassle. Why would they even care if the HTML is being rendered on demand or pre-rendered and stored? Regarding cache, I don't agree - having your site cached by the edge nodes of a CDN is quite important nowadays.
- lazyjones 7y ago> Regarding cache, I don't agree - having your site cached by the edge nodes of a CDN is quite important nowadays. How many of the Alexa top 10K or so have cacheable HTML content (not JS, CSS, images, video) in CDN? Can you provide a few examples?
- bArray 7y agoMy current static setup consists of: * Nginx [1] - Serve the content with some settings, such as compression and HTTPS. * Pandoc [2] - Builds the HTML pages and throws a header and footer in there, as well as a comments section [3]. * Bash script [4] - Runs in a screen session, polls git for changes, pulls and rebuilds the content, then builds RSS feeds. Whilst this works for me, I could see how WordPress could be desirable. Some online editor, ability to add "plug-ins" (i.e. some bits somebody else coded), tracking, comments, etc. I think there is space for some static page generation system/script that adds a light weight editor and the ability to add other people's scripts. [1] https://www.nginx.com/ https://www.nginx.com/ [2] https://pandoc.org/ https://pandoc.org/ [3] https://github.com/danielbarry/free-comment https://github.com/danielbarry/free-comment [4] http://coffeespace.org.uk/projects/site-creation-v2.html http://coffeespace.org.uk/projects/site-creation-v2.html & http://coffeespace.org.uk/projects/rss-feed.html http://coffeespace.org.uk/projects/rss-feed.html
- 52-6F-62 7y agoI do something close to the same, except each MD post is generated on request so I can update easily if needed. Probably not suitable for anything of demand, but my site isn’t! I wrote a slapdash server in Go, stuck it behind Nginx, and can just add posts ad-hoc. Only requirement is I have to restart the server to rebuild the list of available posts in memory. After that posts can be edited at will. Post metadata comes from a four line header. Deployment is pretty manual. Just store everything in a repo, pull changes in on the serving machine and run the Go server in TMUX. No comments or anything, though. And I rarely write anything. It was mainly an exercise for learning some Go. That may even change yet. No repos to share yet as it’s not presentable but will gladly do the work to share in a gist if anyone’s curious.
- bArray 7y ago> each MD post is generated on request so I can update easily > if needed. You mean each client socket? If so that would be awfully slow for high volume traffic. > Only requirement is I have to restart the server to > rebuild the list of available posts in memory. This seems quite undesirable too, where does this requirement come from? > pull changes in on the serving machine Is this manually pulling or do you fetch in a loop? > will gladly do the work to share in a gist if anyone’s > curious. I'm certainly curious now to see exactly how this Go program works.
- revskill 7y agoStatic web is fine for some use cases. For an admin dashboard, static web is stupid.
- sintaxi 7y agoStatic is perfect for an admin dashboard since it doesn't have SEO requirements. Static doesn't mean there isn't any dynamic content is just means the assets are static files that can be cached both server and client side. Dynamic content can be fetched by the client, it doesn't need to be fetched and delivered by the server.
- anthuman 7y agoI guess that's one definition of static webpage. My understanding was that static webpages are static. Meaning it has no dynamic content and that everyone accessing the static page sees the same thing. If dynamic content is client side driven, it wouldn't be "static" as each client could see a different page. For example, even if you your webpage just displayed the client side time, it would be dynamic since people in different time zones will see a different time regardless of the time being generated on the client side. Whether it is a static class or a static webpage, static has a well established meaning in the CS world. But I haven't done web development since college and it is possible the meaning of static webpage has changed as technology changes.
- sintaxi 7y agoStatic is a term to describe the assets that are delivered to the client. It means every user is delivered the same assets which means the server doesn't have to do any logic. The assets can be delivered from a CDN and cached on the client indefinitely. Sending every user `document.write(new Date());` is static because its identical for everyone. The fact each user sees something different is completely irrelevant.
- chipsa 7y agoStatic webpages are served exactly the same to each user. As opposed to dynamically generated webpage. But that doesn't mean a static webpage doesn't use Javascript. It just means the actual content delivered is the same every time.
- sandGorgon 7y agothe biggest problem with JAMStack (everything including Gatsby, Jekyll, Hugo, etc) is that there is no single place with a nice source code repo, CMS system and hosting. Basically, to get your JamStack to work - you need to use Github + Github hooks -> Contentful/Cosmicjs -> Netlify. I believe this is a missing and a killer product. People think "oh why reinvent Github". But a business guy who wants a fast website does not know what github is - he/she just need a single place to do everything. the workflow that would work is - upload my code to dashboard (using git/FTP upload). Write content in CMS and see the website change within a few seconds. Reupload new code, and the website changes within a few seconds.
- huy-nguyen 7y agoYou should check out Gatsby Preview which is currently in some sort of limited public beta. https://www.gatsbyjs.org/blog/2018-07-17-announcing-gatsby-preview/ https://www.gatsbyjs.org/blog/2018-07-17-announcing-gatsby-p...
- infominer 7y agoFor static site generators: https://github.com/pinceladasdaweb/Static-Site-Generators https://github.com/pinceladasdaweb/Static-Site-Generators https://staticsitegenerators.net/ https://staticsitegenerators.net/ I keep all my resources for working with GitHub Pages, here: https://infominer.id/web-work/github-pages-starter-pack/ https://infominer.id/web-work/github-pages-starter-pack/ and am most familiar with GitHub facilitated Jekyll: https://github.com/planetjekyll/awesome-jekyll https://github.com/planetjekyll/awesome-jekyll MkDocs makes really nice pages that don't require fussing around with frontmatter, with auto generated navigation based on directory structure. It also opens your publishing toolkit to python's universe of markdown related extensions, which you may already be familiar with. https://www.mkdocs.org/ https://www.mkdocs.org/
- claviska 7y ago> WordPress was one of the most visible early proponent of WYSIWYG, but others joined. I added inline editing to Surreal CMS back in 2013, but obviously it’s not a well-known brand (the keyword is “visible” I guess). People love inline editing, especially non-devs. When you abstract content into forms or markdown you often end up with results that look different from what you intended. I get feedback from new users weekly about how easy inline editing is for them. Fortunately, TinyMCE, CKEditor, ProseMirror, et al all support it and the trend is finally shifting. But as a developer, I can attest that inline editing isn’t easy to get right — even when the underlying lib supports it. I suspect that’s why we still see forms for content in CMSs.
- nudpiedo 7y agoWhat I understand: the most used solution, Wordpress, is an attractive market but has a slow UI and experience, please consider using my markdown solution which I positioned in a different page than this article.
- sys_64738 7y agoDisable Javascript and you too can surf the WWW like it's the 1990s!
- whiddershins 7y agoAll I want in life (as far as web authoring goes) is a wysiwyg editor for static html that creates fairly clean code and can provide responsive templates. I just want to type text and drop images in and see it in real time, and then I would like to be able to define one or more areas on a page that contain dynamic content. That dynamic content can be served up when visitors reach the site, or can be compiled by the static site generator periodically, I really don’t care about that step. I don’t want to abstract “templates” from content. I don’t want to abstract anything. I just want to type and drop in other media without extra steps. Why does this not exist? Am I supposed to be using Dreamweaver? I just don’t get why all these other solutions are so disjointed. Edit: Maybe I want to be using blocs
- tenaciousDaniel 7y agosounds a bit like markdown tbh
- arithma 7y agoI've recently purchased a license for Bootstrapstudio for $60 and I want to send a vote of confidence. Does exactly what you're describing. I wish they had a bit more integration for templates for webapps but you can only do so much at the end of the day. There are similar other offerings (one that comes to mind is reactstudio, but has a bit more going on there with code and flow.
- jjjbokma 7y agoI currently have a static microblog, which is open source [1]. It's generated from a single mark down file with some custom stuff to separate articles. I've been using it for two months and so far I have been able to blog daily [2]. [1] https://github.com/john-bokma/tumblelog https://github.com/john-bokma/tumblelog [2] http://plurrrr.com/ http://plurrrr.com/
- jandearbeider 7y agoI tested it and even I am not a fan of mark down I am amazed fast speed,simply customizing colors, nice templates and git pull I replaced Wordpress for this system.. - for the SEO part looks like it beats Wordpress -JSON is in there also Great job....used on http://www.werken.nu/blog http://www.werken.nu/blog
- zzo38computer 7y agoI hate WYSIWYG (although I am not trying to prohibit anyone from writing/using them if they want to, only to say that you should not be forced to use WYSIWYG), but certainly for a lot of stuff, static web pages (especially if do not require script and a lot of other external resources) would be helpful, and sometimes gopher would do better, too. (Use of other protocols is also sometimes helpful for non-static stuff too, such as telnet/SSH for interactive sessions, or remote virtual table protocol (or maybe a better protocol and implementation can be made up), for remote database queries.)
- deleted 7y ago[deleted]