JoshALogs.github.io

Personal portfolio / resume site for Joshua A. Logsdon — GIS Analyst III, City of San Diego.

Plain HTML + CSS + a tiny vanilla JS theme toggle. No build step, no dependencies.

Local preview

Open index.html directly in a browser, or run a one-line static server:

python -m http.server 8000
# then visit http://localhost:8000

Publish to GitHub Pages

This repo is named JoshALogs.github.io, which GitHub treats as a user site. Once pushed to main, it auto-publishes to https://joshalogs.github.io.

First-time setup:

git add .
git commit -m "Initial portfolio site"
git branch -M main
git remote add origin https://github.com/JoshALogs/JoshALogs.github.io.git
git push -u origin main

Then on GitHub: Settings → Pages → Build and deployment

• Source: Deploy from a branch
• Branch: main / root (/)
• Save

The site typically goes live within 1–2 minutes of the first push.

Custom domain (later)

When you purchase a domain:

1. In the repo, Settings → Pages → Custom domain, enter yourdomain.com and save. GitHub will commit a CNAME file to the repo automatically.
2. At your registrar, add DNS records pointing to GitHub Pages:
   • A records for the apex domain pointing to: 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153
   • CNAME record for www pointing to joshalogs.github.io
3. Wait for DNS + HTTPS cert to provision (usually < 1 hour), then tick Enforce HTTPS.

Editing

• Content: all copy lives in index.html.
• Design tokens: colors, radii, spacing, and fonts are at the top of styles.css under :root (dark theme) and :root[data-theme="light"].
• Photo: replace assets/headshot.jpg with a newer photo. Keep it square (1:1) and roughly 800×800 for best quality. If you change the filename, update the <img src> in index.html.
• Résumé download: drop a new copy at assets/Logsdon_Joshua_Resume.pdf. If you change the filename, update the two hrefs in index.html that reference the file.

Accessibility notes

• Dark and light palettes both meet WCAG AA contrast for body and UI text.
• Full keyboard navigation with visible focus rings.
• Skip-to-content link for screen readers.
• prefers-reduced-motion respected (animations disabled).
• Semantic landmarks (header, main, nav, section, footer) and ARIA labels where helpful.

Files

index.html         # single-page site
styles.css         # theme tokens, layout, components, print styles
script.js          # theme toggle + back-to-top + footer year
assets/
  headshot.jpg     # profile photo (800x800 JPEG)
  favicon.svg      # favicon — concentric-circles "target" mark
  Logsdon_Joshua_Resume.pdf