يقوم مصممو الويب المحترفون بتطوير قوالب مواقع الويب ، عادةً في برامج تحرير الرسومات القوية مثل Adobe Photoshop. نتيجة العمل عبارة عن ملف به صورة يتم تقديمه في هذا النموذج للعميل. من أجل استخدام التصميم الجاهز ، أي لتخطيط صفحة ويب ، تحتاج إلى قص القالب.
ضروري
محرر الرسومات النقطية Adobe Photoshop
تعليمات
الخطوة 1
افتح ملف القالب في محرر الرسومات Adobe Photoshop. حدد ملف وفتح من القائمة ، أو اضغط على مجموعة المفاتيح Ctrl + O. في مربع الحوار الذي يظهر بعد ذلك ، انتقل إلى الدليل الذي يحتوي على الملف ، وحدده في القائمة وانقر فوق الزر "فتح".
الخطوة 2
اختر مقياسًا مناسبًا لعرض صورة القالب. استخدم أداة التكبير أو عناصر قائمة السياق. حدد مقياسًا يسمح لك بوضع المؤشر بدقة بكسل. هذا ضروري لتعيين الخطوط المرجعية بدقة.
الخطوه 3
شكل مجموعة من الخطوط المرجعية فوق صورة النموذج. قم بتشغيل عرض المساطر في نوافذ المستندات إذا لم يكن قيد التشغيل بالفعل. للقيام بذلك ، اضغط على Ctrl + R أو حدد View and Rulers من القائمة.
الخطوة 4
حرك مؤشر الماوس فوق المسطرة العلوية لإضافة خط مرجعي أفقي. اضغط مع الاستمرار على المفتاح الأيسر. حرك مؤشر الماوس لأسفل إلى منطقة الصورة. وبالمثل ، باستخدام المسطرة اليمنى ، يمكنك إضافة خطوط أفقية.
الخطوة الخامسة
أضف العدد المطلوب من الخطوط المرجعية وضعها على طول حدود تقسيم مناطق القالب. يجب أن تمر الخطوط عبر جميع الأماكن التي تريد قص القالب فيها. يجب أن تقيد جميع الصور والمناطق المنطقية (الشعار ، رأس الموقع ، القوائم الأفقية والعمودية ، إلخ) التي سيتم عرضها على صفحة الويب.
الخطوة 6
قم بتنشيط أداة Slice Tool. زره على شريط الأدوات العمودي.
الخطوة 7
قم بإنشاء العدد المطلوب من مناطق القطع باستخدام أداة Slice Tool. اختر مقياسًا مناسبًا لعرض القالب. استخدم الماوس لتعيين حدود المناطق. ستوفر الإرشادات المضافة في الخطوة الثالثة تحديدًا دقيقًا لحدود الكائنات التي تقوم بإنشائها. اضبط المناطق الموجودة إذا لزم الأمر باستخدام أداة تحديد الشرائح.
الخطوة 8
قم بتغيير خصائص مناطق القطع حسب الحاجة. قم بتنشيط أداة تحديد الشرائح. انقر بزر الماوس الأيمن فوق المنطقة المطلوبة. في قائمة السياق ، حدد عنصر تحرير خيارات الشريحة. في مربع الحوار "خيارات الشريحة" الذي يظهر ، حدد نوع المنطقة (صورة ، منطقة فارغة ، جدول) ، وضع تعبئة الخلفية ، حدد ، إذا لزم الأمر ، الاسم وعنوان URL الهدف ومحتوى السمة alt="Image" والقيم الأخرى. انقر فوق موافق.
الخطوة 9
قص القالب. حدد ملف وحفظ للويب والأجهزة من القائمة ، أو اضغط على Shift + Ctrl + Alt + S. في مربع الحوار Save for Web & Devices ، حدد التنسيق ومعلمات ضغط الصورة التي سيتم قص القالب إليها. انقر فوق الزر حفظ. سيتم عرض مربع الحوار Save Optimized As.
الخطوة 10
حدد HTML والصور (*.html) في القائمة المنسدلة لنوع الملف ، وفي حقل اسم الملف أدخل اسم الملف حيث سيتم وضع ترميز HTML للقالب. في قائمة الشرائح ، حدد كل الشرائح. حدد دليل الإخراج وانقر فوق الزر "حفظ".
الخطوة 11
سيتم وضع ملف HTML في الدليل الهدف ، وهو في الواقع قالب جاهز لصفحة الويب. سيحتوي الدليل الفرعي للصور على مجموعة الصور التي تم قطع القالب الأصلي إليها.
