Why not just start from scratch?
I am still poking at JavaScript to build that screen reader-like experience style thing. I crashed my site a few times last weekend so it’s obviously going well. I decided to start some lower difficulty tutorials in order to do less stumbling in the dark?
Like, I understand most of what I’m doing, I just have the understanding or vocabulary to do it well. Here’s an example of my code that executes when the page finishes loading:
It’s a bunch of dumb loops. I’m even declaring the same variables over and over. But this could really way fewer lines of code. I just don’t know how. Yet.
Don’t tell me how. I’m trying to learn.
Vocabulary lessons
To help building that vocabulary, I’ve stripped a copy of my site of the bases CSS and Javascript and am trying to rebuilt it. It wasn’t super complex to start. I started using Blot.im as the blog service in large part because it is really simple. It’s a tool that you point at a Dropbox folder and it takes what it finds there, assuming for some possible types of syntax, and turns it into displayable HTML you can access from my domain.
An aside on blot.im
Here’s the data structure for my 2020 posts. All 4 of them.
I use Markdown files for my “pages” because a like the simplicity. It’s all text based so the files are really simply and can, and likely will always, be readable by technology. Text is fundamental.
Rebuilding
Blot provided some templating for the structure you could choose from. They are, similarly, optimized for simplicity, and are easy to customized. I’ve used those as my starting point for all the styles I’ve made the last few years as I’ve dabbled in CSS.
So now, I figure I’ll check it and start from the ground up to learn. I’ve forked a base style and can edit it - well, delete - the CSS and JS and keep my site using the current style. No ruining my page until it’s ready to go. :)
Silly mistakes
Today’s foray was getting the nav bar to stick on scroll and have the images not be full size. Nav bar was easy enough and i thought the image part was going to be easy. I spent a good 30 minutes today trying to figure out why they kept squishing or blowing up. I kept doing this:
img {
Max-width: 300px;
Max-height: auto;
}
Or swapping the auto/300px and images kept skewing. I keep forgetting that you only really need to define either max width or height and let the other dimension be auto
. Max-blah gives you the key dimension and the other, non-max dimension set to auto
tells the page to just scale the auto dimension against the max one.
It’s so simple when your write it out. But that’s the fun of learning.
I’ve not gotten to the JS part yet. Order of operations seems best as HTML then CSS then JavaScript.
What does my page look like now?
I got tired, already, of the very bright neo 90s/quasi-neo-brutalist style and have dramatically reduced the complexity of my page. More readability, less flash.
Where I’m still sort of flailing
What do I I want my site to look like? I’ve been trolling through sites that I like trying to find inspiration but nothing feels right. The only thing I like from all of them is a single accent color which I had already started doing for my web pages for a while.
What else? Where should the nav bar go? Should I have sidebars? Should I link to social media?
I think I just…. don’t know what I want from my page any more? I don’t run a business any more. No one comments or comment services doesn’t really work well. So… Is this just for me to write now? Like just for me and anyone who bothers to read it?
Doing something just for me? How horrid….
Permanent link: Http://blog.angrybunnyman.com/why-not-just-start-from-scratch