تخطَّ إلى المحتوى

طيف التقني

استوديو مصري متخصص في تطوير المواقع

Colophon / ملاحظات المصممين والمطورين / محدّثة سبتمبر 2026

إزاي بُني الموقع ده

استوديو بيبيع تطوير مواقع لازم يكون موقعه نفسه دليل شغل. الصفحة دي بتوثّق القرارات المعمارية والتقنية اللي بُني بيها الموقع — القالب، الخطوط، الأداء، والأدوات — بشفافية كاملة. لو حبّيت تبني موقع بنفس النهج، هتلاقي هنا الإجابة على “ليه” قبل “إزاي”.

01

القالب والمنصة

WordPress مع block theme مخصّص

الموقع مبني على WordPress بـblock theme مخصّص (FSE)، مش قالب تجاري ولا Elementor. القرار كان معماري: لو بنبيع تطوير مخصّص، مايصحّش موقعنا يشتغل على قالب جاهز. البنية كلها في theme.json — الألوان، الخطوط، المسافات، الأنماط.

  • WordPress 6.5+ · Block Theme (FSE)
  • PHP 8.1+
  • Rank Math (SEO) · Fluent Forms مش مثبّت — النموذج مدمج في الثيم
  • عدد الـplugins المفعّلة: أقل من ٥

02

الخطوط

IBM Plex Sans Arabic + JetBrains Mono

النص الأساسي: IBM Plex Sans Arabic بأوزان ٤٠٠ و٥٠٠ و٦٠٠ — self-hosted (مش من Google Fonts CDN). الأرقام والأكواد: JetBrains Mono بوزن ٤٠٠.

القرار بـself-hosting بدل CDN: خصوصية + أداء. Google Fonts بيبعت IP كل زائر لجوجل. self-hosting بيمنع ده، وبيقلّل DNS lookup إضافي.

03

الألوان

لوحة سبعة ألوان — بدون تدرّجات

الموقع بيستخدم ٧ ألوان بس: ورق (paper)، ورق بديل (paper-alt)، حبر أساسي (ink)، حبر ثانوي (ink-secondary)، حبر خافت (ink-muted)، خط فاصل (rule)، ولون مميّز (accent). مفيش تدرّجات، مفيش ظلال ملوّنة — فقط خطوط وأسطح ونصوص.

  • Paper: #d8e2f0 · Paper-alt: #c8d4e6
  • Ink: #0a1631 · Ink-secondary: #2a3660
  • Ink-muted: #4d5a77 · Rule: #a8b4c8
  • Accent: #1b3a73 (كحلي عميق)

04

الأداء والاستضافة

أداء أخضر بلا Cache Plugin

الاستضافة على Hostinger (خطة مشتركة). القالب بيعمل preload لخطين فقط (400 + 500)، بيشيل emoji script و XML-RPC و jQuery migrate تلقائيًا. أول صورة في الصفحة بتتحمّل بـeager + fetchpriority=high لتحسين LCP.

مفيش WP Rocket ولا LiteSpeed Cache. Cache-Control على مستوى .htaccess فقط. Core Web Vitals: أخضر بالكامل على الموبايل — قابلة للتحقّق من PageSpeed Insights.

05

شكر وإلهام

مصادر تعلّمنا منها

نصيحة الأداء من web.dev ومقالات Harry Roberts. نظام التصميم متأثّر بـBasecamp و37signals — بساطة عن قصد، بلا زخرفة زايدة. توثيقات WordPress Themes وSchema.org مرجع دائم.

القرارات دي مش وصفات — دي قرارات خاصة بموقع استوديو صغير. ما ينفع هنا مايصحّش دائمًا لسياق تاني. لو حبّيت تعرف تفاصيل تقنية أكتر عن أي قرار، ابعتنا على admin@taif-dev.com.

تواصل معنا