Website TODO
Hidden dashboard - improvement ideas
Last updated: Jan 1, 1980 at 00:00
Content & Structure
- ✓ Add a site structure page that also links to the todo and history page
- ✓ Add Godot battle game export to the website (linked from hidden `/site` page)
- ✓ Add Research Games catalog page at `/research/games` (hidden, linked from site structure)
- ✓ Add embedded game view at `/research/games/battle` with iframe and standalone link
- ○ Add a downloadable CV/Resume (PDF)
- ○ Add a dedicated Projects/Portfolio page showcasing best work with screenshots/demos
- ○ Expand the About Me section with story, skills, or career timeline
- ○ Add a /now page - what you're currently working on
- ○ Add a Bookshelf/Reading list page
- ○ Rework Software Engineer sub-page - update content and presentation
- ○ Rework Renewable Energy sub-page - update content and presentation
- ○ Rework Politics sub-page - update content and presentation
- ○ Add a Running sub-page under About Me
Blog Enhancements
- ✓ Add table of contents for longer blog posts
- ✓ Add estimated reading time to blog posts
- ✓ Blog rendering: more space between paragraphs
- ✓ Tables are not rendering correctly in blog posts; see economy of renewables blog post
- ✓ Support of footnote links in blog posts; see economy [^1] in renewables blog post
- ✓ Add language tags to blog posts for better categorization
- ✓ Show language flag (German, English) for blog posts in blog list
- ✓ Add language filter for blog posts
- ✓ Add an RSS feed for subscribers
- ✓ Add social sharing buttons - leverage existing Open Graph tags
- ✓ Add previous/next post navigation at the bottom of articles
- ✓ Add anchor links on headings - clickable `#` links for deep-linking to sections
- ✓ Add code syntax highlighting for blog posts (Shiki or Prism via mdsvex)
- ○ Add a search function for blog posts
- ○ Add related posts by tag - show 2-3 related posts at the bottom of each article
- ○ Add blog post image support - proper styling for images with captions and responsive sizing
SEO & Social (Improve Internet Awareness)
- ✓ Add Open Graph meta tags for better social media previews when sharing links
- ✓ Create a sitemap.xml for search engines
- ✓ Add structurced data (JSON-LD) to blog posts - enables Google rich results (author, date, description) so posts stand out in search results
- ✓ Add canonical URLs (``) to all pages - prevents duplicate content issues and consolidates search ranking signals
- ✓ Upgrade Twitter card from `summary` to `summary_large_image` - larger preview images when shared on X/Twitter increase click-through rates
- ✓ Add per-page Open Graph tags on non-blog pages - currently only blog posts have specific OG tags; other pages fall back to a generic description, reducing share quality
- ✓ Add `lang` attribute on blog posts - use the existing `language` frontmatter field to set `lang="de"`/`lang="en"` for screen readers and search engines
- ○ Add custom Open Graph images per blog post - auto-generated or custom social preview cards for more eye-catching shares on social media
- ○ Register with Google Search Console - verify site ownership, submit sitemap, and monitor indexing to ensure Google discovers all pages
- ○ Cross-post/syndicate blog posts to platforms like dev.to, Medium, or LinkedIn with canonical links back to the site - reaches wider audiences while preserving SEO authority
- ○ Share posts on communities (Reddit, Hacker News, relevant subreddits) - direct traffic and backlinks improve search rankings
- ○ Add per-page meta descriptions - most non-blog pages only have a `
` but no unique description, so search engines show a generic fallback<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Add <strong class="text-purple-600 dark:text-purple-400">structured data to non-blog pages</strong> - JSON-LD Person/ProfilePage schema on home, About, and profile pages for richer search results<!----></span></li><!--]--></ul></div><div class="todo-card rounded-2xl p-6 shadow-lg border svelte-1g7fi1p"><h2 class="todo-heading text-xl font-bold mb-4 flex items-center gap-2 svelte-1g7fi1p"><span class="w-2 h-2 rounded-full bg-gradient-to-r from-amber-500 to-orange-500"></span> UX Improvements</h2> <ul class="space-y-2"><!--[--><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add a <strong class="text-purple-600 dark:text-purple-400">scroll-to-top button</strong> on longer pages<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Custom <strong class="text-purple-600 dark:text-purple-400">404 page</strong> with helpful navigation<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add <strong class="text-purple-600 dark:text-purple-400">page transitions</strong> for smoother navigation<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add <strong class="text-purple-600 dark:text-purple-400">dark mode toggle</strong> - Tailwind supports this with `dark:` variants<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add <strong class="text-purple-600 dark:text-purple-400">reading progress indicator</strong> - horizontal bar showing scroll position on blog posts<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Consider adding <strong class="text-purple-600 dark:text-purple-400">keyboard navigation</strong> support<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!----><strong class="text-purple-600 dark:text-purple-400">Highlight active page in navigation</strong> - use `$page.url.pathname` to style the current nav link so users know where they are<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add <strong class="text-purple-600 dark:text-purple-400">print styles for blog posts</strong> - `@media print` rules to hide nav/footer and optimize layout for paper<!----></span></li><!--]--></ul></div><div class="todo-card rounded-2xl p-6 shadow-lg border svelte-1g7fi1p"><h2 class="todo-heading text-xl font-bold mb-4 flex items-center gap-2 svelte-1g7fi1p"><span class="w-2 h-2 rounded-full bg-gradient-to-r from-amber-500 to-orange-500"></span> Engagement</h2> <ul class="space-y-2"><!--[--><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add a <strong class="text-purple-600 dark:text-purple-400">visitor counter</strong> (retro style?)<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Add a <strong class="text-purple-600 dark:text-purple-400">contact form</strong> (instead of/in addition to email link)<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Add a <strong class="text-purple-600 dark:text-purple-400">newsletter signup</strong> for blog updates<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Set up a <strong class="text-purple-600 dark:text-purple-400">Discord server</strong> for the site community and add an invite link to the website<!----></span></li><!--]--></ul></div><div class="todo-card rounded-2xl p-6 shadow-lg border svelte-1g7fi1p"><h2 class="todo-heading text-xl font-bold mb-4 flex items-center gap-2 svelte-1g7fi1p"><span class="w-2 h-2 rounded-full bg-gradient-to-r from-amber-500 to-orange-500"></span> Technical</h2> <ul class="space-y-2"><!--[--><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Add <strong class="text-purple-600 dark:text-purple-400">lazy loading</strong> for images<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[--><span class="text-green-500">✓</span><!--]--></span> <span class="line-through text-gray-400"><!---->Run <strong class="text-purple-600 dark:text-purple-400">accessibility audit</strong> (Lighthouse/WCAG) and fix issues<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Implement <strong class="text-purple-600 dark:text-purple-400">image optimization</strong> (WebP format, srcset)<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Consider <strong class="text-purple-600 dark:text-purple-400">Plausible/Simple Analytics</strong> - privacy-respecting visitor insights<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Add a <strong class="text-purple-600 dark:text-purple-400">web app manifest</strong> (`manifest.json`) - enables "Add to Home Screen" on mobile and defines app icons/theme colors<!----></span></li><!--]--></ul></div><div class="todo-card rounded-2xl p-6 shadow-lg border svelte-1g7fi1p"><h2 class="todo-heading text-xl font-bold mb-4 flex items-center gap-2 svelte-1g7fi1p"><span class="w-2 h-2 rounded-full bg-gradient-to-r from-amber-500 to-orange-500"></span> Future Tech Updates</h2> <ul class="space-y-2"><!--[--><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!----><strong class="text-purple-600 dark:text-purple-400">SvelteKit 3 migration</strong> - when released, migrate to rune-based stores (`$app/stores` API changes)<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Consider <strong class="text-purple-600 dark:text-purple-400">i18n support</strong> - SvelteKit 3 will have first-class internationalization<!----></span></li><li class="todo-item flex items-start gap-3 svelte-1g7fi1p"><span class="mt-1 flex-shrink-0"><!--[!--><span class="text-gray-400">○</span><!--]--></span> <span><!---->Keep dependencies updated - run `npm outdated` periodically<!----></span></li><!--]--></ul></div><!--]--></div> <div class="mt-8 text-center"><a href="/" class="inline-flex items-center gap-2 px-6 py-3 rounded-full bg-gradient-to-r from-amber-500 to-orange-500 text-white font-semibold hover:shadow-lg hover:scale-105 transition-all duration-300"><span>←</span> <span>Back to Home</span></a></div></div><!----><!----></div></main> <footer class="footer-gradient py-8 svelte-1wlmi2p"><div class="max-w-6xl mx-auto px-4"><nav class="flex flex-wrap justify-center gap-4 sm:gap-8 mb-4"><a href="/impressum" class="footer-link svelte-1wlmi2p">Impressum</a> <a href="/datenschutz" class="footer-link svelte-1wlmi2p">Datenschutz</a> <a href="/contact" class="footer-link svelte-1wlmi2p">Contact</a></nav> <p class="text-center text-indigo-300/70 dark:text-gray-400 text-sm">© 2026 Thomas Häuser</p> <p class="text-center text-indigo-300/50 dark:text-gray-500 text-xs mt-2">Last updated: Feb 13, 2026, 12:19 PM</p> <hr class="border-indigo-400/30 dark:border-gray-600 mt-6 mb-4"/> <div class="flex justify-center"><div class="counter-wrapper svelte-1eu1bm2"><span class="counter-label svelte-1eu1bm2">Hits</span> <div class="counter-display svelte-1eu1bm2"><!--[--><!--[--><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2 group-space">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2 group-space">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2 group-space">-</span><span class="digit loading svelte-1eu1bm2">-</span><span class="digit loading svelte-1eu1bm2">-</span><!--]--><!--]--></div></div><!----></div></div></footer><!----></div> <!--[!--><!--]--><!----><!----><!--]--> <!--[!--><!--]--><!--]--> <script> { __sveltekit_1dgapem = { base: new URL(".", location).pathname.slice(0, -1) }; const element = document.currentScript.parentElement; Promise.all([ import("./_app/immutable/entry/start.Bx-GCGrb.js"), import("./_app/immutable/entry/app.Cra8skLL.js") ]).then(([kit, app]) => { kit.start(app, element, { node_ids: [0, 19], data: [null,{type:"data",data:{content:"# Website Improvement Ideas\n\nA collection of potential enhancements for the personal website.\n\n## Content & Structure\n\n- [x] Add a site structure page that also links to the todo and history page\n- [x] Add **Godot battle game** export to the website (linked from hidden `/site` page)\n- [x] Add **Research Games** catalog page at `/research/games` (hidden, linked from site structure)\n- [x] Add **embedded game view** at `/research/games/battle` with iframe and standalone link\n- [ ] Add a downloadable **CV/Resume** (PDF)\n- [ ] Add a dedicated **Projects/Portfolio** page showcasing best work with screenshots/demos\n- [ ] Expand the **About Me** section with story, skills, or career timeline\n- [ ] Add a **/now** page - what you're currently working on\n- [ ] Add a **Bookshelf/Reading list** page\n- [ ] Rework **Software Engineer** sub-page - update content and presentation\n- [ ] Rework **Renewable Energy** sub-page - update content and presentation\n- [ ] Rework **Politics** sub-page - update content and presentation\n- [ ] Add a **Running** sub-page under About Me\n\n## Blog Enhancements\n\n- [x] Add **table of contents** for longer blog posts\n- [x] Add **estimated reading time** to blog posts\n- [x] Blog rendering: more space between paragraphs\n- [x] Tables are not rendering correctly in blog posts; see economy of renewables blog post\n- [x] Support of footnote links in blog posts; see economy [^1] in renewables blog post\n- [x] Add language tags to blog posts for better categorization\n- [x] Show language flag (German, English) for blog posts in blog list\n- [x] Add language filter for blog posts\n- [x] Add an **RSS feed** for subscribers\n- [x] Add **social sharing buttons** - leverage existing Open Graph tags\n- [x] Add **previous/next post** navigation at the bottom of articles\n- [x] Add **anchor links on headings** - clickable `#` links for deep-linking to sections\n- [x] Add **code syntax highlighting** for blog posts (Shiki or Prism via mdsvex)\n- [ ] Add a **search function** for blog posts\n- [ ] Add **related posts by tag** - show 2-3 related posts at the bottom of each article\n- [ ] Add **blog post image support** - proper styling for images with captions and responsive sizing\n\n## SEO & Social (Improve Internet Awareness)\n\n- [x] Add **Open Graph meta tags** for better social media previews when sharing links\n- [x] Create a **sitemap.xml** for search engines\n- [x] Add **structurced data (JSON-LD)** to blog posts - enables Google rich results (author, date, description) so posts stand out in search results\n- [x] Add **canonical URLs** (`\u003Clink rel=\"canonical\">`) to all pages - prevents duplicate content issues and consolidates search ranking signals\n- [x] Upgrade **Twitter card** from `summary` to `summary_large_image` - larger preview images when shared on X/Twitter increase click-through rates\n- [x] Add **per-page Open Graph tags** on non-blog pages - currently only blog posts have specific OG tags; other pages fall back to a generic description, reducing share quality\n- [x] Add **`lang` attribute on blog posts** - use the existing `language` frontmatter field to set `lang=\"de\"`/`lang=\"en\"` for screen readers and search engines\n- [ ] Add **custom Open Graph images** per blog post - auto-generated or custom social preview cards for more eye-catching shares on social media\n- [ ] **Register with Google Search Console** - verify site ownership, submit sitemap, and monitor indexing to ensure Google discovers all pages\n- [ ] **Cross-post/syndicate blog posts** to platforms like dev.to, Medium, or LinkedIn with canonical links back to the site - reaches wider audiences while preserving SEO authority\n- [ ] **Share posts on communities** (Reddit, Hacker News, relevant subreddits) - direct traffic and backlinks improve search rankings\n- [ ] Add **per-page meta descriptions** - most non-blog pages only have a `\u003Ctitle>` but no unique description, so search engines show a generic fallback\n- [ ] Add **structured data to non-blog pages** - JSON-LD Person/ProfilePage schema on home, About, and profile pages for richer search results\n\n## UX Improvements\n\n- [x] Add a **scroll-to-top button** on longer pages\n- [x] Custom **404 page** with helpful navigation\n- [x] Add **page transitions** for smoother navigation\n- [x] Add **dark mode toggle** - Tailwind supports this with `dark:` variants\n- [x] Add **reading progress indicator** - horizontal bar showing scroll position on blog posts\n- [x] Consider adding **keyboard navigation** support\n- [x] **Highlight active page in navigation** - use `$page.url.pathname` to style the current nav link so users know where they are\n- [x] Add **print styles for blog posts** - `@media print` rules to hide nav/footer and optimize layout for paper\n\n\n## Engagement\n\n- [x] Add a **visitor counter** (retro style?)\n- [ ] Add a **contact form** (instead of/in addition to email link)\n- [ ] Add a **newsletter signup** for blog updates\n- [ ] Set up a **Discord server** for the site community and add an invite link to the website\n\n\n## Technical\n\n- [x] Add **lazy loading** for images\n- [x] Run **accessibility audit** (Lighthouse/WCAG) and fix issues\n- [ ] Implement **image optimization** (WebP format, srcset)\n- [ ] Consider **Plausible/Simple Analytics** - privacy-respecting visitor insights\n- [ ] Add a **web app manifest** (`manifest.json`) - enables \"Add to Home Screen\" on mobile and defines app icons/theme colors\n\n## Future Tech Updates\n\n- [ ] **SvelteKit 3 migration** - when released, migrate to rune-based stores (`$app/stores` API changes)\n- [ ] Consider **i18n support** - SvelteKit 3 will have first-class internationalization\n- [ ] Keep dependencies updated - run `npm outdated` periodically\n",lastModified:"Jan 1, 1980 at 00:00"},uses:{}}], form: null, error: null }); }); } </script> </body> </html>