About EGGRAMEN

The Site

Name: EGGRAMEN
Webmaster: Eggy
Established: January 5, 2019
Current Size: ~31MB
Current Version: 5
Hosted and Powered By: Neocities!

EGGRAMEN is my personal website for a bunch of different things: learning CSS/HTML and web design, cataloguing and sharing creative projects and works without having scatter myself across 20 different mutually exclusive content silos, and for just goofing off and having some fun with webpages.

This website is developed primarily in the Neocities code editor (which is why it has so many "updates", lol -- save early and save often does that to you.) Webpages are tested primarily in Firefox on a 1600x900 screen, although smaller resolutions are also checked by window resizing.

Site History

The year is 2018, late December...

Tumblr has just made the announcement that they're banning adult content, and pretty much everyone over there is either freaking out, ambivalent, or a clueless pornbot. Fandom is making a mass exodus, and in the chaos I end up joining a Discord server for people looking for new places to go, post-Tumblr.

The discord has a channel dedicated to alternative platforms, and at some point a member shares his new little DIY site, Nostalgia For the 2000s, saying he found this cool site called Neocities that's basically Geocities' modern successor. 2018 me checks out the site, scrolls around, and goes, damn, that's really cool. If only I knew how to make a website. And then: wait, I could learn to make a website!?

Fast-forward through a few weeks and a whole lot of w3schools CSS reference, and suddenly a homepage was born. It was slapdash and awkward, consisting entirely of a hello to visitors, some jotted-down ideas, and a few janky stylesheet test pages, but, well... as they say, the rest is history.

Past Versions

While EGGRAMEN the website has only ever been at one address, in one form, the site's organization and style has changed several times over its short lifespan.

You can see an archive of past versions of the site here.


The Webmaster

Name: I like anonymity. Call me Eggy. (Or "that person who runs EGGRAMEN".)
Age: Under 100
Currently Reading: The Glass Scientists, too much fanfiction
Currently Playing: Chrono Trigger
Currently Listening To: サカサカバンバンバスピスピス (English Cover)

Hi there! I'm the person who runs EGGRAMEN. Not that I manage any servers or anything, obviously, I just do CSS and HTML.

I don't like revealing a lot of information about myself on the interwebs, so don't expect much more than this. I have a multitude of fandoms. I like Jade Harley enough to dedicate an entire section of this site to her. I play videogames sometimes, and make conlangs and muck around with code a bit. Sometimes I write filk and interactive fiction.

ANYWAY... I've run out of things to say here. Enjoy the site!


FAQ: (Not-So-)Frequently Asked Questions

Nobody has ever actually sent me these questions yet, for the record.

