hits counter

ورشة عمل بعنوان: Web Development على مدى يومين ..... يكفي؟

  • بادئ الموضوع بادئ الموضوع G7Ga7
  • تاريخ البدء تاريخ البدء

G7Ga7

True Gamer
السلام عليكم .. اليوم راح تقام ورشة عمل في الجامعة عن تطوير وتصميم مواقع الانترنت :

WebDevelopment-Workshop.jpg


من الايميل:
Congratulations.
You have been selected to attend the Web Development Workshop. The workshop will start from tomorrow Saturday the 3rd of January 2009 at 5:30 pm. We advise you to be there before 5:15 pm for the workshop registration. The workshop will be held in building 14 (ITC Building) room 104 (near to the cafeteria).
Failing to be there before 5:30 pm may subject you to be dismissed from attending the workshop and you will be replaced by someone form the waiting list.
The fees for the workshop are 50 riyals; 25 riyals will be given back after attending the workshop and receiving the certificate.
Waiting to see you at the workshop.
CCSE Club.
زي ما انتوا شايفين , الدورة على مدى ورشتين بس كل وحدة منهم 5 ساعات. الي خلاني افتح الموضوع , هو اني مهتم بالـWeb Development بشكل عام , لكن كنت متوقع انه بحر واسع !. و اللي محيرني هنا , ان الجامعة راح تعطيني شهادة بمجرد اني اكمل 10 ساعات بس :| !!!

