• 0

كيف أحوّل تصميم Psd لموقع إلى صفحة مبرمجة html و css؟

مرحبا، لدي تصميم بفوتوشوب لموقع ، وأريد تحويل التصميم إلى موقع حقيقي عن طريق استعمال html و css، هل أجد دورة مخصصة لذلك؟

تمّ تعديل بواسطة محمد بوسكوري

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

تحويل تصميم PSD إلى HTMLوCSS هي مهارة تستلزم العديد من الخطوات المتتابعة للحصول في آخر المطاف على صفحة من موقع مبرمجة بشكل صحيح:

  • كمرحلة أولى يجب عليك استخراج الصور التي ستستعملها أثناء البرمجة، كخلفية لوسم div أو صور لأشخاص، شعار الموقع، الخلفية...
  • بناء البنية الأساسية لملف html:
<!DOCTYPE html> 
<html>
  <head> 
    <meta charset="utf-8" /> 
    <title>Chris Spooner Design Portfolio</title> 
    <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> 
  </head> 

  <body> 
    <div id="container"> </div> 
  </body>
</html>
  • برمجة الوسوم بداخل وسم body بشكل مرتب ومتتابع، حتى تنتج عملاً منظما.
  • ملف css، وهو ملف التنسيق المسؤول عن تنظيم مظهر العناصر داخل الصفحة.
  • يمكنك بعد ذلك التطرق إلى جعله متجاوبا مع أغلب الأجهزة : أجهزة لوحية، شاشات كبيرة.

مصادر:

  1. كيفية تحويل تصميم فوتوشوب إلى HTML/CSS
  2. دروس html5 على الأكاديمية
  3. دروس CSS على الأكايمية.

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن