شرح لافضل برنامج واسهل برنامج في تصميم المواقع

اليكم شرح لبرنامج رائع جداً وظيفته تصميم المواقع بأحترافيه شديده
SITE SPINNER
البرنامج يحتوى على 33 قالب موقع جاهز مصمم مسبقاً ليس عليك سوى التعديل على أحدهم
و أيضاً يحتوى خاصية إنشاء موقع من البدايه
ومن يستطيع التعديل على القوالب يستطيع عمل موقع بالبرنامج من البدايه



لذلك سوف نشرح التعديل على أحد القوالب
قبل الشرح
يمكنكم تحميل التعريب (وهو من تعريبى أيضاً)


الى الشرح:

حمل البرنامج [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
بعد تثبيت البرنامج قم بوضع معلومات التسجيل كما يلى:
VS2368604R19
qzcxjzkqkqfy

المرحله الاولى ( التعرف على البرنامج )

الان وبعد تثبيت البرنامج نضغط على الايقونه التى على سطح المكتب لتشغيل البرنامج

فتظهر لنا نافذة التصميم بالبرنامج كما بالشكل


كما نلاحظ أن البرنامج يحتوى أدوات تصميم سهله وقويه فى نفس الوقت
الان أمامنا خياران:
الاول: أن نبدأ فى التعديل على هذا النموذج الذى أمامنا
الثانى : أن نفتح نموذج أخر (قالب) لنبدأ فى التعديل عليه
وهو ما سنفعله

لفتح قالب جديد
من القائمه FILE نختار OPEN TEMPLATE



فنختار أحد القوالب المتعدده

الان إنفتح القالب المختار كما بالشكل



المرحله الثانيه ( مكونات الصفحه العاديه)

وكما لاحظنا عند فتح القالب أنه يحتوى عدة مكونات وهى:
كتابات (نصوص) TEXT
صور IMAGES
روابط (LINKS )
والروابط قد تكون نصوص أو صور أو ورللأوفر ROLLOVER ( أى زر يتحرك شكله بمرور الماوس عليه)

الان نبدأ فى تعلم كيفية التعديل على النصوص TEXT
بكل بساطه نتوجه الى أى نص نريد التعديل عليه ونضغط عليه دبل كليك DOUBLE CLICK


نجد ان نافذة محرر النصوص قد إنفتحت لنا كما بالشكل



الان نريد حفظ التعديلات التى أجريناها على النص
كل ما عليك هو الضغط على ( SAVE & CLOSE )



الان سيبدأ كل هواة النقد و محترفيه ( وما أكثرهم )
فى إصطناع المشاكل للبرنامج
لأن شكل الكتابه أصبح غير مرتب بهذا الشكل



ولكن لا تتسرعوا
كل ما عليكم أن تعاينوا الصفحه فى المتصفح لتظهر لكم كما ستظهر لزوار الموقع بعد وضعه على الانترنت وذلك بالضغط
على F7
فيظهر لنا الموقع بهذا الشكل



الان ننتقل الى التعديل على الصور
فمثلاً هناك صوره مزعجه جداً جداً جداً وهى الصوره المكتوب عليها أن هذا الموقع مصمم ببرنامج SITE SPINNER وهى توجد فى جميع القوالب



وكل ما عليك هو إزالة تلك الصوره المزعجه بالضغط عليها دبل كليك لأختيارها كما بالشكل


ثم تنفتح لنا النافذه التاليه التى تخبرنا أن هذا العنصر فى الصفحه محمى ( PROTECTED ) ولكن إزالة الحمايه ممنوعه فى الاصدار التجريبى ولأننا أدخلنا معلومات التسجيل
فمن حقنا كل شىء


الان لنقم بإزالة الحمايه من هذا العنصر
كل ما عليك هو أن تضغط على رمز القفل

ليتحول الى رمز المفتاح


الان أصبح بإمكاننا فعل أى شىء مع هذا العنصر سواء تعديله أو حذفه أصلاً

لكن ....أنتظر لحظات
هذا العنصر ليس هو الصوره المطلوبه ولكنه طبقه لونيه من طبقات البرنامج
لأن هذا البرنامج يتعامل بالتقنيه الحديثه المتبعه فى أكبر و أشهر برامج التصميم LAYERS

لا تخاف كل ما عليك هو سحب تلك الطبقه بعيداً قليلاً حتى تظهر بوادر أو أجزاء من الصوره المطلوبه

هكذا قمكنا بإختيار الصوره المزعجه ...


كل ما عليك هو الضغط على الزر DELETE فى لوحة المفاتيح لتخرج لنا تلك الرساله التى تتأكد من حذف العنصر

مبروك إنحذفت الصوره المزعجه

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

الان هناك تساؤل يلح علينا جميعاً
هل كلما أرغب بالتعديل على عنصر سوف أحتاج الى إزالة الحمايه منه بالطريقة المشروحه؟
الاجابه:
لا
يمكنك أزالة حماية جميع مكونات الصفحه دفعه واحده حتى ترتاح
ولكن موضوع الحمايه هذا مفيد فى حالة وجود فريق عمل يعمل على تصميم الموقع TEAM WORK و أنت رئيسهم ولا تريد الباقون بإفساد تصميمااتك أو أجزاء منها
ولكن لو أنت المصمم الوحيد أزل الحمايه من جميع مكونات الصفحه كما يلى
من القائمه EDIT إختار UNLOCK ALL
أو إختصاراً إضغط فى لوحة المفاتيح على ALT مع U


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

الان تناولنا حذف صوره ولكننا لم نتناول كيفية إضافة صوره
بكل بساطه إضغط على هذه الايقونه


أو من القائمه OBJECT نختار IMAGE


كلاهما يؤدى الغرض

الان نختار الصوره من الصور الموجوده لدينا



الان أظن أنه ليس بأسهل من إدراج الصور

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

ننتقل الان الى جزء جديد من الشرح وهو الروابط LINKS
وهى دائماً الجزء الاصعب والاهم عند تصميم المواقع
لأن موقع بلا روابط يسمى DEAD END PAGE أى : صفحه ذات نهايه ميته لا تؤدى الى شىء بعدها
أنواع الروابط :
كتابه
وطريقة جعل الكتابه رابط تم شرحها عندما شرحت التعديل على النصوص
الان ننتقل الى شرح جعل الصور تحمل رابط

لجعل الصوره تحمل رابطاً ( أى عندما يضغط عليها زائر الصفحه ينتقل الى صفحه أخرى داخل أو خارج الموقع )
نضغط على الصوره دبل كليك فينفتح لنا محرر الصور الخاص بالبرنامج
ونضغط على التفرع LINK ونكتب الرابط الذى نريده
مثلاً نكتب [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
ونختار مكان فتح الصفحه سواء فى صفحه جديده BLANK
أو فى نفس الصفحه PAGE
أو نختار وضع الوسم [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] قبل إسم الموقع
~~~~~~~~~
وهى غير مهمه لأن جميع المتصفحات الحديثه تضع [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] قبل إسم أى موقع
فعلى سبيل المثال إذا كتبت فى إنترنت إكسبلورر ( و أنا أعتبره أسوأ متصفحات الانترنت ولا أستخدمه مطلقاً) إذا كتبت [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
فإنه يقوم أوتوماتيكياً بتوجيهك الى [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] وهكذا.......
~~~~~~~~~
أو نختار MAIL TO
أى أن هذا هو رابط أيميل
أو نختار FTP لو أنه رابط إف تى بى الذى أدرجناه
أو نختار ELNET: لو أنه رابط تيلنت

وهذا يظهر بالصوره التاليه


الان إنتهينا من إعداد الروابط

~~~~~~~~~~~~~~~~~~~~~~~~~~~~

الان لدينا خطوه مهمه جداً وتحتاج منا كل التركيز
وهى التعديل على هيدر الصفحه page header

وهو عادة ما يكون فى قوالب هذا البرنامج عباره عن كتابه بخط كبير ألوانها تتناسب مع الوان الخلفيه
هناك من يقول : وما المشكله ...كتابه عاديه نعدل عليها كما عدلنا على الكتابات من قبل
ولكن للأسف هذا هو العيب الوحيد بالبرنامج أنه عند التعديل على الكتابه التى يضعها لنا البرنامج فى الهيدر ( أى فى رأس الصفحه )
فإنها لا تظهر باللغه العربيه بشكل صحيح
إذن فما الحل؟
بسيطه جداً
إمسح تلك الكتابه و إدرج كتابه عاديه من هذه الايقونه


أو من القائمه المنسدله object ونختار text
الان لا حظنا أن المشكله الوحيده هى إدراج title
ويمكننا الاستغناء عنه بالكتابه العاديه



~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
(ملحوظه هذا الجزء الصغير من الشرح للفضوليين أمثالى الذين يرغبوا بمعرفة أسباب كل شىء ولا ضرر إطلاقاً إذا كنت من قليلى الوقت فيمكنك التغاضى عن هذا الجزء الصغير)
الان سوف أشرح لماذا لا ينفع الكتابه باللغه العربيه فى الخاصيه title

لأن مصمموا البرنامج قد صمموه بشكل أساسى ليعتمد اللغه الانجليزيه ولم يتخيلوا أنه هناك مصمموا مواقع عرب ولم يتخيلوا أنه هناك شخص متعب وفضولى بشكل كبير
يسمى دونجوان لا يترك برنامج تصميم مواقع إلا ويشرحه لأخوانه

وقد فعلوا هذه الخاصيه لتستقبل منك الكلمات باللغه الانجليزيه وتحولها عند معاينة أو نشر الصفحه الى جزء من مكونات الصفحه كصوره وليس كنصوص أى ك رسوميات متجهه

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


الان ننتقل إالى جزء جديد من الشرح
وهو إدراج أشكال هندسيه بالصفحه
وذلك من القائمه المنسدله object ونختار أحد الاشكال

فنختار rectangle مستطيل


أو ellipse بيضاوى


أو polygon مضلع


أو splin منحنى curve



~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
ولأدراج جدول
من القائمه object نختار table




أعتقد أنى الان قد شرحت أغلب خصائص ومكونات البرنامج
لم يتبقى سوى تجاربكم الشخصيه
لأن شرح بلا تجارب شخصيه ليس له قيمه
تحميل الربنامج