أداة الأجاكس Ajax، إختصار لـ asynchronous Javascript and XML تعتبر من تقنيات/أدوات تطوير الويب، إلا أنها تحوي مجموعة من التقنيات مستخدمة خلالها، كما أنها تستخدم وتظهر شفرتها من جهة العميل client-side تستخدم لإنشاء تطبيقات ويب تفاعلية، وتعتمد على إستدعاء البيانات في التطبيقات الويب من خلال الخادم أو Server ودون الحاجة إلى تحديث الصفحة.
عادة يتم إستدعاء البيانات عن طريق كائن XMLHttpRequest ولست ملزماً بإستخدام XML أثناء تطبيق أداة الأجاكس، وبما أنها مجموعة من تقنيات الويب فهي تحتوي على:
- HTML و CSS لتنسيق المعلومات.
- DOM (إختصار لـ Document Object Model) تستخدم للوصول إلى عناصر البيانات وإجراء كافة التعاملات من كتابة وحذف وتعديل البيانات التي تم إستدعائها.
- كائن XMLHttpRequest لتبادل المعلومات بين المتصفح والخادم بدون إعادة تحديث الصفحة.
- XML وJSON كنموذج لإستدعاء البيانات إلى المتصفح. (يتم إنشائها من جهة الخادم server-side)
.. أكمل قراءة بقية الموضوع »
كثير من المبتدئين يسألون عن كيفية عمل صفحات ويب موجودة رأوها في مواقع عدة مثل التأثيرات وغيرها أو عن الوصول إلى مستوى أفضل من الحالي مع أن هناك مواضيع كثيرة تتحدث عن هذه الأمور ولكن الكثير يغيب فيها الجانب النظري والمنهجي الذي نحتاجه دائماً بين فترة وأخرى. وصلتني رسالة على البريد الإلكتروني فأحببت أن أجاوب عليها في تدوينة واحدة.
هذه التدوينة تتحدث عن أهم الطرق التي تحسن من مستوى مطور ومصمم المواقع أثناء عمله على مشروع تصميم موقع ويب، والكثير من الطرق يعرفها أغلب المصممين ولكن سأركز على أهمها والتي لم أستغني عنها منذ بدايتي في هذا المجال.
.. أكمل قراءة بقية الموضوع »
مع سيطرة متصفح الفايرفوكس على سوق المتصفحات وإرتفاع نسبة إستخدامه عن نسبة إستخدام إصدارات متصفح إكسبلورر كما توضح إحصائيات موقع W3schools وإنخفاض عدد مستخدمين إكسبلورر 6 خاصة مع إعلان موقع يوتيوب التخلي عن دعم توافق موقعه مع الإصدار السادس لمتصفح إكسبلورر.
ربما قد يعارض الإنخفاض عدة أمور أهمها وجود الإصدار مع نسخ نظام تشغيل ويندوز الذي يستعمله أغلب المستخدمين إضافةً مع وجوده في أجهزة المقاهي والمدارس عموماً والمشكلة هنا عدم توعية المستخدمين بأن هناك إصدار حديث لنفس المتصفح أو وجود متصفحات أفضل.
لذلك سأكتب وسائل تساعد على ترك دعم إكسبلورر بالنسبة للمطورين والمصممين إضافةً إلى طريقة التعامل مع مستخدمين إكسبلورر 6 عند تصفحهم للموقع.
.. أكمل قراءة بقية الموضوع »
صحيح أن الوقت مهم في إنجاز أي مهمة مع ذلك فإنه قد يحد من فرص الإبداع في العمل، عندما تنحدث على تصميم موقع ويب فيمكن إختصار الكثير من الوقت إذا حددنا الأدوات التي سنستخدمها في التصميم إضافةً إلى طريقة العمل وأشياء أخرى.
سأعرض في هذه التدوينة أدوات وطرق لمطوري ومصممي المواقع تركز على تنفيذ تصميم الموقع في أقل وقت ممكن، بعد إختيار الفكرة بالطبع لأن إختيار فكرة جديدة تحتاج إلى وقت 
.
.. أكمل قراءة بقية الموضوع »
مع ظهور الإصدار الثالث لتقنية CSS منذ فترة من قبل منظمة W3c المستخدمة في تنسيق مواقع الويب بجانب تقنيات مثل HTML، XML والتي لازال فريق CSS WG في منظمة W3c يعمل على الإصدارة الثالثة والتي تدعمها بعض متصفحات التي تعتمد على محرك Gecko و Webkit مثل Firefox و Safari بإستثناء المتصفح Internet Explorer، مع دعمها بعض مميزات CSS3 وليست جميعها، يمكنك رؤية إختبار دعم CSS3 للمتصفحات.
سأعرض مميزات ومصادر الإصدارة الثالثة من تقنية CSS للإستفادة منها وخاصة أنها معتمدة ومستخدمة حالياً في عدة متصفحات ومواقع وبها مميزات يمكن أن توفر عليك والوقت وتضيف المزيد من الجودة والمرونة إلى عملك.
.. أكمل قراءة بقية الموضوع »
واجهة المستخدم User Interface ، أو واجهة الإستخدام كما نسميها نحن غالباً لها أهمية كبيرة في جميع المجالات سواء كان في تطوير المواقع (مواقع، تطبيقات ويب، ..) و أنظمة التشغيل (تطبيقات سطح المكتب، المهام، ..) وفي التقنية بشكل عام، واجهة المستخدم كما تجده أيضاً في الويكيبيديا ستجد له أقساماً عدة ومستخدمة في عدة أشياء أو مجالات.
أبسط مثال على ذلك إختبار مدى قابلية إستخدام منتج أو جهاز معين من قبل العميل أو مستخدمه حيث تكون سهولة أداء المهمات فيه والوصول إليها وكفائتها في نفس الوقت مهمة وإتاحة خيارات للمستخدم لإرضائه وأداء أعماله من خلال المنتج حسب ما يريد.
.. أكمل قراءة بقية الموضوع »
التخطيط لواجهة تصميم الموقع غالب الأحيان تكون بشكل مباشر على الجهاز بإستخدام برامج الرسم مثل برنامج Adobe Photoshop أو كتابة شفرة XHTML مباشرةً أيضاً أقصد بدون التخطيط المبدئي ، فكرة تصميم أو التخطيط لتصميم قالب موقع ويب بإستخدام برنامج Adobe Illustrator التابع لحزمة شركة Adobe أيضاً مفيدة في عدة أمور وقد جربتها سابقاً ، فقط أفكار أتتني لكتابة هذا الموضوع حول إستخدام Adobe Illustrator في تصميم قالب موقع ويب.
سبق كتبت درس حول خاصية position ، وأردت كتابة دروس أخرى حول هذه الخاصية وسأكتفي به لأني المصادر المتعلقة بها متوفرة وبكثرة جداً بالمواقع الأجنبية فلا حاجة لإعادة الدروس مرة أخرى! ، درس اليوم سيكون عن تطبيق على تأثير المحدد hover ، سواء كنت تريد عمل قائمة روابط أو ملاحة (Navigation) ، أو بنفس الطريقة ولكن على واجهة تستطيع من خلالها التحكم في ظهور الصور التي تريدها بتأثير مؤشر الفأره عليه.
.. أكمل قراءة بقية الموضوع »
هذه التدوينة خاصة للإجابة على أسئلة أحد المعلقين في المدونة وأحببت أن أجيب عليها في تدوينة خاصة والأجوبة عموماً هي من وجهة نظري وحسب تجربتي التي لازلت أمارسها لتحسين مستواي ، إسم هذه التدوينة بالأحرى ماذا أحتاج لكي أكون مطور مواقع ويب ، بالطبع أنا أقسّم هذه المهنة على مستويات أو غالباً ما يتم تقسيمها بهذا الشكل: مبتديء – محترف.
.. أكمل قراءة بقية الموضوع »
الكثير منا يهتم بجمع أعمال مطوري مواقع الويب الآخرين و أكثر الأشياء التي تدعوك لمشاهدة هذه الأعمال هي زيادة فهمك لعمل مثل هذه التصاميم ، معرفة طريقة عملها ، دراسة عناصر الصفحة وتنسيقها ، أفكار لواجهات الإستخدام User Interfaces ، .. بإختصار مصدر إلهام لكل مطور ومصمم ، هذه مجموعة من مفضلتي لأفضل وأكثر من 20 معرض للأعمال إحتفظت بها سابقاً وأحببت مشاركتكم بها مع الروابط والصور.
.. أكمل قراءة بقية الموضوع »
خاصية position من أهم الخواص في CSS وعن طريقها تستطيع عمل حيل رائعة وخاصةً بإستخدام الجافاسكربت وأيضاً عمل تصاميم رائعة الشكل وبتأثيرات هذه الخاصية كما نشاهدها في بعض التصاميم الموجودة ضمن معارض CSS المنتشرة وأيضاً إستخدامها مع لغة Javascript ومكتباتها مثل jQuery ، MooTools ، وغيره .. ، وكما وعدكم سابقاً بكتابة هذا الدرس والذي سيشرح بشكل بسيطة طريقة عملها والخواص الأخرى المتعلقة بها مثل z-index الموجودة في CSS ، وسننتقل بعدها لبعض الأمثلة العملية في إستخدام هذه الخاصية.
.. أكمل قراءة بقية الموضوع »
الفكرة واضحة من العنوان (ومعروفة للجميع ) فقط أحببت مشاركتكم به ولمن لا يعرف طريقة عملها ، وهي عمل الحواف الدائرية الجميلة والتي نراها في معارض تصاميم CSS المختلفة ، أحب أن أذكر أني كتبت درس سابق لطريقة عمل حواف دائرية في الفوتوشوب سهلة جداً ،ولكن هذا الدرس يتحدث عن طريقة عملها في CSS أي ربط الصور أو تقسيمها وعرضها في صفحة الويب على شكل صندوق.
.. أكمل قراءة بقية الموضوع »
