About accessibility:
First, if you have any concerns, comments, or requests regarding accessibility, please email me directly at doorbell@yone.house, and I will prioritize addressing them!
I recently updated most of my JavaScript to be compatible with ARIA, screenreaders, and keyboard navigability—I think it works pretty well, but if not please let me know.
My digital accessibility experience is primarily in ebook publishing, not in web design. Even though .epub files are build with HTML and CSS, and I know a decent amount about web accessibility modification, I have never built a website from the ground up before (especially not one that contains JavaScript). So, I am always learning new things as I go, and accessibility may not be entirely perfect on this website; however, I am trying my best, learning a lot, and using as many tools as possible. Learning how to build this website and the experimentation involved has been an invaluable resource and exercise for thinking and learning more about disability justice.
This colophon page is in part for accessibility purposes! Especially the color description section.
Alt text is important, and the Alt Text as Poetry and Alt Text Selfies projects provide a great framework for writing it, so please check them out. To take it a little further, on this site I like to use alt text as a way to add more personal, confessional, or non-visually evident context to images, that is only available to a select audience of people who use or care about accessibility tools (only done with non-functional images). I also like to do this in initially invisible elements, somewhat-hidden popups, and non-visually readable typefaces.
I'm sharing this so maybe people with fewer digital access needs will try interacting with this website in a different way than they're used to. Alt text can be read visually using browser extensions or by looking at the source code, and learning how to navigate a website using only a keyboard can always reveal interesting things. Interacting with this site in a "non-conventional" way may reveal a little bit more information and some fun features I am always adding.
- Generics of keyboard navigation
- Chrome alt text viewer extension
- Firefox alt text viewer extension
- Stacked draggable images must be separated before turning on alt text viewing extensions
Side note regarding publishing accessibility: check out the new epub version of Alt Text as Poetry's workbook, converted by yours truly.
About code:
The HTML, CSS, and JavaScript in this website was coded by hand from blank documents, with the help of Mozilla Developer and w3schools reference pages, many many Stack Overflow posts, a few JavaScript libraries, and, to be completely honest, some AI to make more difficult or unique JavaScript functions be more accessible. This site is hosted on Neocities, and my domain and email are handled by Porkbun. Every document was written and compiled on the Neocities website, which does not have a very user-friendly interface because absolutely nothing is automatic. There are probably better ways to make these files, but I don't know what they are, and to be honest I really like having to write every character by hand. I use the "Dreamweaver" visual theme, for reasons I don't remember at all but I think I just liked it.
Because of this situation, the code of this website is my largest writing project to date, despite the site's modest appearance. Typing and structuring this code, tags, attributes, and all, really does feel like a creative writing exercise. There are more pages in the works, and I'm excited to share them when they're done. I'm really proud of this website!
The code of this website is entirely spaghetti code, because I learned as I went. It's making it harder to expand now, and every time I look at old code I am horrified, but maybe one day I will go back and sort it out. Please do not look at my global stylesheet, or any source files. They are horrendous. But I am getting better every time I add to this!
I just learned how to make a secret hidden pop-up section. Now there are two hidden in this website, which makes me happy. [hint: navigating with the "tab" key helps you find them]
About people:
Many people have provided the inspiration and education that built this website. I originally wanted to list them, but it felt like presenting an acceptance speech with nothing to accept, so right now I will omit the list. However, there are two people who are directly responsible for some pages on this website: Kameelah Janan Rasheed inspired this colophon page, and Elliot of special.fish inspired the lists page.
This site more generally grew from people I've met at institutions I've had the privilege of learning at, notably School for Poetic Computation, Fleisher Art Memorial, the city of Philadelphia in general, and Swarthmore College (very much omitting Swarthmore administrators).
If you are reading this website you probably inspired me creatively in some way, and I hope I've made that clear to you. So many loved ones, friends, collaborators, and mentors have added to this website in a huge way. Thank you!
About color:
The primary color scheme of this website is adapted from combination 341 in A Dictionary of Color Combinations, Vol. 1 [配色事典 大正・昭和の色彩ノート] by Wada Sanzo, generously gifted to me by my dear friend Ada. I am aware that the way I am using this scheme is not the most visually appealing.
I chose combination 341 because it feels like a digitally saturated field, with the sky and grass and ground, and sometimes the sunrise or sunset. I assigned colors based on what makes the physical space feel right for an artificial environment.
I adapted all colors from the CMYK values given in the book before I found out about this online version of the book by Dain Kim. However, the exact CMYK values on a screen did not match what is in the printed book, at least not in the light underneath the Noguchi Ben Franklin Monument on a bright-gray day (the literal values were all a bit more saturated on the screen, and maybe a little greener?). So, I adapted these colors as best I could to match. With a little fiddling.
All chosen colors in the code of this website are in HSL format [hue, saturation, lightness]. I like this format because I can encode meaning into the color property numbers in a qualitative way, as opposed to RGB format adding separate primary colors that have their own meaning already, or hex codes which are just opaque chaos to me. I also like the roundness of the color system, as opposed to a cube. These numbers are where the fiddling takes place: all hue angles stand alone with the color being their only meaning, but their saturation and lightness values are all slightly modified into significant numbers to me, while retaining the character of the color.
I have thought about this a lot. Here is a descriptive list of the main colors on this website:
-
Light Glaucous Blue
hsl(206, 61%, 88%)
This was the base color I found the color combination from, and it is both the background color of the entire website and the color of this text. I wanted a light blue, and I read somewhere that if a beautiful memory could have a color that color would be light blue, and so I chose this one because I liked the word "glaucous," which describes both a "dull grayish-green or blue color" and "covered with a powdery bloom like that on grapes." That is exactly what the color is: a dull grayish-blue, like the bitter starchy texture of touching a fruit fresh off its tree. I like that it is the luminous, powdery color you see through that indicates a fruit has barely been touched. I like the feeling it leaves in your mouth: the astringent sensation of your boots slipping on crunchy snow but on your tongue and teeth and cheeks.
× Felix Gonzalez-Torres Interview by Tim Rollins, April and June 1993 [excerpt]
TR: Getting back to how you make decisions. I wanted to ask you how you chose the blue that you use. What's the difference between your blue, Felix Gonzalez-Torres blue, and Yves Klein blue?
FGT: First of all, my blue is not an international blue, as Yves Klein's was. Mine is just a light blue that you can get anywhere, in any hardware store.
TR: It's more specific. It's not just light blue.
FGT: Actually, I change it all the time. It's a light blue that I change all the time.
TR: It's close to the blue [the Italian architect] Aldo Rossi uses, that's why I know.
FGT: Really? It just has to be light blue.
TR: Okay. Why is it light blue? Is this a baby blue for boys? A robin's egg blue?
FGT: It's more like a Giotto blue in the Caribbean -- saturated with bright sunlight.
TR: It's lighter than Giotto's blue.
FGT: But when you go out in the Caribbean sun the colors get very washed out. It's almost like what Giotto's blue would look like in Last Year in Marienbad -- a memory of a light blue. For me if a beautiful memory could have a color that color would be light blue. There's a lot of positive dialectic, you know, in blues.
blue (bl50) n. 1. a. Any of a group of colors whose hue is that of a sky on a clear day. b. Anything of this color. 2. the blue. a. The sky.-adj. blu-er, blu-est. 1. Of the color blue. 2. Having a gray or purplish color, as from cold or bruise. 3. Informal. Gloomy; depressed. 4. Puritanical; strict. 5. Indecent; risqué: a blue joke. -- blued, bluing. 1. To make blue. 2. To use bluing on. -- idioms. once in a blue moon. Rarely. out of the blue. At a completely unexpected time.
(The American Heritage Dictionary, 2d college ed.)
TR: It's very baby blue, you know, the blue of your first flannel blanket (if you're a boy). You don't use a royal, rich, velvety blue, you use this innocent blue.
FGT: That's a good word for it -- an innocent blue.
TR: Is it a gay blue?
FGT: No. You know, I really didn't have much of an investment in light blue as a kid because we didn't have that kind of luxury of choice. You just got whatever you got: either blue or pink or whatever. If you got a blanket at all you were lucky -- forget about what color it is.
TR: You paint whole walls with it
FGT: Yeah.
TR: So it's a big deal.
FGT: I love blue skies. I love blue oceans. Ross and I would spend summers next to a blue body of water or under clear, Canadian blue skies.
Saturation: 61 is the age of my Obaba when I was born.
Lightness: 88 is the age of my Obaba as I write this—a very lucky age.
-
Cossack Green
hsl(110, 97%, 20%)
The background of this text block: a green like that kind of grass that is dark and long and particularly lush and always kind of wet feeling. ...I intend to do research about the "Cossack" aspect of this green, but in the meantime here is the Wikipedia page for the Cossack ethnic group. Lmk if you find any clues about green!
It is the color of the sections on this page and my about page. On other pages it is occasionally used for borders and underlines, as an accent color.
Saturation: 97 is my birth year and a nice high prime.
Lightness: 20 is the age I was when my disabilities started to present themselves.
-
Deep Slate Olive
hsl(108, 37%, 08%)
It appears as black, but is a dark dark dark green. You are looking up at a tree in a deep deep forest. It is used as a replacement for black in things like the outline of the lists on my lists page, and the text in the nav.
Saturation: 37 is the age I thought my mother was for ~6 years of early childhood.
Lightness: 08 is a significant year to me because it was the final year of US commemorative state quarter releases, and my most vivid memory of ~2002 is when my parents bought a collectible display map for them at a mall. The memory is so vivid because I thought 2008 was unfathomably far in the future. Now it no longer is unfathomably far in the future.
-
Grenadine Pink
hsl(356, 100%, 90%)
It is used sparingly, and is the color of the glowing around these blocks and hyperlinks. Honestly it doesn't look like grenadine at all—it's more like a paler inner-lip color that may indicate anemia. Or, it's the pink of the horizon ~10 minutes before the deepest part of a great sunset.
To be honest I may have amped up the lightness a little more than is true to the book. What is on this website is more like the book's "Fresh Color," which was one of my favorites but technically doesn't fit the scheme. Don't tell Sanzo.
Saturation: 100% means full and complete saturation. Dripping, but also diffused as a drop-shadow filter.
Lightness: 90 seconds / minutes / days are my favorite intervals of time. Can't explain why. Doesn't include hours, weeks, or years.
About type:
Picking typefaces stresses me out a lot, so this website is built almost entirely with web-safe fonts: Helvetica, sans-serif; Times, serif; monospace. (note: there are also web-safe color names!)
There are a few exceptions:
I occasionally use Hildegard von Bingen's litterae ignotae, the letters she developed to write her lingua ignota (using a font made by WurdBender on DeviantArt). I feel a personal connection to her for many reasons, and I use these letters to write something when I want it to be relatively secret. But I know they aren't truly secret—depending on what browser or computer or way of interacting with a website is used, some visitors may be able to read/hear it plainly. Many others cannot. And many who know and love me already know what it says!
I am using Jacquard 24 from Google Fonts for the h1 on this colophon page to make it more... book-y.