Eating my
own cooking.
A Technical SEO consultant who does not apply those same standards to his own site is not a consultant — he is a salesperson. This page documents every technical decision behind abdallahmekky.com, with the reasoning behind each one.
Last updated: June 2026
Performance Targets
Hero images preloaded, no render-blocking resources
Minimal client-side JS, no heavy event handlers
All images have explicit dimensions, fonts self-hosted
Vercel Edge, ISR caching, no cold-start SSR on popular routes
Per-route code splitting, RSC reduces hydration payload
Performance, Accessibility, Best Practices, SEO — all four
Every tool. Every reason.
Framework & Rendering
3 toolsApp Router, RSC, per-route rendering strategy (SSR/SSG/ISR). Fine-grained control over exactly what HTML search bots receive.
Server Components reduce client-side JavaScript to the minimum necessary — better INP, lower hydration overhead.
Type safety across all components, metadata, and structured data objects. Prevents the class of runtime bugs that break rendered HTML.
Styling & Design
3 toolsZero-runtime CSS. Purged at build time — no unused styles in production. Supports the custom design token system cleanly.
Scroll-triggered FadeIn animations. All animations are respectful of prefers-reduced-motion and do not block rendering.
Conditional Tailwind class composition without string concatenation bugs.
Fonts & Typography
3 toolsHigh-contrast serif with strong personality for large display text. Self-hosted via next/font — zero FOUT, no external request.
Neutral, highly legible at small sizes. Optimised for screen rendering across all DPR values.
Used for URL slugs, code samples, and technical identifiers. Clear glyph differentiation at small sizes.
Infrastructure & Hosting
3 toolsEdge network with automatic ISR revalidation. TTFB under 200ms globally. Native Next.js support with no configuration overhead.
Core Web Vitals measured from real user sessions across device types — not synthetic lab data.
Faster installs, deterministic lockfile, and strict dependency isolation compared to npm.
SEO & Structured Data
5 toolsEvery page type has appropriate Schema.org markup — Person, WebPage, Article, FAQPage, DefinedTermSet. Delivered server-side in <head>.
Server-rendered metadata — title, description, canonical, Open Graph, Twitter Card — statically generated per route at build time.
A plain-text file at the domain root guiding AI crawlers (GPTBot, Google-Extended, PerplexityBot) toward key pages and away from thin content.
Configured separately for search bots and AI bots. Noindex applied to utility pages and parameter variants.
Submitted to Google Search Console with accurate lastmod, priority, and changefreq values. Split by content type.
Tooling & Quality
3 toolsNext.js config with strict rules. Catches accessibility issues (jsx-a11y), unused imports, and type errors at development time.
Consistent formatting across all files. Committed to the repo — no formatting debates in PRs.
All changes tracked. Vercel previews deploy on every push — every PR gets a production-equivalent URL to test against.
Intentional by default
No CSS-in-JS
Zero runtime style injection. Tailwind generates static CSS at build time — no additional render-blocking, no hydration mismatch risk, no JavaScript penalty for styling.
Server Components by default
All pages are React Server Components unless interactivity is required. This keeps JavaScript bundles small and HTML immediately parseable by both search bots and AI crawlers.
Self-hosted fonts only
Every typeface is served from this domain via next/font. Zero third-party font requests means no FOUT, no connection overhead, and no privacy-leaking external calls.
Structured data on every page
JSON-LD is generated server-side for every route. No client-side injection means structured data is immediately available to crawlers without JavaScript execution.
Dark mode via CSS variables
A CSS variable token system drives the entire colour palette. Dark mode switches the token layer — zero duplication, instant switching with no Flash of Unstyled Content.
Accessibility as a baseline
Semantic HTML throughout. ARIA labels on all interactive elements. Focus management in interactive components. Colour contrast meeting WCAG AA across both themes.
"The best argument for hiring a Technical SEO consultant is watching what they do to their own site. If it loads in 4 seconds and has no structured data, keep looking."
— Abdallah MekkyYour stack. Audited properly.
Whether you are running Next.js, Laravel, WordPress, or a custom enterprise stack — the same engineering rigour applies. A technical audit starts with understanding your infrastructure.