from Hacker News

Show HN: HTML for People

by blakewatson on 10/10/24, 5:47 PM with 220 comments

  • by simonw on 10/10/24, 8:27 PM

    This is great. The decision to skip CSS by depending on https://simplecss.org/ is smart - CSS is a whole other thing, and having that on top of basic HTML would be pretty intimidating.

    I did worry a bit about https://htmlforpeople.com/zero-to-internet-your-first-websit... - "Step 1. Create a folder on your computer" - because apparently a large number of people these days don't understand files and folders at all! https://www.theverge.com/22684730/students-file-folder-direc...

    Not sure how best to approach that though. Having a whole chapter of the book explaining files and folders feels pretty redundant. Maybe there's something good you could link to?

  • by mightybyte on 10/10/24, 8:18 PM

    I think the fundamental approach being taken by this project is immensely valuable to the world. This kind of education about open standards might actually be the most powerful tool that can help us take steps in the direction away from giant opaque corporations and back towards the systems based on open standards that the internet originated from. I really hope this project continues to be updated and get more and more eyes and contributors. If you feel the same way, I'd say at least throw it a GitHub star. https://github.com/blakewatson/htmlforpeople

    (Note: I have nothing to do with this project thus far and have nothing to gain from saying this.)

  • by jraph on 10/11/24, 6:14 AM

    Well done! I really like how you make people write bare text, publish it and bam, that works, just like this, and how you ease into html.

    The text is very well written, straightforward, welcoming, well structured. It seems easy and enjoyable to read.

    I believe that putting html in non professional hands is a good goal.

    Some feedback:

    - About <meta charset="utf-8">, it seems to be introduced quite late. People comfortable with English but wanting to write their website in their own language might be surprised. Or even people with accents in their names (you are putting your name in the title, people will probably try this). You also say that it's for special characters like emojis, but you should probably say it's essential for most languages that are not purely ASCII (event English with words like cliché). Maybe you could introduce that earlier and say that it's there for historical reasons and that without it, you may have issues with characters. To be checked but it might be better to put it before <title>.

    - body, head, html tags are mostly useless, except for html because of the lang attribute (accessibility + some browsers incorrectly offering to translate)

    - vscode is a bit unfortunate because of the telemetry part, and seems quite heavy and complex for the task. On Windows, notepad++ is a great option. On Linux, any default text editor that's already installed will do. There's always codium, which is code without the bad parts. The intended target doesn't know about the bad parts, so they are installing spyware without knowing.

    I didn't know about the aria current page feature, I'll start using this.

  • by forbiddenvoid on 10/10/24, 8:52 PM

    I love the idea and I'm thrilled to see more sites like this out there. But I do think this assumes a level of computer literacy that isn't consistent with typical, non-technical users.

    Step 1 starts with:

    > Pick a location on your computer and create a folder. Call it my-site or something similar.

    You've already lost the vast majority of people right here. There are a shockingly large number of people out there that use computers EVERY day that won't know how to do this.

  • by messo on 10/10/24, 8:47 PM

    I have tried so many times to convince non-technical people that they can put together their own website quite easily, but so often they think I'm joking and that it requires a lot of effort.

    Next time I'll refer the to this site and ask them to give it half an hour and see what they can create in that time. I know that so many would get hooked if they just get that first taste of "wow, i just published something on the actual web!"

    @blakewatson: Any plans to add i18n to the site and accepting pull requests for translations?

  • by aardvark179 on 10/10/24, 8:02 PM

    Why, “Start coding already!” rather than something like, “Start writing already?” I think half the barrier to people building sites is that they think they need to know how to code, and that seems scary, but they do know what they want to write, and that seems more approachable.
  • by henning on 10/10/24, 7:50 PM

    This is great. I love you how started with a tiny HTML file and didn't immediately ask the user to install NodeJS and VS Code and a ton of other webdev shit.
  • by divbzero on 10/10/24, 7:56 PM

    I love the order of tutorial, starting simple to deploy something first:

    1. Use Notepad/TextEdit to create a plain text index.html.

    2. Deploy index.html to Neocities or similar.

    3. Add content with headings and images.

    And only then going back to:

    4. Make it proper HTML with <head> and <body>.

    5. Upgrade Notepad/TextEdit to Visual Studio Code.

  • by gabrielsroka on 10/10/24, 9:49 PM

    Would something like this work instead of using Notepad/TextEdit (at least at first)? Of course, this code could be made better...

      <textarea onkeyup='results.innerHTML=this.value'></textarea>
      <div id=results></div>
  • by jamiedumont on 10/11/24, 5:01 PM

    This is a brilliant endeavour and incredibly well executed! I’ll certainly be bookmarking it to share with others.

    I’ve recently decided to start adding to my website with just hand-written HTML, and slowly migrating the back catalogue. I love its directness, its ability for ad-hoc changes to a page and its robustness. After trying almost every system for publishing on the web under the sun; I’ve concluded HTML is the right tool for the job, even if it means a little extra work up front.

    As a retired developer I’m happy to tinker with Rust or SQL or something embedded when the mood strikes, but when I want to write, I just want to write - and HTML kind of lets me do that. I think if more people saw HTML as a document to author rather than just a build target then we’d have a lot simpler systems. This mindset has resulted/allowed for a huge dumbing down of average computer/web users and huge headaches for developers. I can’t think who all the complexity we’ve brought into the world serves 99% of the time.

    This resource might be one of the things that nudges us back on track.

  • by al_borland on 10/11/24, 1:49 AM

    Thank you for being one of the few people who realize TextEdit on the Mac supports plain text. The number of “experts” who say it doesn’t support it and tell people to download some other app drives me nuts.
  • by chrisldgk on 10/12/24, 6:30 PM

    An absolutely great tutorial and something I wish I had when I first started playing around with HTML about 11 years ago (I’m 26, quite late to the party).

    Even though I’ve been working as a full-stack for quite a few years now I’ve been hooked while reading just imagining and remembering how magical building my first few websites used to be. I’m hoping this will get some more people to realize how easy it is to build your own webpage and how much fun it can be building your own little place on the internet.

  • by amanzi on 10/11/24, 3:04 AM

    I still remember creating my first html page back in the 90s. It felt really magical creating it with just Notepad - changing the bgcolor of a page to red or blue or whatever, was amazing.
  • by AlienRobot on 10/10/24, 8:34 PM

    I'm happy to see more people recommending Neocities :D
  • by lemonberry on 10/11/24, 11:45 AM

    This is great, but most people don't care about coding or building their websites for scratch. Most people don't work on their own cars. Authors don't bind their own books.

    People want to share their thoughts, stories, and photos. In my opinion, we need better tools to allow people to create their own sites without needing to code.

  • by brunoarueira on 10/12/24, 12:37 PM

    The concept is great, my father, which is a doctor, bought a minibook at a newsstand about HTML for dummies. At the time (maybe 98 upto 2000) explaining the good old markee, blink and other tags besides the basic HTML document composition. So, I think learn HTML is for everyone!
  • by jimbosis on 10/10/24, 9:14 PM

    I plan to dig in deeper, but this looks like a great introduction to building websites.

    I teach a one semester high school Web Design class and currently use a mixture of lessons from these two for learning the basics of making pages by hand with HTML and CSS:

    https://internetingishard.netlify.app/

    https://www.washington.edu/accesscomputing/webd2/student/ind...

    This looks very promising and could supplant or at the very least supplement those.

  • by brianzelip on 10/11/24, 3:09 PM

    Here's a great podcast episode with the author about "home cooked apps", https://shoptalkshow.com/609/
  • by globular-toast on 10/11/24, 6:30 AM

    This is how I learnt to program as a kid around 1997. My dad taught me to do exactly this. I didn't have it up on Neocities, though, in fact I didn't put something on the public web till years later, should've done it sooner! So I just had my own little website with multiple pages that were meticulously maintained.

    However, I did become quite lazy and would never have continued maintaining it as raw HTML. I discovered PHP which gave me superpowers, but it is quite a paradigm shift. I wish I knew about static site generators sooner.

  • by Brajeshwar on 10/11/24, 3:09 AM

    A few months back, someone asked for suggestions on which new AI options to learn to beef up his marketing career. I told him to learn HTML first. That will be useful for a long time and will likely last his lifetime. After that, he can start learning others.

    I even x-ed it at https://xcancel.com/brajeshwar/status/1812149514632925525

  • by debacle on 10/10/24, 10:25 PM

    > I don’t think websites were ever intended to be made only by “web professionals.”

    I absolutely agree with this, in both directions - the tools we have kind of suck if the web WAS meant for professionals, but also that I remember learning HTML from tutorials in 1995, and back then there wasn't much of a difference between a good website or a great website except that a good website used a table based layout and didn't have prev/next navigation.

  • by breck on 10/13/24, 1:33 AM

    Nicely done! Might be cool to offer a PDF version? It would be nice to zoom out and see all the content at once.

    Here's my user test:

    https://news.pub/?try=https://www.youtube.com/embed/j_A2egms...

  • by itohihiyt on 10/11/24, 9:54 PM

    I think this is great, my biggest stumbling block is deploying what I've created. I have a domain and need a host. The paragraph about deploying only covers hosting by a service you can't use you own domain on (as far as I can tell). It mentions netlify, which I assume would be an option if you have your own domain, however their website talks about shit but tells you nothing.
  • by egypturnash on 10/11/24, 12:42 PM

    Is HTML ever actually defined in the beginning of this book? There’s a reference to what the acronym expands to when tags start getting introduced but the chapters before this never come out and say “HTML stands for HyperText Markup Language, and here are three sentences that very briefly explain what that means; we’ll be exploring that in much more detain in the coming chapters.”
  • by stego-tech on 10/10/24, 9:09 PM

    We sorely need more of this. HTML was the first language I actually understood (although BASIC was my first ever), and left me feeling empowered to carve out my own survival on the internet. While layering CSS and Javascript aren't bad decisions on their face, I do think they combine to create a steep barrier to entry for most newcomers as they're believed to be "Core" to the language of HTML itself.

    Kudos to the author(s) for the site. I'll have to add it to my arsenal as a "next step" for folks who want something more custom than WP/Ghost on PikaPods w/ a theme, or who just really want to be totally independent.

  • by famahar on 10/11/24, 3:09 AM

    I love making stuff like this accessible for many people. Giving it a quick read and while I do find it more readable I think you can still lose people when you define terms. More fun analogies and simple silly (non technical looking) pictures could really help a concept sink in faster. Great work overall though.
  • by monkeynotes on 10/11/24, 4:22 PM

    Don't coding LLMs kind of fill this gap? I can't imagine anyone who isn't a pro wanting to spend time learning HTML when they can just describe what they want in plain text and get something good enough.
  • by bethemoly on 10/16/24, 2:29 AM

    Thanks for writing the book! I’m glad I came across it while learning how to make a website.
  • by ErikAugust on 10/10/24, 7:49 PM

    One additional book recommendation: HTML and CSS, the Good Parts.
  • by RheingoldRiver on 10/11/24, 8:13 AM

    > Step 1. Create a folder on your computer

    I don't need to read farther than this, I'm never going to recommend this over freecodecamp. Let alone that a lot of people are usually on mobile during learning time, it just makes it too scary, too easy to mess up, too hard to share what you are doing to get help.

    I 100% believe online sandboxes are the way to teach coding to people who aren't already comfortable with technical problem solving.

  • by darkdrog on 10/11/24, 9:51 AM

    this is a great tutorial even for experienced programmers, many of them even don't understand the nature of website behind the coding , but this tutorial leads a wise way to illustrate this concept
  • by serverlord on 10/11/24, 6:46 PM

    Someone should recreate HTML in Markdown just for fun.
  • by pif on 10/11/24, 8:03 AM

    Uhm, this post looks based on a flawed premise:

    > Imagine if Word documents were only ever created by “Word professionals.”

    But they are! OP explain how to create websites using basic text editors, and nobody is able to create a Word document using simple text or binary editors, apart from maybe a handful of gurus in Richmond.

    If you really want to democratize HTML, an HTML editor is what you need. Otherwise, your teaching site will not attract much more people than any other teaching site.

  • by sova on 10/11/24, 3:06 AM

    HTML is not for people
  • by worble on 10/11/24, 8:21 AM

    >Alternatively, you can launch your browser first, click File > Open File…, then navigate to your index.html file.

    Uh, I don't think browsers have had the File toolbar for a long time, I just checked to make sure I'm not crazy and Firefox and Chrome on my system certainly don't.

  • by eviks on 10/11/24, 3:23 AM

    > It’s for anybody, the way documents are for anybody. HTML is just another type of document.

    You don't ask anybody to learn XML tags to edit a Word document in a plain text editor even though it's technically possible. Similarly, HTML is not "just another type", but one of the many poorly designed (especially so if CSS is added) document formats that no non-tech "anybody" should be exposed to

    WYSIWYG is for anybody.

  • by ziaee-ashkan on 10/13/24, 8:16 PM

    cool idea!
  • by WhiteOwlEd on 10/11/24, 3:44 PM

    With OpenAI and other LLMs, web development is accelerating. For example, I put together a AI call center demo ( https://www.youtube.com/watch?v=Vv7mI_qRrhE ) by using Open AI o1-preview. There I could take a lot of different files on typescript and backend server stuff written in python. I would add logs into the mix to make one massive prompt, and then I would let the AI work on reasoning in the cases where I needed to accelerate the writing of additional code.