(It probably helps that I don't offer many ways to ask.)

Why the name 'EGGRAMEN'?

I was really into putting fried egg on my instant ramen at the time, and I couldn't think of a name.

More relevantly, I didn't want to use a name for my website that I already used somewhere else, especially in my fandom spaces. I like the option of multiple identities, even if it can get difficult to maintain, and sometimes turns out to be not really worth it.

No but like, why is it in all caps. What's with that.

It looks less dumb that way. Please let me have this.

It does look dumb though.

Actually, you know what, screw you, it looks cool. It's stylized.

How do I use a layout from the CSS Testpages?

If you do not know how to make use of a pre-existing stylesheet template, don't worry! We've all been there at some point. It's actually pretty simple. (... I say, keeping in mind the obligatory xkcd, lol.)

1. On your site, save a copy of the CSS stylesheet

Those are the files from the "code" or "stylesheet" link(s). They are not exactly a layout on their own, but a set of rules that tell your browser how specific HTML should be displayed.

2. Copy the HTML from the "preview" page and save it on your own site

You can do this by going to the "preview" page, and right-click ->> "view page source". This will open up a tab showing you the actual HTML of the preview page. Copy the whole thing into a new HTML file on your own site.

If you don't have a 'view source' option, some browsers will still let you put "view-source:" before the "https://" in the URL/address bar to do the same thing.

3. Replace the stylesheet link on your page

Once you have copied the HTML from the page to your own site, open the HTML file, go to the line near the top that says something like
<link href="STYLESHEET_PATH.css" rel="stylesheet" type="text/css" media="all">
and replace whatever "STYLESHEET_PATH.css" is with the path to the CSS file on your site.

If you're using a stylesheet that has a "base" and a "skin", you'll want to do this for every stylesheet that applies to that page, and make sure you keep them in the same order as the original.

Note: your "path" to the stylesheet can be the actual full URL for your CSS file, but it's usually better to use a relative path like /PATH/TO/YOUR_STYLESHEET.css or whatever to keep everything from breaking if your site's name/domain name ever changes.

You should now have a most working duplicate of the "preview" page, and should be able to replace the content in the new page with whatever you want!

4. Fix broken links to images and fonts

If you have broken/missing images or fonts, you'll need to go into the CSS file(s) and do a bit of editing. Look for code like url("SOME URL") -- there should usually be comments, too, telling you to replace things.

Replace "SOME URL" or whatever with the path to your own locally hosted images and fonts. (Please don't hotlink!)

If you do copy a font used in one of my stylesheets, make sure to check the license. Some have specific requirements about how they can be used or distributed, or may need to have a copy of the license with them somewhere on your site.

You should now be good to go! Have fun tweaking and experimenting with your new page layout.

How do you make your webpages and stylesheets?

Like I've said, 99% of EGGRAMEN is coded in Neocities' on-site IDE. This is because I'm lazy and can't be bothered to make the files on my computer instead.

On the rare occasion I do work on this site offline, I use gedit, which is basically the Linux equivalent of Notepad... because it was already installed, and again, I'm lazy.

If you're asking how I come up with stuff, though, or how I figure out how to make it...

A lot of my layouts are inspired by others, or are tests to see if I could do something. I take a lot of influence from Tumblr themes, and from other Neocities or old-web sites I encounter in passing. At least two of my CSS layouts in the directory are just trying to recreate the general vibes of a site I saw once and can't find again. or could find but wished I could imitate.

Most of the how is accomplished by a mixture of looking up tutorials and references (i.e. a lot of searches for things like "css position attribute" or "why do i have extra margin unless 1px border added???"), trial and error (sometimes I swear half the hits on my site are just me refreshing the damn page to see changes) and occasionally using view source to poke around in the code of other sites to see how they accomplished something in particular.

If you're looking for coding resources, I recommend checking out the code section of my credits page, which should have several good places to start.

Do you do custom layouts for people?

No.

Pretty please?

Nope.

Are there any rules for using your test stylesheets?

Only what I said on the Test Directory page.

TL;DR: use however you like, there is no warranty, and credit is appreciated (but not strictly required.)

I originally considered including something about non-commercial use, but let's be real, the only people using janky Neocities-style static layouts for commerce are like... internet artists, zine makers, people with little DIY storefronts and blogs, etc, so I honestly don't care.

I am serious about the "ABSOLUTELY NO WARRANTY" part, though -- if you're doing anything businessy with these, please go over the code yourself and make sure it works and does what you want it to do. I am but a self-taught amateur dicking around with CSS and HTML in my spare time, and some of what I've made is... not great, tbh.

Oh, and if there's embedded fonts: check the font licenses. Some fonts have restrictions on free usage. That one's on you to make sure you're aware of before using it. Same goes for any images being used, though you should really replace those anyway.

What about buttons?

Don't hotlink.

Otherwise, same thing regarding credit. I've generally felt that trying to get credited for 88x31 pixel buttons I drew in an hour is something of a lost cause, and I'm okay with that.

(Do not assume other people are okay with that, though. Asking and crediting is still a good thing you should do whenever possible.)

Can I use your site layout?

If you alter it enough to feel like yours, then sure. But please don't just use it verbatim. It'll be like we both came to a fancy dress party in exactly the same outfit and it'll be really awkward and weird.

Also, if at any point my site ends up using original art assets for the layout, please don't reuse those unless I specifically say I'm okay with it. I don't care so much about pixel buttons, but art theft is still rude as hell.

Will you make me a custom site button?

Sorry, but no. (And I do not, as of writing, take commissions.)

But you made one for [insert person here]!

Buttons happen on an I-feel-like-it basis. I might still make one for you, if I think your site is neat and I want to make a button for it! I just don't do requests.

So I guess the solution is either have a really cool site that's relevant to my interests and hope I feel like linking you, or DIY.

What do you use to make your buttons?

Finally, a better question!

I use GIMP 2.10 for pretty much all my image editing. It's not a great drawing program (I prefer Krita for that), but it has all the basic Photoshop-like functionality needed for decent pixel buttons -- and even better, both GIMP and Krita are free (and open-source.)

Pixel writing, I do by hand with a hardedge 1px pencil brush and a lot of swearing careful measuring. I don't really use any special fonts except for site buttons where I'm trying to match the site's own font.

Why did you make an FAQ when nobody actually asks you questions?

I was bored. Also, I was revamping my about page.

Also also, I've realized if enough people keep using my stylesheets/layouts and buttons, it's probably worth having an FAQ, just like, pre-emptively. Just in case. (Update: it is no longer pre-emptive.)

So wait... how do I ask you questions? If I had one. Hypothetically speaking.

Well, don't tell anyone, but I have a snazzy little contact page with some relevant information... In case anyone might need it.

CreditsTop