update index.html and styles.css to improve accessibility and enhance visual presentation

This commit is contained in:
pacnpal
2025-02-16 11:55:09 -05:00
parent 1fee683d6d
commit 3c36496c7b
2 changed files with 59 additions and 18 deletions

View File

@@ -1,25 +1,42 @@
<!DOCTYPE html>
<!-- saved from url=(0017)https://pacnp.al/ -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="PacNPal's personal space - Exploring retro tech, gaming, and roller coasters. Creator of Steadirect.com for Steam invite links.">
<meta name="keywords" content="retro computing, vintage computers, gaming, roller coasters, steam links, pacnpal">
<meta property="og:title" content="PacNP.al - PacNPal's Space">
<meta property="og:description" content="Exploring video games, vintage computers, roller coasters, and the web.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://pacnp.al">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="PacNP.al">
<meta name="twitter:description" content="Exploring video games, vintage computers, roller coasters, and the web.">
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link href="https://fonts.cdnfonts.com/css/chicagoflf" rel="stylesheet">
<title>PacNP.al - PacNPal's Space</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<a href="#main" class="skip-link" style="position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; z-index: 999999;">Skip to main content</a>
<header role="banner">
<h1>Welcome to PacNP.al</h1>
<p>Exploring video games, vintage computers, roller coasters, and the web.</p>
</header>
<section id="about">
<h2>About PacNPal</h2>
<p>A retro tech enthusiast and a gamer, diving deep into coasters and vintage computing.</p>
<p>Find me on <a href="https://bsky.app/profile/pacnp.al" target="_blank" rel="noopener noreferrer">BlueSky</a>.</p>
</section>
<section id="sites">
<h2>My Sites</h2>
<p><a href="https://steadirect.com" target="_blank" rel="noopener noreferrer">Steadirect.com</a> - Create clickable links for protocol URLs like Steam invites.</p>
</section>
<main id="main" role="main">
<section id="about" aria-labelledby="about-heading">
<h2 id="about-heading">About PacNPal</h2>
<p>A retro tech enthusiast and a gamer, diving deep into coasters and vintage computing.</p>
<p>Find me on <a href="https://bsky.app/profile/pacnp.al" target="_blank" rel="noopener noreferrer">BlueSky</a>.</p>
</section>
<section id="sites" aria-labelledby="sites-heading">
<h2 id="sites-heading">My Sites</h2>
<p><a href="https://steadirect.com" target="_blank" rel="noopener noreferrer">Steadirect.com</a> - Create clickable links for protocol URLs like Steam invites.</p>
</section>
</main>
<script defer="" src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon="{&quot;rayId&quot;:&quot;912ee97cdcebeb5e&quot;,&quot;version&quot;:&quot;2025.1.0&quot;,&quot;r&quot;:1,&quot;token&quot;:&quot;1cef99b58ec34b74ae9a46890381b17f&quot;,&quot;serverTiming&quot;:{&quot;name&quot;:{&quot;cfExtPri&quot;:true,&quot;cfL4&quot;:true,&quot;cfSpeedBrain&quot;:true,&quot;cfCacheStatus&quot;:true}}}" crossorigin="anonymous"></script>