ما ادري صراحة , انا ان شاء الله رايح رايح اليوم (المشكلة بيوم الاثنين -_-"), لكن ابي اعرف شي من الشباب الي عندهم خبرة, هل 10 ساعات راح تكفيني اتعلم المبادئ كلها الي بتمشيني لما ابغى اسوي موقع؟ ولا لازم ابحر زيادة بعد ما اخلص من الدورة عشان اعرف اصمم موقع؟

المشكلة انا ما عندي وقت حالياً أتدرب على شي ضخم مثل تصميم المواقع , وانا لازم اركز على البرمجة ودراستي.

ودي أعمل بحث عن الموضوع , لكن للأسف قاعد اكتب Report الآن لازم اسلمه اليوم العصر .. فما عندي وقت ابحث واشوف في الموضوع , فأتمنى من احد يتكلم عن تطوير المواقع , وتجربته الشخصية , ومن وين تعلم , وكيف تعلم ... الخ الخ .. أي تجربة من اي شخص راح تفيدني الآن.

وشكراً تي جي.
 
10 ساعات راح تعلمك المبادئ والأساسيات فقط. يعني لا تتوقع انك تشوف شرح عميق ودروس مكثفة

على العموم هو هذا المطلوب في النهاية, لأن الموضوع شبيه بتعلم الفوتوشوب, يعلموك الأساسيات والباقي تكتشفه من خلال الممارسة والتطبيق العملي


تعديل: بالنسبة لي خبرتي متواضعة, وتعلمتها بنفسي
 
السلام عليكم ورحمة الله وبركاته

اظن راح يعلمك الكورس الاساس في صنع موقع من الصفر وبنائه على تطبيق الCSS و اضافة تطبيقات عليه مثل الJava Script فعلا شيء مهم للناس المبتدئة وتجعلهم يبنون موقع بشكل جيد
والكورس فيه الفوتوشوب واستخدامه لتصميم المواقع والعمل على HTML اظن هذا كافي لكل من يريد ان يبني موقع

لكن التطبيقات الاحترافية والعالية مثل بناء مواقع Dynamic Development الي بتحتاج داتا بيز وبرمجة لغات كـASP او PHP غير متواجدة في هذا الكورس وهذا يتخصص فيه مطوري المواقع المتخصصين وقد لا يحتاجه الكثير اذ يتم اعتماد السكربتات الجاهزة والتي توفر اشياء يحتاجها اصحاب المواقع
 
كان ودي احضر يوم الاثنين بس (ما همني الا الاجاكس) بس طلع ما تقدر تحضر يوم واحد بس. -_-
 
انا اشوف 10 ساعات ممتازة , راح تعطيك بدايات و مفاتيح قوية للدخول في عالم تصميم صفحات الويب



انا استغرقت حوالي اسبوعين او ثلاث اعلم نفسي على المبادئ بس كان في مشكلة >_> , اتعلمتها من دروس في النت هههه , اعتقد 10 ساعات من واحد فاهم تكفي ان شاء الله , اتوقع تطلع من هذي الدوري و انت عارف كيف تصمم موقع


بالتوفيق...
 
حتى لو ما تكفي, احضرها و شوف نفسك بعدها!
لو لقيتها كافية لك تمام, لو حسيت ان في اشياء ناقصتك ممكن تكملها في دورات خارجية ..
 
أبو داحم أحضرها لسببين ..

أولاً منت بخسران شيء أتوقع

ثانياً بتأخذ نظرة ولو بسيطة عن أشياء ممكن ماتعرفها عنها أي شيء ...

إن شاء الله تستفيد و أنتظر منك شرح لو بسيط لأهم ما يقدم لكم اليوم ..
 
إنشاء المواقع مسألة ممارسة.. يعني مهما حاولت مستحيل توصل لشي في فترة قصيرة

لازم تعطيه وقته.. لكن هذا مش معناته إنك ما تبدأ اذا كنت متحمس فرصة حلوة جحجح
 
شكراً جميعا .. باقي ساعة .. حماااس
icon10.gif


اظن راح يعلمك الكورس الاساس في صنع موقع من الصفر وبنائه على تطبيق الCSS و اضافة تطبيقات عليه مثل الJava Script فعلا شيء مهم للناس المبتدئة وتجعلهم يبنون موقع بشكل جيد
والكورس فيه الفوتوشوب واستخدامه لتصميم المواقع والعمل على HTML اظن هذا كافي لكل من يريد ان يبني موقع

ممتاز .. حتى لو اطلع على قولتك لو اتعلم الاساسيات ممكن اطور نفسي بعدها هذا كافي بالنسبة لي.
 
يا سلام ليتني اقدر احضرها ! تطوير المواقع موضوع متشعب و فيه مجالات فرعية كثيرة مستحيل البني آدم الطبيعي يحيط بها كلها ، في عندك شغلة تطوير برمجيات الويب من تحليل و تصميم و كتابة للكود ، و عندك تطوير لغات البرمجة المستخدمة في كتابة برمجيات الويب على اختلاف انواعها و الغرض منها ، و عندك مجال الحماية ، و عندك مجال تصميم الواجهات ، و عندك مجال الاستضافة ، و حتى الادارة و التسويق و المحاسبة و القانون صار لهم اعتبار في تطوير المواقع !!
 
في المحاضرة الان :

f_prm_acbf59a.jpg


رااااسي xD
 
حلو حلو .. شغل على الهواء مباشرة ... بس شعار ويكيبيديا كبداية xD

وكيف قدرت تأخذ هالدومين 🙁 ... j\k
 
^^^^
لول

رااااسي xD

خلاك تطبق عن طريق الكود والا ايش ؟ لول

بس تمام ما شاء الله اهم شيء تذكر الاساس الي هو تصميم الفوتوشوب والاكواد HTML مهم تفهمها ما تحفظها كثير XD
 
الفرونت بيج أسوأ برنامج في العالم :angry::
والله فيني النووووم , معد اقدر اثبت وش يشقول الرجال xD

+
f_prm_c086d21.jpg


:laugh:::laugh::

أهم شي فهمت كيف تتصمم المواقع.
 
كنت بقول ..5 ساعات بتكون عذاب لورش عمليه ..

بس انا كنت متأخر :laugh::
 
عبدالرحمن الـWeb Development فعلا بحر ..
اللي انت جالس تاخذه في الدورة هذي حسب ما اشوف هو أساسيات جدا بسيطة ..
يعني أساسيات انك تكون Web Designer ..

الـWeb Dev هو امتع مجال في البرمجة عندي وممكن أفيدك باللي تبي فيه كونه شغلي الحالي صاير كثير عليه ..
وجالس اشتغل حاليا على كم Web Application ..

بالنسبة لمدة الدورة إذا كانت خلفيتك ممتازة في البرمجة بشكل عام والسكريبتينج فكافية لإعطائك أساسات تبني عليه تطورك في الموضوع هذا ..
 
G7Ga7 اذا اعجبك المجال انصحك تترك الفرونت بيج و تجرب أدوبي دريم ويفر لان امكانياته افضل ، ممكن تشوف بديل open source او shareware او زي كذا كل البرامج هذي تؤدي نفس الغرض ، لكن الفرونت بيج يعتبر خطوة مبتدئة جداً و ما انصحك تركز عليه كثير
 
المحاضرة كانت طويلة , وبصراحة لشخص ما عنده اي خلفية عن هذا المجال كانت ملياااانة معلومات مفيدة - ولو اني ما راح استخدمها في حياتي العملية .. اتوقع - .

في البداية , فتحنا الفوتوشوب عشان نصمم الـLayout أو شكل الموقع.. نتيجتي كانت:
f_prm_acbf59a.jpg


الممتاز في الموضوع , اني تعلمت خدعة أو ثنتين في الفوتوشوب ما كنت ادري عنهم 😀 ..
بعد كذا استخدمت ولأول مرة الـSlice Tool , وعلى سنواتي الي اشتغلت فيها على البرنامج أول مرة اعرف فايدتها !!

بعد كذا بدأ الاحباط الحقيقي لما فتحنا الفرونت بيج .. في البداية المعلومات الي اعطانها اياها المُحاضر, ويوم ورانا كيف كل يركب خلفيات الموقع, والصور, ووو .. الخ كان كل شي سهل (كان يعتمد بقوة على الجداول وتقسيمها!). لكن لما بديت اشتغل على موقعي اصبت باحباط كبييير , التحكم بالجداول أبدا مهو سهل, ومعقد جدا وغير عملي بالنسبة لي. هنا انا بديت امل, وبدأ راسي يعورني ..

في نهاية المحاضرة , لازم اقول اني طلعت مشبع بمعلومات ممتازة كبداية !! ولو اني ما استمتعت فعلاً ببناء الموقع على الفرونت بيج !!

المحاضرة الجاية ان شاء الله راح يتكلم عن الآبليتس, وتطبيقات الجافا .. هنا انا متحمس من جد 😀
 
بعد كذا استخدمت ولأول مرة الـSlice Tool , وعلى سنواتي الي اشتغلت فيها على البرنامج أول مرة اعرف فايدتها !!
مثير للاهتمام.. توني جربتها كيف تستخدمها :xd:؟
 
مثل ما قال محمد ..
التصميم بشكل عام سواء كان تصميم مواقع او دعايات او حتى التصميميات الحركة إلي يسمى ( Motion Graphics ) لايمكن أن الواحد يتعلمة في يوم وليلة او حتى فس شهر او حتى سنة ..

لازم أهم شي في عالم الفن و التصميم بشكل عام .. الإرادة + الممارسة ..

لكن شيء حلو جداً أن الواحد يعرف الأساسيات علشان يبدء يطور هذا الشيء عنده ..
بالتوفيق جحجاح ^^
 
الفرونت بيج صح انه سيء استخدامه لكنه خيار مفيد وايد إذا بتصمم موقعك بالعربي. البرامج الثانية تعقد السالفة اذا حاولت تصمم فيها بالعربي. الدريمويفر ممتاز جدا للتعامل مع الـCSS.

استخدم الـSlice Tool في الـImageReady. انا شخصيا أفضل استخدمها هناك (تقدر تخزنه الصفحة بسهولة على صيغة HTLM و تسويلها update)
 
امس اختُتمت ورشة العمل ولله الحمد. بشكل عام طلعت من الورشة بفائدة كبيرة في امور عدّة.

  • تصميم شكل الموقع باستخدام الفوتوشوب.
    • القياسات المفضلة.
    • كيف توزع عناصر الموقع بشكل ممتاز.
    • زي ما قلت قبل, فيه خُدع, واختصارات جديدة للفوتوشوب تلعمتها.
    • استخدام الـSlice Tool عشان نقص - نقسّم - اجزاء الموقع. البانر يكون لحاله, والخلفيات نقصها على طول أو عرض 1 بيكسل.
  • "تركيب" الموقع باستخدام الفرونت بيج.
    • تركيب اجزاء الموقع باستخدام الجداول (اسوأ جزئية في ورشة العمل).
    • التلاعب بكود الـHTML (كيف تضيف نصوص , تغير مكانها, ألوانها, احجامها .. الخ).
    • بعض الامور الاساسية مثل انشاء روابط hyperlinks وتحيرك النصوص , وغيرها .
  • أكواد الـCSS.
    • كيف استخدمها (انشئ Classes , او اعدل بشيء باستخدام الـid الخاص بذاك الشيء, أو اعدل على كل شي داخل tag معين في كود الـhtml).
    • الـAttributes , ووين اقدر احصل الي ابيه منها.
  • مقدمة بسيطة جداً عن الـJava Script و الـ PHP , ajax وغيرهم من لغات البرمجة.
    • وش الفائدة من استخدامهم في المواقع.
    • الفروق بينهم.
  • مصطلحات جديدة.
    • Web Development VS Web Design
    • الـStatic websites و الـDynamic Websites
بصراحة كنت مأمل ناخذ أكثر في الجافا سكريبت , لكن الوقت ما سمح 🙁 .
شخصياً ما تحمست مرة في هذا المجال , فما اشوف نفسي قاعد اسوي مواقع أو كذا .. لكن كان ممتاز جداً اني امتص كل هالفوائد في 10 ساعات بس , ومنها شهادة رسمية من الجامعة 😀
 
التعديل الأخير:
أكواد الـCSS.

* كيف استخدمها (انشئ Classes , او اعدل بشيء باستخدام الـid الخاص بذاك الشيء, أو اعدل على كل شي داخل tag معين في كود الـhtml).

كذا انا متحسف رسمياً اني ما حضرت
 
إذا قررت تبرمج بشكل يدوي أنصحك تحمل Notepad++. انا مستغرب شلون للحين مايكروسوفت ما فكرت تصدر برنامج مثله يكون ستاندرد مع كل إصدارات الويندوز. مستحيل أفكر أكتب سطر coding واحد عالنوتباد العادي. شوف الفرق الجهنمي بينه وبين نوتباد الويندوز التعيس:


(اضغط على الصورة)

http://notepad-plus.sourceforge.net/uk/site.htm

تحتاجه حتى لو تستخدم دريم ويفر او أي برنامج ثاني، محد يعرف يتعامل مع ملفات الـCSS غير عقلك والنوتباد (بتحتاج تتعلم CSS إذا دخلت في المدونات، أو إذا تبي تطور موقعك بأساسيات جديدة، لأنه الـHTML بروحه مو عملي. بس ينفع).

هو أهم شي لا تقول بتعلم كل شي فوقت واحد لأنك ما راح تتعلم شي لول. إسأل مجرب. إبدأ في الـHTML (سهل جدا) وبعدين الـCSS. الـPHP أخاف أقرب منه، معقد. ولو تسألني امممم محد لاحقك، يعني خذ راحتك. الفوتوشوب وبرمجة المواقع تعلمتهم من نفسي، من دون دروس او دورات او شي، ممكن اني اخذت وقت طويل لكن ما عندي شي علشان أستعجل، ودريم ويفر كان يساعد وايد بكل الأحوال. فعلا التجربة والخطأ تعلمك بشكل كبير، عندي أكثر من 7 مدونات خربتها لأني كنت أتعبث بالأكواد لكني أثمرت بنتيجة مو بطالة.

إشترك في RSS هذا الموقع، مفيد: http://www.webmonkey.com/

بالتوفيق.
 
إذا قررت تبرمج بشكل يدوي أنصحك تحمل Notepad++. انا مستغرب شلون للحين مايكروسوفت ما فكرت تصدر برنامج مثله يكون ستاندرد مع كل إصدارات الويندوز. مستحيل أفكر أكتب سطر coding واحد عالنوتباد العادي. شوف الفرق الجهنمي بينه وبين نوتباد الويندوز التعيس:
.

يسس .. شكراً :rockon:
من الاشياء الي تعلمتها ان النوت باد واحد من أقوى البرامج على الويندوز .. اقدر اكتب عليه أكواد من الجافا الى الـHTML والـCSS ..

على قولتك , مشكلة النوت باد العادي مو مرتب أبدا, وصعب جدا انك تبدأ تكتب اكواد عليه .. لكن هذا اتوقع راح يفيدني بشكل كبييير في اكثر من شي. شكراً كولو.

Naif قال:
استخدم الـSlice Tool في الـImageReady. انا شخصيا أفضل استخدمها هناك (تقدر تخزنه الصفحة بسهولة على صيغة HTLM و تسويلها update)

ليه بالاميج ريدي أفضل؟ الفوتو شوب فيه نفس الخيارات الي كتبتها , يعني اقدر احفظ الـSlices كاملة كصور متفرقة, واقدر احفظ sliceـه معينة عشان اسوي ابديت لشيء معين.

ووش تقصد لما قلت اخزن التصميم كـHTML ? يعني الكود راح يكون جاهز بمجرد اني اسوي save as HTML ?
Mista Koo قال:
مثير للاهتمام.. توني جربتها كيف تستخدمها :xd:؟


بكل بساطة تستخدمها عشان تقسم التصميم الى شرائح أو Slices متعددة.. مثلاً البانر يكون slice لحاله , وكل زر تخليه slice منفصل عشان تتعامل معهم بشكل مختلف, وكذا ..

في البداية مرة صعبة, وراح تسوي أخطاء كثير , لكن اتوقع اذا استمريت راح تسهل مرة. وتصير عملية روتينية.


سؤال لمعشر المدوّنين:
الآن لما تستخدموا مواقع مثل وورد بريس وغيره , تقدر تتحكم بمدوّنتك عن طريق انك تسوي أبلود للـcss كود حقك, صح ؟ اذا لأ, ممكن أحد يشرح لي كيف اقدر اتحكم في خيارات مدونتي عبر الـcss.
 
يس أكيد تقدر، لو عندك مدونة مدفوعة تقدر تعدل كل إنش بالمدونة، من صور إلى كلام برمجي إلى أي شي ثاني.

scss.gif


Tumblr يقدم خدمة التعديل على ملفات الـCSS وإنشائها مجانا بالكامل (ووردبريس كله مجاني، لكن فيه مميزات ما تقدر تسويها إلا إذا عندك موقع. يعني النسخة اللي راح تركبها على الموقع المدفوع هي نفسها النسخة المجانية (وهي مجانية طبعا)، لكن صلاحيات الموقع المدفوع تأهلك إنك تسوي أشياء ما يقدر المجاني يسويها).

اللي أقصده بالمجاني هو username.wordpress.com
 
ليه بالاميج ريدي أفضل؟ الفوتو شوب فيه نفس الخيارات الي كتبتها , يعني اقدر احفظ الـSlices كاملة كصور متفرقة, واقدر احفظ sliceـه معينة عشان اسوي ابديت لشيء معين.

ووش تقصد لما قلت اخزن التصميم كـHTML ? يعني الكود راح يكون جاهز بمجرد اني اسوي save as HTML ?

تقدر عن طريق الايمجريدي انك تجهز السلايز و تخلص التصميم و بعدين تخزن الصفحة على صيغة html. و تتخزن لك صفحة HTML فيها التصميم مقطع مثل ما جهزته و الصور موجودة في فولدر الصفحة.
File >> Save Optimized as و اختر HTML لنوع الفايل

طبعا اذا كتبت كلام في الايمج ريدي بيتخزن على شكل صورة في ملف الـHTML. تقدر بعدين في محرر الـHTML انك تحذف الصورة اللي ما تريدها (مكان الكلام) و اختر نفس لون الخلفية الخاصة بالكلام اللي كان في الصورة و اكتب الكلام text عادي.
 
عودة
أعلى