Live data from Hacker News

How to build a website without frameworks and tons of libraries

kodingkitty.com

251–260 of 270 posts

Re: How to build a website without frameworks and tons of libraries

#251
The page has low contrast (3.5:1) and uses a fixed width font. Both are bad for legibility. The contrast is even too low to fulfill the WCAG minimum success criteria (4.5:1).

To me as a site visitor, that's more important than whatever framework it uses.

Also, uploading the site via FTP? There are far better options.

Re: How to build a website without frameworks and tons of libraries

#252

I've landed on the same approach for my photography portfolio. Benefit of jumping ship from development to photography is that I don't have to rely on Squarespace like most other photographers! After trying a few server-based options like Ghost, Statamic and self-built ones with Phoenix or Vapor (I've covered some ground as a dev) and the usual SSG options I ended up just writing everything as straight HTML without a…

You could use server-side includes to get the basic prev-next navigation and consistent menus, headers and footers.

I moved from static HTML to 11ty (https://11ty.dev) for the same reason and I'm pretty happy with how simple it allows you to keep things. Plus, it helps me avoid yak shaving instead of writing content!

I think for a site like this I'd go with 11ty, just a clean project without a template or custom config, one collection to pull the photos from Flickr inline the styles.

(just sharing my personal approach, nothing wrong with Jamie's approach, ofc)

Re: How to build a website without frameworks and tons of libraries

#253

Earlier quoted context omitted.

I see your point. My recommendation if you wish to improve your designs is to do them outside of CSS if you don't already. With something like figma or Penpot you will have your fonts, palette, spacing and layout all predefined. Then once all your views are created using these common elements, you only need to transcribe them as classes in your CSS and use those few classes where needed in your HTML. I'm not a design…

Without some design knowledge and experience (and dedication), starting from a blank canvas in Figma, Framer, or Penpot is going to be extremely difficult. Design is an art and skill in its own right.

Of course but starting from the assumption that he is doing it himself he will have an easier time using design software than jumping into CSS.

Design software encourages/enforces good design rules through its interface. You couple that with a willingness to learn and a bit of practice and you can achieve some nice things. Especially given that the design of some types of websites is very codified like SaaS or blogs.

Re: How to build a website without frameworks and tons of libraries

#254
post #233

I believe the most minimalistic and productive way is to just use php. The language was specifically just created for that. If it's a simple site then you don't need composer you don't need router logic. just create separate files for header footer navigation and include them on each page.

Agreed, with the caveat that it's only so easy if a server is already set up for it. Otherwise it loses a bit of it's edge, but not by much. We are being simple, and I consider a simple PHP site about one step above HTML and CSS in required complexity, and about 5 steps below anything else in regards to tooling/setup/execution.

I think every flavor of Linux except Alpine includes PHP by default if you go the VPS route and every $2 shared host also has PHP. Seems like a bit of a moot point.

Re: How to build a website without frameworks and tons of libraries

#255
post #29

I think everyone writing content for the web should learn HTML and maybe some CSS - although the design part should be done by someone good with CSS, so that you only need to use semantic HTML, or you will end up with div's all over.

I think CSS is an order of magnitude more complicated than html, so I'd leave that to the professionals. But pretty much everyone should learn html, I agree with that.

With a little bit of CSS I mean enough to know how to add some extra padding to all buttons on the site, like finding button { padding 4px } and change that to 6px.

Re: How to build a website without frameworks and tons of libraries

#256
post #62

Earlier quoted context omitted.

This still requires JS and localstorage. I've been considering this recently for my site and I settled on having prefers-color-scheme on the root domain with dark. and light. subdomains. If the user chooses a color they just get bumped to a subdomain that sets a cookie with their preference. If they come to the site from an external link and they have a preference cookie they get redirected to the subdomain again. Ab…

This sounds like it would have the same problem as redirects to mobile subdomains - users will share links to light. and dark. subdomains, unknowingly forcing their preference onto the recipient. The proper solution is to only implement the media queries and yell at browser vendors to make this easier to toggle either for all websites or for specific websites. Implementing a light/dark mode switch in every website is…

unknowingly forcing their preference onto the recipient

I'd suggest knowingly rather than unknowingly. It's a link to a website after all. It should link to the same thing that the person who shared it was viewing. That's the point of a URL - when you share one the recipient should see what you were seeing.

FWIW I would also like browser vendors to do a better job at enabling users to manage their preferences on a per site basis though.

Re: How to build a website without frameworks and tons of libraries

#257
post #10

This seems to fall into the 'simplistic, not simple' school of thought. You can have a relatively simple website if it doesn't do anything and if it cuts corners. Take your dark mode, which is just about the only nontrivial feature I see on this page. (One could also criticize the low contrast of the appearance and other problems, but that's less relevant to the simplicity thesis you're claiming.) First, your dark mo…

I was reading this thinking "that's a great analysis" and then read _who_ posted it. OP, this is the author of https://gwern.net, which has been very influential in the design of many technical blogs / personal sites and has some very inventive and fantastic ideas. Ie, the author knows what they're talking about.

My site uses CSS to respect light/dark theme, so has no manual toggle. It requires Javascript and I have a personal goal to have a JS-free site, just pure HTML and CSS. I also think that a site should respect the user's own light/dark settings, and so a toggle, if one ever exists for a site, should really be a browser setting on the browser toolbar.

/u/gwern, in case you read this, your design along with Tufte.css were one of the influences of my own site: https://daveon.design/ . (Also present is inspiration from older-style publishing and manuscripts, and personal preferences. But your site was the first one -- a key influence -- I saw that inspired me with what a modern, clean personal website could be and how it could look, as well as what it might contain. It's a real honour to see you here and reply!)

Re: How to build a website without frameworks and tons of libraries

#258
post #216
post #10

This seems to fall into the 'simplistic, not simple' school of thought. You can have a relatively simple website if it doesn't do anything and if it cuts corners. Take your dark mode, which is just about the only nontrivial feature I see on this page. (One could also criticize the low contrast of the appearance and other problems, but that's less relevant to the simplicity thesis you're claiming.) First, your dark mo…

Honestly if the goal is a website as simple as possible, dark mode should not belong there at all. We've had simple readable websites in 90s long before the dark mode fad was a thing, only having light mode is fine. > Third, this binary toggle is a bad way to implement dark mode because it ignores system/browser settings, so if a user has, say, enabled dark-mode on their smartphone OS, they still get served light-mod…

Why would simple avoid dark mode? It respects the user's preferences.

My site uses CSS to respect light/dark theme, so has no manual toggle. (A manual toggle requires Javascript and I have a personal goal to have a JS-free site, just pure HTML and CSS.) It was quite simple to do: just a media query and setting a few colours.

I also think that a site should respect the user's own light/dark settings, and so a toggle, if one ever exists for a site, should really be a browser setting on the browser toolbar. I don't know of a browser that does this, yet.

Re: How to build a website without frameworks and tons of libraries

#259

Earlier quoted context omitted.

There's a fairly high barrier for people to commit to installing a tool and building with it, especially if you haven't shown them what they'll get out. Docs look good otherwise.

That tutorial has an embedded dev server running on (I think) StackBlitz, so the barrier to taking a look is actually pretty low. (Of course it doesn't work for me with my normal firefox security settings, but running it in Chrome/Chromium is easy enough.)

Thanks, I'll see if I can get this to load. I was sort of hoping to see static website output. "Doesn't load" is a fairly high barrier.

Re: How to build a website without frameworks and tons of libraries

#260
post #10

This seems to fall into the 'simplistic, not simple' school of thought. You can have a relatively simple website if it doesn't do anything and if it cuts corners. Take your dark mode, which is just about the only nontrivial feature I see on this page. (One could also criticize the low contrast of the appearance and other problems, but that's less relevant to the simplicity thesis you're claiming.) First, your dark mo…

I was reading this thinking "that's a great analysis" and then read _who_ posted it. OP, this is the author of https://gwern.net , which has been very influential in the design of many technical blogs / personal sites and has some very inventive and fantastic ideas. Ie, the author knows what they're talking about. My site uses CSS to respect light/dark theme, so has no manual toggle. It requires Javascript and I have…

> My site uses CSS to respect light/dark theme, so has no manual toggle. It requires Javascript and I have a personal goal to have a JS-free site, just pure HTML and CSS. I also think that a site should respect the user's own light/dark settings, and so a toggle, if one ever exists for a site, should really be a browser setting on the browser toolbar.

I agree that it should definitely respect the OS level setting but I really like it when I'm given the option to override that setting. What if I don't like the way a site implemented their dark mode styles and I would rather switch back to light mode for just that one site. Having no toggle on the site I would have to go to my OS level settings, turn dark mode off, then later remember to go back to my OS level settings and turn it back on.

Post reply on HN