To do list:
- Most obviously, get the content actually uploaded to the site.
Make the index page into a NSFW warning. Do something with localstorage to remember the user's choice? Maybe it should expire after X days. Navigating to any page within delta7447.neocities.org should ideally first ask the user "Are you a big boy? Is it legal for you to be here?" Should investigate that; I have no idea if that's even feasible. From poking around other NSFW sites on Neocities, it seems that the common approach is what I have now: the main page has a warning, then that leads to the actual home page. I'd like to be more thorough about it, but I recognize that may not be possible/feasible.
- There's a meta content parameter called "rating", with one option being "adult". That'd probably be accurate for my site, but I'm concerned adding it might have unexpected consequences. Should look into that sometime.
Add a light/dark mode toggle. This presumably just requires a boolean in localstorage: 0 for dark mode, 1 for light. Implemented
Add a favicon Non-square images work but get distorted. So I had to make a specialized favicon that has some extra blank space to make it a square.
- A fancy sortable table like what you'd find on Wikipedia or Fandom wikis, where the user can sort by whatever column they'd like. This would contain links to all my works, as well as info like word counts, commissioned by, etc. Additionally, it'd be fantastic if spreadsheet-like formulas could be implemented, allowing me to convert a word count into a reading time based on a preset WPM.
Can HTML do math? Would I have to Javascript for that? I'm gonna have to Javascript for that.
- A search function (ideally not using Google), and/or a tag system. You can specify a tag (or multple tags) and find a list of every work with that tag included. I think the way to do this is to add an extra column to the works list. That in conjunction with the table filtering function would work beautifully I think.
A recommendations page for my fellow writers and artists--"if you like my X, try my friend's Y" and so on. let's fucking go
Support for Discord's link preview thing--something that'd show a work's title and a synopsis, alongside a specific color for the bar on the left and my logo.
A translate button? I know Google has that functionality, but I don't want Google involved here. I wonder if DeepL might have that as an option.... I think the way to go is to simply let people use whatever translation software they want as they see fit.
- If this site goes places and I conclude the supporter plan is a good idea, it'd be nice to have the custom domain delta7447.space.
- Maybe an RSS/Atom feed people can subscribe to to get pings for updates?
Support for browsers' reader mode would be nice. It seems to not be natively supported as it stands now, so presumably I need some internal code to enable that. It seems to be an auto-detect thing, if a page is long/text-heavy enough. I don't think this requires any action on my part.
Custom font as part of a site-wide stylesheet thing? Not one of my own creation, but rather one hand-picked by me as opposed to a generic Arial, Helvetica, Times New Roman, etc. Atkinson Hyperlegible would be nice, though it lacks some accented letters used in Japanese names (consider Senran Kagura's Yagyū, Daidōji, Ryōbi, Ryōna, etc.), which would be a little inconvenient for me. Tentatively considering IBM Plex--maybe serif for titles/headers and sans for body text? I've added IBM Plex Sans, and I like it more than the serif version. For now I will use that font site-wide. I'm now using Bitter for story text, and IBM Plex Sans for non-story text.
Meta pages like my commission status/info, my fetish list (so commissioners know what I am and am not into/willing to write about) (workin' on it), and my storylines lists illustrating how my stories connect to each other. (I'm thinking that'll be integrated into each respective page, rather than being its own thing per se.
Implement lazysizes to efficiently load images only as needed. I've added loading="lazy" to all images referred in the works folder, which improves performance. However, the images load in the conventional fashion, appearing to be open space for a short period before loading in top-down, with anything not loaded yet being white. I'm honestly not sure lazysizes is really needed, but it might be worth looking into
Add IBM Plex Sans' proper bold/italics fonts? Variable fonts my beloved
Consider changing the theme color to Delta Purple we purple now
- Ensure every page meets W3C standards. The WAVE extension will come in handy. Working on it
- Handy resources: punkwasp's list and The Ultimate Mother Fucking Website
Consider making bullet points colored, ala DeviantArt. Are gradients feasible? Don't make them too fancy--maybe a different shape at most. Of course, make sure the color has sufficient contrast As you can see, we green/purple squares now
- Is it worthwhile to add SEO-related tags to pages? Are the existing meta ones sufficient?
- Make the site responsive via @media stuff. There's apparently lots of ways to do this--maybe a desktop and mobile version would be in order? It's generally a matter of resolution: min/max widths in pixels, and/or statements, etc. Look into what values are commonly used. Once you've got that set up, add the "this site is responsive" button to your nav page. The logo could switch between "logo on the left, text on the right" to the nav style where it's "big logo up top, text below" on mobile. This sort of thing can be done to alter font size, which I think will be most useful on headers, to avoid a semi-long title taking up half the goddamn screen. Consider also https://www.w3.org/WAI/WCAG2AAA-Conformance
Speaking of the nav page, do you really need index2? Why is it there, if nav does everything it can but better?
- Consider adding normalize.css for consistency's sake
- Can the selection color be translucent? Could be a neat effect
- Make a site map maybe?
Make index2 fancier. Add a larger centered logo with a tagline that is randomly selected from a list
- Split in progress/not started points from the completed and
strikethroughed ones for readability's sake
- Consider a settings page where the light/dark mode can be toggled, as well as possibly a toggle to use the OpenDyslexic font. This page would make a lot of sense for the localstorage stuff on the about page.
- Get set up with React and Next.js
- Add container divs (section or article? Investigate) to make your sticky headers work
- Other elements to use/consider:
- time: this would probably be wrapped around the timestamps for post dates, no need for datetime probably
- section: generic sectioning element. Use this if there isn't a better element elsewhere
- main: the main focus of the page--should be unique to that page
- article: I think this is the container to use for separating stories/chapters on a given page. I'm thinking the text div should become article, while the description should be section.
- mark: might be useful for highlighting filtered text in a table. Use different colors than the selection formatting
- nav: might be suitable for a table of contents?
- Ensure all HTML tags have the proper closing tags. It's not *required*, strictly speaking, but it's a smart idea