yukijoou: New blog post: "own your place on the web!"
This commit is contained in:
parent
af247baa03
commit
ceb81fe254
2 changed files with 240 additions and 0 deletions
212
content/yukijoou/make-a-website/index.md
Normal file
212
content/yukijoou/make-a-website/index.md
Normal file
|
@ -0,0 +1,212 @@
|
|||
---
|
||||
title: "own your place on the web!"
|
||||
authors: ['yukijoou']
|
||||
date: 2023-09-03
|
||||
description: "...or why you shouldn't create content for social networks in 2023"
|
||||
---
|
||||
|
||||
hi, welcome! you've just arrived on my piece of the internet. you're reading
|
||||
this article from my own website.[^ownership] i have full control over every bit
|
||||
of this page. i can change the background to a picture of my cat, or make the
|
||||
layout completely different, or use bad words and insults if i want to.
|
||||
if you've arrived here, it's likely not because of google's search results --
|
||||
unlike most companies these days, i'm not using any tricks to rank higher in
|
||||
search results or buy ads, and so i'm probably not easily findable through that.
|
||||
i also don't tend to talk about trendy topics, or bring any value to google, as
|
||||
that's not my goal...
|
||||
|
||||
see, i'm just making things on the internet because i enjoy it! because i think
|
||||
some of my friends may find it interesting, because i want to try something out,
|
||||
or just because i like writing or making software for the fun of it. i don't
|
||||
think it's worth the time or effort to be popular, or to play the google
|
||||
rankings game, it'd just make it harder for me to do the silly things i enjoy.
|
||||
|
||||
and i'm not alone! the "indie web", or, as i like to call it, the "*people*'s
|
||||
web", is a bunch of independent websites, just like mine, made by people, **for
|
||||
people**, with the main goal of sharing something with the world, or just
|
||||
putting ideas out there. we're not in it for the money or the fame: most of us
|
||||
hide behind usernames and avoid sharing as much personal information as possible
|
||||
because we just want to make fun or share interesting things!
|
||||
|
||||
we want to share the cute cat we saw on the way home, the program we made that
|
||||
helps us study, or even how we block ads on websites and watch pirated copies of
|
||||
movies, because we think it'll help out other *people*, or because we think they
|
||||
may enjoy it. some of those things may not be liked by advertisers, and that's
|
||||
one of the reasons why we don't want to use big platforms like instagram or
|
||||
others. we don't want them telling us what's "safe" or not.
|
||||
|
||||
we don't like ads on websites, so we don't use them. we don't like
|
||||
corporate/uniform designs, so we try to be creative. we don't care about having
|
||||
billions of views and interractions, so most of us don't even track that. and
|
||||
most importantly, we want **people** to enjoy our stuff. not algorithms, not ai
|
||||
chat-bots, not search engines. we don't care about those.
|
||||
|
||||
# the problem with the state of "the internet"
|
||||
|
||||
if you ask your parents what the internet is, they will likely answer that it's
|
||||
"basically facebook" (or something similar), and possibly "emails" if they use
|
||||
that. which makes sense -- when you think of internet content nowadays, most
|
||||
people think of massive social network that make content creation and sharing
|
||||
super easy.
|
||||
in a way, it's really wonderful that anyone can share their opinion and say what
|
||||
they want! thanks to the algorithms they have, finding people's stuff you like
|
||||
is easy, and everything is centralised on less than a dozen platforms.
|
||||
|
||||
and that's the problem. all that content is pretty much owned and distributed by
|
||||
a dozen massive platforms. if one of them goes down (and one day they all will),
|
||||
it's millions, if not hundreads of millions of people's content that gets
|
||||
deleted in an instant. this also means it's up to the platform to decide what's
|
||||
allowed and not allowed: if an employee in the right department of that company
|
||||
doesn't like you, they can shut off your account in minutes, and you have no
|
||||
recourse.
|
||||
|
||||
the content creation process may be "easy", at least in comparaison to not using
|
||||
those massive services, but it does restrict you to the platform's rules, which
|
||||
often encourage you to make things that make advertisers happy, and allow the
|
||||
platform to make as much money from its users as it can. these things often
|
||||
don't align with what people want! most people are growing tired of
|
||||
recommendation algorithms, people and companies keep finding ways of getting
|
||||
around it, and instead of your recommendations being full of things you care
|
||||
about, it's mostly just popular stuff, or things specifically made to make the
|
||||
algorithm happy.
|
||||
|
||||
making the content creation process as easy as possible also means killing a
|
||||
good bit of creativity. when making a twitter post, you can write some 280
|
||||
characters in the box and share those with the world. no more, no less. no
|
||||
formatting, no *emphasis* or **bold text**. some websites may give you more
|
||||
options, but none will allow you to write your own code in the middle of your
|
||||
blog post to draw a rainbow:
|
||||
|
||||
*Click and drag in the window below to draw a rainbow!*
|
||||
<div id="funny-block">
|
||||
<canvas width=100 height=100 id="rainbow">
|
||||
your browser unfortunately doesn't support canvas, no funny rainbows for you :c
|
||||
</canvas>
|
||||
<script src="./rainbow.js"></script>
|
||||
<noscript>
|
||||
you'll need javascript to enjoy this funny thing i made
|
||||
</noscript>
|
||||
</div>
|
||||
<style>
|
||||
#rainbow {
|
||||
image-rendering: pixelated;
|
||||
border: 1px solid black;
|
||||
border-radius: 5px;
|
||||
width: 90%;
|
||||
height: 30vh;
|
||||
}
|
||||
#funny-block {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
on popular social networks, if you want to do anything more creative than bare
|
||||
text , you have to use an image or a video, which comes with its own set of
|
||||
problems[^screenreaders]. youtube had fancy channel customisation
|
||||
options[^smosh-2009] at some point, but it got removed in the name of uniformity
|
||||
and ease of use. now, every channel looks the same except for a custom logo and
|
||||
banner, and i think that's a bit sad :(
|
||||
i've seen amazing personal websites with crazy designs, and on small social
|
||||
networks like [SpaceHey](https://spacehey.com/), where people have the tools to
|
||||
customise their profile page, you get amazingly unique things!
|
||||
|
||||
and that's mostly why i think personnal websites are better: you can truly
|
||||
express yourself, you're not at the mercy of some algorithms to know if your
|
||||
content will be deleted, and you're not helping some company grow their market
|
||||
share and increase their proffit margins[^corporate-hosting]. you're always in
|
||||
control of your content, you can make backups and repost it wherever you want
|
||||
super easily, and can, for example, at any point, [stop openai from using your
|
||||
content in chatgpt](https://platform.openai.com/docs/plugins/bot).
|
||||
|
||||
though, many people think the major platform's compromises are worth it for the
|
||||
ease of use social networks have. to which i have to answer:
|
||||
|
||||
# making a website isn't hard!
|
||||
|
||||
of course, this is subjective, but making a website isn't a difficult skill to
|
||||
learn, and will serve you greatly for anything related to the internet! there
|
||||
are many tools available to make it even easier, and even more tutorials (i'm
|
||||
also currently working on a guide to help you get started)!
|
||||
it's not expensive either, and (depending on what you want to do, of course),
|
||||
you likely can put something up on the internet for free (or really cheap) right
|
||||
now (as long as you have a computer).
|
||||
|
||||
and even if you can't put anything on the internet right now, you don't have to:
|
||||
you can store all the files that make up your website on your computer, and make
|
||||
your website accessible to anyone on your home internet connection for free
|
||||
within minutes. it's a very good way to prototype things and just play around
|
||||
with making internet content without any consequenses!
|
||||
|
||||
while you may have to rely on some companies to make it work (like, an internet
|
||||
service provider, a host if you don't want all the traffic from your website to
|
||||
go through your home internet, and most likely a registrar to get a name for
|
||||
your website), you have the option to switch to any other company providing the
|
||||
same service at any point! you can always copy all your files to somewhere else
|
||||
if you want to.
|
||||
|
||||
all in all, the whole infrastructure i'm running for my friends and i costs me
|
||||
about 15€/month, plus a few hours of maintance a month, for a blog, personal
|
||||
websites for each of us, a social network, and an image sharing service -- it's
|
||||
cheaper than a premium netflix subscription!
|
||||
|
||||
-------------------------------------------------------------------------------
|
||||
|
||||
so, if you have some time to spare, and want to start sharing content with the
|
||||
world, i recommend making a website! even if it's just for reposting stuff
|
||||
you're sharing elsewhere, it gives you a space that's truly yours, and that you
|
||||
can keep as long as you're alive, and maybe more. it'll teach you general
|
||||
computer and system administration skills, that'll always be usefull in life.
|
||||
and most importantly, it'll let you express yourself however you like, share the
|
||||
things you care about with friends, and make something *for people*.
|
||||
|
||||
i'll note though that if you want to build a massive community, a website
|
||||
probably isn't the way to go. but i'd say, you don't need a massive community!
|
||||
people looking at your website are often much more engaged and interested in
|
||||
what you're sharing than people scrolling though hundreads of posts, so you'll
|
||||
likely get as many interractions, if not more, from actual humans!
|
||||
|
||||
if you want to get started right now, i recommend you check out [mozilla's
|
||||
"Getting started with the web"
|
||||
guide](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web),
|
||||
and if you're looking for tools to make your life easier, i made a [dead simple
|
||||
site generator](https://yukijoou.kemonomimi.gay/site-inator.html) you might want
|
||||
to check out.
|
||||
|
||||
if you want to see some content made by indie web people, you can check those
|
||||
out:
|
||||
|
||||
* [rampancy.neocities.org](https://rampancy.neocities.org), including [this
|
||||
beutiful digital shrine to the video game
|
||||
SIGNALIS](https://rampancy.neocities.org/games/SIGNALIS) (cw: no reduced
|
||||
motion support on both links)
|
||||
* [possums.gay](https://possums.gay/), another yuki's website (cw: gifs with
|
||||
slight motion on the main page, quite high contrast)
|
||||
* [nano.lgbt](https://nano.lgbt/) (cw: gifs with slight motion, high contrast)
|
||||
* [maia.crimew.gay](https://maia.crimew.gay/) (cw: gifs with slight motion)
|
||||
* [sugary.kemonomimi.gay](https://sugary.kemonomimi.gay/) (cw: gifs with slight
|
||||
motion)
|
||||
* and of course, [my own website](https://yukijoou.kemonomimi.gay/)
|
||||
|
||||
you should also check out [reclaim hosting](https://www.reclaimhosting.com/), a
|
||||
company providing super cheap hosting (less than 4$/month) and domains for your
|
||||
website.
|
||||
|
||||
[^ownership]: well, not really "my own", it's my group of friends' website that i am
|
||||
managing.
|
||||
|
||||
[^screenreaders]: images are not readable by screenreaders used by blind people, and take
|
||||
much more data than text to transmit. blind people make up a good part of
|
||||
internet users, and metered connections are still definitely a thing in many
|
||||
places.
|
||||
|
||||
[^smosh-2009]: see [smosh's channel in 2009 on the internet
|
||||
archive](https://web.archive.org/web/20090309121304/https://www.youtube.com/smosh),
|
||||
i was not on youtube back then, so i don't have many examples, but i'm sure
|
||||
some people managed to do some way more advanced things!
|
||||
|
||||
[^corporate-hosting]: yes. i know, you will have to rely on some companies when
|
||||
running a website, and they definitely make money from you. but i'll touch
|
||||
on more how that works later, and i think it's still a much more honest and
|
||||
transparent business model than most social media companies.
|
28
content/yukijoou/make-a-website/rainbow.js
Normal file
28
content/yukijoou/make-a-website/rainbow.js
Normal file
|
@ -0,0 +1,28 @@
|
|||
const canvas = document.getElementById("rainbow");
|
||||
const context = canvas.getContext("2d");
|
||||
|
||||
const resizeCanvas = () => {
|
||||
canvas.width = canvas.clientWidth;
|
||||
canvas.height = canvas.clientHeight;
|
||||
};
|
||||
|
||||
canvas.onmousemove = (event) => {
|
||||
if (event.buttons < 1) return;
|
||||
context.fillStyle = "red";
|
||||
context.fillRect(event.offsetX, event.offsetY + (0 * 5), 5, 5);
|
||||
context.fillStyle = "orange";
|
||||
context.fillRect(event.offsetX, event.offsetY + (1 * 5), 5, 5);
|
||||
context.fillStyle = "yellow";
|
||||
context.fillRect(event.offsetX, event.offsetY + (2 * 5), 5, 5);
|
||||
context.fillStyle = "green";
|
||||
context.fillRect(event.offsetX, event.offsetY + (3 * 5), 5, 5);
|
||||
context.fillStyle = "cyan";
|
||||
context.fillRect(event.offsetX, event.offsetY + (4 * 5), 5, 5);
|
||||
context.fillStyle = "blue";
|
||||
context.fillRect(event.offsetX, event.offsetY + (5 * 5), 5, 5);
|
||||
context.fillStyle = "violet";
|
||||
context.fillRect(event.offsetX, event.offsetY + (6 * 5), 5, 5);
|
||||
};
|
||||
|
||||
window.onresize = () => resizeCanvas();
|
||||
document.addEventListener("DOMContentLoaded", resizeCanvas);
|
Loading…
Reference in a new issue