مكونات الويب Web Components

لا يخلو أي مشروع ويب حقيقي في أيامنا الحالية يعتمد لغة PHP من استخدام أحد أطر العمل PHP FrameWork، حيث يمكن لكل متابع أن يلمس التسارع في تطور هذه الأطر، وكما نعلم معظم هذه الأطر تهتم بطريقة البرمجة من جهة المخدم (Server Side)، ولكن ما الجديد في التقنيات الويب من جهة الزبون (Client Side)؟!

إن ظهور HTML5 و CSS3 وقبلها مكتبات Javascript (مثل jQuery، Zepto… إلخ ) وما يحدث لهذه المكتبات من تطوير سريع هو أهم ما حصل إلى الأن، ولكن هل هناك مفاهيم جديدة قد تغير كل ما سبق وتتجه بالويب الذي نعلمه اليوم كمبرمجين إلى مستوى جديد تماماً ، ويجعلنا نعود لنتعلم الأساسيات من جديد ؟!، بصراحة الجواب هو نعم :)

قد يعتبر البعض انها نقمة على المبرمجين ، وقد يتحمس البعض لتعلم أشياء جديدة. بكل الأحوال أحد هذه المفاهيم الجديدة هي مكونات الويب أو Web Components.

Web Components

أكمل القراءة

حسّن منهجيّتك في تطوير الواجهات 2 – Grunt

نعود اليوم لموضوع تطوير الواجهات والأدوات التي تساعدنا على تخفيف الأعباء الروتينية للتركيز على الأجزاء الممتعة من العمل. هناك الكثير لنفعله في هذه المقالة، جهز كوباً من الشاي ولنبدأ.

حسّن منهجيّتك في تطوير الواجهات 2 – Grunt

أكمل القراءة

حسّن منهجيّتك في تطوير الواجهات 1 – Bower

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

على سبيل المثال، هذا ما منعني حتى الآن من الانتقال من Photoshop إلى Fireworks لتصميم الواجهات مع أني سمعت الكثير عن أفضليته في هذا المجال. لذلك أحاول الآن أن أثور على هذه العقلية وأتعلم استخدام أدوات جديدة للتطبيق العملي، لا لمجرد الثقافة العامة واستعراض المعلومات.

حسّن منهجيّتك في تطوير الواجهات 1 – Bower

أكمل القراءة

عملية تجميل لموقع جيسترا التعريفي

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

لذا فقد قمت بتخصيص بعض الوقت للقيام بعملية تجميلية للموقع بما يناسب رؤيتنا والمرحلة التي يعيشها عالم الويب اليوم. وخلال ذلك تعلمت ولاحظت بعض الأمور التي أود مشاركتها معكم.

أكمل القراءة

التطوير المتقدم (Progressive Enhancement)

التطوّر الحاصل والمستمر في عالم التصميم للويب أمرّ ليس خفيّاً على أحد، الأفكار والأدوات والتقنيات تنبع يومياً من كل مكان في العالم. ظهر التطوير المتقدم في مرحلة مبكرة من ثورة الويب الحالية، ويعزى إليه الفضل في كثير من التحسينات في مجال تجربة الاستخدام UX.

التطوير المتقدم

أكمل القراءة

استخدام لغة توصيف النصوص التشعبية الدلالية (Semantic HTML)

لماذا نستخدم وسم <h1> و وسم <p>؟ لماذا لا نستخدم وسم <div> أو <span> دائماً عند كتابة مستند HTML؟ لماذا يوجد وسم مثل <ul> و <h2> و غيرها؟ هل نضع النص داخل وسم <h1> من اجل ان يظهر بحجم اكبر؟

في هذه المقالة سنناقش المعنى الدلالي لوسوم HTML والفوائد وراء استخدامها بالشكل المناسب حسب دلالاتها.

HTML5 Semantics

الصورة من صفحة HTML5 Logo

أكمل القراءة

مجموعة أوراق غش لـ HTML5

شهدت السنوات القليلة الماضية تطوراً في تقينات الويب بسرعة غير مسبوقة، وبالطبع فقد نالت HTML نصيباً كبيراً من ذلك مع ظهور إصدارها الخامس.

وتماشياً مع ذلك فقد توافرت مواد التدريب والتعليم والتجريب لها ومنها أوراق الغش (Cheat Sheets) التي تمثل مرجعاً مختصراً وسريعاً يساعد المحترفين في تبني التقنيات الجديدة لكونها سهلة التصفح والقراءة ولعدم إسهابها في الشرح.

مجموعة أوراق غش لـ HTML5

نقدم إليكم هنا مجموعة من أوراق الغش التي توضح أهم الإضافات والتعديلات في توصيف HTML5.

أكمل القراءة