Portfolio / PsychPrograms.com
Education Resource Platform

A Research-Driven Psychology Education Platform, Built from Scratch

Career guides, accredited program rankings, salary data, and state licensing requirements for psychology students and career changers.

Website DesignSoftware DevelopmentSEODigital Marketing
Visit Website
PsychPrograms.com homepage showing the hero section with career and program navigation

The Challenge

The psychology education space online is dominated by a handful of large sites that pull in millions of monthly visitors. Most of them follow the same playbook: generic program descriptions, vague salary ranges, and "request info" buttons that funnel visitors straight to admissions offices. The content reads like it was written to sell enrollment, not to help someone make an informed decision about their career.

Students and career changers researching psychology programs deserve better than that. They need honest information about what a degree actually costs, what the job market looks like after graduation, what licensing requires in their state, and whether a particular career path aligns with their goals. That information exists across dozens of government databases, accreditation directories, and academic publications, but nobody had pulled it together in a way that was accessible and trustworthy.

The goal was to build a resource that could compete with established sites on content depth and authority, while being transparent about methodology and data sources. Not a lead-gen funnel with a blog attached. An actual research platform that happens to be a website.

Our Solution

We designed and built PsychPrograms.com as a comprehensive education resource with four content pillars: career guides, program rankings, salary data, and state-level licensing guides. Every piece of content is sourced from primary data and structured to perform in search.

Data-Driven Content Architecture

The site runs on a TypeScript data architecture where every career, program ranking, salary guide, and state page is defined as a structured data file. This is not a CMS with freeform text fields. Each content type has a strict interface that enforces consistency: a career guide must include salary data with national medians and state breakdowns, education requirements with step-by-step timelines, job outlook with BLS growth projections, pros and cons, and expert insights.

The site covers a growing library of career guides (from clinical psychologist to BCBA), program rankings across different degree types, state-level MSW program guides, and detailed salary breakdowns for each career path. Astro's import.meta.glob() dynamically discovers all data files at build time, so adding a new career or state guide is as simple as creating a new TypeScript file that matches the interface. No template changes needed.

PsychPrograms.com careers directory showing career cards with salary badges and growth percentages

The careers directory shows each psychology career path with median salary and projected growth rate, helping visitors quickly compare options.

Editorial Design That Builds Trust

The design system was built to feel like a trusted academic publication, not a marketing site. We chose a warm plum and sage color palette with cream backgrounds, using Lora (a variable serif) for headings and DM Sans for body text. The typography creates an editorial feel that signals authority without being cold or corporate.

Every detail reinforces credibility: "Last updated" dates on every page, author bylines with real credentials, breadcrumb navigation that shows where you are in the content hierarchy, and a dedicated methodology page that explains exactly how programs are ranked (25% accreditation status, 25% academic quality, 20% student outcomes, 20% affordability, 10% flexibility). The dark mode implementation uses OKLCH color space for perceptual uniformity, so the warm tones translate properly across both themes.

Clinical Psychologist career guide showing author byline, last updated date, and table of contents

The clinical psychologist career guide includes author credentials, last-updated dates, breadcrumbs, and a sidebar table of contents for easy navigation.

Research-Backed Program Rankings

The program rankings are built on a transparent, documented methodology. Every program featured is verified against official accreditation directories: APA for psychology programs, CSWE for social work, CACREP for counseling, NASP for school psychology, and BACB for behavior analysis. No program makes it onto the site without a verified accreditation check.

Each ranking page includes a comparison table, detailed profiles with tuition data (both in-state and out-of-state where applicable), program format and length, concentration options, field placement hours, and a "Why We Chose This" editorial note explaining the reasoning. The data comes from NCES/IPEDS institutional data, program websites, and direct verification against accreditation body directories.

Best Online MSW Programs ranking page with author, methodology reference, and table of contents

The Best Online MSW Programs ranking references the transparent methodology, links to accreditation verification, and shows the specific criteria used for evaluation.

Performance-First Technical Stack

PsychPrograms.com is built on Astro 5 with static site generation, which means every page is pre-rendered at build time. There is zero runtime JavaScript except for the theme toggle and contact form. Pages load instantly because there is no framework hydration, no client-side routing, and no JavaScript bundles to download before the content appears.

The site deploys to Cloudflare Pages for edge delivery, putting the static HTML as close to the visitor as possible. Combined with Astro's built-in image optimization via Sharp (responsive sizes, WebP conversion), the Core Web Vitals scores are consistently in the green across all page types.

On the SEO side, every page generates comprehensive Schema.org JSON-LD markup: Organization, WebSite, WebPage, BreadcrumbList, Article (for career and program pages), FAQPage (for pages with FAQ sections), and CollectionPage (for directory pages). All schemas are merged into a single @graph in the document head. The semantic markup gives search engines a structured understanding of the content, which is increasingly important as AI-powered search features rely on structured data to generate answers.

State-Level Licensing and Program Guides

One of the most useful content types on the site is the state-level program guide. Each state page covers the specific licensing requirements for that state (exam names, supervision hours, continuing education mandates), salary data contextualized to that state's labor market, and a curated list of accredited programs at in-state universities with tuition, format, and concentration details.

The site is expanding state by state, with the architecture designed to scale to all 50 states and additional degree types. Each state page pulls from state licensing board data and is cross-referenced with the ASWB (Association of Social Work Boards) for exam requirements and reciprocity information.

Technology Stack

Astro 5
TypeScript
Tailwind CSS 4
DaisyUI 5
Cloudflare Pages
Schema.org JSON-LD

The Results

PsychPrograms.com launched with a content library that covers the full decision-making journey for psychology students: from "What does a clinical psychologist actually do?" to "What are the best online MSW programs?" to "How much do school psychologists make in California?" The depth and specificity of the content sets it apart from the generic program directories that dominate the space.

A growing library of in-depth, research-backed content across four content pillars: career guides, program rankings, salary data, and state licensing guides.

Every program ranking verified against official accreditation directories (APA, CSWE, CACREP, NASP, BACB) with a transparent, published methodology.

Sub-second page loads across all page types with green Core Web Vitals scores, powered by Astro's zero-JS static generation and Cloudflare edge delivery.

Comprehensive Schema.org markup on every page (Organization, Article, FAQPage, BreadcrumbList, CollectionPage) providing search engines with structured data for rich results and AI-powered search features.

Scalable content architecture that expands to new states, degree types, and career specializations without any template changes. Adding a new page is as simple as creating a TypeScript data file.

This project is a good example of what happens when content strategy, design, and engineering are all considered from the start rather than treated as separate phases. The TypeScript data architecture enforces content quality. The editorial design builds trust with visitors. The static generation and schema markup give search engines exactly what they need. Each layer reinforces the others, which is much harder to achieve when you bolt them together after the fact.

Need a Content-Driven Website?

We build websites where the content strategy, design, and engineering all work together from day one.

Start Your Project
Message sent! We'll be in touch within 24 hours.