From 236aca6c69f40dafe1459332b7769819095ce172 Mon Sep 17 00:00:00 2001 From: Bradley Taunt Date: Sun, 4 Feb 2024 08:46:44 -0500 Subject: Initi commit on new cgit platform --- .build.yml | 12 ++++ LICENSE | 21 +++++++ README.md | 5 ++ everyone-should-become-an-html-expert.html | 96 +++++++++++++++++++++++++++++ favicon.png | Bin 0 -> 144 bytes index.html | 39 ++++++++++++ members.html | 85 +++++++++++++++++++++++++ pics/bitcoin-qr.png | Bin 0 -> 1158 bytes pics/bitcoincash-qr.png | Bin 0 -> 1288 bytes pics/computer.svg | 76 +++++++++++++++++++++++ pics/eth-qr.png | Bin 0 -> 1255 bytes pics/manreadingnewspaper.svg | 47 ++++++++++++++ pics/xmr-qr.png | Bin 0 -> 7547 bytes style.css | 3 + 14 files changed, 384 insertions(+) create mode 100644 .build.yml create mode 100644 LICENSE create mode 100644 README.md create mode 100644 everyone-should-become-an-html-expert.html create mode 100644 favicon.png create mode 100644 index.html create mode 100644 members.html create mode 100644 pics/bitcoin-qr.png create mode 100644 pics/bitcoincash-qr.png create mode 100644 pics/computer.svg create mode 100644 pics/eth-qr.png create mode 100644 pics/manreadingnewspaper.svg create mode 100644 pics/xmr-qr.png create mode 100644 style.css diff --git a/.build.yml b/.build.yml new file mode 100644 index 0000000..9739c62 --- /dev/null +++ b/.build.yml @@ -0,0 +1,12 @@ +image: debian/stable +oauth: pages.sr.ht/PAGES:RW +environment: + site: xhtml.club +sources: + - https://git.sr.ht/~bt/xhtml-club +tasks: +- package: | + cd xhtml-club + tar -cvz . > ../site.tar.gz +- upload: | + acurl -f https://pages.sr.ht/publish/$site -Fcontent=@site.tar.gz diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..9d88e14 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2022 Bradley Taunt + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..fea603f --- /dev/null +++ b/README.md @@ -0,0 +1,5 @@ +# xhtml-club + +The official XHTML Club website + +Live website: [xhtml.club](https://xhtml.club) diff --git a/everyone-should-become-an-html-expert.html b/everyone-should-become-an-html-expert.html new file mode 100644 index 0000000..82b6136 --- /dev/null +++ b/everyone-should-become-an-html-expert.html @@ -0,0 +1,96 @@ + + + + + XHTML Club - Everyone Should Become HTML Experts + + + + +

Everyone should become an HTML expert

Posted on April 6th, 2021

No matter your profession or level of technical skill - you should master the HTML programming¹ language. It's used everywhere on the internet and is very simple to grasp. Since HTML uses logical standards for rendering content it becomes fairly simple to pickup and learn. More on that later.

Why should you bother to learn HTML?

Easy to pickup and easy to master
Better understanding of website structure
Ability to attain your own web freedom

+ +
+

1. Easy to pickup and easy to master

HTML is not a difficult language to understand. I also believe it is fairly easy to master, since the core concepts and structure of HTML is so intuitive. Let's look at a made-up example and you'll see what I mean.

Let's pretend that you want to display a page on the big world wide web showcasing your skills at baking cupcakes. Similar to creating a text or Word document on your computer using an application, you probably have a general idea of how the content should be displayed:

Recipe title
Ingredients
Details
(optional) Picture of said cupcakes

Seems simple enough, right? That's because it is. We can now start to work our way through these items one piece at a time.

Recipe title

Since this is the heading of our document (or web page in this context) we will use the HTML heading tag(s):

+ <h1>My Amazing Cupcakes</h1> +

Remember how I mentioned HTML being fairly intuitive? Using h1 tags, you're telling the browser to render the content within this tag as a number 1 level heading → h-1. If you instead wanted to render your headings at smaller sizes (or give them less importance in the document) you can cycle through all available heading tags 2 through 6. Feel free to learn more about HTML heading elements.

Ingredients

A document item like a set of ingredients would normally best be rendered out into a list. HTML has us covered with that as well:

<ul>
+  <li>Some sugar</li>
+  <li>Some flour</li>
+  <li>Some butter</li>
+  <li>Chocolate</li>
+  <li>Frosting</li>
+</ul>

Which would render like this in the browser:

Some sugar
Some flour
Some butter
Chocolate
Frosting

The ul tag stands for unordered list and the li elements inside reference list items. Starting to see a simple pattern here? If you wanted to set your list to display as a set of ordered items, just set the parent tag as ol instead of ul. I bet you probably already figured that out though ;) Feel free to learn more about unordered and ordered list items.

Details (Instructions)

Now, you could set the recipe details/instructions to be set as another list element, but for this example we are going to render them as paragraph elements:

<p>Mix all the ingredients together however you think is best. These cupcakes aren't a real recipe anyway!</p>
+<p>Make sure you don't burn the cupcakes. That would suck.</p>

I know- you're probably shocked that HTML renders p tags as paragraphs.

Picture (optional)

The content above would be more than enough for users to read our document and understand how to bake our delicious cupcakes. But a picture is worth a thousand words:

<img src="path/to/your/cupcakes/image" alt="Delicious chocolate cupcakes">

Yet more intuitive greatness from the HTML gods! An image is represented within an img tag. You use the src (source) attribute to point the browser to the image's location. The alt (alternate text) is a helpful snippet of text that describes what the picture contains (required for those with disabilities or accessibility issues).

