1. تحتوي كل صورة مصدر psd على ثلاثة أنظمة ألوان، ويجب قص الصور بشكل منفصل وفقًا لنفس المواصفات، ويجب تسمية الصور الموجودة في نفس المنطقة المقطوعة بالألوان الثلاثة بنفس الاسم.
2. أنشئ ثلاثة مجلدات تحمل أسماء الألوان وفقًا لنظام الألوان، ثم ضع المعلومات اللازمة لإنشاء "نظام الألوان" في صفحة ويب في كل مجلد.
3. المحتوى المطلوب الموجود في كل مجلد نظام ألوان: مجلدات الصور، وcss، والرؤوس، والأزرار، وملفات html، وعرضين كبيرين وصغيرين لصفحات الويب؛ ويتم تنفيذ جميع الأسماء وفقًا للأمثلة، ويمكن تسمية المحتوى المخصص بحرية .
4. تخطيط صفحة الويب، تتكون جميع صفحات الويب من الأجزاء التالية:
· الرأس (الشعار، الرؤوس)
· شريط التنقل من المستوى الأول (الأزرار)
· شريط التنقل من المستوى الثاني (الأزرار)
· منطقة محتوى الصفحة (يتم استخدام منطقة المحتوى لـ عرض صفحات الويب الإنجليزية)
· يحدد التذييل (القائمة السفلية، حقوق الطبع والنشر)
المنطقة التي سيتم إنتاجها بناءً على ملف psd، ويجب إنتاج المنطقة المرسومة في الصورة المصدر، والمنطقة غير الموجودة (البعض لا يحتوي على ملف لا يلزم إنتاج شريط التنقل من المستوى الثاني، وبعضه لا يحتوي على تذييل.
5. متطلبات إنشاء ملف html الأول: قم بتسميته html.html. يجب أن تكون الصفحة بأكملها ضمن جدول.
الرأس: يمكن تحويل الرأس إلى خلفية، أو يمكن تقطيع بعض صور الرأس ذات الأشكال غير المنتظمة إلى عدة أجزاء للمعالجة، ويجب تقليل عدد القطع إلى الحد الأدنى. يتم إنشاء منطقة الشعار بشكل منفصل في جدول (يمكن أن يكون عرض الجدول محدودًا)؛ وينقسم الشعار إلى ثلاثة أجزاء: صورة الشعار، واسم الشركة، وشعار الشركة؛ ويجب إدخال 40 حرف W كبير الأحرف، ويحتاج شعار الشركة أيضًا إلى إدخال 40 حرفًا كبيرًا من حرف W
للتنقل على المستوى الأول: يجب ألا يكون المحتوى الموجود في قائمة المستوى الأول (التنقل) في جدول مستقل؛ يجب إنشاء ستة عناصر قائمة من المستوى الأول على الصفحة، وإدخال 20 حرفًا كبيرًا W في كل عنصر (يمكن إدخالها كـ 6 W بالإضافة إلى مسافة)؛ بالنسبة لمخطط psd، قد يحتوي البعض على حالتين فقط)؛ ويجب أن تكون الصورة في كل عنصر والنص في سطر واحد. يمكنك استخدام br لجعلها تظهر في أسطر منفصلة.
التنقل الثانوي (التنقل العمودي): يجب إنتاج المحتوى الموجود في القائمة الثانوية (التنقل) في جدول مستقل؛ ويجب عدم تعيين ارتفاع الجدول وفقًا للعينة؛ ويجب إنتاج 10 عناصر قائمة ثانوية في الصفحة ، أدخل 20 حرفًا كبيرًا من حرف W في كل مشروع (يمكنك إدخاله في شكل 6 W بالإضافة إلى مسافة)؛ تحتاج الروابط النصية إلى إنشاء تغييرين على الأقل لحالة الارتباط التشعبي.
منطقة محتوى الصفحة: أدخل عددًا كافيًا من الأحرف الإنجليزية لتوسيع الصفحة (سيحتوي متصفح IE المستخدم ضمن شاشة مقاس 1024 × 768 على أشرطة امتداد يسارًا ويمينًا)
: أدخل 40 حرفًا كبيرًا على شكل حرف W في منطقة معلومات حقوق الطبع والنشر. للحفاظ على جمال الصفحة، حافظ على مسافة معينة بين المناطق العلوية والسفلية.
القائمة السفلية: يجب إنتاج محتوى القائمة الثانوية (التنقل) في جدول مستقل؛ ولا يمكن ضبط ارتفاع الجدول؛ ويجب إنتاج ستة عناصر قائمة ثانوية في الصفحة، و20 يتم إدخال حرف W كبير في كل عنصر (يمكن إدخاله باستخدام 6 W بالإضافة إلى مسافة)؛ تحتاج الروابط النصية إلى إنشاء تغييرين على الأقل لحالة الارتباطات التشعبية؛ ويجب حجز مسافة معينة بين المناطق العلوية والسفلية لجمالها الصفحة.
6. متطلبات إنشاء ملف html الثاني: قم بتسميته html2.html. انسخ ملف html الأول، واحذف جزءًا من المحتوى الموجود بداخله، واحتفظ بثلاث عمليات تنقل من المستوى الأول، واثنين من عمليات التنقل من المستوى الثاني (التنقل الرأسي)، وثلاث قوائم سفلية، مع ظهور 6 أحرف في كل عنصر؛ واحتفظ بسطرين من اللغة الإنجليزية أحرف منطقة محتوى الصفحة (دون فتح الصفحة).
7. في الحالة المذكورة أعلاه، يجب أن تحافظ الصفحتان على تأثير موحد، ويمكن تكرار الخلفية؛ ويمكن عرض صورة الرأس في المركز أو يمكن توسيعها (قد تحتوي بعض مناطق الرأس على خلفية).
8. يجب أن يستخدم اسم الشركة وشعارها وعنوان صفحة منطقة المحتوى وخطوط القائمة ذات المستوى الأول والثاني خطوط النظام القياسية، مثل Tahoma أو Arial.
9. عند إنشاء دليل القالب، يرجى تحديد خيار "عدم تخزين الصور المصغرة مؤقتًا" في "الأدوات" -> "خيارات المجلد" -> "عرض" حتى لا تحتوي حزمة القالب المضغوطة على ملفات ذاكرة تخزين مؤقت زائدة عن الحاجة.
10. لا يمكن أن يحتوي ملف style.css على أي روابط صور (مثال: صورة الخلفية: url('../images/bg.gif');)، ولا يمكن أن يحتوي على تعريف علامات html (على سبيل المثال، يجب أن يكون هناك لا توجد تعريفات في CSS إذا لتطبيقه، يمكنك كتابته مباشرة في علامة html).
11. يجب أن يكون ترميز مجموعة الأحرف لـ html هو utf-8.
12. يجب أن تستخدم جميع أحجام الخطوط (بما في ذلك أوراق الأنماط وHTML) النقاط (pt) بدلاً من البكسل (البكسل). الحد الأدنى للحجم هو 8pt، على سبيل المثال، حجم الخط: 8pt.
13. لا يمكن للعناصر (div، وما إلى ذلك) الموجودة داخل القالب استخدام الموضع المطلق أو احتواء JavaScript.
14. جميع القوالب لها نفس التأثير في المتصفحات IE، وMozilla، وOpera.
15. يجب أن تكون جميع مسارات الصور في ملف القالب مسارات نسبية. بالنسبة لمسار "اللون"، على سبيل المثال: الملفات الموجودة أسفل الصور باللون الأزرق يجب كتابتها بالشكل < img src=images/xxxx.gif > بدلاً من < img src=blue/images/xxxx.gif >.
16. عندما لا تستطيع بعض ملفات psd الخاصة استيعاب 40 حرفًا كبيرًا وصغيرًا من حرف W، يمكن تقليل خطوط اسم الشركة والشعار، ولكن ليس أصغر من 8 نقاط.
17. يجب أن تملأ القوالب الشاشة بأكملها في الارتفاع، وينطبق الشيء نفسه على تلك التي لا تحتوي على محتوى (بحيث يمكن أن يمتد جزء المحتوى عموديًا).
18. يجب أن يكون لجميع المناطق لون خلفية (حسب صورة psd).
19. لا يمكن أن تظهر أحرف المسافة.
20. يجب إضافة جميع قيم السمات إلى " ".
21. جميع العلامات التي لا تظهر في أزواج يجب إضافتها بـ "/". على سبيل المثال: يجب كتابة <img src=******> بالشكل <img src=******/>