عند إنشاء موقع ويب ، تعتبر مرحلة عرض تصميم الصفحة مهمة جدًا ، والتي سيتم لاحقًا طباعتها ونشرها على الشبكة. في هذه المقالة ، ستتعلم كيفية استخدام Adobe Photoshop لرسم تخطيط كفء لموقع ويب ، على أساسه يمكنك لاحقًا تشكيل تخطيطات أكثر تعقيدًا.
انه ضروري
برنامج أدوبي فوتوشوب
تعليمات
الخطوة 1
قم بإنشاء ملف جديد في Photoshop (Ctrl + N) بأبعاد 1040 × 1400 ، حيث 1400 هو الارتفاع. قم بتشغيل عرض المساطر (Ctrl + R) واضبط وحدات البكسل كوحدات قياس في إعدادات المسطرة.
الخطوة 2
ابدأ في تمديد الأدلة بحيث تلائم حدود مربعات التخطيط. قم بمد الحدود الجانبية بحيث تترك 40 بكسل للحواف. يجب أن تترك الحدود العلوية والسفلية 40 بكسل على كل جانب من حدود الخلفية.
الخطوه 3
ثم حدد دليلاً 200 بكسل لأسفل من أعلى الخلفية للرأس العلوي.
الخطوة 4
لتشكيل الأشرطة الجانبية على يسار ويمين التخطيط ، قم بتعيين الأدلة 240 بكسل من حد الخلفية إلى اليسار ، و 800 إلى اليمين.
الخطوة الخامسة
5 بكسل للداخل من الشريط الجانبي الأيسر والأيمن وارسم دليلين عموديين آخرين. ثم اسحب دليلين آخرين بحجم 245 بكسل إلى اليسار و 795 بكسل إلى اليمين.
الخطوة 6
الآن قم بالقياس من حد الرأس 30 بكسل وارسم دليلًا أفقيًا للقائمة الأفقية.
الخطوة 7
حدد المنطقة الضيقة من القائمة الأفقية التي حددتها للتو بتحديد مستطيل باستخدام المفتاح M. حدد أداة التعبئة واملأ المنطقة بلون رمادي فاتح محايد.
الخطوة 8
حدد أداة التعبئة واملأ المنطقة بلون رمادي فاتح محايد. انقر فوق قائمة "تحديد-تعديل-ضغط" ، وتحديد خيار 1 بكسل وانقر فوق "موافق". املأ المنطقة بظل رمادي فاتح - سيكون لديك إطار قائمة.
الخطوة 9
قم بإنشاء طبقة جديدة وحدد صورة مناسبة لأيقونة الموقع أو الشعار ، ثم افتحه.
الخطوة 10
أدخل صورة على طبقة جديدة في الرأس ، وضعها على الحافة اليسرى. على يمين الصورة ، اكتب عنوان نص الموقع باستخدام أي خط.
الخطوة 11
صمم كتل موقع الويب الخاص بك بنفس نظام الألوان مثل العنوان الذي تم إنشاؤه حديثًا. حدد منطقة الشريط الجانبي الأيسر وقم بإجراء نفس عمليات التعبئة ثنائية اللون عليها كما هو الحال مع كتلة القائمة.
الخطوة 12
افعل الشيء نفسه مع الكتلة العريضة المركزية للمحتوى. انسخ طبقة الشريط الجانبي الأيسر وضعها كالشريط الجانبي الأيمن.
الخطوة 13
أضف نصًا إلى التنسيق الخاص بك - اختر خطًا محايدًا واملأ عناوين القائمة وأمثلة الأخبار والصور والعلامات وقسم الروابط.
الخطوة 14
قم بإنهاء التصميم عن طريق إنشاء "تذييل" أو تذييل - قم بتدوين حقوق النشر الخاصة بك وجهات الاتصال الخاصة بك هناك.
