November 13th, 2023 -
Pokemon Sites and Learning to Code
I talk about these two sites a bit here. Go look at them if you haven't.
❇●❇●❇●❇
If you're one of my friends, you'll know my learning strategy is very "monkey see, monkey do".
That is, I'm a masterful copycat, better at learning the fundamentals through backwards engineering rather than sit-down study (at least at first).
This was how I learned how to draw from references (after tracing official Pokemon art became a long-forgotten pastime), how I learned to sew (I'm still kinda bad at it), and perhaps most importantly to our current discussion, how I learned to code.
Back when I first started coding my site in 2020 I was really into the idea of coding my own Pokedex pages. Thing is, helpful as W3Schools and all the resources I knew of could be, I did not have the patience to sit through actual lessons on the off chance the information actually sponged into my head.
Instead, and I feel kind of dirty for admitting this, I went into inspect element and absolutely GUTTED some websites to learn how they worked.
(I don't advise you do this yourself, and if you do, do it in some kind of code previewer instead of using the Neocities editor like I did/do. It feels really rude in hindsight.)
The two websites that were subject to my cannibalistic wrath were PokemonDB and Serebii.
❇●❇●❇●❇
PokemonDB came first, which is mostly why I feel bad, considering they go so far as to say "hey don't steal our shit" on their about page. Still, I was fascinated by the clean, easily-digestible presentation of DB's Pokedex pages, and I wanted to learn how they were done.
Studying and editing PokemonDB's code and cross-referencing with the site's CSS was one of my very first looks into what specifically matched up with what between the documents.
Turns out, the answer to "how were the pages done" is both "a lot of CSS" and "a lot of messing with tables".
I dislike tables. They make me feel kind of violent.
That said, scrolling through DB's code and seeing how the tables were laid out (and especially how clean the code itself was) would give me some fundamental knowledge I'd need to inspect Serebii's code later.
Though I wouldn't properly learn about div class columns until getting more into Toyhou.se coding later, DB was also my first introduction to that, as well as the 'abbr' html tag (which the site uses to define various bits of slang, most notably what years the different Generations correspond to.
I mean, I haven't really made use of abbr myself, but it's in my head I promise.
Inspired by my messing with the code but finding the meticulous layout intimidating (and feeling bad about stealing from a site that told me not to), I moved onto Serebii.
❇●❇●❇●❇
Though Serebii was much more accessible to me in layout, its code was a whole other beast.
Joe Merrick has been working on the site since at least 2001, and it really shows- the code is clumped together into huge bricks, not impenetrable but definitely difficult for a novice coder like me to understand.
I can definitely imagine that his time with the site is what has made the code so legible to him that he chooses to keep it that way- either that, I'm just a baby idiot, or the idea of cleaning up the code on the hundreds of mostly-static pages of his decades-old site is too much of an ordeal for him.
Which would make sense.
Either way, don't take my comments on the cleanliness of the code as a slight against Mr. Joe Serebii- I hold nothing but respect for him, and I've learned a lot from studying that code!
For example, Serebii's old web simplicity means its CSS was much less intimidating to me, meaning I was actually convinced to properly dive into its multiple(!) stylesheets to figure out how the hell the webmaster got it to look how it did.
❇●❇●❇●❇
...Now, you may be wondering why I didn't say as much of substance about Serebii as I did about PokemonDB.
This is because I'm currently back to studying what I ripped of Serebii's code a few years ago, this time rather than trying to essentially gank it for myself (which is rude) actually trying to use what I see to properly do my own thang- like referencing a photo for a pose.
I'm learning a lot! I'm also going to have to make my own custom CSS classes like Serebii does so I'm not forced to do all my styling over and over again, but that's fine- I have to learn at some point!
If I ever get my dex pages to a presentable state, you will see it- you may have already seen it, even, because I'm a freak who uses the Neocities editor and inadvertently posts Every Update to my profile feed whether I want to or not.
When I get around to it, though, I hope I'll feel like I've atoned for being slightly rude to people in private.
See you next time :]
❇●❇●❇●❇