[HN Gopher] Show HN: HTML for People
___________________________________________________________________
Show HN: HTML for People
Author : blakewatson
Score : 143 points
Date : 2024-10-10 17:47 UTC (5 hours ago)
(HTM) web link (htmlforpeople.com)
(TXT) w3m dump (htmlforpeople.com)
| ErikAugust wrote:
| One additional book recommendation: HTML and CSS, the Good Parts.
| henning wrote:
| 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.
| autoexec wrote:
| This is a lesson that a lot of professionals could stand to
| relearn. They don't actually need hundreds of MBs of JS to
| display basic text and images. Accessibility and failing
| gracefully are way too often ignored.
| divbzero wrote:
| 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.
| have_faith wrote:
| You're probably already aware, but <html>, <head> and <body> is
| optional in HTML5, so it's a "proper" document without them.
| aardvark179 wrote:
| 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.
| blakewatson wrote:
| OP here. Oooh that's a good suggestion. Yeah it's hard to shed
| the webdev persona and see it through fresh eyes--even though I
| specifically tried to do just that!
| mightybyte wrote:
| 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.)
| otteromkram wrote:
| Mozilla has amazing documentation that's been around for years.
|
| Here's their basic html tutorial section:
| https://developer.mozilla.org/en-US/docs/Learn/HTML
|
| No one is or has been stopping people from learning HTML.
| baggy_trough wrote:
| Super approachable. (sure Jan meme.gif)
| blakewatson wrote:
| OP here. I appreciate the kind words. Yeah, I hope it finds its
| way into the hands of non-professionals.
| simonw wrote:
| 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?
| acheong08 wrote:
| It's crazy how bad the mobile epidemic has gotten. There are
| kids coming into a Computer Science degree that can't figure
| out how to unzip a zip or even finding out where files get
| downloaded to. (Fwiw, those I know dropped out before 2nd year)
| MathMonkeyMan wrote:
| My dad was asking me a question about backing something up
| onto Google Drive, or saving space on some cloud storage
| account, or something.
|
| He was using the mental model of files and folders -- that
| files exist and refer to stored bytes, and that there can be
| one or several copies of a file. There can be links to a file
| that take very little space relative to the file.
|
| I had to tell him that I have no idea what sort of storage
| model these services expose, if any, and that the concept of
| a file system backed by a storage device is not the analogy
| that applications expose to their users these days.
|
| He eventually understood, but I could feel his frustration --
| that the mental model he had was really just chosen by a past
| moment in application design, and that what replaced it is
| nebulous and disempowering.
| username135 wrote:
| Can you elaborate on what you told your father?
|
| When i use google drive, the interface appears to be
| folder/file structure. Whether it is or is made to look
| that way is irrelevant, i suppose, as long as it works that
| way. I can also increase storage by downloading/deleting
| things so Im a bit flummoxed.
| MathMonkeyMan wrote:
| I don't remember if he was trying to save space on his
| Google Drive or on his phone. His question was, mostly,
| that if he deleted files in one place, where would the
| space savings appear? I immediately thought of Windows'
| OneDrive and how it's sort of an automated rsync setup. I
| didn't know enough about his phone, which apps he was
| using, or about Google Drive to give an answer better
| than "I don't know, and I detect that some of your
| assumptions are probably wrong."
| layman51 wrote:
| In my opinion, Google Drive is basically the same as the
| traditional file structure. Where it gets very confusing
| for people is when it comes to collaboration. Before 2020
| or so, there was confusion around copying the same Google
| Doc so it appears in multiple locations, and making
| shortcuts to it instead. Look up stuff around the "Shift
| + Z" keyboard shortcut if you want to learn more.
| tiffanyh wrote:
| It can be even worse.
|
| I've seen younger generation only use Google Docs and
| streaming services (music/video) and not even understand what
| a "file" is, because everything is just on the internet.
| crooked-v wrote:
| Calling it an "epidemic" isn't really helpful. The reason
| there's this shortcoming isn't because it's some problem
| inherent to those darn kids, it's because the state of
| computer education is expect them to just figure it out on
| their own when they have no need or reason to do so.
| bartvk wrote:
| I'd say half of my first-year CS students don't know how to
| create a folder with files, at the start of the school year.
| To me, it's nuts. But on the other hand, lots of students are
| very curious and come to learn. You can't blame them for not
| knowing something.
| 0cf8612b2e1e wrote:
| At one point, every member of a CS program started without
| having ever seen or touched a computer. Everyone has to start
| somewhere. We do not reject new biology majors because they
| had never touched a microscope before entering the program.
| Novosell wrote:
| The difference is that these days the people are surrounded
| by computers and probably interact with a computer many
| hours every day, yet they are barely more tech savvy than
| that first lot who had never seen a computer before.
|
| But so it goes when society moves forward.
| asoneth wrote:
| > The decision to skip CSS by depending on
| https://simplecss.org/ is smart
|
| I was always a little disappointed with how most web browsers
| choose to render HTML pages that had no explicit styling
| information. I'm not necessarily saying web browsers should
| have defaults as opinionated as simple.css, but the default
| page margins, padding, text styles, headings, etc that they
| picked aren't particularly attractive.
|
| Opinionated web developers will override the defaults no matter
| what they are, but if the convention was to have more
| attractive defaults I wonder if that would have resulted in a
| larger share of personal websites and blogs created using plain
| HTML.
| BirdEBird wrote:
| Good article, but the reason is obvious: When opening an app or
| a web app stopped opening a new document and started to present
| a list of recent documents, that was the beginning of the end.
| If someone wants a file, they open the app for that file and
| scroll down. They have never needed to make sense of a file
| existing independently of the app in which it was create and
| may be viewed. This process was cemented by iOS's absence of a
| file manager.
| divbzero wrote:
| The Android Files app has always allowed access to local
| files, and the iOS Files app has allowed access to local
| files since 2019.
|
| https://www.cultofmac.com/news/files-app-makes-ipad-more-
| mac...
|
| However, neither of them are typically used in mobile UX
| patterns.
| jachee wrote:
| The five years since then haven't been enough time to
| change 12 years of behavior.
| AlienRobot wrote:
| I'm happy to see more people recommending Neocities :D
| messo wrote:
| 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?
| forbiddenvoid wrote:
| 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.
| Retr0id wrote:
| I suspect even a majority of HN users visited the page on a
| mobile device, and were not in a position to immediately follow
| the instructions.
| Novosell wrote:
| Android allows you to create directories.
| Retr0id wrote:
| As does iOS, but the instructions given were for a desktop
| device.
| stego-tech wrote:
| 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.
| jimbosis wrote:
| 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.
| otteromkram wrote:
| Check out Mozilla's tutorials, too.
|
| https://developer.mozilla.org/en-US/docs/Learn/HTML
| gabrielsroka wrote:
| Would something like this work instead of using Notepad/TextEdit
| (at least at first)? Note, this code could be made better...
| <textarea onkeyup='results.innerHTML=this.value'></textarea>
| <div id=results></div>
| debacle wrote:
| > 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.
___________________________________________________________________
(page generated 2024-10-10 23:00 UTC)