https://ellesho.me/page/

ID de l'analyse :
7d6d564b-abff-4211-a95d-ad583f5ec216Terminée
URL soumise :
https://ellesho.me/pageRedirigé
Fin du rapport :

Liens : 72 trouvé(s)

Variables JavaScript : 15 trouvée(s)

Messages de journal de console : 0 trouvé(s)

HTML

<!DOCTYPE html><html lang="en" style="position: relative; min-height: 100dvh;"><head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>elle's homepage</title>
    <meta name="description" content="this is elle's homepage. my home on the internet. i like to make stuff with html and i will put some of it on here">
    <meta name="keywords" content="elle, homepage, very internet person, html, small web">
    <meta name="author" content="elle">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="default">
    <meta name="theme-color" content="#201e21">
    <meta name="fediverse:creator" content="@[email protected]">
    <meta property="og:title" content="elle's homepage">
    <meta property="og:description" content="elle's hypertext stuff">
    <meta property="og:url" content="https://ellesho.me/page">
    <meta property="og:image" content="https://ellesho.me/card.webp">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    <meta property="og:type" content="website">
    <meta property="og:site_name" content="elle's homepage">
    <link rel="canonical" href="https://ellesho.me/page">
    <link rel="icon" href="https://ellesho.me/favicon.svg" type="image/svg+xml" sizes="any">
    <link rel="icon" href="https://ellesho.me/favicon.ico" type="image/x-icon" sizes="16x16">
    <link rel="apple-touch-icon" sizes="180x180" href="https://ellesho.me/apple-touch-icon.png">
    <link rel="manifest" href="/manifest.json">
    <link rel="alternate" type="application/rss+xml" title="elle's homepage rss feed" href="https://ellesho.me/page/rss.xml">
    <link rel="me" href="https://mastodon.social/@e11e">
    <link rel="me" href="https://github.com/riotgoools">
    <link rel="me" href="https://gravatar.com/elleeeeeeeee">
    <link rel="me" href="https://ellebowmacaroni.tumblr.com">
    <link rel="pgpkey" href="https://ellesho.me/page/key.pub">
    <link rel="authorization_endpoint" href="https://indieauth.com/auth">
    <link rel="token_endpoint" href="https://tokens.indieauth.com/token">
    <link rel="microsub" href="https://aperture.p3k.io/microsub/972">
    <link rel="webmention" href="https://webmention.io/ellesho.me/webmention">
    <link rel="openid.delegate" href="https://ellesho.me/page">
    <link rel="openid.server" href="https://openid.indieauth.com/openid">
    <link rel="preconnect" href="https://cursor-party.riotgoools.partykit.dev">
    <link rel="preload" href="js.js" as="script">
    <link rel="preload" href="https://cursor-party.riotgoools.partykit.dev/cursors.js" as="script">
    <style>
        :root {
            --sp: url('data:image/webp;base64,UklGRgoKAABXRUJQVlA4TP0JAAAvv8FPEBfiOLJtJbq461IDIBsCsFAtDndYwbhPGm5j21aqc3GHyCEjpxdqpgFyYneHr25r21aii1vmNGCdk3sBtPIj3H3mGYgkY4mgl7CKiUAAAOD/fwIgQfF50YFVJZKgI0hAsQKCOJ/P3f8/BYDgcn9cqgT/H3JU4QOWAIT18LGgJh4BDggeg+FOzIoX3n94TOyb+f3+fv+/n3p7D7AzM/h/T1FUGgylv9hMhlJFfMgdPYIm39Wj/3jdOSF+hDtfZmFJ+dq7P4VJyolB88A6JpRNil9jawbJqzemp7dk+r8D+3MAsGctKYNHbdvbttG2jeYUuqQnbuMipzjJzHg0vdl3xrxn/VfqJkGQxAlI8t10HhH9lwRJktw2NbtACwTFokaECTpC17OaVof+7ND6Smr+t+tqSqX2zqC8ADLwzqB2qizqECjJ+++/usaL519ZjEUNC9B7y1NfGaRB2Yi9VyyL93bYeb23OAVDnaJVjPffruRv5LHtvamDzuu95cmWJ22AAW1K7waLgVwufw/UDSz03upki5M2tCLv5pMt5pOdD02P3lud3OrS5MrAm7l86miYRxrvlbIQJ1uZhIG53knaDp5zFpLeWwU99Mi9xcltfglofSjybpOEYdttz3kWnMpb+ix4SRy1tzixzCq1qY6+JBGfQaztwBxSeQ/OYoSdX9ZLFrbaWzn/2fb2qS8zqWo6eu+baNux55yFpPRW1c9dz5Zgq72lt0bl5aJOTspq5d5Mxa+jbbepZpDMWwcEqSzv0WR7QerUpgSYltSh4bWrm5GDL3NI5S3jW6qwSvJuY0n3bLd8Ptk3r+34wff1DJJ5y7AcV4rRB0B2wLl2Wlr03tNPO/rORw6+s0jkXTaaQPCcS4adsuuQn7dHHqvhwbfD02c675WKHTxbUgFB58PbaOd3/Yip3unSEfPPGsO2zyGV9wrGwv9uIex8qq6D3nv+WaPdczOj8Qm9i6W8+o5459spsY13/RvP9Yb53gnOGn1jZpHIWwdyKJOpnR9+Ao11fRqTw2TvFGeNnYhvZjQ+pff6JN75uY/ZqcwLKbxvghaPnTXOI4134RQf5nY9R+9hh0fPGic3PrF3amoYReW9GkI7J6UK6bzjDY6eNfY2k0jsnZw6qBFU3ishTE3Zet8M+hs/a+y7PmGl8E7c9oYaWMSnyHtFhCkpf287ftboCQfezL0X1EHjF2OPW5X3qghjXc/AO2ENX7QZG5l7B/9bCLD4efR1c433ygjxrpfjbYdnjdWAakDm3ougltQsls3Yi9ci75URYl0vyXvqwz1372W94HMHnWdRL4LGp/f+B1HvlRGGXS/O+0bOjQBqFnww0AmEKLyfOOa9KkKYsvAucp0aqBl0PUTtvRJqSJnecqwBalgwRO29IqonA+9ySwJh25dk4L2BFw0DliyWcu/NHPrOB11nSQbeG/qgCbuegfemXsi7Tixt8iED7wdfbf1n6z9b/qihcO99u3BvNzvWe5edzn0PUu97/wnSrp/7ft9S73v/uW9x1596R+9d8rw30sbDufnzHKRtR9r4fQf3e9/Srp/iHXEqHP70OUrChRT/2bVdSbjQ0XRJ2/emT6cUTB2rQr33Y6X31vZdyyn2Zs8p+oWLXhzJOZKzK4csFl4FC53320jjS/X+MtL4Ur2bcG834sWOKfbbXb89qsMlFnsL2d0Pl1Z7Kwm6jm29tzgFQdp43tpWe4sb7y9L9e4bDoO+6b2VCYTmb+na/hYHVaT3l3Rt/5JivZtY1227QG8PrLF0r1jXC/X+Egr2Phh2Hego0NuBb8S9Wt8lHUTaTqHew0AwN7hgSvaGYdrgAqV7gx98tfWfrf9s/WfrP1v/+e8OAFj13r8gp6Vk7ww+7M94jlIeXvmltd47/sNi7y/+sPiD33JIi0v1bgg2COkmvLB/Q+XezX74d1TewZR+2fFgar9seUt9eghcW+iN1LuxxSN4yPWjQendD623bSu9f9F6t4env7ruug4tIu/6qaXejXz1ePAdD8CFeh8U791e+7Tuu94g6jzXrqXesUuFA4Lem1K9D4DAm0K9Wxh2HaBF7y0jg4so2vugr2K9rx10PlLOwHuDqyyC7Qy8vcEH95WBtzf4YNtZeG/uwXYe3pt8yMD7wVdb/9n6z9Z/tv6z9Z//E8e9xd8BT+d9EZSOGhheT+k+4q2+AwquIJNUYys54+vOW5Z81wXNBx1ODOH1lN2+sA15pBMrZt2NPBIIwxnU/4Krd6CZd4BdA5B+gt0n5aC/47YeTvqhgZOrCjJIynDfwdffv+PeTh0G6dZwcTI4BqTuVaSs5A5QsuOe8PgDaGZQ6qQM902fT77vk5OH237e9nURr5REhjNA/EuvPa5BMq5O6pCaqzzSUVB2Yu+Ar/spCAcXfcXT3W3SUDOMBim3lrEzqMe1iMdXJ3Y/3ZFB4h2xe5/We8JMGQ66jgUlCxG0ewbHHVBOG2JvJB7AY65qFaPJHoa+8ym9v45PSLlDcLy170bfDkcpwPDAA1LMiTWXPO6rX1tD1+JoGvQ7TLad0PvrGPFPoFRd98XotJvg6mUAF2GJxuORleFxNaz074bH4edh8sG9Byna75hFOu+RmTIc1CeDxo0PBAvhFI9IAIJjj2ownK6sCPE0tEgc3gHTZoLQ5wncuoMqGWHpuBgpKstCBt/62CEorjQv2ZDEm6ACUt/cQT3hn1vfuZ+k/81bdevb6N2GShWqDCq2TRPmpFQ7wHBD8puLPNQj4y7IpP9O2ML1nQf3mWClqpzQhTkpbZh4c8wKt4MX7rpxGwy67cEshdsLAkKB8nlcWRumJVXAHhueTHBbBxAO6RTuSWQnm+KJaud3c67SBsbmnBG85lrZQehiZJYzYHDBLXSzfORhRjKVU4YJ6/7CGaOyh+HCPiBMJW24DSrYUjiPsTMIkxOVrQoM5gywh6FPxf7y2SOz+Hdv+buZmtIHxtKc4Q2idmzbGdzctCQK89Mmcl07vJ2MgqbrG1iyR7fkE3Rdj6eNinDnjIK26xtWsh9HtmQVsvDepAZ+8NXWf7b+s/Wfrf/8FxA7lvExp68eqfIN9lv7/LFT/2GXSj2oPUTW7wn2W/MJkIXrj85g7vncZs+Ipk2w35pPO1aFjzXIB+d79MMyBsVa3yMWfkrPtW3U6/MgGYNkrn1+YgDAT9ROTj+qay3fnBsMtjWs+/HojX8ilvixSHwe1Dfn32jYY83T0IdhotJAJaYf39iXFrK3znd8FIZIUgxsMT909FvYk22Osc5DmDRcW4+Pv7ms9y6PM7ia13noU6HUHZf+qt479mVdCQdUm1o9uka/tv3VsXUYWPupqZuw3hf5LXN++CYcXNY8xP5mz4PpS+qH2TTBCgbpoRbAD77a+s/Wf7b+s/Wfrf/8hw8DAA==');
            --point: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 16 16"><g fill="none" fill-rule="evenodd"><path fill="%23FFF" d="m3.3 12.4-1.2-2-1.5-2c-.2-.4-.2-.6-.1-1 0-.5.7-1 1.4-1 .5 0 1 .4 1.4.8l.7.7.3.6c.3.3.3.4.3 0l-.4-2-.3-1.1L3.6 4l-.3-1.5c0-.5 0-1.4.3-1.8.3-.3.9-.4 1.3-.2.5.2.8 1 1 1.3l.4 2 .5 2.7V5.1c0-.3.3-.7.7-.8a2 2 0 0 1 .9 0c.3 0 .6.2.8.5.3.6.3 1.9.3 1.8.1-.4.1-1.2.3-1.6l.7-.5h1c.2 0 .6.4.7.5.2.3.3 1.3.3 1.7l.3-.8c.4-.6 1.9-.7 2 .7v1a14.6 14.6 0 0 1-.3 3l-.7 1.4s-1 1.2-1.2 1.8v1.9h-1.2c-.4 0-.9-.9-1-1-.2-.4-.5-.4-.7-.1-.2.4-.7 1-1 1.1H5.5s.2-1-.2-1.3l-1.1-1.1-.9-1Z"/><path stroke="%23000" stroke-linecap="round" stroke-linejoin="round" stroke-width=".8" d="m3.3 12.4-1.2-2-1.5-2c-.2-.4-.2-.6-.1-1 0-.5.7-1 1.4-1 .5 0 1 .4 1.4.8l.7.7.3.6c.3.3.3.4.3 0l-.4-2-.3-1.1L3.6 4l-.3-1.5c0-.5 0-1.4.3-1.8.3-.3.9-.4 1.3-.2.5.2.8 1 1 1.3l.4 2 .5 2.7V5.1c0-.3.3-.7.7-.8a2 2 0 0 1 .9 0c.3 0 .6.2.8.5.3.6.3 1.9.3 1.8.1-.4.1-1.2.3-1.6l.7-.5h1c.2 0 .6.4.7.5.2.3.3 1.3.3 1.7l.3-.8c.4-.6 1.9-.7 2 .7v1a14.6 14.6 0 0 1-.3 3l-.7 1.4s-1 1.2-1.2 1.8v1.9h-1.2c-.4 0-.9-.9-1-1-.2-.4-.5-.4-.7-.1-.2.4-.7 1-1 1.1H5.5s.2-1-.2-1.3l-1.1-1.1-.9-1h0Z"/><path stroke="%23000" stroke-linecap="round" stroke-width=".8" d="M11.6 12.7V9.3m-2 3.4V9.3m-2 0v3.4"/></g></svg>') 12 -12, pointer;
            --music: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 512 512"><path d="M452.3.5 185.16 67.28a16.92 16.92 0 0 0-12.64 16.2v308.44c-13.97-8.43-31.28-13.49-50.09-13.49-46.03 0-83.48 29.96-83.48 66.79S76.4 512 122.43 512c46.04 0 83.48-29.96 83.48-66.78V196.68l233.75-58.43v153.5c-13.98-8.43-31.29-13.5-50.1-13.5-46.03 0-83.47 29.97-83.47 66.8 0 36.82 37.44 66.78 83.48 66.78 46.03 0 83.48-29.96 83.48-66.79V16.7A16.76 16.76 0 0 0 452.3.5z"/></svg>') 12 12, zoom-in;
            --min: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><path d="M7.5 6.25 9.75 4 11 5.25 8.75 7.5 11 9.75 9.75 11 7.5 8.76 5.26 11 4 9.75 6.25 7.5 4 5.25 5.25 4 7.5 6.25Z"/></svg>');
            --max: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15 15"><path d="M11 11H5.25l5.73-5.75V11ZM9.74 4 4.01 9.74V4h5.73Z"/></svg>');
            --rss: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAuMTEgMC4wOCA3LjczIDcuODYiPgogIDxnIGZpbGw9IiNhN2E3YTciPgogICAgPHBhdGggZD0iTS4xMy44M1YuMTVDLjEyLjA5LjE0LjA4LjIuMDhhNy42IDcuNiAwIDAgMSA1LjA0IDEuOTggNy45NiA3Ljk2IDAgMCAxIDIuNiA1Ljc0YzAgLjE0IDAgLjE0LS4xNS4xNEg2LjQzYy0uMDYgMC0uMDgtLjAxLS4wOC0uMDhBNi40OCA2LjQ4IDAgMCAwIDIuNSAyLjA3YTYuMTUgNi4xNSAwIDAgMC0yLjI5LS40OGMtLjA4IDAtLjEtLjAyLS4xLS4xVi44M1oiLz4KICAgIDxwYXRoIGQ9Ik00LjQ3IDcuOTRIMy44Yy0uMDYgMC0uMDgtLjAxLS4wOC0uMDhBMy42NyAzLjY3IDAgMCAwIC43OSA0LjMyYy0uMi0uMDQtLjQtLjA2LS42LS4wNS0uMDUgMC0uMDctLjAyLS4wNy0uMDhWMi44MmMwLS4wNi4wMi0uMDcuMDgtLjA3YTUgNSAwIDAgMSAzLjEgMS4xMyA1LjI0IDUuMjQgMCAwIDEgMS45IDMuOTNjMCAuMTMgMCAuMTMtLjEzLjEzaC0uNloiLz4KICAgIDxwYXRoIGQ9Ik0xLjE2IDUuODZjLjU0LS4wMyAxLjAzLjQ3IDEuMDIgMS4wNCAwIC41Ny0uNDcgMS4wNC0xLjA0IDEuMDRBMS4wNSAxLjA1IDAgMCAxIC4xMiA2Ljg4YzAtLjU0LjQ3LTEuMDUgMS4wNC0xLjAyWiIvPgogIDwvZz4KPC9zdmc+');
            --skl: skew(0deg, -27deg);
            --skr: skew(0deg, 27deg);
            --grd: linear-gradient(90deg, #90ffc8, #6466ff, #dacaff, #ff6faf);
        }

        html, body {overflow:hidden;height:100%;margin:0;font-size:16px;image-rendering:pixelated}
        * {-webkit-tap-highlight-color:transparent}
        button {all:unset;display:inline;background:none;border:none;font:inherit;padding:0;margin:0;cursor:pointer;box-shadow:none;outline:none}
        span.email b, #day, #night {display:none}
        .center {display:flex;align-items:center;justify-content:center}
        .pointer {cursor:var(--point)}
        
        .sp {background:var(--sp) 0 0 / 896px no-repeat}

        .hyperspace {height:100vh;width:100vw}
        .ellesroom {position:relative;top:50px;width:400px;min-width:400px;height:512px}
        .leftwall, .rightwall{position:absolute;width:180px}
        .leftwall {top:58px;left:15px;font-size:0.8rem;transform:var(--skl)}
        .rightwall {top:74px;right:10px;transform:var(--skr)}
        .mono {font:0.7rem monospace}
        .gradient {background:var(--grd);-webkit-background-clip:text;background-clip:text;color:transparent}
        .ns {margin:0;color:#ccc;font:0.8rem/1.2 serif}
        .area {position:absolute;width:400px;height:300px;overflow:clip}
        .area, .go {user-select:none;-webkit-user-select:none}
        .floor {flex-direction:column;position:relative;pointer-events:none}
        .tile {display:flex;flex-direction:row;align-items:center;justify-content:center;height:24px;overflow:visible}
        .ft1, .ft2 {width:96px;height:64px}
        .ft1 {background-position:0 0}
        .ft2 {background-position:-128px 0}

        .obj {position:absolute}
        .mb {background-position:-640px -128px;animation:pl-mb 1.2s steps(2) infinite;width:30px;height:30px;top:-18px;left:150px}
        @keyframes pl-mb {0%{background-position:-512px -128px;}100%{background-position:-768px -128px}}
        .mbn {background-position:-768px -128px;width:30px;height:30px;top:-18px;left:150px}
        .cup {background-position:-128px -512px;width:14px;height:24px;top:-28px;left:196px}
        .pile {background-position:-256px -384px;width:60px;height:38px;top:86px;left:62px}
        .bed, .bedn {background-position:0 -384px;width:88px;height:48px;top:-4px;left:190px}
        .bedn {background-position:-128px -384px;}
        .cans {background-position:-768px -256px;width:16px;height:12px;top:6px;left:206px}
        .n {top:-8px;left:182px}
        .note {background-position:0 -512px;width:36px;height:26px;top:74px;left:228px}
        .clth {background-position:-640px -384px;width:42px;height:24px;top:48px;left:128px}
        .shoe {background-position:-768px -384px;width:48px;height:48px;top:24px;left:278px}
        .phn {background-position:0 -256px;animation:pl-phn 1.8s steps(2) infinite;width:22px;height:14px;top:20px;left:230px}
        @keyframes pl-phn {0%{background-position:0 -256px;}100%{background-position:-256px -256px}}
        .phnn {background-position:-256px -256px;width:22px;height:14px;top:20px;left:160px}

        .fax, .go, .skate, .snooze, .pdx, #fit, #launch, #faq, #mobile {cursor:zoom-in}
        .cnstr {width:58px;height:62px;top:294px;left:108px;background-position:-256px 0;animation:pl-constr 0.5s steps(2) infinite;pointer-events:none}
        @keyframes pl-constr {0%{background-position:-256px 0;}100%{background-position:-512px 0}}
        .pod {width:22px;height:24px;top:316px;left:194px;background-position:0 -128px;animation:pl-pod 1s steps(2) infinite;cursor:var(--music)}
        @keyframes pl-pod {0%{background-position:0 -128px;}100%{background-position:-256px -128px}}
        .fax {width:42px;height:74px;top:240px;left:314px;background-position:-512px 0;animation:pl-fax 1s steps(2) infinite}
        @keyframes pl-fax {0%{background-position:-512px 0;}100%{background-position:-768px 0}}
        .go {display:flex;justify-content:space-between;bottom:128px;right:20px;width:80px;height:20px;font-size:0.8rem;transform:skew(59deg, -27deg)}
        .go a {color:#000;text-decoration:none}
        .skate {bottom:126px;right:44px;width:42px;height:34px;background-position:-768px 0;}
        .pdx {bottom:96px;left:134px;width:36px;height:24px;background-position:-512px -256px;animation:pl-pdx 0.8s steps(2) infinite}
        @keyframes pl-pdx {0%{background-position:-512px -256px;}100%{background-position:-768px -256px}}

        #bubble {display:none;position:absolute;top:-72px;right:36px;background:#e5e5ea;border-top:1px solid #efefef;border-radius:20px;color:#000;font:0.6rem/1.3 sans-serif;padding:15px;filter:drop-shadow(4px 5px 5px #0001);border-right:1px solid #d3d3d3;width:100px;transform:var(--skr)}
        .bubblearrow{position:absolute;bottom:-25px;right:15px;border-top:20px solid #0003}
        .bubblearrow::before {content:"";position:absolute;border-left:10px solid transparent}
        .bubblearrow::before {bottom:2px;right:5px;border-top:23px solid #d3d3d3}
        .bubblearrow::after {content:"";position:absolute;bottom:4px;right:6px;border-left:10px solid transparent;border-top:21px solid #e5e5ea}
        #bubble code {background:var(--grd);color:#fff;font-size:0.5rem;border-radius:3px;padding:1px}

        #closet {display:none;position:absolute;top:100px;left:50px;margin:10px;filter:drop-shadow(-4px 5px 5px #0001)}
        .rack {padding:10px;border:3px solid #fff;border-radius:10px;filter:drop-shadow(-2px -2px 0px #eee)}
        .tag {position:absolute;top:36px;left:-36px;width:52px;height:6px;padding:2px 4px;background:#fff;content:"";filter:drop-shadow(1px -1px 0px #eee);transform:rotate(-90deg);font:0.4rem sans-serif;color:#fff;text-shadow:-0.5px -0.5px 0px #eee;}
        .hanger {position:absolute;top:0px;left:0px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1.3fr 1.3fr 1fr;width:100%;height:100%}
        .sprue {border:none}
        .hanger .sprue:nth-child(1),
        .hanger .sprue:nth-child(3),
        .hanger .sprue:nth-child(5) {border-right: 3px solid #fff}
        .hanger .sprue:nth-child(1),
        .hanger .sprue:nth-child(2),
        .hanger .sprue:nth-child(3),
        .hanger .sprue:nth-child(4) {border-bottom: 3px solid #fff}

        #fit {position:absolute;top:264px;left:76px;height:18px;width:38px;background:none;transform:skew(-59deg, 27deg)}
        .clothes {flex-direction:column}
        #hoodie, #tee {margin:10px 0;filter:drop-shadow(-1px -1px 0px #eee);cursor:pointer}
        #hoodie {position:relative;width:36px;height:36px;background-position:-512px -384px}
        #tee {position:relative;width:28px;height:24px;background-position:-384px -384px}
        .guest {background:var(--sp) -136px -180px / 316px no-repeat;width:8px;height:8px;display:inline-block}
        .key {border:1px solid #aaa;border-radius:0.2em;background-color:#f9f9f9;background-image:linear-gradient(to bottom,#eee,#f9f9f9,#eee);color:#000;padding:0.1em 0.3em;font:0.85em monospace}
        #kb {font-size:0.79em}

        #faq {position:absolute;top:250px;left:246px;height:14px;width:18px;background:none;transform:skew(-59deg, 27deg)}
        #pad {display:none;position:absolute;top:-10px;left:170px;filter:drop-shadow(4px 5px 5px #0001)}
        .paper, .paperbig {position:relative;width:140px;height:220px;border-top:2px solid #ddd;border-right:2px solid #bbb;border-radius:10px;background:#fff;background-image:repeating-linear-gradient(#b5d9e8 1px,transparent 2px,transparent 10px);background-size:100% 10px}
        .paper::before, .paperbig::before {position:absolute;width:99%;height:70px;border-radius:10px;background:radial-gradient(circle, black 5px, #fff 5px) repeat-x;background-size:20px 20px;content:""}
        .qs {position:absolute;padding:0 10px 10px;top:20px;width:120px;height:180px;color:#000;font:0.6rem/1.4 sans-serif;overflow:scroll}
        .mag, .demag {position:absolute;bottom:10px;right:10px;padding:0;font:1.5rem sans-serif;color:#fff;border-radius:50%;cursor:pointer}
        .mag {width:25px;height:25px}
        .mag::after {content:'🔍'}
        .demag{width:40px;height:40px;}
        .demag::after{content:'🔍'}
        .paperbig {width:320px;height:480px;border-right:none;background-image:repeating-linear-gradient(#b5d9e8 1px,transparent 2px,transparent 20px);background-size:100% 20px;filter:drop-shadow(0px 5px 5px #0003)}
        .paperbig .qs {width:280px;height:410px;padding:10px 20px 20px;font:1rem/1.4 sans-serif}
        #pagebig {position:fixed;top:200%;left:50%;transform:translate(-50%, -50%);transition:top 0.5s ease;z-index:9999}
        #pagebig.show {top:50%}

        #launch {position:absolute;top:156px;left:158px;height:30px;width:25px;background:none;transform:skew(27deg, -27deg)}
        #frame {display:none;position:absolute;top:-10px;left:20px;width:165px;height:150px;background:#ccc;border-top:2px solid #ddd;border-left:2px solid #bbb;filter:drop-shadow(-5px 5px 5px #0002);border-radius:10px;transform:var(--skl)}
        #framebig {flex-direction:column;border-radius:15px;filter:drop-shadow(0px 5px 5px #0003);background:#ccc;}
        #titlebar {position:absolute;top:0;width:165px;height:30px}
        #titlebarbig {cursor:auto}

        .homepage, .homepagebig {display:flex;align-items:flex-start;justify-content:center;overflow:scroll;background:#eee1ee}
        .homepage {margin-top:30px;width:165px;height:110px}
        .homepagebig {margin:40px 0 20px;width:80vw;max-width:800px;height:60vh}
        #min {position:absolute;border-radius:50%;padding:0;border:none;color:#000;cursor:pointer;background:#f00 var(--min) center / contain no-repeat}
        #min {top:12px;left:12px;width:18px;height:18px}
        #max, #full {position:absolute;top:12px;left:38px;width:18px;height:18px;border-radius:50%;padding:0;border:none;text-decoration:none;cursor:pointer;background: #3c0 var(--max) center / contain no-repeat}
        #full {top:7px;left:4px;width:15px;height:15px}
        .urlbar, .urlbarbig {position:absolute;display:flex;align-items:center;background-color:#fff}
        .urlbar {left:24px;top:4px;width:130px;height:16px;padding:2px;border-bottom:1px solid #eee;border-right:1px solid #aaa;border-radius:3px}
        .urlbarbig {top:7px;width:55%;height:20px;padding:3px;border-radius:5px}
        .urlbar::before, .urlbarbig::before {content:"";background:var(--sp) -128px -256px / 448px no-repeat;width:24px;height:16px}
        .urlbarbig::before {margin:5px 0 0 5px;width:20px;height:20px}
        .urlbar::after, .urlbarbig::after {width:100%;margin-right:20px;font:0.5rem sans-serif;content:"https://ellesho.me/page/website";overflow:hidden}
        .urlbarbig::after {font:0.8rem sans-serif;margin-left:5px}
        .rss {position:absolute;top:9px;right:13px;width:10px;height:10px;background:var(--rss) center / contain no-repeat}
        .urlbarbig .rss {top:7px;right:8px;width:12px;height:12px}
        #fullscreen {position:fixed;top:200%;left:50%;transform:translate(-50%, -50%);transition:top 0.5s ease;z-index:9999}
        #fullscreen.show {top:50%}
        
        .page {margin:10px;max-width:80ch;font:0.6rem/1.4 serif}
        .homepage, .homepagebig {container-name:site;container-type:inline-size}
        .homepagebig .page {margin:30px;font:1em/1.4 serif}
        h1, nav, main {margin-bottom:1.5em;font:1em/1.4 normal}
        h2 {margin:0 0 10px 0;font:italic bold 1em/1.4 normal}
        nav a {margin-right:0.8em;color:#000;text-decoration:underline}
        nav a.active {text-decoration:overline}
        .page img {width:100px;height:auto}
        .homepagebig .page img {width:280px;height:auto}
        ul {padding:0 10px}
        .homepagebig ul {padding:0 15px}
        time {font-size:0.8em}
        .pl {color:#000;text-decoration:none;pointer-events:none}
        .homepagebig h2 {margin-bottom:20px}
        article {content-visibility:auto;margin-bottom:30px}
        .homepagebig article {content-visibility:auto;font:1rem/1.4 serif;margin: 0 0 3em 0}
        #du, #now, #totop {display:none}
        .links ul {display:grid;grid-template-columns:repeat(3, 1fr);grid-auto-flow:row;gap:4px 10px;list-style-type:none;padding:0;margin:0}
        @container site (width < 480px){.links ul{grid-template-columns:repeat(2, 1fr)}}
        footer {padding:10px 0px 10px 0px;font-size:0.8em;border-top:1.5px solid black}
        footer a {color:#000;text-decoration:underline}

        #mobile {position:absolute;top:192px;right:140px;height:12px;width:22px;background:none;transform:skew(-59deg, 27deg)}
        #dscroll {display:none;position:absolute;top:-60px;right:44px;transform:var(--skr)}
        .phone, .phonebig {border-radius:25px;filter:drop-shadow(4px 5px 5px #0001)}
        .phone a, .phonebig a {text-decoration:none}
        .phone {box-shadow:2px -3px 0 #d1d1d1}
        .phonebig {border-radius:30px;border:5px solid #d1d1d1;filter:drop-shadow(0px 5px 5px #0003)}
        .screen, .screenbig {background:linear-gradient(-45deg, #35c3f3 0%, #8b9fe8 20%, #e681d8 39%, #ffa9a4 76%, #fed2ce 100%) fixed;padding:5px;border:5px solid #000;border-radius:25px;overflow-y:scroll;scrollbar-width:none}
        .screen {width:115px;height:185px;font:0.6rem/1.5 monospace}
        .screenbig {max-width:400px;width:80vw;height:80vh;font:1rem/1.5 monospace}
        .screen::-webkit-scrollbar, .screenbig::-webkit-scrollbar {width:0;height:0}
        .bigger, .smaller {position:absolute;bottom:20px;right:20px;padding:0;font:1rem sans-serif;color:#fff;background:#3d3d3d;border-radius:50%;cursor:pointer}
        .bigger {width:25px;height:25px;}
        .bigger::after {content:'\2921'}
        .smaller{width:40px;height:40px;}
        .smaller::after{content:'\2715'}
        #doomscroll {position:fixed;top:200%;left:50%;transform:translate(-50%, -50%);transition:top 0.5s ease;z-index:9999}
        #doomscroll.show {top:50%}

        .feed-item {background:#ddd;margin-bottom:10px;padding:11px;border-radius:15px;font-size:0.7em;color:#000}
        .feed-header {display:flex;justify-content:space-between;align-items:center;font-size:0.7em}
        .feed-source {display:flex;align-items:center}
        .feed-source img {image-rendering:auto;width:1.5em;height:1.5em;margin:-1px 0px 0px 4px}
        .feed-source span {margin-left:0px}
        .feed-date {color:#444}
        .feed-description {margin-top:10px;overflow-wrap:break-word;word-wrap:break-word}
        .feed-item pre {white-space:pre-wrap;word-wrap:break-word}
        .feed-item p {margin-bottom:1px}
        .feed-description img,.feed-description video {width:100%}
        .screenbig .feed-item {padding:20px 20px}
        .throb {position:absolute;top:60px;height:10px}
        .spin {width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:10px 0 #fff, -10px 0 #fff;animation:flash 0.5s ease-out infinite alternate}
        @keyframes flash {0% {background:#fff2;box-shadow:10px 0 #fff2, -10px 0 #fff} 50% {background:#fff;box-shadow:10px 0 #fff2, -10px 0 #fff2} 100% {background:#fff2;box-shadow:10px 0 #fff, -10px 0 #fff2}}

        #navi {display:none;position:absolute;top:188px;left:50px;background:linear-gradient(to right, #edcfd7 50%, #e4bcc7 50%);;color:#000;font:0.6rem/1.3 sans-serif;padding:8px;filter:drop-shadow(4px 5px 5px #0001);border-right:2px solid #dbacb4;border-top:2px solid #ffebeb;border-radius:15px;width:206px;height:fit-content;transform:var(--skr)}
        .ds {display:grid;grid-template-columns:96px 96px;grid-template-rows: 20px 120px 20px;column-gap:14px;row-gap:5px;width:100%;padding:0;margin:0} 
        .ds div:nth-child(1),.ds div:nth-child(5) {font-size:1.2em;color:#666}
        .ds div:nth-child(3),.ds div:nth-child(4) {background-color:#eee;font:0.7em/1.4 monospace;border:1px solid #000;padding:3px;border-radius:3px;overflow:scroll;scrollbar-width:none}
        .ds div:nth-child(3) {background-color:#000}
        .ds div:nth-child(2),.ds div:nth-child(6) {font-size:3em;color:#edcfd7;filter:drop-shadow(1px -1px 0px #dbacb4)}

        #deck {display:none;position:absolute;top:100px;left:310px;width:65px;height:140px;filter:drop-shadow(-4px 5px 5px #0001);transform:var(--skl)}
        .nose {position:absolute;left:-5px;display:flex;justify-content:end;background:#CBC3E3;width:60px;height:60px;border-radius:80px 80px 0 0;border-left:3px solid #dbc2af;border-top:3px solid #dbc2af;transform:skewX(10deg);box-sizing:border-box;overflow:hidden}
        .middle {display:flex;justify-content:center;position:absolute;top:60px;background:#CBC3E3;width:60px;height:130px;border-left:3px solid #d1b7a1;box-sizing:border-box;overflow:hidden}
        .tail {position:absolute;left:-5px;top:190px;width:60px;height:50px;background:#CBC3E3;border-radius:0 0 80px 80px;border-left:3px solid #dbc2af;box-sizing:border-box;transform:skewX(-10deg);overflow:hidden}
        .stk {position:absolute;transform:rotate(15deg)}
        .ball {top:5px;right:10px;font-size:1.7rem;letter-spacing:-20px;line-height:20px}
        .web {top:0px;left:-36px;font-size:4.5rem}
        .ring {top:74px;right:-6px;font-size:1.5rem;transform:rotate(-30deg)}
        .pixl {bottom:0px;left:-5px;font-size:1.8rem}
        .disk {bottom:0px;left:1px;font-size:0.5rem;transform:rotate(5deg)}
        .bow {top:0px;left:25px;font-size:1.7rem;transform:rotate(-15deg)}
        .wrlabel {top:42px;left:-20px;height:fit-content;width:64px;padding:5px 20px;background:#f6f;font:italic 0.6rem sans-serif;color:#fff;transform:rotate(-20deg) skew(-6deg)}
        .scratch {position:absolute;top:85px;left:-21px;font-size:10rem;line-height:20px;transform:rotate(-50deg)}
        .holes {width:35px;height:40px;position:absolute;top:0px}
        .holes:before, .holes:after {content:"";position:absolute;height:100%;width:20px;background-image:radial-gradient(circle at center, #000 1.5px, transparent 1.5px), radial-gradient(circle at center, #000 1.5px, transparent 1.5px);background-size:20px 20px;background-position:top center, bottom center;background-repeat:no-repeat}
        .holes:before {left:0px}
        .holes:after {right:0px}

        @keyframes bouncel {0% {transform:scale3d(0, 0, 0) var(--skr)} 70% {transform:scale3d(1.05, 1.05, 1.05) var(--skr)} 100% {transform:scale3d(1, 1, 1) var(--skr)}}
        @keyframes shrinkl {0% {transform:scale3d(1, 1, 1) var(--skr)} 70% {transform:scale3d(1.05, 1.05, 1.05) var(--skr)} 100% {transform:scale3d(0, 0, 0) var(--skr)}}
        @keyframes bouncer {0% {transform:scale3d(0.5, 0.5, 0.5) var(--skl)} 70% {transform: scale3d(1.05, 1.05, 1.05) var(--skl)} 100% {transform: scale3d(1, 1, 1) var(--skl)}}
        @keyframes shrinkr {0% {transform:scale3d(1, 1, 1) var(--skl)} 70% {transform:scale3d(1.05, 1.05, 1.05) var(--skl)} 100% {transform:scale3d(0.5, 0.5, 0.5) var(--skl)}}
        #bubble, #deck, #closet, #frame, #dscroll, #navi, #pad {animation-duration:0.2s;animation-fill-mode:both;animation-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1.275)}
        #bubble.expand-in, #dscroll.expand-in, #navi.expand-in, #pad.expand-in {animation-name:bouncel}
        #bubble.shrink-out, #dscroll.shrink-out, #navi.shrink-out, #pad.shrink-out {animation-name:shrinkl}
        #deck.expand-in, #frame.expand-in, #closet.expand-in {animation-name:bouncer}
        #deck.shrink-out, #frame.shrink-out, #closet.shrink-out {animation-name:shrinkr}

        #night .hyperspace {background-color:#201e21}
        @keyframes rotate {from {transform:rotate(0deg);}to {transform:rotate(360deg)}}
        .starpath {position:fixed;animation:rotate 2400s linear infinite}
        #sky {position:absolute;display:grid;grid-template-columns:repeat(8, 1fr);grid-template-rows:repeat(8, 1fr);gap:0;font-family:sans-serif;color:#fff;text-align:center;top:50px;text-shadow:0 0 3px #fff3;animation:glow 2s infinite ease-in-out}
        @keyframes glow {0%, 100% {text-shadow:0 0 3px #fff3} 50% {text-shadow:0 0 6px #ffff}}
        .star1 {grid-area: 1 / 2 / 2 / 3}
        .star2 {grid-area: 1 / 5 / 2 / 6}
        .star3 {grid-area: 1 / 6 / 2 / 7}
        .star5 {grid-area: 2 / 3 / 3 / 4}
        .star6 {grid-area: 2 / 6 / 3 / 7}
        .star7 {grid-area: 2 / 7 / 3 / 8}
        .star8 {grid-area: 3 / 1 / 4 / 2}
        .star9 {grid-area: 4 / 2 / 5 / 3}
        .star10 {grid-area: 5 / 1 / 6 / 2}
        .star11 {grid-area: 6 / 1 / 7 / 2}
        .star12 {grid-area: 3 / 7 / 4 / 8}
        .star13 {grid-area: 4 / 8 / 5 / 9}
        .star14 {grid-area: 5 / 8 / 6 / 9}
        .star15 {grid-area: 6 / 7 / 7 / 8}
        .star16 {grid-area: 7 / 2 / 8 / 3}
        .star17 {grid-area: 7 / 4 / 8 / 4}
        .star18 {grid-area: 7 / 5 / 8 / 6}
        .star19 {grid-area: 7 / 7 / 8 / 8}
        .star20 {grid-area: 8 / 3 / 9 / 4}
        .star21 {grid-area: 8 / 5 / 9 / 6}
        .star22 {grid-area: 8 / 9 / 9 / 7}
        .star6, .star13, .star19 {text-align:left}        
        .star7, .star11, .star18 {text-align:right}
        #night .leftwall {top:70px}
        #night .rightwall {filter:brightness(0%)}
        .dim {filter:brightness(20%);pointer-events:none}
        #night .pod {background-position:-256px -128px;animation:pl-npod 1s steps(2) infinite}
        @keyframes pl-npod {0%{background-position:-256px -128px;}100%{background-position:-512px -128px}}
        .snooze {top:115px;right:170px}
        .zzzs {position:relative;display:flex;align-items:end;justify-content:center;width:20px;height:50px;overflow:hidden;filter:opacity(50%)}
        .z {position:absolute;bottom:-10px;font:0.6rem sans-serif;color:#bbb;animation:float 3s ease-in infinite, fade 3s ease-in infinite}
        @keyframes float {0% {transform:translateY(0%)} 100% {transform: translateY(-300%)}}
        @keyframes fade {0% {opacity:0} 80% {opacity:1} 100% {opacity:0}}
        .z:nth-child(1) {left:50%;animation-delay:0s}
        .z:nth-child(2) {left:40%;animation-delay:2s}
        .z:nth-child(3) {left:30%;animation-delay:7s}

        .countdown {font:1rem monospace;text-align:left;margin:1em 0;color: #c35dff;text-shadow:0 0 1px #fff3,0 0 2px #fff3,0 0 3px #fff3;animation: glow 3s infinite ease-in-out}
        @keyframes glow {0%, 100% {text-shadow:0 0 1px #fff3,0 0 2px #fff3,0 0 3px #fff3} 50% {text-shadow:0 0 2px #fff4,0 0 4px #fff4,0 0 6px #fff4}}
        .lightson {position:relative;width:30px;height:17px;background:#333;border-radius:34px;border-bottom:1px solid #666;border-right:1px solid #666;cursor:pointer}
        .lightson::before {display:flex;align-items:center;justify-content:center;content:"☼";font-size:0.7rem;position:absolute;left:2px;top:2px;width:13px;height:13px;background:#aaa;border-radius:50%;border-top:1px solid #ccc;border-left:1px solid #ccc;transition:transform 0.3s ease}
        .lightson.active {background:#fff}
        .lightson.active:before {transform:translateX(13px)}

        .nojs {flex-direction:column;background:#000}
        .nojsicon {background-position:-256px -512px;height:32px;width:32px}
        .nojsb {background:#efefef;color:#000;font:0.8em/1.2 serif;border-radius:20px;margin:0 auto 20px;max-width:140px;padding:15px;position:relative}
        .nojsb::after {content:"";position:absolute;bottom:-10px;right:70px;border-right:10px solid transparent;border-top:10px solid #efefef}
    </style>
</head>
    <body style="background-color: rgb(32, 30, 33);">
        <div id="day" style="display: none;">
            <div class="hyperspace center">
                <div class="ellesroom center">
                    <div class="leftwall">
                        <div class="mono">&lt;div class="wall"&gt;</div>
                        <p>welcome to my homepage it's still under construction! maybe it will be like this forever idk ¯\_(ツ)_/¯</p>
                        <p>feel free to click around &lt;3</p>
                    </div>
                    <div class="rightwall">
                        <header class="gradient">elle's homepage ฅ^ • ﻌ • ^ฅ</header>
                        <p class="ns">
                            dns: ellesho.me/page<br>
                            hns: elle.shome/page<br>
                            ens: elles.eth.limo<br>
                        </p>
                    </div>
                    <div class="floor center">
                        <div id="dayfloor">
                            <div class="tile">
                                <div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft2"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft2"></div><div class="sp ft2"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft2"></div><div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft2"></div><div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div>
                            </div>
                            <div class="sp cup obj"></div>
                            <div class="sp pile obj"></div>
                            <div class="sp note obj"></div>
                        </div>
                        <div class="sp mb obj"></div>
                        <div class="sp bed obj"></div>
                        <div class="sp cans obj"></div>
                        <div class="sp phn obj"></div>
                    </div>
                    <div class="area center">
                        <canvas id="game" width="512" height="512"></canvas>
                    </div>
                    <div class="sp cnstr obj"></div>   
                    <audio id="pod" loop=""></audio>
                    <button class="sp pod obj" data-audio="pod" data-src="sailor.aac" aria-label="listen" onclick="playpause(this)"></button>
                    <button class="sp fax obj" id="chat" aria-label="open/close contact"></button>
                    <button id="faq" aria-label="open/close faq"></button>
                    <div id="pad">
                        <div class="paper">
                            <div class="qs">
                                <div id="ans">
                                    <p>🤷🏻‍♀️ frequently asked ???</p>
                                    <p><i><b>who are u?</b></i></p>
                                    <p>i'm elle! the webmaster here</p>
                                    <p><i><b>what are your pronouns?</b></i></p>
                                    <p>irl i'm she/her but i'm ok with whatever as long as u aren't being sexist or bigoted about it</p>
                                    <p><a href="https://en.wikipedia.org/wiki/On_the_Internet,_nobody_knows_you%27re_a_dog" target="_blank">everyone on the internet is a dog</a> anyways ૮ • ﻌ - ა</p>
                                    <p><i><b>what is this place?</b></i></p>
                                    <p>it's my escape from the social and/or commercial web. a place to play and experiment for fun</p>
                                    <p>i just think the internet needs more personal homepages now more than ever</p>
                                    <p><i><b>does this have something to do with crypto??</b></i></p>
                                    <p>no! there's no dog coins or anything here. but it does use some tech that is often associated with what some call "web3" (i don't like that term, it's all just the internet to me ¯\_(ツ)_/¯)</p>
                                    <p>for example, the page is stored on <a href="https://ipfs.tech" target="_blank">ipfs</a>, with some media on <a href="https://www.arweave.org" target="_blank">arweave</a>, and u can get here via alternative domain name systems like <a href="https://ens.domains" target="_blank">ens</a> and <a href="https://handshake.org" target="_blank">handshake</a></p>
                                    <p>i know there is a lot of bad stuff in crypto (esp in the cryptocurrency space) but there is also some useful stuff to explore! this homepage tries to use energy efficient tech (well, as efficient as the internet can be at least, which is not very (╥_╥)) and will never ask u to use any cryptocurrency to access it</p>
                                    <p><i><b>how is the chat made?</b></i></p>
                                    <p>it's based on <a href="https://github.com/partykit/cursor-party" target="_blank">cursor party</a> by <a href="https://interconnected.org" target="_blank">matt webb</a> and runs on <a href="https://www.partykit.io" target="_blank">partykit</a>. i forked matt's code and added my own features. u can read more about it in my <a href="https://ellesho.me/page/website/now/#party-time" target="_blank">blog post</a></p>
                                    <p><i><b>what is a signing extension (for optional usernames in chat)?</b></i></p>
                                    <p>they are local apps/browser extensions (such as frame, metamask, rainbow, etc.) crypto ppl call them <a href="https://ethereum.org/en/wallets/find-wallet/" target="_blank">wallets</a> but they are basically just little keychains that provide u with a public-private cryptographic keypair and lets u sign to verify ownership of those keys. think pgp keys, yubikeys, or passkeys</p>
                                    <p>i decided to use this system because ens lets u prove domain name ownership with a simple dns txt record. this avoids having to create user accounts or, worse, keeping user info in a database somewhere to be leaked x_x</p>
                                    <p><i><b>what did u make this site with?</b></i></p>
                                    <p>just plain old html/css/js (no frameworks.) i'm just typing it all out as i go in vscode</p>
                                </div>
                            </div>
                            <button class="mag center" id="pageup" aria-label="zoom page"></button>
                        </div>
                    </div>
                    <div id="bubble">
                        💬 talk to me on<br>
                        <a href="https://matrix.to/#/@elle:gooolch.at" target="_blank">matrix</a><br>                    
                        <a href="https://elle.converse.xyz" target="_blank">xmtp</a>
                        <p><span class="email">📧 hi@elle<b>.elle</b>.email</span></p>
                        <p>type: <br><code>finger [email protected]</code> in your terminal app for a fun message</p>
                        <hr>
                        <p><span class="guest"></span> press <span class="key">/</span> to chat with other ppl on the page*</p>
                        <p><span class="key">enter</span> to hold msg</p>
                        <p><span class="key">esc</span> to clear msg</p>
                        <span id="kb">*keyboard &amp; mouse required</span>
                        <div class="bubblearrow"></div>
                    </div>
                    <div class="go obj">
                        <a href="https://xn--sr8hvo.ws/previous">←</a> 
                        <a href="https://xn--sr8hvo.ws/next">→</a>
                    </div>
                    <button class="sp skate obj" id="wr" aria-label="about webring"></button>
                    <div id="deck">
                            <div class="nose"><div class="stk ball">&nbsp;🔮<br>&nbsp;&nbsp;🎀</div></div>
                            <div class="middle">
                                <div class="holes" style="top:0px"></div>
                                <div class="stk web">🕸️</div>
                                <div class="stk wrlabel">use the ← / → to explore the <a href="https://xn--sr8hvo.ws">indieweb webring</a></div>
                                <div class="stk ring">💍</div>
                                <div class="stk disk">💾</div>
                                <div class="holes" style="top:95px"></div>
                            </div>
                            <div class="tail">
                                <div class="stk scratch">🪤</div>
                                <div class="stk pixl">👾</div>
                                <div class="stk bow">🎀</div>
                            </div>     
                    </div>
                    <button id="mobile" aria-label="open/close feed"></button>
                    <div id="dscroll">
                        <div class="phone center">
                            <button class="bigger center" id="lockin" aria-label="zoom feed"></button>
                            <div class="throb center" id="throb">
                                <div class="spin"></div>
                            </div>
                            <div class="screen"><div class="rss-feeds"></div></div>
                        </div>
                    </div>
                    <button id="launch" aria-label="open website"></button>
                    <div id="frame">
                        <div class="homepage" id="homepage">
        <div id="top"></div>
        <div class="page">
            <header>
                <h1>.* ౨ৎ • 𝑒𝓁𝓁𝑒'𝓈 𝒽𝑜𝓂𝑒𝓅𝒶𝑔𝑒 • ౨ৎ *.</h1>
                <nav>
                    <a class="active">now</a>
                    <a href="/page/website">about</a>
                    <a href="/page/website/uses">uses</a>
                    <a href="/page/website/links">links</a>
                </nav>
            </header>
            <main>
                <article id="now">
                    <h2>now:</h2>
                    <i>lately, i've been spending my spare time making this homepage as a way to stay sane on the internet and in life. i'm currently in a weird limbo caring for my elderly parents who are in poor health so i find myself doing random personal projects around the internet for fun and to teach myself new things</i>
                </article>
                <article id="windows-or-mirrors">
                    <time datetime="2024-11-20"><a class="pl" href="#windows-or-mirrors" target="_blank">2024-11-20</a></time>
                    <h2>windows or mirrors</h2>
                    <p>i haven't felt like working on my homepage for the last two weeks. honestly, i haven't felt like being on the internet much at all since the us election happened. i can't say i was surprised by the result (i foreshadowed it in my <a href="https://ellesho.me/page/website/now/#halloween-at-home" target="_blank">halloween post</a>.) but i was shocked, disgusted, and disappointed by it all the same. the days following nov 5 only confirmed my fears with the immediate increase of online (and offline) <a href="https://www.teenvogue.com/story/emboldened-by-a-trump-win-misogyny-is-exploding-online" target="_blank">misogyny</a>, <a href="https://www.theguardian.com/us-news/2024/nov/08/racist-text-messages-trump-win" target="_blank">racism</a>, and <a href="https://www.reuters.com/world/us/fbi-says-bigoted-text-messages-also-sent-lgbtq-hispanic-people-2024-11-15/" target="_blank">bigotry</a> because the worst people saw their guy winning as an approval. how will it escalate when things actually start for real in 2025?</p>
                    <p>it felt worse to me this time because of how much big internet money drove this result – from elon musk to <a href="https://archive.is/NvsSK" target="_blank">big tech ceos</a> to <a href="https://www.followthecrypto.org" target="_blank">crypto pacs</a>. i know special interest money is unfortunately always a part of it but what i saw full force in this election wasn't the internet where marginalized people can actually have a voice but an uneven space where, once again, entities with outsized capital and influence con and bully their way into controlling everyone's lives. seeing the internet in this way makes me feel so gross, like maybe it's a lost cause.</p>
                    <p>i've written before about how the web has been a refuge for me. growing up, i was an outsider. i grew up in a very conservative, religious, and conformist town that treated anyone outside their limited worldview with distain. i wanted no part in the mass culture that everyone defaulted to, wearing the same brands of clothing, consuming the same media, performing the same ascribed roles. it was on the internet that i found people to talk to about weird animes or learn how to play obscure songs or figure out fun html tricks. it was online where i could encounter more expansive ideas and truly escape the restrictive local culture. when i went online, a better alternative world came into focus.</p>
                    <p>i don't know if i can still say that with confidence. i mean, that open internet is still there but it's been displaced out of view. because now, when i go online, i can't avoid seeing all the terrible things of irl piling up everywhere, obscuring the little bits of good. it's less of a window into a more open world and more of a mirror or maybe even a funhouse mirror, taking the horrors of real life and stretching and distorting them even more and reflecting that image back onto us, <a href="https://www.animanoir.xyz/blog/2024/the-death-state-of-the-internet/" target="_blank">reshaping our very being</a>. and i feel like an outsider needing to find an alternative space again.</p>
                    <p>over the past couple weeks, i started building a links page/section here. it was on my todo list to make one but i was extra motivated after reading <a href="https://thoughts.melonking.net/thoughts/every-site-needs-a-links-page-why-linking-matters" target="_blank">this</a> and feeling like i need to do something to be a "positive citizen of the web" after recent events, even if it's just putting some hyperlinks on my page. i'm still collecting links to put on it. most of the sites i have so far are sites i've recently visited. there are two links sections<sup><a href="https://6chcl6xjikbnwusbdcwole44rjexv6q7t6nz7x7byk3zru7xbmbq.arweave.net/8I4l-ulCgttSQRis5ZOcikl6-h-fm5_f4cK3mNP3CwM" target="_blank">1</a></sup> – a <a href="https://ellesho.me/page/website/links" target="_blank">text link page</a> on the flat version of this homepage and an 88x31 button link popup menu on the <a href="https://ellesho.me/page" target="_blank">3d view</a> if you click on the nintendo ds/pokedex/handinavi thing on the ground.</p>
                    <p>i've been working on recentering myself. i've been disconnecting from social media to create more distance from those platforms so as not to have a direct pipeline to my brain for the poison that's surely on the way. i don't know what's going to happen from here but i'm just going to keep doing what i believe in and focusing on the people i care about. anyways, here are <a href="https://www.theguardian.com/commentisfree/2024/nov/17/how-to-survive-the-broligarchy-20-lessons-for-the-post-truth-world-donald-trump" target="_blank">some good tips</a> for the potential future.</p>
                </article>
                <article id="halloween-at-home">
                    <time datetime="2024-10-31"><a class="pl" href="#halloween-at-home" target="_blank">2024-10-31</a></time>
                    <h2>halloween at home</h2>
                    <p>it's halloween! i hope you are having a good one. it's always been my favorite day. i feel very nostalgic around this time. sadly, i haven't been able to dress up or do anything special for the past few years beyond handing out candy ( • ᴖ • 。) but hopefully just doing that adds to the fun for someone else.</p>
                    <p>lately, i've been battling exhaustion and exasperation. taking care of my parents was especially demanding this week. dealing with someone with severe dementia, it feels like there are really only neutral days and bad days and bad bad days. this week wasn't bad bad but still pretty bad. added to that is the anxiety over things in the world. the wars, the election, the general vibe of everything is stressing me out. this makes me restless and i find it hard to focus on getting things done sometimes.</p>
                    <p>as usual, i turned to my homepage for an escape. i decided to rewrite my feed aggregator again. since there are so many different feeds coming in now, things were getting sluggish and it bugged me. while moping around one day, i realized i should just stop calling each feed individually with the aggregator and, instead, automate a regularly refreshed cache of a pre-compiled feed. this way, i could just fetch one feed instead of many simultaneously on my page. it worked! now everything's much snappier and less resource intensive ^-^</p>
                    <p>anyways, i also added two more "small web" feeds – <a href="https://status.cafe/users/elle" target="_blank">status.cafe</a> and <a href="https://elle.flounder.online" target="_blank">flounder</a>. status.cafe is made by the same person as smol.pub and is a fun little streamlined status update app. flounder is a nice service for building gemini capsules that also publishes on http.</p>
                    <p>i think the reason i'm feeling an urgency to explore these alternative services right now and making my homepage more of my default home is because i'm unsure i'll want to continue using "big internet" social media in the near future. between 2016-2020, i stopped using it because it was unbearable, both terrifying and annoying at the same time. they even had a phrase for what they were doing: "<a href="https://www.vox.com/policy-and-politics/2020/1/16/20991816/impeachment-trial-trump-bannon-misinformation" target="_blank">flooding the zone with shit</a>." you should watch adam curtis' excellent film, "<a href="https://www.youtube.com/watch?v=Gr7T07WfIhM" target="_blank">hypernormalisation</a>," to understand how this tactic is basically a form of psychological torture used to control the masses. i'm not particularly interested in spending the next 4 years (or maybe forever?? (╥_╥)) in that zone. and for a myriad of other and more important reasons, i hope it doesn't even get to that point where it happens again.</p>
                </article>
                <article id="outposts">
                    <time datetime="2024-10-24"><a class="pl" href="#outposts" target="_blank">2024-10-24</a></time>
                    <h2>outposts</h2>
                    <p>i've not been feeling very good about the social media machine for a long time (infinite algorithm scrolls.) i've been pulling away from them more and more recently. whatever value they provide for connecting people just doesn't seem worth it for the amount of mind pollution they serve up now (which is only getting worse as the tools to generate garbage increase speed.)</p> 
                    <p>the worst offender imo is twitter because it has an outsized influence on the world and is run by a maniac who uses it as his own personal tool to spread hateful disinformation. i don't want to participate in that or be complicit in granting figures like musk any more power to do the harm to people, to the world, and to the internet, that he causes on a daily basis with his schemes. i get it. people want a neutral place to gather. but twitter hasn't been neutral for a while now, especially since it stopped being "twitter." it breaks my brain and my heart that people are still holding onto the illusion that twitter is some kind of open town square and granting it its power (╥_╥)</p>
                    <p>i want to be on an internet that feels good – that is a hopeful technology. an internet that surprises and shows new possibilities and wonders. maybe it's because of, or at least exacerbated by, the current us election frenzy but it can feel like the opposite of hopeful sometimes.</p>
                    <p>that's why i started making this homepage. it's a refuge.</p>
                    <p>i spent a large part of this week looking at alternative networks and web communities. there are so many people doing interesting things everywhere. the <a href="https://tildeverse.org" target="_blank">tildeverse</a>, <a href="https://usb.club" target="_blank">file</a> <a href="https://serveyourtra.sh" target="_blank">sharing</a> clubs, a community on a <a href="https://sectordisk.pw" target="_blank">1.44mb floppy disk</a> ¯\_(ツ)_/¯ all the indie web and small web stuff i've mentioned in previous entries. people just blogging and making websites in a truly open way. i'm happy there are still those places to turn to when the mainstream internet starts to stink. though, i do worry it might be a form of escapism and avoidance to just get lost in obscure websites. idk.</p>
                    <p>there aren't too many cosmetic changes to the homepage in this update. i did do some large rewrites to slim down my javascript but i mainly just signed up for a bunch of different services as part of my research and added them to the aggregated feed pop up: 
                    </p><ul>
                        <li><a href="https://feedland.org/?river=http://data.feedland.org/feeds/elle.xml" target="_blank">feedland</a> – a web based rss aggregator that also lets you post to your own feedland rss feed</li>
                        <li><a href="https://spacehey.com/e11e" target="_blank">spacehey</a> – a myspace revival</li>
                        <li><a href="https://elles.neocities.org" target="_blank">neocities</a> – a geocities revival</li>
                        <li><a href="https://elle.bearblog.dev/" target="_blank">bear</a> – a tiny independent blogging service</li>
                        <li><a href="https://elle.smol.pub" target="_blank">smol.pub</a> – another small blogging service that publishes to http, <a href="https://en.wikipedia.org/wiki/Gopher_(protocol)" target="_blank">gopher</a>, and <a href="https://geminiprotocol.net" target="_blank">gemini</a> protocols</li>
                    </ul>
                    <p>all of these services have feeds but they also have their own web page. i'm not sure how often i'll update them or what i'll even use them for (i now have 11 feeds being aggregated and i'm already bad enough at updating a single blog!) but i'm thinking of them as little unique outposts or satellites for this homepage that i'll develop on the side for fun.</p>
                </article>
                <article id="stress-test">
                    <time datetime="2024-10-17"><a class="pl" href="#stress-test" target="_blank">2024-10-17</a></time>
                    <h2>stress test</h2>
                    <p>things got a little overwhelming here on the <a href="https://ellesho.me/page" target="_blank">homepage</a> last friday morning when thousands of visitors<sup><a href="https://mesjwdrpkjvlh6ee5p7savmxkdvwnfctirdl2vzy6br5esgbqelq.arweave.net/YSSbDi9SarP4hOv_IFWXUOtmlFNERr1XOPBj0kjBgRc" target="_blank">1</a></sup> suddenly flooded in from <a href="https://news.ycombinator.com/item?id=41809469" target="_blank">hacker news</a>!</p>
                    <p>honestly, i never expected more than a handful of people to be here at the same time so i was worried that the various things that i run my page on wouldn't survive the day. luckily there were only a couple minor hiccups –i kept getting alert emails from cloudflare and the partykit server for the cursor chat would occasionally refresh from being overloaded – but that's about it and my little homepage was able to tough it out (◕‿◕)♡</p>
                    <p>of course, when you have an open chat, there's bound to be people who try to cause a disturbance (see some of the comments on hn.) i wasn't awake yet when people were really misbehaving so i missed a lot of that stuff. for the most part, whenever i dropped in, everyone was just enjoying chatting about all sorts of topics. occasionally someone would test the "free speech" but everyone just ignored them, as they should, and the offender would leave because they weren't getting reactions. i think that's an interesting thing about a live chat vs. social feeds. it's closer to real life where shitty behavior is shunned in real time and the person(s) acting out just seem like sad jerks whereas on social it's validated and emboldened by metrics and more shittiness.</p>
                    <p>overall, it was a fun experience even though it was a little stressful because i had some irl issues (mom in hospital) happening at the same time. i chatted with a lot of random people who also care about the internet or were curious about learning more. lots of people said they wanted to make their own homepages now which is the best response i could ever hope for. i received a bunch of emails too! there were lots of questions about the page and it's hard to get to all of them so i decided to compile the questions i got in email and the ones i remember from chat into an faq section for my homepage task this week. i'll add to it if more things come to mind ^-^</p>
                    <p>i replaced the little purse on the floor with a notepad to open the faq. the design of it is a little nod to the <a href="https://win98icons.alexmeub.com" target="_blank">windows 95/98 notepad icon</a> which was what i learned writing html on when i first got a computer &lt;3</p>
                    <p>thanks again to everyone who visited! maybe some of you are reading this through rss right now :)))</p>
                </article>
                <article id="being-healthy">
                    <time datetime="2024-10-10"><a class="pl" href="#being-healthy" target="_blank">2024-10-10</a></time>
                    <h2>being healthy</h2>
                    <p>i'm still juggling life stuff that all hit at once last week – coordinating with a contractor to do home repairs, watching over one parent with dementia while their home is being worked on, and getting my other parent ready to go in for a major surgery. it's been hectic!</p>
                    <p>i'm also trying to improve my sleep schedule by going to bed earlier so i don't get too stressed out about everything. one of my worst habits is working on projects right before bed. this is partly because the day is filled with other chores and tasks that i need to complete – lately there's been a lot – and so i don't get around to opening up the things i really want to do until everything else is settled for the day. but even if i set a time limit, i can't stick to it. i go on tangents, trying different experiments, looking up all the things i thought about during the day but couldn't get to. minutes quickly melt into hours and i'm looking at no sleep again (╥_╥)</p>
                    <p>it's probably a good thing i have all these other responsiblities to snap me out of my projects. when i was younger and more carefree, i would get obsessed with whatever i was doing and stay up for days making things – very productive but not very healthy.</p>
                    <p>this week, i tried to keep my homepage tasks smaller to not overextend myself too much. so i just worked on little details again that i've been meaning to get to. before, i had speech bubbles come out of the skateboard and the clothing pile like the mailbox but those were just placeholders until i made more fitting pop ups.</p>
                    <p>so, with the short time i had this week, i just focused on making css drawings for those elements – a skate deck with emoji graphics for the webring info and a gunpla-like sprue tree for the closet ^-^ i haven't checked how the deck looks on a non-apple device so i'm not sure how the emojis look on that, sorry! i used the mousetrap box for the tail scrape and it might look weird with other emoji sets ¯\_(ツ)_/¯ if it looks too weird, maybe i'll try to do some full-on css drawing, like lynn fisher's <a href="https://a.singlediv.com" target="_blank">amazing single div art</a>, but i think it's okay for now!</p>
                </article>
                <article id="linking">
                    <time datetime="2024-10-03"><a class="pl" href="#linking" target="_blank">2024-10-03</a></time>
                    <h2>linking</h2>
                    <p>i didn't really have a great week and fell behind on a lot of things. on top of my usual caregiver duties, i was battling an internet outage, home repairs, food poisoning, and general lethargy from feeling bad about life and the world.</p>
                    <p>with the little time i did have, i made a little 88x31 pixel link button<sup><a href="https://ellesho.me/elles8831.webp" target="_blank">1</a></sup> for my <a href="https://ellesho.me/page" target="_blank">homepage</a>. you may remember these little things as relics from the old internet. they were popularized by <a href="https://gifcities.org/?q=88x31" target="_blank">geocities</a> and became a fun semi-standard for linking to other websites from your own. the <a href="https://web.archive.org/web/19961020015116/http://www3.netscape.com/" target="_blank">netscape now 3.0 button</a> is <a href="https://neonaut.neocities.org/cyber/88x31" target="_blank">supposedly</a> the first instance of this button format so i wanted to make mine based on that one ^-^</p> 
                    <p>a couple weeks ago, i came across <a href="https://eightyeightthirty.one" target="_blank">eightyeightthirty.one</a> which is a project that scrapes the internet for 88x31 button links and builds a graph visualization with all the connections. i found the graph to be quite breathtaking and moving because it is really displays the most basic function of the web. pages linking to pages. people connecting through hyperlinks. sometimes that's all it needs to be.</p>
                    <p>things like social networks eventually came along hoping to solve the shortcomings of such a system where one can get lost in pure noise. we're at the point now where most algorithms decide what most people see and i'm not sure that's really a solution.</p>
                    <p>thinking about links this week, i've also been submitting my homepage to various curated directories like <a href="https://internetphonebook.net" target="_blank">internet phonebook</a>, <a href="https://personalsit.es" target="_blank">personalsit.es</a>, <a href="https://ooh.directory" target="_blank">ooh.directory</a>, <a href="https://searchmysite.net" target="_blank">searchmysite</a>, and others. i don't know if/when any of them will list my little homepage but that's okay. with the size of the internet these days, it seems like a difficult task for anyone to manually maintain a directory. and sometimes the internet doesn't have to be all about instant gratification, follow for follow. sometimes not knowing is good and it's just a fun exercise to reach out and maybe one day randomly discover links coming in and out of the noisy and chaotic wild web &lt;3</p>
                </article>
                <article id="fun-details">
                    <time datetime="2024-09-26"><a class="pl" href="#fun-details" target="_blank">2024-09-26</a></time>
                    <h2>fun details</h2>
                    <p>my patience for the "social web" has been wearing thinner and thinner lately. it's exhausting and boring at the same time and not enjoyable. what's the point of it? now, i mainly just show up to talk to friends and get the hell out asap before the algorithms stream the worst of humanity into my brain. i wish there were better online spaces that weren't just about provoking each other into engagement points.</p>
                    <p>in my irl, i'm watching my parents get sicker every day, slowly being wiped away by incurable disease. it's painful to watch. so it should be no surprising that i don't really want to fill what little time i have outside of taking care of them with reading horrible takes on social media.</p>
                    <p>whenever things feel extra bad online, i find myself retreating to this homepage. i'm not sure if withdrawing into endless html tweaking is a great way of coping but it's a way.</p>
                    <p>i spent probably too much time this week rewriting large parts of the page to make no visible difference at all. i wanted to add some fun details, probably as a way to offset all the non-fun i'm having elsewhere.</p>
                    <p>i sectioned off the floor so that it's now made of smaller, separate, modular units for if i ever want to expand the space or introduce different terrain. i tried multiple ways of doing this like rotated css grid and svg defs but ended up using a simple method of a centered flex column since i needed pixel perfect positioning.</p>
                    <p>i made the pop up elements feel more organic by giving them a little css bounce animation when they open and close instead of just appearing (carrying this over from the styling i gave the ens connect options menu). i also added some subtle sounds to them so they play a random note when they open ^-^ idk. just for fun.</p>
                </article>
                <article id="invisible-things">
                    <time datetime="2024-09-19"><a class="pl" href="#invisible-things" target="_blank">2024-09-19</a></time>
                    <h2>invisible things</h2>
                    <p>the cursor party has been live on the <a href="https://ellesho.me/page" target="_blank">homepage</a> for a week now and it's been a really nice addition. i've occasionally dropped in whenever i'm doing updates and met some interesting people. one day, i met someone named leia who makes interesting <a href="https://leils.github.io/web-sites/" target="_blank">web experiments</a>. another day, i met someone who found me through the <a href="https://webcurios.co.uk/webcurios-13-09-24/" target="_blank">web curios newsletter</a> ^-^ i'm loving how the invisible act of simultaneously surfing a webpage with a stranger can become a live interaction.</p>
                    <p>most convos i've had in chat are with people who are looking for a more interesting internet than social platforms. sometimes i wonder if any people have connected with each other on the page while i'm not on it myself. i hope so!</p>
                    <p>usually, it's pretty quiet on the page (it's a homepage after all, not many people are visiting homepages en masse these days ¯\_(ツ)_/¯) but on the first day that chat was enabled, the url got shared a bunch and lots of people were dropping by. i think at one point, there were 20 people on the page, both friends and strangers. it was a nice test that gave me lots of things to improve upon.</p>
                    <p>here are some things i did this week<sup><a href="https://z37cmikmlacdxo3antwinsmjwstcjodfq34qdgymamu2c2lgthdq.arweave.net/zv4mIUxYBDu7YGzshsmJtKYkuGWG-QGbDAMpoWlmmcc" target="_blank">1</a></sup>:</p>
                    <ul>
                        <li>increased the chat input character limit to 64</li>
                        <li>fixed the cursor party behavior in sleep/night mode. you can see people in night mode but chat is disabled. the day mode toggle lets you activate chat</li>
                        <li>put in some kaomoji shortcodes. type in the chat /@@ or /?? or /cat for some quick emoticons</li>
                        <li>fixed the unclearable sticky message bug when you hit enter</li>
                        <li>swapped out ethers for viem to lighten the bundle since i'm only retrieving ENS names and don't need other blockchain stuff</li>
                        <li>swapped out window.ethereum for eip-6963 for people who have more than one signer extension installed and i also made a little menu animation for it in react (if you only have one extension installed, you will just connect directly)</li>
                        <li>fixed subdomain resolution for usernames</li>
                        <li>made some general edits to the page like a quick guide to using chat and other styling improvements</li>
                    </ul>
                    <p>i hope all that improves the experience of this semi-secret chat feature. see you in the chat, maybe!</p>
                </article>
                <article id="party-time">
                    <time datetime="2024-09-11"><a class="pl" href="#party-time" target="_blank">2024-09-11</a></time>
                    <h2>party time</h2>
                    <p>i was inspired to integrate cursor party on my <a href="https://ellesho.me/page" target="_blank">homepage</a> after reading matt webb's blog post, <a href="https://interconnected.org/home/2024/09/05/cursor-party" target="_blank">"every webpage deserves to be a place."</a> i had been interested in <a href="https://www.partykit.io" target="_blank">partykit</a> for a while, after seeing things like <a href="https://spencer.place" target="_blank">spencer chang</a>'s <a href="https://playhtml.fun" target="_blank">playhtml</a>. all of it just makes sense for the kind of place i want my homepage to be – a fun place for visitors and a place for me to experiment.</p>
                    <p>cursor party basically makes a webpage "multiplayer." you see other people's cursors floating around the page as they navigate it. it even allows you to chat with these other guests. it's a really lovely idea for individual webpages which can feel isolated from the social web. in a lot of ways, the chat is how i wish "social" websites were – just about talking to people, not about signaling for engagement numbers or amassing followers for clout.</p>
                    <p>of course, just cloning a repo and calling it a day is no fun. my head immediately filled with ideas to add to it. here are some features i added to make it my own:</p>
                    <ul>
                        <li>color picker to let guests customize their look (initial load is a random color)</li>
                        <li>instead of cursors, guests appear as little pixel sprites that face the direction of the cursor movement so there's some visual feedback to show someone is paying attention to you</li>
                        <li>made a rudimentary username system using ethereum extension connect (frame, rainbow, metamask, etc.) so, if you don't want to chat anon, you can display as a verified id via onchain ens or <a href="https://support.ens.domains/en/articles/8834820-offchain-gasless-dnssec-names-in-ens" target="_blank">offchain dns name</a> (my favorite part!!) as i've mentioned previously with the indieweb stuff, i love the idea of websites being your online id and i think dnssec ens names are a nice way to do that. it's only two steps: 1. add a txt to your dns records 2. set the dns name as your primary name in the <a href="https://app.ens.domains" target="_blank">ens dapp</a>. that's all! now when you connect, it will show that name. i will be using my <a href="https://app.ens.domains/elle.email" target="_blank">elle.email</a> dns name so you can verify it's really me in chat ^-^</li>
                    </ul>
                    <p>so that's where my week went. it was a lot of trial and error learning about working with partykit and the cursor party code and also ens stuff. getting the dns names to resolve with the different signer extensions was a bit tricky (⌒_⌒;) i was having a stressful week irl with my parent getting sick and preventing me from sleeping much anyways soooo (╥_╥) but i think i got things working and now you can chat with strangers on the internet here! (make sure you are in day mode. chat is disabled in night mode of course.)</p>
                    <p>to chat, just press forward slash (/) and start typing. your sprite will come into focus for the other guests.</p>
                </article>
                <article id="fit-check">
                    <time datetime="2024-09-04"><a class="pl" href="#fit-check" target="_blank">2024-08-28</a></time>
                    <h2>fit check</h2>
                    <p>on the <a href="https://ellesho.me/page" target="_blank">3d version</a> of the homepage this week, i added a little closet with an alternate outfit for my sprite ^-^ it pops up if you click on the pile of clothes on the floor. i also made little aesthetic adjustments to the sprite in general. i spent some time last week in blender building a 3d version of my sprite<sup><a href="https://laf742unpzgsbr6y74qr27jv2nea53k7wdogxhn6x4aww7ebvuta.arweave.net/WAv-ao1-TSDH2P8hHX0100gO7V-w3Gudvr8Ba3yBrSY" target="_blank">1</a></sup> so i could have a more consistent walk cycle. this ended up being more work and kind of unecessary but still enjoyable.</p>
                    <p>on the <a href="https://ellesho.me/page/website" target="_blank">2d side</a> of the page, i cleaned up all the markup and switched in semantic html tags for the fun of it. this changes nothing really that anyone can see in the browser rendering but it makes the html clearer and nicer visually imo. i think of it as kind of a meta aesthetic for the page.</p>
                    <p>as things get messier in my irl world, writing this homepage has been very therapeutic. something to look forward to doing or thinking about every day. i think it's actually starting to feel like a garden for me now. 10/10 would recommend having projects to get lost in. maybe it's more like a little bonsai tree:</p>
                    <p><i>They represent the idea of a perfect balance between nature and art, representing how people can attain peace within themselves. As bonsai trees are kept small through very careful pruning, they also represent a life-long commitment of patience and dedication to a task.</i><sup><a href="https://www.gardengatemagazine.com/review/bonsai-tree-meaning/#:~:text=They%20represent%20the%20idea%20of,and%20dedication%20to%20a%20task." target="_blank">2</a></sup></p>
                </article>
                <article id="self-portrait">
                    <time datetime="2024-08-28"><a class="pl" href="#self-portrait" target="_blank">2024-08-28</a></time>
                    <h2>self-portrait</h2>
                    <p>listening to kening zhu's podcast essay, "<a href="https://keningzhu.com/journal/your-website-is-not-a-brochure" target="_blank">your website is not a brochure</a>," last week found me nodding in agreement about personal websites being worlds. i briefly said as much in my <a href="https://ellesho.me/page/website/now/#this-homepage-is-my-home" target="_blank">first post</a> here about this homepage being my home. but i also started thinking about this homepage as being a self-portrait. and maybe that is what a home is anyways ¯\_(ツ)_/¯</p>
                    <p>having cared for multiple people in my life who have suffered from dementia, one thing i noticed in all the cases is that their physical surroundings would start to fall into disarray before their cognitive abilities noticeably deteriorated. i think because of this, i've always looked at the organization and details of spaces as a reflection of the person inhabiting it. a mirror of what's going on inside. a self-portrait.</p>
                    <p>the art history of self-portraiture is interesting too. it is often a form of practice. painters use themselves as the most readily available model when developing and honing their skills. and sometimes self-portraiture is done out of necessity. during the renaissance, <a href="https://www.artsy.net/article/artsy-editorial-female-artists-self-portrait-demand-place-art-history-05-13-19" target="_blank">women were forbidden to take art lessons</a> and so they would use their own reflection to defy oppressive systems and leave their a mark (literally) on the world.</p>
                    <p>on social media, you can get a vague sense of a person through their posts. but there is always a limitation there because everyone is forced to fit into the same composer modal, the same platform layout. here, i hope to paint a fuller self-portrait not only through the imagery and text, but also through the little details, the choice of tech stack and techniques, the quirks and idiosyncracies in the source code.</p>
                    <p>like <a href="https://archive.org/details/serial-experiments-lain-english" target="_blank">lain</a> uploading herself to the wired but maybe without the full-on assimilation and instead just to leave a reminder that i was a human here on the internet once after my mind and body are gone and ai takes over. like how people through history have left self-portraits that show they existed too.</p>
                </article>
                <article id="webrings-permalinks">
                    <time datetime="2024-08-21"><a class="pl" href="#webrings-permalinks" target="_blank">2024-08-21</a></time>
                    <h2>webrings and permalinks</h2>
                    <p>i fell down a little rabbit hole this week learning about <a href="https://indieweb.org" target="_blank">indieweb</a> building blocks and integrating some of them here. i joined the indieweb webring and added the webring nav on the homepage. i've always loved webrings and the idea of the internet being disparate websites connected to each other so things like indieauth and the concept of your website being your online identity/key are really appealing to me.</p>
                    <p>apart from that, i continued to tighten up dial-up mode, fixing little details. now the blog has permalink anchors so specific posts can be shared ¯\_(ツ)_/¯ working on this part of the homepage has been really nostalgic for me and brought me back to simpler times on the web, just having fun with limited html.</p>
                    <p>i think things are almost in a good place where i can actually start using the blog as more than just a place to post changelogs (⌒_⌒;) and i can maybe start writing about more general things. the bones are there. idk, i've never been that great at regular blogging but i think i'd like to use this space to write more thoughts about life on the internet.</p>
                </article>
                <article id="optimizing">
                    <time datetime="2024-08-13"><a class="pl" href="#optimizing" target="_blank">2024-08-13</a></time>
                    <h2>optimizing</h2>
                    <p>this week, i did a lot of optimizations on the homepage like converting assets and icons to tiny webp and svg formats and converting audio from mp3 to aac. i added some preload tags and lazyloading for the audio. i rewrote my rss aggregator so that it's a simple fetch script instead of relying on an external dependency which was probably overkill for what i wanted to do anyways.</p>
                    <p>i also started building out the website in the homepage that pops up when u click the laptop ^-^ it now has an rss button and 3 sections and u can even visit it by adding /website to the end of my url: <a href="https://ellesho.me/page/website" target="_blank">ellesho.me/page/website</a> ie. elle's homepage website. it's pure html/css so it's old-tech and dial-up friendly (⌒_⌒;) if you're reading this on the lofi version, u can go to the full version here: <a href="https://ellesho.me/page" target="_blank"> ellesho.me/page</a></p>
                </article>
                <article id="sleep-mode">
                    <time datetime="2024-08-07"><a class="pl" href="#sleep-mode" target="_blank">2024-08-07</a></time>
                    <h2>sleep mode</h2>
                    <p>in trying to create a more humane web experience, i've added a night/sleep mode the homepage. the page will be asleep between 10pm and 6am. u can listen to a chiptuned version of "fly me to the moon" that i put on the homepod but that's about it ¯\_(ツ)_/¯</p>
                    <p>there is an emergency light switch if u really need something! but if it's not a emergency, u should get some sleep :) it's good for your brain.</p>
                </article>
                <article id="social-feeds">
                    <time datetime="2024-07-30"><a class="pl" href="#social-feeds" target="_blank">2024-07-30</a></time>
                    <h2>social feeds</h2>
                    <p>i decided to reduce my twitter usage so i guess i'll decentralize and use every other network instead (⌒_⌒;)</p>
                    <p>i added a social feed that pops up when u click the phone on the sleeping bag. it aggregates the rss from my blog here, farcaster, bluesky, mastodon, are.na, daft, and tumblr (bc why not.)</p>
                    <p>i made this bc this is how i wish the web still was. a place where social tools complement individual personal pages rather than the all-consuming monster that social has become. a place where our online time is not dominated by a single platform.</p>
                </article>
                <article id="this-homepage-is-my-home">
                    <time datetime="2024-07-17"><a class="pl" href="#this-homepage-is-my-home" target="_blank">2024-07-17</a></time>
                    <h2>this homepage is my home</h2>
                    <p>it is a small piece of html that is all my own. a place online to relax. a lived-in space that reflects me as the person who lives here.</p>
                    <p>here, i can paint the walls purple one day and pink the next. i can display weird things i've found on the ground. whatever i feel like.</p>
                    <p>it might be messy sometimes but i hope it's cozy for visitors who happen to stop by.</p>
                    <p>there is nothing for sale here, nothing to be advertised. no follower count or like buttons. no algorithms or trackers or paywalls.</p>
                    <p>this is just my home. -elle</p>
                </article>
            </main>
            <footer>
                <div id="totop">
                    <a href="#top" id="up" role="button">ᐱ</a>
                </div>
                ฅ^⸝⸝• ﻌ •⸝⸝^ฅ subscribe via <a href="https://ellesho.me/page/rss.xml" target="_blank">rss</a><br>
                contact webmaster (elle): <span class="email">hi@elle<b>.elle</b>.email</span>
                <p id="du"><i>ps. u are in "dial-up" mode of my homepage. <a href="https://ellesho.me/page">pls click here for the full version</a></i></p>
                <div class="h-card" style="display:none;">
                    <img class="u-photo" src="https://ellesho.me/favicon.svg" alt="elle">
                    <p class="p-name">elle</p>
                    <a class="u-url" href="https://ellesho.me/page">https://ellesho.me/page</a>
                    <p class="p-note">i like to make nice things on the internet</p>
                </div>
            </footer>
        </div>
    
</div>
                        <div class="urlbar"></div>
                        <div id="titlebar"></div>
                        <a href="https://ellesho.me/page/rss.xml" aria-label="RSS Subscribe" class="rss" target="_blank" role="button"></a>
                        <button id="full" class="center" aria-label="zoom website"></button>
                    </div>
                    <button id="fit" aria-label="open/close closet"></button>
                    <div id="closet">
                        <div class="rack">
                            <div class="clothes center">
                                <div class="hanger">
                                    <div class="sprue"></div>
                                    <div class="sprue"></div>
                                    <div class="sprue"></div>
                                    <div class="sprue"></div>
                                    <div class="sprue"></div>
                                    <div class="sprue"></div>
                                </div>
                                <button id="hoodie" class="sp" aria-label="hoodie fit"></button>
                                <button id="tee" class="sp" aria-label="tee fit"></button>
                            </div>
                        </div>
                        <div class="tag">01 // ELLE'S FITS</div>
                    </div>
                    <button class="sp pdx obj" id="pdx" aria-label="pokedex navi ds"></button>
                    <div id="navi">
                        <div class="ds">
                            <div class="center">•••</div>
                            <div class="center">• •</div>
                            <div>
                                <a href="https://pixelde.su" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/pixeldesu.png" alt="pixel"></a>
                                <a href="https://notnite.com" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/notnite.png" alt="notnite"></a>
                                <a href="https://eva.town" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/eva.png" alt="eva"></a>
                                <a href="https://caitsith.neocities.org" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/caitsith.gif" alt="caitsith"></a>
                                <a href="https://neonaut.neocities.org" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/neonaut.png" alt="neonaut"></a>
                                <a href="https://redstrate.com" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/redstrate.png" alt="redstrate"></a>
                                <a href="https://eightyeightthirty.one" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/88x31.webp" alt="eightyeightthirty.one"></a>
                                <a href="https://bukmark.club" target="_blank"><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAUEBA==" data-src="/btn/bukmark.png" alt="bukmark club"></a>
                            </div>
                            <div>
                                <img src="/elles8831.webp" alt="elle's 88x31 button">
                                <p>right-click save my 88x31 button above to link back here (if u want to!) ^-^</p>
                                <p>&lt;-- visit some sites!</p>
                            </div>
                            <div class="center">•••</div>
                            <div class="center">+</div>
                        </div>
                    </div>
                </div>
            </div>
            <div id="fullscreen">
                <div id="framebig" class="center">
                    <div class="homepagebig">
                        <div id="homepagebig">
        <div id="top"></div>
        <div class="page">
            <header>
                <h1>.* ౨ৎ • 𝑒𝓁𝓁𝑒'𝓈 𝒽𝑜𝓂𝑒𝓅𝒶𝑔𝑒 • ౨ৎ *.</h1>
                <nav>
                    <a class="active">now</a>
                    <a href="/page/website">about</a>
                    <a href="/page/website/uses">uses</a>
                    <a href="/page/website/links">links</a>
                </nav>
            </header>
            <main>
                <article id="now">
                    <h2>now:</h2>
                    <i>lately, i've been spending my spare time making this homepage as a way to stay sane on the internet and in life. i'm currently in a weird limbo caring for my elderly parents who are in poor health so i find myself doing random personal projects around the internet for fun and to teach myself new things</i>
                </article>
                <article id="windows-or-mirrors">
                    <time datetime="2024-11-20"><a class="pl" href="#windows-or-mirrors" target="_blank">2024-11-20</a></time>
                    <h2>windows or mirrors</h2>
                    <p>i haven't felt like working on my homepage for the last two weeks. honestly, i haven't felt like being on the internet much at all since the us election happened. i can't say i was surprised by the result (i foreshadowed it in my <a href="https://ellesho.me/page/website/now/#halloween-at-home" target="_blank">halloween post</a>.) but i was shocked, disgusted, and disappointed by it all the same. the days following nov 5 only confirmed my fears with the immediate increase of online (and offline) <a href="https://www.teenvogue.com/story/emboldened-by-a-trump-win-misogyny-is-exploding-online" target="_blank">misogyny</a>, <a href="https://www.theguardian.com/us-news/2024/nov/08/racist-text-messages-trump-win" target="_blank">racism</a>, and <a href="https://www.reuters.com/world/us/fbi-says-bigoted-text-messages-also-sent-lgbtq-hispanic-people-2024-11-15/" target="_blank">bigotry</a> because the worst people saw their guy winning as an approval. how will it escalate when things actually start for real in 2025?</p>
                    <p>it felt worse to me this time because of how much big internet money drove this result – from elon musk to <a href="https://archive.is/NvsSK" target="_blank">big tech ceos</a> to <a href="https://www.followthecrypto.org" target="_blank">crypto pacs</a>. i know special interest money is unfortunately always a part of it but what i saw full force in this election wasn't the internet where marginalized people can actually have a voice but an uneven space where, once again, entities with outsized capital and influence con and bully their way into controlling everyone's lives. seeing the internet in this way makes me feel so gross, like maybe it's a lost cause.</p>
                    <p>i've written before about how the web has been a refuge for me. growing up, i was an outsider. i grew up in a very conservative, religious, and conformist town that treated anyone outside their limited worldview with distain. i wanted no part in the mass culture that everyone defaulted to, wearing the same brands of clothing, consuming the same media, performing the same ascribed roles. it was on the internet that i found people to talk to about weird animes or learn how to play obscure songs or figure out fun html tricks. it was online where i could encounter more expansive ideas and truly escape the restrictive local culture. when i went online, a better alternative world came into focus.</p>
                    <p>i don't know if i can still say that with confidence. i mean, that open internet is still there but it's been displaced out of view. because now, when i go online, i can't avoid seeing all the terrible things of irl piling up everywhere, obscuring the little bits of good. it's less of a window into a more open world and more of a mirror or maybe even a funhouse mirror, taking the horrors of real life and stretching and distorting them even more and reflecting that image back onto us, <a href="https://www.animanoir.xyz/blog/2024/the-death-state-of-the-internet/" target="_blank">reshaping our very being</a>. and i feel like an outsider needing to find an alternative space again.</p>
                    <p>over the past couple weeks, i started building a links page/section here. it was on my todo list to make one but i was extra motivated after reading <a href="https://thoughts.melonking.net/thoughts/every-site-needs-a-links-page-why-linking-matters" target="_blank">this</a> and feeling like i need to do something to be a "positive citizen of the web" after recent events, even if it's just putting some hyperlinks on my page. i'm still collecting links to put on it. most of the sites i have so far are sites i've recently visited. there are two links sections<sup><a href="https://6chcl6xjikbnwusbdcwole44rjexv6q7t6nz7x7byk3zru7xbmbq.arweave.net/8I4l-ulCgttSQRis5ZOcikl6-h-fm5_f4cK3mNP3CwM" target="_blank">1</a></sup> – a <a href="https://ellesho.me/page/website/links" target="_blank">text link page</a> on the flat version of this homepage and an 88x31 button link popup menu on the <a href="https://ellesho.me/page" target="_blank">3d view</a> if you click on the nintendo ds/pokedex/handinavi thing on the ground.</p>
                    <p>i've been working on recentering myself. i've been disconnecting from social media to create more distance from those platforms so as not to have a direct pipeline to my brain for the poison that's surely on the way. i don't know what's going to happen from here but i'm just going to keep doing what i believe in and focusing on the people i care about. anyways, here are <a href="https://www.theguardian.com/commentisfree/2024/nov/17/how-to-survive-the-broligarchy-20-lessons-for-the-post-truth-world-donald-trump" target="_blank">some good tips</a> for the potential future.</p>
                </article>
                <article id="halloween-at-home">
                    <time datetime="2024-10-31"><a class="pl" href="#halloween-at-home" target="_blank">2024-10-31</a></time>
                    <h2>halloween at home</h2>
                    <p>it's halloween! i hope you are having a good one. it's always been my favorite day. i feel very nostalgic around this time. sadly, i haven't been able to dress up or do anything special for the past few years beyond handing out candy ( • ᴖ • 。) but hopefully just doing that adds to the fun for someone else.</p>
                    <p>lately, i've been battling exhaustion and exasperation. taking care of my parents was especially demanding this week. dealing with someone with severe dementia, it feels like there are really only neutral days and bad days and bad bad days. this week wasn't bad bad but still pretty bad. added to that is the anxiety over things in the world. the wars, the election, the general vibe of everything is stressing me out. this makes me restless and i find it hard to focus on getting things done sometimes.</p>
                    <p>as usual, i turned to my homepage for an escape. i decided to rewrite my feed aggregator again. since there are so many different feeds coming in now, things were getting sluggish and it bugged me. while moping around one day, i realized i should just stop calling each feed individually with the aggregator and, instead, automate a regularly refreshed cache of a pre-compiled feed. this way, i could just fetch one feed instead of many simultaneously on my page. it worked! now everything's much snappier and less resource intensive ^-^</p>
                    <p>anyways, i also added two more "small web" feeds – <a href="https://status.cafe/users/elle" target="_blank">status.cafe</a> and <a href="https://elle.flounder.online" target="_blank">flounder</a>. status.cafe is made by the same person as smol.pub and is a fun little streamlined status update app. flounder is a nice service for building gemini capsules that also publishes on http.</p>
                    <p>i think the reason i'm feeling an urgency to explore these alternative services right now and making my homepage more of my default home is because i'm unsure i'll want to continue using "big internet" social media in the near future. between 2016-2020, i stopped using it because it was unbearable, both terrifying and annoying at the same time. they even had a phrase for what they were doing: "<a href="https://www.vox.com/policy-and-politics/2020/1/16/20991816/impeachment-trial-trump-bannon-misinformation" target="_blank">flooding the zone with shit</a>." you should watch adam curtis' excellent film, "<a href="https://www.youtube.com/watch?v=Gr7T07WfIhM" target="_blank">hypernormalisation</a>," to understand how this tactic is basically a form of psychological torture used to control the masses. i'm not particularly interested in spending the next 4 years (or maybe forever?? (╥_╥)) in that zone. and for a myriad of other and more important reasons, i hope it doesn't even get to that point where it happens again.</p>
                </article>
                <article id="outposts">
                    <time datetime="2024-10-24"><a class="pl" href="#outposts" target="_blank">2024-10-24</a></time>
                    <h2>outposts</h2>
                    <p>i've not been feeling very good about the social media machine for a long time (infinite algorithm scrolls.) i've been pulling away from them more and more recently. whatever value they provide for connecting people just doesn't seem worth it for the amount of mind pollution they serve up now (which is only getting worse as the tools to generate garbage increase speed.)</p> 
                    <p>the worst offender imo is twitter because it has an outsized influence on the world and is run by a maniac who uses it as his own personal tool to spread hateful disinformation. i don't want to participate in that or be complicit in granting figures like musk any more power to do the harm to people, to the world, and to the internet, that he causes on a daily basis with his schemes. i get it. people want a neutral place to gather. but twitter hasn't been neutral for a while now, especially since it stopped being "twitter." it breaks my brain and my heart that people are still holding onto the illusion that twitter is some kind of open town square and granting it its power (╥_╥)</p>
                    <p>i want to be on an internet that feels good – that is a hopeful technology. an internet that surprises and shows new possibilities and wonders. maybe it's because of, or at least exacerbated by, the current us election frenzy but it can feel like the opposite of hopeful sometimes.</p>
                    <p>that's why i started making this homepage. it's a refuge.</p>
                    <p>i spent a large part of this week looking at alternative networks and web communities. there are so many people doing interesting things everywhere. the <a href="https://tildeverse.org" target="_blank">tildeverse</a>, <a href="https://usb.club" target="_blank">file</a> <a href="https://serveyourtra.sh" target="_blank">sharing</a> clubs, a community on a <a href="https://sectordisk.pw" target="_blank">1.44mb floppy disk</a> ¯\_(ツ)_/¯ all the indie web and small web stuff i've mentioned in previous entries. people just blogging and making websites in a truly open way. i'm happy there are still those places to turn to when the mainstream internet starts to stink. though, i do worry it might be a form of escapism and avoidance to just get lost in obscure websites. idk.</p>
                    <p>there aren't too many cosmetic changes to the homepage in this update. i did do some large rewrites to slim down my javascript but i mainly just signed up for a bunch of different services as part of my research and added them to the aggregated feed pop up: 
                    </p><ul>
                        <li><a href="https://feedland.org/?river=http://data.feedland.org/feeds/elle.xml" target="_blank">feedland</a> – a web based rss aggregator that also lets you post to your own feedland rss feed</li>
                        <li><a href="https://spacehey.com/e11e" target="_blank">spacehey</a> – a myspace revival</li>
                        <li><a href="https://elles.neocities.org" target="_blank">neocities</a> – a geocities revival</li>
                        <li><a href="https://elle.bearblog.dev/" target="_blank">bear</a> – a tiny independent blogging service</li>
                        <li><a href="https://elle.smol.pub" target="_blank">smol.pub</a> – another small blogging service that publishes to http, <a href="https://en.wikipedia.org/wiki/Gopher_(protocol)" target="_blank">gopher</a>, and <a href="https://geminiprotocol.net" target="_blank">gemini</a> protocols</li>
                    </ul>
                    <p>all of these services have feeds but they also have their own web page. i'm not sure how often i'll update them or what i'll even use them for (i now have 11 feeds being aggregated and i'm already bad enough at updating a single blog!) but i'm thinking of them as little unique outposts or satellites for this homepage that i'll develop on the side for fun.</p>
                </article>
                <article id="stress-test">
                    <time datetime="2024-10-17"><a class="pl" href="#stress-test" target="_blank">2024-10-17</a></time>
                    <h2>stress test</h2>
                    <p>things got a little overwhelming here on the <a href="https://ellesho.me/page" target="_blank">homepage</a> last friday morning when thousands of visitors<sup><a href="https://mesjwdrpkjvlh6ee5p7savmxkdvwnfctirdl2vzy6br5esgbqelq.arweave.net/YSSbDi9SarP4hOv_IFWXUOtmlFNERr1XOPBj0kjBgRc" target="_blank">1</a></sup> suddenly flooded in from <a href="https://news.ycombinator.com/item?id=41809469" target="_blank">hacker news</a>!</p>
                    <p>honestly, i never expected more than a handful of people to be here at the same time so i was worried that the various things that i run my page on wouldn't survive the day. luckily there were only a couple minor hiccups –i kept getting alert emails from cloudflare and the partykit server for the cursor chat would occasionally refresh from being overloaded – but that's about it and my little homepage was able to tough it out (◕‿◕)♡</p>
                    <p>of course, when you have an open chat, there's bound to be people who try to cause a disturbance (see some of the comments on hn.) i wasn't awake yet when people were really misbehaving so i missed a lot of that stuff. for the most part, whenever i dropped in, everyone was just enjoying chatting about all sorts of topics. occasionally someone would test the "free speech" but everyone just ignored them, as they should, and the offender would leave because they weren't getting reactions. i think that's an interesting thing about a live chat vs. social feeds. it's closer to real life where shitty behavior is shunned in real time and the person(s) acting out just seem like sad jerks whereas on social it's validated and emboldened by metrics and more shittiness.</p>
                    <p>overall, it was a fun experience even though it was a little stressful because i had some irl issues (mom in hospital) happening at the same time. i chatted with a lot of random people who also care about the internet or were curious about learning more. lots of people said they wanted to make their own homepages now which is the best response i could ever hope for. i received a bunch of emails too! there were lots of questions about the page and it's hard to get to all of them so i decided to compile the questions i got in email and the ones i remember from chat into an faq section for my homepage task this week. i'll add to it if more things come to mind ^-^</p>
                    <p>i replaced the little purse on the floor with a notepad to open the faq. the design of it is a little nod to the <a href="https://win98icons.alexmeub.com" target="_blank">windows 95/98 notepad icon</a> which was what i learned writing html on when i first got a computer &lt;3</p>
                    <p>thanks again to everyone who visited! maybe some of you are reading this through rss right now :)))</p>
                </article>
                <article id="being-healthy">
                    <time datetime="2024-10-10"><a class="pl" href="#being-healthy" target="_blank">2024-10-10</a></time>
                    <h2>being healthy</h2>
                    <p>i'm still juggling life stuff that all hit at once last week – coordinating with a contractor to do home repairs, watching over one parent with dementia while their home is being worked on, and getting my other parent ready to go in for a major surgery. it's been hectic!</p>
                    <p>i'm also trying to improve my sleep schedule by going to bed earlier so i don't get too stressed out about everything. one of my worst habits is working on projects right before bed. this is partly because the day is filled with other chores and tasks that i need to complete – lately there's been a lot – and so i don't get around to opening up the things i really want to do until everything else is settled for the day. but even if i set a time limit, i can't stick to it. i go on tangents, trying different experiments, looking up all the things i thought about during the day but couldn't get to. minutes quickly melt into hours and i'm looking at no sleep again (╥_╥)</p>
                    <p>it's probably a good thing i have all these other responsiblities to snap me out of my projects. when i was younger and more carefree, i would get obsessed with whatever i was doing and stay up for days making things – very productive but not very healthy.</p>
                    <p>this week, i tried to keep my homepage tasks smaller to not overextend myself too much. so i just worked on little details again that i've been meaning to get to. before, i had speech bubbles come out of the skateboard and the clothing pile like the mailbox but those were just placeholders until i made more fitting pop ups.</p>
                    <p>so, with the short time i had this week, i just focused on making css drawings for those elements – a skate deck with emoji graphics for the webring info and a gunpla-like sprue tree for the closet ^-^ i haven't checked how the deck looks on a non-apple device so i'm not sure how the emojis look on that, sorry! i used the mousetrap box for the tail scrape and it might look weird with other emoji sets ¯\_(ツ)_/¯ if it looks too weird, maybe i'll try to do some full-on css drawing, like lynn fisher's <a href="https://a.singlediv.com" target="_blank">amazing single div art</a>, but i think it's okay for now!</p>
                </article>
                <article id="linking">
                    <time datetime="2024-10-03"><a class="pl" href="#linking" target="_blank">2024-10-03</a></time>
                    <h2>linking</h2>
                    <p>i didn't really have a great week and fell behind on a lot of things. on top of my usual caregiver duties, i was battling an internet outage, home repairs, food poisoning, and general lethargy from feeling bad about life and the world.</p>
                    <p>with the little time i did have, i made a little 88x31 pixel link button<sup><a href="https://ellesho.me/elles8831.webp" target="_blank">1</a></sup> for my <a href="https://ellesho.me/page" target="_blank">homepage</a>. you may remember these little things as relics from the old internet. they were popularized by <a href="https://gifcities.org/?q=88x31" target="_blank">geocities</a> and became a fun semi-standard for linking to other websites from your own. the <a href="https://web.archive.org/web/19961020015116/http://www3.netscape.com/" target="_blank">netscape now 3.0 button</a> is <a href="https://neonaut.neocities.org/cyber/88x31" target="_blank">supposedly</a> the first instance of this button format so i wanted to make mine based on that one ^-^</p> 
                    <p>a couple weeks ago, i came across <a href="https://eightyeightthirty.one" target="_blank">eightyeightthirty.one</a> which is a project that scrapes the internet for 88x31 button links and builds a graph visualization with all the connections. i found the graph to be quite breathtaking and moving because it is really displays the most basic function of the web. pages linking to pages. people connecting through hyperlinks. sometimes that's all it needs to be.</p>
                    <p>things like social networks eventually came along hoping to solve the shortcomings of such a system where one can get lost in pure noise. we're at the point now where most algorithms decide what most people see and i'm not sure that's really a solution.</p>
                    <p>thinking about links this week, i've also been submitting my homepage to various curated directories like <a href="https://internetphonebook.net" target="_blank">internet phonebook</a>, <a href="https://personalsit.es" target="_blank">personalsit.es</a>, <a href="https://ooh.directory" target="_blank">ooh.directory</a>, <a href="https://searchmysite.net" target="_blank">searchmysite</a>, and others. i don't know if/when any of them will list my little homepage but that's okay. with the size of the internet these days, it seems like a difficult task for anyone to manually maintain a directory. and sometimes the internet doesn't have to be all about instant gratification, follow for follow. sometimes not knowing is good and it's just a fun exercise to reach out and maybe one day randomly discover links coming in and out of the noisy and chaotic wild web &lt;3</p>
                </article>
                <article id="fun-details">
                    <time datetime="2024-09-26"><a class="pl" href="#fun-details" target="_blank">2024-09-26</a></time>
                    <h2>fun details</h2>
                    <p>my patience for the "social web" has been wearing thinner and thinner lately. it's exhausting and boring at the same time and not enjoyable. what's the point of it? now, i mainly just show up to talk to friends and get the hell out asap before the algorithms stream the worst of humanity into my brain. i wish there were better online spaces that weren't just about provoking each other into engagement points.</p>
                    <p>in my irl, i'm watching my parents get sicker every day, slowly being wiped away by incurable disease. it's painful to watch. so it should be no surprising that i don't really want to fill what little time i have outside of taking care of them with reading horrible takes on social media.</p>
                    <p>whenever things feel extra bad online, i find myself retreating to this homepage. i'm not sure if withdrawing into endless html tweaking is a great way of coping but it's a way.</p>
                    <p>i spent probably too much time this week rewriting large parts of the page to make no visible difference at all. i wanted to add some fun details, probably as a way to offset all the non-fun i'm having elsewhere.</p>
                    <p>i sectioned off the floor so that it's now made of smaller, separate, modular units for if i ever want to expand the space or introduce different terrain. i tried multiple ways of doing this like rotated css grid and svg defs but ended up using a simple method of a centered flex column since i needed pixel perfect positioning.</p>
                    <p>i made the pop up elements feel more organic by giving them a little css bounce animation when they open and close instead of just appearing (carrying this over from the styling i gave the ens connect options menu). i also added some subtle sounds to them so they play a random note when they open ^-^ idk. just for fun.</p>
                </article>
                <article id="invisible-things">
                    <time datetime="2024-09-19"><a class="pl" href="#invisible-things" target="_blank">2024-09-19</a></time>
                    <h2>invisible things</h2>
                    <p>the cursor party has been live on the <a href="https://ellesho.me/page" target="_blank">homepage</a> for a week now and it's been a really nice addition. i've occasionally dropped in whenever i'm doing updates and met some interesting people. one day, i met someone named leia who makes interesting <a href="https://leils.github.io/web-sites/" target="_blank">web experiments</a>. another day, i met someone who found me through the <a href="https://webcurios.co.uk/webcurios-13-09-24/" target="_blank">web curios newsletter</a> ^-^ i'm loving how the invisible act of simultaneously surfing a webpage with a stranger can become a live interaction.</p>
                    <p>most convos i've had in chat are with people who are looking for a more interesting internet than social platforms. sometimes i wonder if any people have connected with each other on the page while i'm not on it myself. i hope so!</p>
                    <p>usually, it's pretty quiet on the page (it's a homepage after all, not many people are visiting homepages en masse these days ¯\_(ツ)_/¯) but on the first day that chat was enabled, the url got shared a bunch and lots of people were dropping by. i think at one point, there were 20 people on the page, both friends and strangers. it was a nice test that gave me lots of things to improve upon.</p>
                    <p>here are some things i did this week<sup><a href="https://z37cmikmlacdxo3antwinsmjwstcjodfq34qdgymamu2c2lgthdq.arweave.net/zv4mIUxYBDu7YGzshsmJtKYkuGWG-QGbDAMpoWlmmcc" target="_blank">1</a></sup>:</p>
                    <ul>
                        <li>increased the chat input character limit to 64</li>
                        <li>fixed the cursor party behavior in sleep/night mode. you can see people in night mode but chat is disabled. the day mode toggle lets you activate chat</li>
                        <li>put in some kaomoji shortcodes. type in the chat /@@ or /?? or /cat for some quick emoticons</li>
                        <li>fixed the unclearable sticky message bug when you hit enter</li>
                        <li>swapped out ethers for viem to lighten the bundle since i'm only retrieving ENS names and don't need other blockchain stuff</li>
                        <li>swapped out window.ethereum for eip-6963 for people who have more than one signer extension installed and i also made a little menu animation for it in react (if you only have one extension installed, you will just connect directly)</li>
                        <li>fixed subdomain resolution for usernames</li>
                        <li>made some general edits to the page like a quick guide to using chat and other styling improvements</li>
                    </ul>
                    <p>i hope all that improves the experience of this semi-secret chat feature. see you in the chat, maybe!</p>
                </article>
                <article id="party-time">
                    <time datetime="2024-09-11"><a class="pl" href="#party-time" target="_blank">2024-09-11</a></time>
                    <h2>party time</h2>
                    <p>i was inspired to integrate cursor party on my <a href="https://ellesho.me/page" target="_blank">homepage</a> after reading matt webb's blog post, <a href="https://interconnected.org/home/2024/09/05/cursor-party" target="_blank">"every webpage deserves to be a place."</a> i had been interested in <a href="https://www.partykit.io" target="_blank">partykit</a> for a while, after seeing things like <a href="https://spencer.place" target="_blank">spencer chang</a>'s <a href="https://playhtml.fun" target="_blank">playhtml</a>. all of it just makes sense for the kind of place i want my homepage to be – a fun place for visitors and a place for me to experiment.</p>
                    <p>cursor party basically makes a webpage "multiplayer." you see other people's cursors floating around the page as they navigate it. it even allows you to chat with these other guests. it's a really lovely idea for individual webpages which can feel isolated from the social web. in a lot of ways, the chat is how i wish "social" websites were – just about talking to people, not about signaling for engagement numbers or amassing followers for clout.</p>
                    <p>of course, just cloning a repo and calling it a day is no fun. my head immediately filled with ideas to add to it. here are some features i added to make it my own:</p>
                    <ul>
                        <li>color picker to let guests customize their look (initial load is a random color)</li>
                        <li>instead of cursors, guests appear as little pixel sprites that face the direction of the cursor movement so there's some visual feedback to show someone is paying attention to you</li>
                        <li>made a rudimentary username system using ethereum extension connect (frame, rainbow, metamask, etc.) so, if you don't want to chat anon, you can display as a verified id via onchain ens or <a href="https://support.ens.domains/en/articles/8834820-offchain-gasless-dnssec-names-in-ens" target="_blank">offchain dns name</a> (my favorite part!!) as i've mentioned previously with the indieweb stuff, i love the idea of websites being your online id and i think dnssec ens names are a nice way to do that. it's only two steps: 1. add a txt to your dns records 2. set the dns name as your primary name in the <a href="https://app.ens.domains" target="_blank">ens dapp</a>. that's all! now when you connect, it will show that name. i will be using my <a href="https://app.ens.domains/elle.email" target="_blank">elle.email</a> dns name so you can verify it's really me in chat ^-^</li>
                    </ul>
                    <p>so that's where my week went. it was a lot of trial and error learning about working with partykit and the cursor party code and also ens stuff. getting the dns names to resolve with the different signer extensions was a bit tricky (⌒_⌒;) i was having a stressful week irl with my parent getting sick and preventing me from sleeping much anyways soooo (╥_╥) but i think i got things working and now you can chat with strangers on the internet here! (make sure you are in day mode. chat is disabled in night mode of course.)</p>
                    <p>to chat, just press forward slash (/) and start typing. your sprite will come into focus for the other guests.</p>
                </article>
                <article id="fit-check">
                    <time datetime="2024-09-04"><a class="pl" href="#fit-check" target="_blank">2024-08-28</a></time>
                    <h2>fit check</h2>
                    <p>on the <a href="https://ellesho.me/page" target="_blank">3d version</a> of the homepage this week, i added a little closet with an alternate outfit for my sprite ^-^ it pops up if you click on the pile of clothes on the floor. i also made little aesthetic adjustments to the sprite in general. i spent some time last week in blender building a 3d version of my sprite<sup><a href="https://laf742unpzgsbr6y74qr27jv2nea53k7wdogxhn6x4aww7ebvuta.arweave.net/WAv-ao1-TSDH2P8hHX0100gO7V-w3Gudvr8Ba3yBrSY" target="_blank">1</a></sup> so i could have a more consistent walk cycle. this ended up being more work and kind of unecessary but still enjoyable.</p>
                    <p>on the <a href="https://ellesho.me/page/website" target="_blank">2d side</a> of the page, i cleaned up all the markup and switched in semantic html tags for the fun of it. this changes nothing really that anyone can see in the browser rendering but it makes the html clearer and nicer visually imo. i think of it as kind of a meta aesthetic for the page.</p>
                    <p>as things get messier in my irl world, writing this homepage has been very therapeutic. something to look forward to doing or thinking about every day. i think it's actually starting to feel like a garden for me now. 10/10 would recommend having projects to get lost in. maybe it's more like a little bonsai tree:</p>
                    <p><i>They represent the idea of a perfect balance between nature and art, representing how people can attain peace within themselves. As bonsai trees are kept small through very careful pruning, they also represent a life-long commitment of patience and dedication to a task.</i><sup><a href="https://www.gardengatemagazine.com/review/bonsai-tree-meaning/#:~:text=They%20represent%20the%20idea%20of,and%20dedication%20to%20a%20task." target="_blank">2</a></sup></p>
                </article>
                <article id="self-portrait">
                    <time datetime="2024-08-28"><a class="pl" href="#self-portrait" target="_blank">2024-08-28</a></time>
                    <h2>self-portrait</h2>
                    <p>listening to kening zhu's podcast essay, "<a href="https://keningzhu.com/journal/your-website-is-not-a-brochure" target="_blank">your website is not a brochure</a>," last week found me nodding in agreement about personal websites being worlds. i briefly said as much in my <a href="https://ellesho.me/page/website/now/#this-homepage-is-my-home" target="_blank">first post</a> here about this homepage being my home. but i also started thinking about this homepage as being a self-portrait. and maybe that is what a home is anyways ¯\_(ツ)_/¯</p>
                    <p>having cared for multiple people in my life who have suffered from dementia, one thing i noticed in all the cases is that their physical surroundings would start to fall into disarray before their cognitive abilities noticeably deteriorated. i think because of this, i've always looked at the organization and details of spaces as a reflection of the person inhabiting it. a mirror of what's going on inside. a self-portrait.</p>
                    <p>the art history of self-portraiture is interesting too. it is often a form of practice. painters use themselves as the most readily available model when developing and honing their skills. and sometimes self-portraiture is done out of necessity. during the renaissance, <a href="https://www.artsy.net/article/artsy-editorial-female-artists-self-portrait-demand-place-art-history-05-13-19" target="_blank">women were forbidden to take art lessons</a> and so they would use their own reflection to defy oppressive systems and leave their a mark (literally) on the world.</p>
                    <p>on social media, you can get a vague sense of a person through their posts. but there is always a limitation there because everyone is forced to fit into the same composer modal, the same platform layout. here, i hope to paint a fuller self-portrait not only through the imagery and text, but also through the little details, the choice of tech stack and techniques, the quirks and idiosyncracies in the source code.</p>
                    <p>like <a href="https://archive.org/details/serial-experiments-lain-english" target="_blank">lain</a> uploading herself to the wired but maybe without the full-on assimilation and instead just to leave a reminder that i was a human here on the internet once after my mind and body are gone and ai takes over. like how people through history have left self-portraits that show they existed too.</p>
                </article>
                <article id="webrings-permalinks">
                    <time datetime="2024-08-21"><a class="pl" href="#webrings-permalinks" target="_blank">2024-08-21</a></time>
                    <h2>webrings and permalinks</h2>
                    <p>i fell down a little rabbit hole this week learning about <a href="https://indieweb.org" target="_blank">indieweb</a> building blocks and integrating some of them here. i joined the indieweb webring and added the webring nav on the homepage. i've always loved webrings and the idea of the internet being disparate websites connected to each other so things like indieauth and the concept of your website being your online identity/key are really appealing to me.</p>
                    <p>apart from that, i continued to tighten up dial-up mode, fixing little details. now the blog has permalink anchors so specific posts can be shared ¯\_(ツ)_/¯ working on this part of the homepage has been really nostalgic for me and brought me back to simpler times on the web, just having fun with limited html.</p>
                    <p>i think things are almost in a good place where i can actually start using the blog as more than just a place to post changelogs (⌒_⌒;) and i can maybe start writing about more general things. the bones are there. idk, i've never been that great at regular blogging but i think i'd like to use this space to write more thoughts about life on the internet.</p>
                </article>
                <article id="optimizing">
                    <time datetime="2024-08-13"><a class="pl" href="#optimizing" target="_blank">2024-08-13</a></time>
                    <h2>optimizing</h2>
                    <p>this week, i did a lot of optimizations on the homepage like converting assets and icons to tiny webp and svg formats and converting audio from mp3 to aac. i added some preload tags and lazyloading for the audio. i rewrote my rss aggregator so that it's a simple fetch script instead of relying on an external dependency which was probably overkill for what i wanted to do anyways.</p>
                    <p>i also started building out the website in the homepage that pops up when u click the laptop ^-^ it now has an rss button and 3 sections and u can even visit it by adding /website to the end of my url: <a href="https://ellesho.me/page/website" target="_blank">ellesho.me/page/website</a> ie. elle's homepage website. it's pure html/css so it's old-tech and dial-up friendly (⌒_⌒;) if you're reading this on the lofi version, u can go to the full version here: <a href="https://ellesho.me/page" target="_blank"> ellesho.me/page</a></p>
                </article>
                <article id="sleep-mode">
                    <time datetime="2024-08-07"><a class="pl" href="#sleep-mode" target="_blank">2024-08-07</a></time>
                    <h2>sleep mode</h2>
                    <p>in trying to create a more humane web experience, i've added a night/sleep mode the homepage. the page will be asleep between 10pm and 6am. u can listen to a chiptuned version of "fly me to the moon" that i put on the homepod but that's about it ¯\_(ツ)_/¯</p>
                    <p>there is an emergency light switch if u really need something! but if it's not a emergency, u should get some sleep :) it's good for your brain.</p>
                </article>
                <article id="social-feeds">
                    <time datetime="2024-07-30"><a class="pl" href="#social-feeds" target="_blank">2024-07-30</a></time>
                    <h2>social feeds</h2>
                    <p>i decided to reduce my twitter usage so i guess i'll decentralize and use every other network instead (⌒_⌒;)</p>
                    <p>i added a social feed that pops up when u click the phone on the sleeping bag. it aggregates the rss from my blog here, farcaster, bluesky, mastodon, are.na, daft, and tumblr (bc why not.)</p>
                    <p>i made this bc this is how i wish the web still was. a place where social tools complement individual personal pages rather than the all-consuming monster that social has become. a place where our online time is not dominated by a single platform.</p>
                </article>
                <article id="this-homepage-is-my-home">
                    <time datetime="2024-07-17"><a class="pl" href="#this-homepage-is-my-home" target="_blank">2024-07-17</a></time>
                    <h2>this homepage is my home</h2>
                    <p>it is a small piece of html that is all my own. a place online to relax. a lived-in space that reflects me as the person who lives here.</p>
                    <p>here, i can paint the walls purple one day and pink the next. i can display weird things i've found on the ground. whatever i feel like.</p>
                    <p>it might be messy sometimes but i hope it's cozy for visitors who happen to stop by.</p>
                    <p>there is nothing for sale here, nothing to be advertised. no follower count or like buttons. no algorithms or trackers or paywalls.</p>
                    <p>this is just my home. -elle</p>
                </article>
            </main>
            <footer>
                <div id="totop">
                    <a href="#top" id="up" role="button">ᐱ</a>
                </div>
                ฅ^⸝⸝• ﻌ •⸝⸝^ฅ subscribe via <a href="https://ellesho.me/page/rss.xml" target="_blank">rss</a><br>
                contact webmaster (elle): <span class="email">hi@elle<b>.elle</b>.email</span>
                <p id="du"><i>ps. u are in "dial-up" mode of my homepage. <a href="https://ellesho.me/page">pls click here for the full version</a></i></p>
                <div class="h-card" style="display:none;">
                    <img class="u-photo" src="https://ellesho.me/favicon.svg" alt="elle">
                    <p class="p-name">elle</p>
                    <a class="u-url" href="https://ellesho.me/page">https://ellesho.me/page</a>
                    <p class="p-note">i like to make nice things on the internet</p>
                </div>
            </footer>
        </div>
    
</div>
                    </div>
                    <div class="urlbarbig">
                        <a href="https://ellesho.me/page/rss.xml" aria-label="RSS Subscribe" class="rss" target="_blank" role="button"></a>
                    </div>
                    <div id="titlebarbig"></div>
                    <button id="min" class="center" aria-label="close website" onclick="closeframe()"></button>
                    <a href="https://ellesho.me/page/website" id="max" class="center" aria-label="maximize website"></a>
                </div>
            </div>
            <div id="doomscroll">
                <div class="phonebig center">
                <button class="smaller center" id="logout" aria-label="close feed"></button>
                <div class="screenbig"><div class="rss-feeds"></div></div>
                </div>
            </div>
            <div id="pagebig">
                <div class="paperbig">
                    <div class="qs">
                        <div id="ansbig"><div id="ans">
                                    <p>🤷🏻‍♀️ frequently asked ???</p>
                                    <p><i><b>who are u?</b></i></p>
                                    <p>i'm elle! the webmaster here</p>
                                    <p><i><b>what are your pronouns?</b></i></p>
                                    <p>irl i'm she/her but i'm ok with whatever as long as u aren't being sexist or bigoted about it</p>
                                    <p><a href="https://en.wikipedia.org/wiki/On_the_Internet,_nobody_knows_you%27re_a_dog" target="_blank">everyone on the internet is a dog</a> anyways ૮ • ﻌ - ა</p>
                                    <p><i><b>what is this place?</b></i></p>
                                    <p>it's my escape from the social and/or commercial web. a place to play and experiment for fun</p>
                                    <p>i just think the internet needs more personal homepages now more than ever</p>
                                    <p><i><b>does this have something to do with crypto??</b></i></p>
                                    <p>no! there's no dog coins or anything here. but it does use some tech that is often associated with what some call "web3" (i don't like that term, it's all just the internet to me ¯\_(ツ)_/¯)</p>
                                    <p>for example, the page is stored on <a href="https://ipfs.tech" target="_blank">ipfs</a>, with some media on <a href="https://www.arweave.org" target="_blank">arweave</a>, and u can get here via alternative domain name systems like <a href="https://ens.domains" target="_blank">ens</a> and <a href="https://handshake.org" target="_blank">handshake</a></p>
                                    <p>i know there is a lot of bad stuff in crypto (esp in the cryptocurrency space) but there is also some useful stuff to explore! this homepage tries to use energy efficient tech (well, as efficient as the internet can be at least, which is not very (╥_╥)) and will never ask u to use any cryptocurrency to access it</p>
                                    <p><i><b>how is the chat made?</b></i></p>
                                    <p>it's based on <a href="https://github.com/partykit/cursor-party" target="_blank">cursor party</a> by <a href="https://interconnected.org" target="_blank">matt webb</a> and runs on <a href="https://www.partykit.io" target="_blank">partykit</a>. i forked matt's code and added my own features. u can read more about it in my <a href="https://ellesho.me/page/website/now/#party-time" target="_blank">blog post</a></p>
                                    <p><i><b>what is a signing extension (for optional usernames in chat)?</b></i></p>
                                    <p>they are local apps/browser extensions (such as frame, metamask, rainbow, etc.) crypto ppl call them <a href="https://ethereum.org/en/wallets/find-wallet/" target="_blank">wallets</a> but they are basically just little keychains that provide u with a public-private cryptographic keypair and lets u sign to verify ownership of those keys. think pgp keys, yubikeys, or passkeys</p>
                                    <p>i decided to use this system because ens lets u prove domain name ownership with a simple dns txt record. this avoids having to create user accounts or, worse, keeping user info in a database somewhere to be leaked x_x</p>
                                    <p><i><b>what did u make this site with?</b></i></p>
                                    <p>just plain old html/css/js (no frameworks.) i'm just typing it all out as i go in vscode</p>
                                </div></div>
                    </div>
                    <button class="mag center" id="pagedown" aria-label="unzoom page"></button>
                </div>
            </div>
        </div>
        <div id="night" style="display: block;">
            <div class="hyperspace center">
                <div class="hyperspace starpath">
                    <div id="sky" class="hyperspace">
                        <div class="star1">⁺ ˚</div>
                        <div class="star2">⋆˙</div>
                        <div class="star3">✧</div>
                        <div class="star5">. ˖ ⁺</div>
                        <div class="star6">*</div>
                        <div class="star7">⁺ +</div>
                        <div class="star8">⋆ ,</div>
                        <div class="star9">。</div>
                        <div class="star10">✧</div>
                        <div class="star11">. *</div>
                        <div class="star12">⋆ ˚</div>
                        <div class="star13">.</div>
                        <div class="star14">⋆ ✦</div>
                        <div class="star15">.</div>
                        <div class="star16">⋆˙</div>
                        <div class="star17">⁺˚</div>
                        <div class="star18">.</div>
                        <div class="star19">⁺˖⋆</div>
                        <div class="star20">⁺ *</div>
                        <div class="star21">‧ ₊ ˚</div>
                        <div class="star22">✦</div>
                    </div>
                </div>
                <div class="ellesroom center">
                    <div class="leftwall">
                        it's late, u should get some sleep.
                        this homepage will wake up in
                        <p id="countdown" class="countdown">03:16:30</p>
                        <p id="lightSwitch" class="lightson"></p>
                    </div>
                    <div class="rightwall">
                        <header>elle's homepage ฅ^ᴗ ﻌ ᴗ^ฅ</header>
                        <p class="ns">
                            dns: ellesho.me/page<br>
                            hns: elle.shome/page<br>
                            ens: elles.eth.limo<br>
                        </p>
                    </div>
                    <div class="floor center dim">
                        <div id="nightfloor"><div id="dayfloor">
                            <div class="tile">
                                <div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft2"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft2"></div><div class="sp ft2"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft2"></div><div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft2"></div><div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div><div class="sp ft1"></div>
                            </div>
                            <div class="tile">
                                <div class="sp ft1"></div>
                            </div>
                            <div class="sp cup obj"></div>
                            <div class="sp pile obj"></div>
                            <div class="sp note obj"></div>
                        </div></div>
                        <div class="sp mbn obj"></div>
                        <div class="sp bedn obj"></div>
                        <div class="sp cans n obj"></div>
                        <div class="sp clth obj"></div>
                        <div class="sp shoe obj"></div>
                        <div class="sp phnn obj"></div>
                    </div>
                    <div class="snooze obj">
                        <div class="zzzs">
                            <div class="z">z</div>
                            <div class="z">z</div>
                            <div class="z">z</div>
                        </div>
                    </div>
                    <div class="sp cnstr obj dim"></div>
                    <audio id="sleeppod" loop=""></audio>
                    <button class="sp pod obj" data-audio="sleeppod" data-src="moon.aac" aria-label="listen" onclick="playpause(this)"></button>
                    <div class="sp fax obj dim"></div>
                    <div class="go obj dim">
                        <span>←</span> 
                        <span>→</span>
                    </div>
                    <div class="sp skate obj dim"></div>
                    <div class="sp pdx obj dim"></div>
                </div>
            </div>
        </div>
        <script src="https://cursor-party.riotgoools.partykit.dev/cursors.js"></script><div class="cursors-root"><div style="position: absolute; inset: 0px; overflow: clip; pointer-events: none;"><div style="position: absolute; transform: translate(271.6px, 11.7783px); filter: blur(1.5px); opacity: 0.2; z-index: 1001;"><div style="transform: scaleX(-1);"><svg height="28" viewBox="0 0 24 28" width="24" xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" style="filter: drop-shadow(rgba(0, 0, 0, 0.2) 0px 2px 2px);"><g transform="translate(0, 4)"><g transform="scale(2)"><path stroke="#ffffff" d="M2 0h2M8 0h2M1 1h1M4 1h1M7 1h1M10 1h1M1 2h1M4 2h1M7 2h1M10 2h1M1 3h1M5 3h2M10 3h1M0 4h1M11 4h1M0 5h1M11 5h1M0 6h1M3 6h1M11 6h1M0 7h1M3 7h1M7 7h1M11 7h1M0 8h1M7 8h1M11 8h1M0 9h1M11 9h1M1 10h1M9 10h2M2 11h7"></path><path stroke="#137444" d="M2 1h2M8 1h2M2 2h2M8 2h2M2 3h3M7 3h3M1 4h10M1 5h10M1 6h1M4 6h7M1 7h1M4 7h2M8 7h3M1 8h5M8 8h3M1 9h10M2 10h7"></path><path stroke="#323232" d="M2 6h1M2 7h1M6 7h1M6 8h1"></path></g></g></svg></div></div></div></div>
        <script src="js.js"></script>
        <div class="h-card" style="display:none;">
            <img class="u-photo" src="https://ellesho.me/favicon.svg" alt="elle">
            <p class="p-name">elle</p>
            <a class="u-url" href="https://ellesho.me/page">https://ellesho.me/page</a>
            <p class="p-note">i like to make nice things on the internet</p>
        </div>
        <noscript>
            <div class="nojs center hyperspace">
                <div class="nojsb">
                    <strong>u need javascript to view this homepage correctly!</strong>
                    pls enable javascript in your browser settings &lt;3<br><br>
                    <a href="https://ellesho.me/page/website">or click here to visit my html/css-only mini site :)</a>
                </div>
                <div class="sp nojsicon"></div>
            </div>
        </noscript>
    
</body></html>