That's it!

+ +
+

2. Better understanding of website structure

By becoming fluent in HTML, you gain a much better understanding on how all websites across the web are constructed. Though a greater understanding of HTML has many benefits, I find having the ability to troubleshoot bugs or issues through a browser's devtools to be the most beneficial.

No matter your current job or future career path, being able to mention your expertise of HTML can only be seen as an added bonus to your skill-set. Do not underestimate the power to build website skeletons!

+ +
+

3. Ability to attain your own web freedom

The other benefits of learning HTML posted above are great - but I believe the best reason to become an HTML master is the web freedom associated with it. You gain the ability to create, edit and share your own website without the help of any 3rd party builders or locked-in content management systems. Instead, your workflow might be something like:

Open a text editor
Begin writing out your content with semantic HTML
Save file as `index.html`
Upload to your web host

And with free hosting services such as Netlify or DigitalOcean it's not like you'll be breaking the bank to have that website live on the interwebs! (You could go down the rabbit-hole of increasing your web freedom by self hosting your content etc - but I'll save that for another day)

+ +
+

Wrapping up

There can only be positives to gain from jumping into HTML and eventually mastering the language. It's the core skeleton implemented across the web (no matter how complex the framework used to get there might be) and isn't going away anytime soon. Some might advocate for becoming fluent in Markdown or a similar formatted text language but I would strongly advocate for the real deal: HTML.

+ +
+

1. This is a common debate - but for simplicity sake I'm just calling it this.

+ + + \ No newline at end of file diff --git a/favicon.png b/favicon.png new file mode 100644 index 0000000..884d6bd Binary files /dev/null and b/favicon.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..28c6e29 --- /dev/null +++ b/index.html @@ -0,0 +1,39 @@ + + + + + XHTML Club - Extreme HyperText Movement for Luddites + + + + +

XHTML Club

Extreme HyperText Movement for Luddites

+ +

Greetings, this is the official XHTML club (and blog)! This website is both a collection of HTML-focused websites and a simple blog; a lonely web designer screaming out into the abyss of the internet. Ranting and raving about the ever increasing bloat that is the "modern" web.

The Purpose of XHTML

I feel as though I get more and more extreme in my efforts to combat excessive web bloat across the internet. It started off with the creation of the 1MB Club project but has since expanded further - as you might have noticed.

This isn't due to a hatred towards CSS and JavaScript, but instead a hatred towards how horrible they are being used on the web today. What was once used for flourish or improving a user's experience is now used to directly attack and harm that user. I do not wish to be a part of that growing problem.

The Goal of XHTML

Simply put: there isn't one. I don't expect to change any minds on the subject of web bloat - especially "designers" since they tend to dig their heels in the hardest. It would be pretty incredible if tomorrow the world woke up and every website only used pure, semantic HTML and nothing else...but I'm a realist. Things will probably need to get much worse before they get better.

Slightly Hypocritical

I understand how strange this website/project might seem - considering my entire career is based upon being a web designer. Personally, I believe that heavily relying on styles and scripts for web page content was and continues to be a huge mistake. Maybe that puts me out of a job in the future. Maybe that creates new jobs based on this methodology down the line. Who can truly say? All I know is that people need to stick to their principles and I can't pretend that dumping a bunch of web shit on regular users is justified just so designers can get paid. There has to be a better way.

Articles

WIP / Why you need a personal website (and how to make one)
2021-04-06 / Everyone should become an HTML expert

+ + + \ No newline at end of file diff --git a/members.html b/members.html new file mode 100644 index 0000000..c74a96e --- /dev/null +++ b/members.html @@ -0,0 +1,85 @@ + + + + + XHTML Club - Member List + + + + +

XHTML Club

Extreme HyperText Movement for Luddites

+ +

XHTML Members:

How to submit: +

Just shoot me an email with "[XHTML Club] submitted URL" as the subject line.
(Multiple website submissions can just be included within the email body.)

Feel free to toss a small donation my way if you feel like it was worth it
(This is entirely optional - only do so if you're feeling generous!)

Current websites that are fairly close to being pure HTML (the rules are a little loose here):

+ + + diff --git a/pics/bitcoin-qr.png b/pics/bitcoin-qr.png new file mode 100644 index 0000000..eb2dd9a Binary files /dev/null and b/pics/bitcoin-qr.png differ diff --git a/pics/bitcoincash-qr.png b/pics/bitcoincash-qr.png new file mode 100644 index 0000000..24d4707 Binary files /dev/null and b/pics/bitcoincash-qr.png differ diff --git a/pics/computer.svg b/pics/computer.svg new file mode 100644 index 0000000..8955207 --- /dev/null +++ b/pics/computer.svg @@ -0,0 +1,76 @@ + + + \ No newline at end of file diff --git a/pics/eth-qr.png b/pics/eth-qr.png new file mode 100644 index 0000000..7e53719 Binary files /dev/null and b/pics/eth-qr.png differ diff --git a/pics/manreadingnewspaper.svg b/pics/manreadingnewspaper.svg new file mode 100644 index 0000000..539dbb3 --- /dev/null +++ b/pics/manreadingnewspaper.svg @@ -0,0 +1,47 @@ + + \ No newline at end of file diff --git a/pics/xmr-qr.png b/pics/xmr-qr.png new file mode 100644 index 0000000..3cf1535 Binary files /dev/null and b/pics/xmr-qr.png differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..db5e99f --- /dev/null +++ b/style.css @@ -0,0 +1,3 @@ +*{box-sizing: border-box;} +img{max-width:100%;} +pre{overflow:auto;} -- cgit v1.2.3-54-g00ecf