اذهب الي المحتوي
أوفيسنا

ابو جودي

أوفيسنا
  • Posts

    6,503
  • تاريخ الانضمام

  • Days Won

    167

كل منشورات العضو ابو جودي

  1. السلام عليكم ورحمة الله وبركاته اخى الحبيب جزاكم الله كل الخير واسال الله ان ينفعنا بما علمنا وان يجعله حجة لنا واعلم اخى الحبيب هذا ليس تفضلا منى عليكم فمن علمه الله علم وكتمه الجم به بلجام من نار يوم القيامه نسال الله السلامه والعافية فى ديننا ودنيانا ونسال الله ان يعلمنا ما ينفعنا وينفعنا بما علمنا ويجعل كل اعمالنا خالصة لوجهه الكريم فتكون حجة لنا لا علينا ان شاء الله وكل الشكر والتقدير على شعوركم الطيب ومروركم
  2. كيف يعمل المصمم ؟ اولا:- أول خطوه يقوم بها اى مصمم حول العالم هو عمل لقاء عمل مع العميل وسؤاله عدة أسئله هامة جدا محورها السؤال التالى على العميل - ما هى صناعتك ومجال اعمالك ؟ والاجابه هنا هى مفتاح العمل لان تطور صناعة تصميم المواقع اخذت شكلها الاحترافى منذ ما يقارب 10 سنوات فأصبح لكل مجال ونشاط شكل وفريم محدد لكل صناعه فقد يختلف مكان تواجد القوائم والاضافات ولكن الروح العامه ستجدها واحده لكل مجال . الخطوه البديله اسأل العميل أن يبدأ فى سرد التصور العام لما يريد من موقعه او تصوره عن الشكل الذى يريد موقعه عليه وتناقش ان هذا التصور مع العميل موضحا نقاط القوة والضعف وعرض الاراء الفنية وبعد الاستفاضه فى الحديث قم باخراج ورقه واكتب بها ما توصلتم اليه تحديدآ سواء كانت مكتوبه من طرفك او من طرف العميل لا يهم فالمهم هى ان تكون لهذه الورقه نسخه مع الطرف الاخر فهى ستكون خريطة الطريق لكم جميعآ وستوفر عليكم الوقت الكثير . لماذا ؟ لان النتيجه النهائيه للتصميم ستكون مرتبطه بشكل لصيق لما تم تحديده سابقآ أما اذا انحرف التصميم عما هو مطلوب فيمكن للكل الرجوع لما تم الاتفاق عليه لتصحيح الخطأ سواء كان من العميل أو من المصمم وهذه الخطوه لن تطول كثيرآ بهذه الطريقه لان اى تغير اضافى من طرفك سيكون معلوم للجميع وانت اولهم لذا لن تنتقل للخطوه التاليه الا اذا كنت متأكد تمامآ انك لن ترجع الى التصميم مره اخرى ثانيا :- التدقيق اللغوى : أمر هام جدآ فيجب ان تختار احد الاشخاص من فريق عملك لمراجعة الكلمات المستخدمه بدقه متناهيه خاصة فى حالة استخدام أكثر من لغه على الموقع فأنت لا تريد ان تظهر امام عملائك وزوار الموقع بأن لغتك ركيكه فى الفرنسيه مثلآ مع أنك تقدم احد خدماتك باللغه الفرنسيه وتتباهى بهذا .فأذا اكتشفت هذا الامر بعد رفع الموقع على الانترنت ستجد المبرمج انشغل بمشروع اخر ولن يجد الوقت للتعديل المفاجىء فى الوقت الذى تريده ثالثا:- مشكله تحدث دائمآ فى خطوة البرمجه تجد نفسك بشكل مفاجىء تريد ان تضيف اداه جديده على الموقع ولكن الرد سيكون لك صادم وهو لا نستطيع هذا . أهدء قليلآ وتذكر خطوة التصميم فموافقتك هى صفارة الانطلاق للانتقال المرحله التاليه وهذه المرحله هى أنتقال التصميم من صوره الى مجسم متفاعل تحت يد المبرمج وهنا لا يمكن الاضافه او المسح على التصميم لان اى تعديل سيؤثر على الشكل العام وسيصبح التصميم غير مرتب وفظ للناظريين . أذا تذكر موافقتك على التصميم هى موافقه على الموقع نفسه فأختبارات البرمجه هى خطوه تفاعل ادوات لا أكثر فتريث قليلآ فى خطوة التصميم ولكن لا تطيل فيها رابعا: مراحل الامان والخطر العمر الافتراضى لانشاء موقع الكترونى هو من 3 أسابيع الى 8 أسابيع فأذا تعدى مشروعك هذا الوقت فأعرف انك دخلت مرحلة الخساره الفعليه لوقتك وما يمكن ان تجنيه من الموقع . هنا الخطأ منحصر عند 3 أفراد فقط فأما المشكله لدي العميل لانه يريد تغير على الموقع ويرى انه تغير جوهرى لابد منه ( اذا نسى الموقع المنشأ حاليا ودفع من جديد مقابل مادى للموقع ككل بالاضافه الجديده ) وأما المشكله فى التصميم وهنا يجب ان يكون هناك تفاهم مع العميل بصدر رحب لان المصممين لهم عقليه خاصه يتعاملو من اساسها وهى ان اى تصميم لا يجب ان يخرج على اساس انه قص ولزق بل هو فن ( سمعة المصمم فى اعماله لذا هم دائمآ لا يوافقون على كل التغيرات ) وأما المشكله فى البرمجه وهذه المشكله بالتحديد لها حلول كثيره واذا كنت مبرمج محترف لن تصل الى هذه المرحله ( لا يوجد شىء اسمه مستحيل فى البرمجة ) وبعد الانتهاء من مرحلة العميل والتطرق اليها يأتى دور المصمم قبل البدأ بالتصميم المباشر او التوجه لبرامج التصميم يجب عمل أبحاث بداخل ذهنك عما تريده بالتحديد . حتما أنت لا تعرف بنسبة 90% ما تريده عند بدء التفكير فى شكل موقعك لذا ابحث عن مواقع عن نفس مجال ما تريد تصميمه بالتحديد او مجالات مشابهه بشكر كبير لمجال عملك فهنا الاستفاده ليست لعمل مسح افقى لمنافسيك إنما لمعرفة كيف تبدو مواقعهم وما هى الالوان المستخدمه والاضافات المدرجه على الموقع وكيف تم ترتيب المنتجات والخدمات وهذه الخطوه يجب ان تكرر مرتين على الاقل وكل مره منهم يجب الخروج بـ 1 او 2 موقع من اكثر ما استراح لهم عينيك او محببين لك من ناحية التصميم او الترتيب وبعد ذلك أخرج ورقه بيضاء وقلم رصاص وأرسم من مخيلتك بشكل كروكى ما هو - شكل الجسد العام للموقع من مكان البانر واللوجو - أين تريد قوائم المنتجات ومكان عرض صور المنتجات العامه - ماذا تريد ان تركز عليه نظر الزائر - هل الجزء السفلى به ادوات اضافيه ام سيكون نسخه من الروابط باعلى الموقع هذه الخطوه لا تنظر لها باستهتار أو انها مرهقه وتأكد من حرسك عليها حتى تكون مصمم ناجح بعد ذلك تعرض الشكل الكروكى الذى رسمته للموقع على العميل وتاخذ رايه النهائى وتاتى بعد ذلك مرحلة الفوتوشوب مرحلة الفوتوشوب هنا اقصد بها العمل على تصميم الموقع برسمه داخل برنامج الفوتوشوب بالالوان والادوات اى تجسيد الرسم الكروكى النهائى الذى تم الاتفاق الكلى مع العميل عليه وبعد الانتهاء من تصميم الفوتوشوب يتم عرضه مره اخرى على العميل وتكون هذه هى المرحله الاخيره بالنسبه للعميل حتى يتسلم الموقع بعد ذلك الى اللقاء فى الحلقة القادمة ان شاء الله مع الفوتوشوب فور ويب لنتعلم كيفية تجسيد واخراج شكل التصميم للموقع من الشكل الكروكى من على ورقه بتصميم فوتوشوب امممممم طبعا محتاج اكمل بعد كده فى جروب على الفيس بوك لرفع الاعمال سواء من قبلى او من قبلكم عليه لان المساحه الخاصة بالمرفقات هنا قليلة جديدا ولن تساعدنا فى العمل ولكن اولا اتواصل مع ادارة الموقع هل اجعل اسم الجروب باسم الموقع ويكون تحت ادارة الموقع ام لا واوافيكم ان شاء الله بالرد فى المشاركات المقبلة ملاحظة هامه جدا العمل على الجروب سيكون فقط لرفع الاعمل والاحتفاظ بها اما الشرح والنقاش سيكون من خلال الموضوع هنا فى المنتدى
  3. مقاييس تصميم صفحات المواقع إن مثل هذه المقاييس ضرورية في ظل وجود الخيارات العديدة المتوفرة على الإنترنت . فعلى سبيل المثال يقوم العديد من زائري المواقع الإلكترونية بإغلاق نوافذ الرسوم , وذلك من أجل تسريع عملية تنزيل الصفحات على الشاشة , إذن نجد أن من الضروري وجود خيار نصي يغني عنها . إن وسائل القراءة الصوتية الخاصة لمساعدة ذوي المشاكل البصرية , تقوم أيضاً بقراءة خيارات النص تلك, وكذلك الحال بالنسبة لمواقع المكتبات القائمة على أساس النص. كما قد تم إيجاد تكنولوجيات متنقلة جديدة تعتمد على النص بشكل أكبر , وهي تتضمن أمور مثل المفكرة الشخصية الرقمية , الهواتف الخلوية ?الخ. إن ما يلي يوضح سبب ضرورة التصميم الناجح والمرن على الشبكة الإلكترونية ,وكذلك السبب الذي من أجله تم صنع هذا الدليل. أجب عن عدد من الأسئلة الأساسية بهدف التركيز: من سيقوم بزيارة موقعي الإلكتروني ! ... ولماذا ؟ قم بالكتابة لهم بشكل خاص. قم باستعمال مفردات مناسبة أو وضحها بالتعريف. قم باستعمال مفاهيم عريضة للمفهوم الخاص بك قبل أن تقوم بتطوير موقعك وذلك كي تتجنب البعد والتشتت عن الفكرة الأساسية. قم بتشكيل / تصميم / صفحة قياسية أساسية للموقع الإلكتروني: لا تفترض أن الشيء الذي تراه أنت هو ذات الشيء الذي سيراه المستخدمون الآخرون. يوجد القليل من الثبات ما بين المنصات التي تنطلق منها المعلومات , أحجام الشاشات, الألوان وأنواع الحروف الموجودة أصلاً كخيار أول في البرنامج , وكذلك حتى في أذواق الأفراد بخصوص تصفح الإنترنت. ضع في اعتبارك الحيِّز الحقيقي للشاشة. ضع المعلومات الأكثر أهمية إلى أعلى يسار الشاشة . لا تفترض حلول بخصوص الشاشة أو تفترض حجمها. قم بتسهيل الإطلاع: إن غالبية المشاهدين ( حوالي 75%) يقومون أولاً بالإطلاع على النص والقوائم للحصول على المعلومات ( ويقومون بتجاهل الصور) . قم بالتقليل من التفاصيل والعناوين الفرعية في الصفحة الأساسية , ( أقل من 20% يقومون بالقراءة التفصيلية كلمة كلمة ). اجعل العرض والتصفح عادياً من حيث المقاييس: قم بوضع الشعارات , القوائم , والصفات في مواقع ثابتة وبالإمكان توقعها. قم باستعمال (وصلة العودة إلى أعلى) في نهاية الصفحات الطويلة . بشكل بديهي قم بتسمية الروابط / الوصلات حسب المضمون والـ (URL) الخاص بالصفحة . قلل من وجود المساحة البيضاء على صفحات القائمة الأساسية. إن هذه المسألة تسلسل وتسهّل عملية البحث. قم ببناء المضمون من خلال صفحات متصلة. إن الصفحات الموصولة يجب أن تكون ثلاثة أو أقل ضمن الموقع. ويجب دائماً أن يعرف الزائرون أين هم على الموقع ( أين يتواجدون على موقعك) , وأن يكونوا قادرين على الرجوع أو نقطة البداية . اجعل النص سهلاً للقراءة ( انظر إلى الدليل الخاص بالكتابة لموقع إلكتروني ) استعمل بحرية كل من النشرات القصيرة , العناوين , العناوين الفرعية , وحجم الحرف . وقم بفصل أجزاء النص بواسطة مساحات بيضاء . لا تملأ الشاشة بالنص : اي اجعل أجزاء النص تقع في الوسط وأن تكون محاطة بحاشية يسري وحاشية يمنى ومقسمة إلى أعمدة . أشكال الحروف : قم باستعمال أنواع الحروف العادية أو الحجم الشائع استعماله , هذا إن لم تستعمل نوع الحروف الموجودة اصلاً كخيار أول في البرنامج . إن استعمال البنوط المناسبة للحروف التي تظهر على الشاشة يحكمها قياس الشاشة ودرجة الوضوح عليها . ومن أجل أكبر قدر من سهولة الوصول , فإن حجم الحروف يجب أن يكون ملائماً بكشل نسبي , بدلاً من أن يكون ثابتاً أو مطلقاً في حالة الثبات. فإن أصغر حجم للحروف يجب أن يكون 10 ( PC) أو 12( Macitosh) أومتوسط أو " 3". قم باستعمال حجم كبير من الحروف في المواقع التي تخاطب الأطفال الصغار وكبار السن. لقد أظهرت الأبحاث وجود اختلاف بسيط من حيث سرعة القراءة أو مسألة التفضيل عند استخدام أحجام وبنوط مختلفة . قم باستعمال نوع واحد من البنوط لتوضيح , الاتجاهات والتجوال , وقم باستعمال بنطاً آخر للمضمون . لا تقم باستعمال أكثر من نوعين من البنوط ضمن نفس الموقع. تجنب أنواع الحروف ذات الأشكال ( الملونة , التي تظهر وتختفي , التي تبدو وكأنها انفلتت من لفافة ) ففي أغلب الأحيان هذه الحروف لا تحقق عرضاً مناسباً, أو أنها تعتبر مزعجة. استعمل الألوان بحكمة : إما أن تقوم بتحديد نوعية كل الألوان أو لا تفعل ذلك مع أي منها . إن عدم تحديد أي منها سوف يتعارض مع ترتيبات البرمجة الخاصة بكومبيوتر الزائر. في حين أن قيامك بتحديد بعض الألوان فقط , سوف يجعل الآخرين يعيدون ترتيبات البرمجة على أجهزتهم , وهكذا فإن ألوانك المحددة قد تكون مجموعات أو خلطات غير جميلة مع تلك الترتيبات الأصلية. قم باستعمال ألوان تختلف عن بعضها البعض بشكل كبير وذلك بالنسبة للون الخلفية من جهة ولون النص من جهة أخرى . ومن المفضل أن تكون الخلفية فاهية (فاتحة) اللون وأن يكون النص داكن اللون. تجنب الخلفيات التي تؤثر سلباً على وضوح النص. استعمل لوحة ألوان آمنة للمتصفح وتتألف من 216 لوناً. إن هذه الألوان تتسم بالمقاييس المألوفة لجميع المتصفحين . الصور: إن الصور يجب أن لا تتجاوز 75 وحدة من وحدات تشكيل الصورة للبوصة الواحدة (Pixels) . إن هذا هو الحد الذي بالإمكان توصيله عبر الإنترنت . أما ما يزيد عن ذلك فسوف يؤدي إلى تبطيء عملية التنزيل على الجهاز, دون أي زيادة على مدى الرؤية. قم باستعمال ملفات الـ ( JPG) وذلك للصور الفوتوغرافية ومن مثل تلك التي تحتوي على ألوان مظللة . في حين قم باستعمال ملفات ( gif) للصور مثل الأشكال ذات المجالات الملونة الواسعة والثابتة . نظام بديل يتكون من الرموز . وهو عبارة عن نص وصفي يحل محل , ويصف مضمون أو وظيفة ودور جميع الصور. إن هذا النظام يلائم ذوي المشاكل البصرية . وكذلك يلائم أولئك الذين يقومون بإغلاق أو إلغاء الصور في وسيلة تجوالهم. وكذلك فإن هذا النظام مفيد في مجال وسائل التجوال الخاصة بوصلات المكتبات , وكذلك للوسائل ذات الأساس الرقمي. تجنب عرض الصور على أنها وصلات . أما إذا كان ذلك ضرورياً , فإن النص البديل يجب أن يصف محتوى الصفحة الموصلة . تجنب الإشارة إلى الصور على أنها نص . بشكل ديكور أو غير ذلك فقد تتحقق قيمة بصرية ضئيلة في حالة وجود حجم نسبي للنص كما وصفنا أعلاه. تجنب استعمال الصور الشفافة أو الصور ذات الـ ( Gif) المؤلفة من وحدة واحدة ملونة من الأجزاء التي تتكون منها الصورة على الشاشة دون وجود سبب جيد لعمل ذلك. إن بعض الناس يقومون باستعمال هذه الوسائل كحشوات للوصول إلى شكل ترتيب الصفحة . ينتج عن ذلك أنهم يعملون صفحات لا يمكن استعمالها من قبل الزائرين الذين يتجولون وهم يغلقون برنامج تنزيل الصور. قم باستعمال القوائم كي تشكل عرضاً أو تصميماً , ولكن : قم بتحديد عرض القوائم وخلايا القوائم بنسب مئوية , وليس بالوحدات المطلقة لأجزاء الصورة على الشاشة. بشكل عام فإن الصفوف الأفقية يجب أن تتقلص أو تتمدد لتلائم حجم الشاشة . إن الصفوف الأفقية ذات العرض الثابت لا تتطابق في الكثير من الأحيان مع أحجام الحروف المكبرة. كما أن الصفوف ذات العرض الثابت قد تملي وتحدد المساحة العمودية على الشاشات الصغيرة . تجنب وضع القوائم مع الفقرات أو خلطها مع النصوص . تجنب السطور المتعددة من النص في خلايا عبر الصفوف بقراءة السطر العلوي عبر الصف الأفقي , قبل أن تتوجه إلى السطر الثاني الذي يقع في الأسفل منه. الوصلات: كن جيداً في الوصف قدر الإمكان عندما تقوم بوصف مضمون وصلة ما. قم بترك فراغ ثم ضع إشارة العمود ثم فراغ , وذلك للفصل ما بين الوصلات التي تأتي بشكل متتالي. لا تستعمل عبارات مثل "اضغط هنا" , "أدخل". تجنب الصور المستعملة كوصلات , فمن الصعب من ناحية الإبصار الإنتباه إلى كونها وصلات. تجنب أسلوب الإنسياب المستمر (Roll Over) للقوائم النازلة من الأعلى إلى الأسفل, إذ أنه من الصعب من ناحية الإبصار معرفة ما إذا كانت هذه القوائم تحتوي على وصلات . كما أنه من الصعب تقديم وصف كافٍ لمحتويات الوصلات. تجنّب: البراويز أو قم باستعمال بديل ليس له إطار. برمجة الجافا (Java) والفلاش (Flash) حيث كان ممكناً. الأشكال التي ليس لها فائدة حيث إنها تشد الانتباه بعيداً عن المضمون. الأشكال التي تفتقر إلى الأعلى وإلى الأسفل , والتي تبرم , والتي تدور أو التي تتحرك بشكل عام دون أن تكون ذات أهمية من حيث القيام بدور توضيحي للمضمون. النص المطول الذي يبدو على الشاشة وكأنه انفلت من لفافة . شاهد الصفحات الخاصة بك: مستعملات ترتيبات برمجة تقوم على أساس الأبيض والأسود وذلك للتأكد من إمكانية وصول ذوي مشكلة عمى الألوان. إلغاء الصور , للتأكد من إمكانية وصول ذوي المشاكل البصرية , وكذلك إمكانية وصول التكنولوجيات الخالية من الصور. قم بالمشاهدة بواسطة بدائل من وسائل التجوال (Linux , Macintosh , PC... الخ) قم بالمشاهدة بواسطة بدائل من وسائل التجوال (Internet Explorer , Netscape , Opera , Linux). قم بالمشاهدة بواسطة بدائل من أحجام النص والـ (Windows).
  4. انواع مواقع الانترنت للوهله الاولى قد يبدو اننا نتحدث عن انواع مواقع الانترنت من حيث طبيعتها ومن المؤكد انه من الصعب جداً حصر انواع المواقع بهذه الطريقه فهناك مواقع تجاريه وعلميه وسياحيه وشخصيه والكثير من الانواع الاخرى التى لا يسع الحديث لسردها هنا، اما المقصود هنا بأنواع المواقع فهو تصنيفها من زاويه اخرى تماما وبمعنى اصح سنقوم بتصنيف انواعها من الزاويه الفنيه او التطبيقيه، والواقع ان للمواقع ثلاثه انواع رئيسيه وهم . 1- مواقع الانترنت الساكنه. 2- مواقع االانترنت الدينامكيه. 3- مواقع التجاره الالكترونيه. 1- مواقع الانترنت الساكنه static web site : وهى مواقع الانترنت العاديه التى تحتوى على نصوص وصور وغيرها من وسائل العرض النصيه والجرافكيه الثابته والمتحركه طبقا لمحتوى الصفحات وفكرة وهدف الموقع الا ان هذا النوع من المواقع لا يحتوى على امكانيه تغير بياناته بطريقه ديناميكيه متغيره او قاعدة بيانات database يمكن تحديث البيانات من خلالها , حيث يتطلب تغيير اى معلومة او صورة باستخدام ادوات ولغات تطوير المواقع ثم اعاده نشره على الانترنت مره اخرى وبالطبع فإن عدد صفحات الموقع غير محدود ويمكن اضافه المزيد فى اى وقت طبقا للمحتوى المطلوب للموقع . 2- مواقع الانترنت الدينامكيه Dynamic web site : ويعتبر هذا النوع من المواقع اكثر المواقع تطوراً من المواقع الساكنه حيث يسمح بتغير او اضافة او حذف اى معلومات او صور من صفحاته وجداوله بسهولة تامة من قبل صاحب الموقع او المسئول عنه فى اى وقت يشاء وبأى عدد من المرات دون الرجوع الى مصمم الموقع او الشركه التى قامت بتصميمه، ويتم ادخال واظهار المعلومات وجداول البيانات والصور الموجوده بصفحات المواقع الدينامكيه من خلال قواعد بيانات databases كبيرة تسمح بالاضافه والتحديث المستمر للصفحات ولهذا اطلق عليها المواقع الدينامكيه، ويقوم صاحب الموقع او المسئول عن ادارته بتحديث بيانات الموقع من خلال لوحة تحكم مؤمنة دائما بكلمة سر لا يعرفها سوى مسئول ادارة الموقع . 3- مواقع التجاره الالكترونيه e-commerce : وهى بالطبع اكثر مواقع الانترنت تطوراً وأهمها من الناحيه التجاريه، وتعد مواقع التجارة الالكترونية بمثابة محال وشركات تعمل على بيع منتجاتها وخدماتها من خلال الويب والانترنت باستخدام طرق دفع اليكترونيه عبر الشبكة ثم توصيل المنتج او الخدمة بعد ذلك للمشترى فى مكانه وتقوم فكرة مواقع التجارة الالكترونية من الناحية العلمية على انشاء موقع ديناميكى يحتوى على كتالوج اليكترونى او صفحات تشرح المنتجات او الخدمات التى تقدمها الجهة صاحبة الموقع مع السماح للمتصفح باختيار ما يرغب منها للشراء ودفع ثمنها باستخدام كروت فى ارسال او شحن المنتجات او الخدمات المطلوبه للعميل المشترى فى مكانه .
  5. السلام عليكم ورحمة الله تعالى وبركاته متابعينا الكرام الحلقة الثانية ان شاء الله رب العالمين من الكورس الخاص بتصميم مواقع الانترنت عنوان الحلقة اليوم User Interface UI / Web Design وسننظر ونلقى الضوء اليوم على User Interface UI / Web Design واجهة المستخدم من منظور مهم جدا جدا جدا ان الحقيقة الأساسية التي تكمن في نجاح أي موقع هي واجهة المستخدم او واجهة الاستخدام - User Interface - لذلك الموقع وهي النقطة التي يجب ان تؤخذ بعيين الاعتبار لدى أي مصمم ويب ولأن المستخدم لا يرى في هذا الموقع سوى واجهته ولكي تلقي الواجهة ناجحا وحتي تصبح مرغوباً بها لدى أي مستخدم يجب ان تتوافر فيها بعض المميزات والخصائص يمكن تلخيصها بالنقاط التالية: – 1- الدلالة الواضحة Clear Indication : – تعريف الدلالة الواضحة بشكل مختصر هي ما يدلّ على المراد منها بنفس صيغتها من غير توقف على أمر خارجي. تكمن طريقة معرفة مضمون الموقع من خلال زيارته للصفحة الرئيسية مباشرة. وهذا ما يسمى للوقع دلالة واضحة وهي أحد النقاط المهمة التي تعطي جانب إيجابي لواجهة المستخدم. ان انطباع الدلالة الواضحة يظهر بشكل فعال في الموقع الذى يتم تصميمه من الصفحة الرئيسية للموقع على سبيل المثال لو نريد تصميم موقع لتعليم لغات تصميم فيتحتم على المصمم ان يظهر دلالة الموقع فيتبين للمستخدم مباشرة انه موقع تعليمي للغات الويب وهذا هو مضمون الموقع فعلا وهذه احدى الطرق الذكية التي تجعل من التصميم هادف الى المضمون الدال علية. 2-الهيكلية The structure principle: – تنظيم واجهة المستخدم بشكل بسيط وهادف وبطريقة جدية ومفيدة مبنية على أساس نماذج واضحة ومنسقة بحيث تكون هذه النماذج مرئية يمكن للمستخدم تمييزها بسهولة. كما ينصح بوضع الأشياء التي ترتبط مع بعضها البعض في مجموعات ويفضل أيضا فصل الأشياء الغير مرتبطة مع بعضها ان الطريقة التي يمكن من خلالها وضع هيكلة المواقع يجب ان تكون على أساس مخطط تنظيمي يوضح عدد الوظائف او الحالات او المهام التي يحتويها ذلك الموقع. 3-اتباع قاعدة التباين Follow the contrast rule فن استخدم الألوان في التصميم من المراحل المهمة جدا بعطاء واجة المستخدم رونق اكثر ومن اهم أساسيات انتقاء الألوان قاعدة التباين بحيث يجب التأكد ان الألوان لن تغطي على النص وتجعله غير واضح او غير مقروء فيمكن اختيار لون غامق في كتابة النص واختيار خلفية فاتحة للكتابة عليها او العكس حسب رؤية المصمم فالنص الرصاصي الغامق المكتوب على خلفية بيضاء يكون واضح جدا للمستخدم فيما لو كانت الخلفية سوداء سيكون قراءته امر صعبا جدا . 4-تجمع العناصر Intuitable Design من المهم في تصميم الواجهة ان يتم تجمع العناصر التي ترتبط منطقيا مع بعضها البعض حتى يسهل الوصول اليها وذلك لتسهيل عملية وصول المستخدم اليها ففي اغلب الأحيان يتم عادة استخدام تلك العناصر مجتمعة مع بعضها لتنفيذ مهمة معينة. 5 – قابلية التصميم للتخمين Intuitable Design:- اذا كان المستخدم لا يعرف كيف يستخدم الواجهة فان التصميم الجيد للواجهة يساعد المستخدم على التوقع او التخمين وما يجب علية فعلة لتنفيذه وهي نقطة مهمو جدا وتسقط لدى اغلب المصممين . بعض النصائح التي يجب ان تؤخذ بعين الاعتبار عند التصميم يجب على مصمم الواجهة وضع ما يلي في الحسبان حينما ينوي تصميم واجهة مستخدم 1. دليل المستخدم غير متوفر للمستخدم 2. في حالة توفر دليل المستخدم، فإن المستخدم لا يقرأه 4. المستخدم لا يحب أن يقرأ خطوات انشاء موقع على شبكة الانترنت: هنالك خطوات يجب علينا معرفتها قبل التفكير ببناء الموقع وهي علي النحو التالي الخطوة الاولي : فكرة الموقع وهي التخصص او الاهتمام الذى سوف يتم انشاء الموقع علي اساسة الخطوة الثانية : اسم الموقع وهى اختيار اسم مناسب للموقع يتناسب مع فكرة الموقع الخطوة الثالثة : مستلزمات التصميم وهى المواد المعلموماتية و المواد البرمجية التى سوف تحتاج اليها لكى تساعدك في انشاء الموقع و تنقسم الى عدة اقسام أ. سوف تحتاج الى الصور و الخلفيات الفيديوهات ب. برامج تصميم الويب و هنالك نوعان منها برامج الجرفيكس و برامج الاكواد البرمجية الخاصة بتصميم صفحات الويب ايا كانت اللغة البرمجية التى تكتب بها و البرامج المتداولة فى تصميم الويب 1.الفرونت بيدج - والويب اكسبريشن - والدريم ويفر , وغيرها الكثير والكثير والكثير من البرامج هذا يختص بتصميم الاكواد 2.الادوب فوتوشب لتصميم الجرافيكس كما لا انصح بالارتكاز على برنامج بعينه فخذ من كل شجرة ثمره جـ. خبره فى التعامل مع هذه البرامج الخطوة الرابعـــة : حجز المساحة على الويب الخطوة الخامسة : ابدأ فى تصميم الموقع الخطوة السادسة : بعد الانتهاء من تصميم موقعك ارسل ملفات الموقع الى مساحتك على الانترنت
  6. دومـاً إجعل لـ كلماتك وروداً تهبـط على النـاس من حولك فيكون لها شذاً طيبـاً يسعـدهم ... ولا تجعل لها أشواكـاً تؤلمهم فأنت رائع حين تتجاهل من يسيء إليك وكريم حين تأخذ أحزان غيرك وجميل عندما تبتسم وفي قلبك حزن عظيم ولا تحمل هم المستقبل فإنه بيد الله، فقط إحمل همًا واحدًا كيف ترضي الله ؟ لأنك لو أرضيت الله : رضي عنك وأرضاك وكفاك وأغناك
  7. طبعا هذا الكلام مستحيل فى عالم البرمجه لان لو عدلت الكود ليقبل بعدد اتنين رابط او اكتير عند معالجة الكود لتنفيذ الامر يقرأ الامر الاول فقط وينفذه دون الباقى تقبل تحياتى ولا تهدر وقتك فى البحث عما لا يفيد ممكن تعمل صفحة منبثقه تحتوى على صورتين او رابطين اعتقد ده الشئ الوحيد اللى ممكن تعمله او انك تروح للرابط الاول وبعدين من الرابط الاول تتوجه للرابط الثانى وعمليا ده مش حيكون كويس
  8. طيب هو ممكن حضرتك ترفقى المثال اللى حضرتك شغاله عليه وتشرحى زر الامر اللى حضرتك عاوزه الكود ده عليه مفرروض يعمل ايه ان بصراحه مش قادر افهم
  9. لا تخن من خانك فقط انتظر حتى يعطيك ظهره واكتب على ظهره كان بإمكانى الخيانة ولكن لا تسمح لى اخلاقى بهذه الاهانة
  10. طيب متابعينا الكرام اللى حابب يشتغل بالسيرفر المحلى اللى نقدر نفعله بالويندوز بدون قواعد بيانات لحد ما ننتهى من تعلم تصميم الصفحة الرئيسية + باقى صفحات الموقع يبقى تمام يفعل زى ما سبق شرحه اللى حابب يصطب برنامج سيرفر محلى علشان لما نحتاج لقواعد بيانات يبقى تحت امركم وفى الحاله دى ننسى الشرح اللى فات ونسطب برنامج اسمه wamp ده الموقع الرسمى للبرنامج http://www.wampserver.com/en/ طبعا فى تحميل للنسختين 64Bit , 32Bit الروابط المباشر للتحميل 32Bit http://cznic.dl.sourceforge.net/project/wampserver/WampServer%202/Wampserver%202.5/wampserver2.5-Apache-2.4.9-Mysql-5.6.17-php5.5.12-32b.exe 64Bit http://cznic.dl.sourceforge.net/project/wampserver/WampServer%202/Wampserver%202.5/wampserver2.5-Apache-2.4.9-Mysql-5.6.17-php5.5.12-64b.exe برجاء التركيز اللى عنده ويندوز 32 بيت ينزل الوامب سيرفر الخاص بـ 32 بيت اللى عنده ويندوز 64 بيت ينزل الوامب سيرفر الخاص بـ 64 بيت برجاء الاتى تحضير البرامج التالية لكل متدرب Adobe Photoshop CC Adobe Dreamweaver CC wampserver اللى يواجه مشكله فى تحضير او تصطيب البرامج يبلغنى وانا تحت امركم ان شاء الله
  11. ممكن تتابع العمل على استضافة حضرتك بدل السيرفر المحلى عادى لكن هتواجه الاتى اولا هتحتاج كل شوية ترفع الملفات اللى انت عاوز ترفعها او تضيفها وهتحتاج كل شوية تعدل وده يلزمه وجود الانترنت بصفة مستمره ممكن السرعه تأثر عليك شوية لو النت بطئ تانى شئ والاهم بالاسلوب ده هتستنزف الباندويث او الترافيك الخاص بك على الفاضى ثالث شئ ولا تزعل تحت امرك نلغى الاكسس لو حابب ونشتغل sql *_^ انت تأمر يا باش مهندس
  12. البداية بتفعيل سيرفر محلى لعرض الشغل بتاعنا لان من غير سيرفر محلى ما نقدر نعرض الشغل كما نقوم بعرضه على الويب تفعيله لا يؤثر اطلاقا على المساحه ولا اداء الجهاز وممكن نبدا بهذا السيرفر لعرض اعمالنا ومتابعة تصميمها حتى الانتهاء ثم نستخدم احد برامج السيرفر المحلى عندما نريد ربط اعمالنا بقاعدة بيانات
  13. إننا نعيش لأنفسنا حياة مضاعفة حينما نعيش للآخرين وبقدر ما نضاعف إحساسنا بالآخرين نضاعف إحساسنا بحياتنا ونضاعف هذه الحياة ذاتها في النهاية ,لقد تعلمنا في المدرسة ونحن صغار أن السنبلة الفارغة ترفع رأسها في الحقل وأن الممتلئة بالقمح تخفضه فلا يتواضع إلا كبير ولا يتكبر إلا حقير
  14. انا مش فاهم او هحاول افهم حاضر وابحث فى النقطه دى لكن على كل حال تسهيلا على الاخوة وعلى اساتذتنا انا هارفع مثال الاخ الكريم MostafaSaleh هنا ع المنتدى att.rar
  15. السلام عليكم ورحمة الله وبركاته انا معكم باذن الله استاذنا رضوان حسب الوقت المتفرغ فى اليوم ان شاء الله <<-------< عباره مقتبسه من اخويا محمد والبريد انا اصلا ظاهره فى بياناتى مش مخفى soul-angel@msn.com ولى عظيم الشرف الانضمام لتلك الكوكبة فى هذا الصرح الشامخ
  16. ارفق مثال لو تكرمت ليتم التعديل كما تريد وبناء على المثال يتم الشرح وما تم تعديله على المرفق الخاص بكم ان اردتم الشرح
  17. امممم انا بدأت الدورة فى موضوع مختص بيها ان شاء الله هتلاقوا الموضوع موجود هنا فى القسم http://www.officena.net/ib/index.php?showtopic=60025 بس لى رجاء ممكن نحاول نوفق يوم ووقت نجتمع فيه مع بعض فى نفس الوقت ان شاء الله لسرعة التواصل لان هنحتاج ده فى المحاضرات القادمه بامر الله رب العلمين لان انا هاعتمد فى الشرح على الاسلوب العملى والخاص بورش العمل لذلك الموضوع بالنسبه لى مش عرض شوية كلام نظرى ونجرى وخلاص اختاروا الوقت اللى يناسبكم وبلغونى واحاول اظبط مواعيدى عليكم بامر الله اتمنى يكون بالليل وياريت لو يكون يوم خميس علشان لو سهرنا وطولنا يكون صابحين اجازة ان شاء الله اممممممم فى شئ مهم كمان انا للعلم مجرد هاوى فقط لا غير انا فى الاساس مهندس كيميائى تمام بس بفضل الله عندى معلومات لابأس بها ونستنتج من المعلومه دى شئ مهم جدا جدا جدا انا اسلوبى مش حيكون الطريقة النمطية اللى معظم الناس بتسير بيها انا بأمر الله هأعطيكم خلاصة المعلومات بابسط الطرق واسرعها واللى توصل للنتيجه المرجوه بامر الله شئ مهم كمان انا اول مره فى حياتى باعمل الكلام ده يعنى مش عندى ميديا جاهزة انا باحضر لحضراتكم الدروس يوم بيوم وباحضر الميديا وقت التحضير للمحاضره سوء كان صور او لو احتاجنا لفيديوهات لذلك ان شاء الله اتحماونى لان مش بأنقل من ارشيف جاهز عندى او من اى مصادر ان شاء الله رب العالمين لو ساعدتونى كويس وعد على ما ننتهى من الكورس ده بالطريقة اللى انا راسمها فى خيالى اوعدكم كل واحد من المتابعين حيكون قادر على الاتى 1- تجهيز شكل الموقع بالفوتوشوب بالمقايس القياسية والتى تناسب جميع الاجهزة حتى الموبايل والتابلت 2- تصميم الصفحة كامله بالتكويد بكتابة الكود الخاص بـ HTML , HTML5 يدويا وليس استخدام واجهة التصميم 3- كتابة اكواد CSS , CSS3 يعنى ان شاء الله هنعمل مع بعض موقع احترافى من الصفر وممكن لو امكن الوقت وربنا يسر لنا نربط الموقع بلوحة تحكم الوردبريس للتحكم الكامل بكل كبيرة وصغيرة بالموقع
  18. اولا انا شايف ان الملفات مش كامله اللى تخص اللوحه وعلشان كده مش قادر احكم العطب فين او ايه المشكله اللى بتواجه حضرتك ثانيا لو حضرتك بتتكلم على سيرفر مدفوع فقط ارفع الملفات الى السيرفر من خلال اى برنامج ftp اممممم طبعا مش تنسى دى لوحة تحكم يعنى لها قاعدة بيانات من خلال الموقع الخاص بحضرتك هتعمل قاعدة بيانات خاصة بيها ولو عندك ع االسيرفر الشخصى كل شئ تمام زى ما حضرتك بتقول خد باك اب وازرع الباك اب على السيرفر المدفوع تقبل تحياتى بكل الحب والود اخوك محمد اعتذر عن التاخير فى الرد نظرا لظروف عملى
  19. للإجابة على هذا السؤال علينا إسقاطه على ثلاث نقاط أساسية لنخلص بعدها إلى جواب علمي مرتكز على معايير واقعية وليس على أهواء وميولات. - النقطة الأولى: التكلفة Cost: معلوم ان لغة PHP لغة مجانية، ويمكن تشغيلها على مختلف انظمة التشغيل من Windows و Mac و Linux، إضافة إلى أن استضافة المواقع والتطبيقات المبرمجة بها متوفرة ومتاحة بكثرة وسعرها مناسب جدا. بينما تقنية ASP.Net تابعة لشركة ميكروسوفت، وهي ليست مجانية وإنما مدفوعة، ويا ليت الأمر يتوقف عندها بل إن التكاليف مستمرة، خصوصا أن المواقع والتطبيقات المبرمجة بتقنية ASP.Net لا تشتغل إلا على الويندوز وهو منتج مدفوع، أضف إلى ذلك أن بيئة التطوير الخاصة ب ASP.Net وهي الفيجوال ستوديو مدفوعة أيضا وليست مجانية، إلا في حال أردت أن تشتغل على بيئة Mono Project على نظام Linux و Mac أو تشتغل على النسخ Express من الفيحوال ستوديو وهي مجانية لكنها ليست بمستوى كفاءة وقوة النسخ الكاملة مثل Ultimate و Professional... ويستمر تفوق PHP على ASP.Net إذا ما تطرقنا إلى موضوع التوافقية Interoperability مع قواعد البيانات، فسوف نجد أن لغة PHP متوافقة بشكل كبير مع نظام إدارة قواعد البيانات MySQL وهو منتوج مجاني متاح للجميع :) بينما تستمر دواهي وطوام ASP.Net لنجد أنها متوافقة بشكل كامل مع نظام إدارة قواعد البيانات MS SQL Server وهو مدفوع وغير مجاني :) ما عدا النسخة Express طبعا. إذن من حيث عامل التكاليف فلغة PHP أفضل بمراحل من تقنية ASP.Net - النقطة الثانية: الكفاءة والأداء Performance: هذه النقطة بالذات لا نستطيع الجزم فيها لأن كلا من لغة PHP وتقنية ASP.Net تشتغلان بكفاءة عالية وبأداء جيد، ويمكنك الاطلاع على سرعة مواقع كبيرة مصممة بهما، فمثلا موقع Facebook وهو أكبر شبكة تواصل اجتماعي مبرمج بلغة PHP، وموقع StackOverFlow أكبر تجمع للمبرمجين حول العالم مبرمج بتقنية ASP.Net بالارتكاز على لغة C# ما دمنا نتحدث حول الأداء والكفاءة فدعوني أوجه رسالة لكل مبرمج كفاءة البرامج مرتبطة بكفاءة المبرمج فما دمت تعتمد على الدقة في كتابة الكود Optimize the code، وما دمت تحرص على كتابة استعلامات منسقة ونظيفة Clean and Proper SQL Queries فأنا أضمن لك أن كفاءة برامجك ستزداد. - النقطة الثالثة: مصادر التعلم مصادر تعلم لغة PHP متوفرة بشكل أكبر من مصادر تعلم تقنية ASP.Net ولعل ذلك راجع إلى مجانية اللغة والعدد الكبير للمبرمجين بها. كذلك من حيث سهولة التعلم فلغة PHP أسهل، يكفيك أن تتابع دورة أو تقرأ كتابا ثم تبدأ بتطوير برمجيات ب PHP، كما يكفيك أن تطلع على قليل من قواعد PHP لتبدأ تطوير أنظمى إدارة المحتوى Content Managemeny System مثل ووردبريس أما تقنية ASP.Net فمصادر تعلمها نادرة قليلا بالقياس مع وفرة مصادر PHP، لكنها سهلة التعلم إن كان لك سابق عهد بإحدى لغات الدوت نيت (فيجوال بزيك أو سي شارب) إضافة إلى دعمها للعديد من تقنيات الويب بشكل بسيط نذكر على سبيل المثال تقنية Ajax التي ستستطيع استخدام مجموعة من الأدوات الجاهزة، كل ما عليك سوى سحبها داخل Source Code والاستمتاع بها أيضا تقنية ASP.net غنية جدا على مستوى تقارير الطباعة Reporting لأنها تدعم الكريستال ريبورت و Report Document بشكل قوي جدا، الشيء الذي سيجعل شعرك يشيب في PHP لأنها عقيمة على مستوى التقارير. في الختام أحب أن أشير إلى أن الاختيار بين لغة PHP وتقنية ASP.Net يحكمه توجهك الخاص أيها المبرمج، فلو كنت من رواد الدوت نيت فالتحق بركب ASP.Net ولا تلتفت لكل ما يشاع فإنك على صواب. أما إن كنت جديدا وليس لك دراية بإحدى لغات الدوت نيت، فلا تتردد بخوض غمار لغة PHP ورأسك مرفوع، وإن سألوك عن السبب قل لهم: أوصاني بها رجل كريم
  20. قيل للأمام الشــــافعي : يا إمام دلنا على واجب وأوجب ؟ وعجيب وأعجب ؟ وصعب وأصعب ؟ وقريب وأقرب ؟ قــــــــــــــال: واجب الناس أن يتوبوا ولكن ترك الذنوب أوجب ... والدهر فى تصرفه عجيب وغفلة الناس عنة أعجب ... والصبر عند المصائب صعب ولكن فوات الثواب أصعب ... وكل ما تتمنى قريب والمـــــــــوت من دون ذلك أقرب....
  21. الجزء الاول المقدمه والتمهيد الموقع الالكترونى هو عدة صفحات يوجد الموقع الالكترونى على مساحه خاصة به على سيرفر يتم الوصول للموقع الالكترونى من خلال الدومين طيب الكلام ده كبير قوى ممكن نبسطه شويه اه طبعا قوى قوى - الموقع الالكترونى : يتكون من صفحة او اكثر والصفحة الواحده قد تحتوى على الصور والفيديوها والمقالات او احد ما سبق ويتم عمل ذلك من خلال مصمم مواقع الانترنت - السيــــــــــــــــرفر : هو المساحه على الخادم التى تحتوى على كل الصفحات والميديا الخاصه بتصميم الموقع - الدوميــــــــــــــــن : هو عنوان الموقع ويبدأ عادة بـ com.اسم الموقع .www مثلا او net.اسم الموقع. www مثلا او eg.اسم الموقع. www ...... طيب حلو قوى الكلام ده الموقع الالكترونى زى ما قلنا من شوية بيتمون من صفحات والتى قد تحتوى على الصور او المقالات او الفيديوهات ولكن معالجة البيانات على الموقع لكى تتم تحتاج لقاعدة بيانات طيب ايه رايكم بما اننا هنا داخل منتدى من اكبر وأهم المنتديات العربية التى تهتم بدراسة منتجات الاوفيس سنقوم بالاعتماد على الاكسس كقاعدة بيانات فى هذه الدروس طيب يبقى كده علشان نشتغل على تصميم موقع الكترونى لازم له الاتى 1- قاعدة بيانات ( أكسس ) ويتم ربط الموقع بقاعدة البيانت عن طريق odbc 2- سيرفر 3- برنامج التكويد الخاص بالبرمجة وكتابة الاكواد اللازمة ( دريم ويفر ) طيب حد من اخواتنا الكرام المتدربين والمتابعين للشرح سامعه يسأل طيب السيرفر منين اجيبه انا هأشرح حالا ان شاء الله نركز لاننا كده بدأنا الشغل الجد الله يبارك لكم نقوم بتخصيص مكان على الهارد ديسك وذلك لجعله هو السيرفر المحلى انا مثلا على سبيل المثال خصصت المكان على القرص c وقمت بإنشاء فولدر بإسم www ولتفعيل السيرفر المحلى نفتح كنترول بانل Control Panel واللى غالبا بتكون بالشكل ده ثم نقوم بتغير العرض كما هو موضح فى الصورة التالية ثم نقوم بإختيار Programs and Features كما هو موضح فى الصورة التالية تفتح كما بالشكل التالى ونختار Turn Windows features on or off بعد ذلك تفتح عندنا نافذة بهذا الشكل من هذه النافذه نختار الـ ( Internet Information Services ) ونقوم بتفعيله نضغط على علامة + الموجوده بجوار Internet Information Services حتى تصبح - وتفتح كل الاختيارات التى تندرج تحت الاختيار الاساسى ( Internet Information Services ) وذلك لتفعيلهم جميعا حتى تصبح كما بالصورة السابقه بوجوده علامة √ بجوار Internet Information Services نعود مرة اخرى للكنترول بانل Control Panel ولكن هذه المره نقوم باختيار Administrative Tools تفتح لنا نافذه بهذا الشكل ونختار منها Internet Information Services (IIS) Manager فتفتح لنا نافذه بهذا الشكل نقوم بالضغط كليك يمين على اسم الجهاز والمستخدم كما فى الصورة التالية فتظهر النافذه بهذا الشكل التالى نقوم بتغيير البيانات كما فى الشكل التالى اسم الموقع طبعا يكون انجليزى بدون مسافات يفضل ان يكون بنفس طريقة اختيار اسم الدومين تحديد الفولدر الذى تم انشائه لتخصيصه سيرفر محلى على الجهاز الخاص بنا على سبيل المثال كما فعلت انا اسم الفولدر www مكان الفولدر القرص c نقوم بتغيير رقم البورت من 80 الى 2082 ثم بعد ذلك نقوم بالضغط على ok كده تمام انتهينا من انشاء السيرفر المحلى الذى سنقوم بتصميم مواقعنا عليه ان شاء الله وللتأكد من تجربة السيرفر والتأكد من انه يعمل بشكل سليم نقوم بفتح الرابط التالى http://localhost/ تفتح بالشكل التالى وللتأكد من فتح الموقع على السيرفر http://localhost:2082/ تفتح بالشكل التالى بهذه النتيجة نكون قد وصلنا الى نهاية الحلقة الاولى ان شاء الله وتفعيل السيرفر المحلى انتظروا الحلقة القادمة ان شاء الله لا اريد الاسراع فى عرض المعلومات لان كثرة الكلام يذهب ببعضه البعض وفى التأنى السلامة ان شاء الله حتى يستوعب من فكرة له اصلا هذه المعلومات القيمة ان شاء الله فكما وعدت سيكون الشرح من اقل مستوى حتى تعم الفائدة على الجميع الى اللقاء اخوكم محمد ☺
  22. “لا تقهر أحدًا كي تسعد نفسك ، ولا تظلم نفسًا لتبرر أخطائك .. حاول دائمًا أن تبني سعادتك بعيدًا عن أذية الناس”
×
×
  • اضف...

Important Information