آرتيشن

طريقة عمل زر 3D بالفوتوشوب وتكويده بال HTML و ال CSS3

أولا: سنبدأ بالفوتوشوب, فى هذا الفيديو أشرح طريقة عمل الزر بالفوتوشوب:

Fluent … عن الأفكار التى لا تنتهى

ثلاثة مهندسين سابقين لدى جوجل جمعتهم فكرة تحويل الايميل الى شبكة اجتماعية! ليسو أول من يأت بهذه الفكرة فقد سبقهم تطبيق Sparrow الخاص بنظام التشغيل mac ولكنهم نقلو الفكرة الى الانترنت حتى لا تكون حكرا على مستخدمى نظام تشغيل بعينه.
حاليا لا يعمل Fluent الا مع Gmail فقط, وسيتم ضم Yahooو Hotmail فى المستقبل. كذلك النسخة الحالية هى نسخة تجريبية مغلقة ولكن يمكنك تجربة ديمو من هنا.

شاهد الفيدو التوضيحى التالى لترى ماالذى يحمله المستقبل لخدمة الايميل مع Fluent:

أفضل اضافات لجوجل كروم لمساعدة مصممى المواقع

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

فيديو: طريقة عمل خلفية بال CSS بطريقة ال image sprites

Sprite Cow

نظم عملك مع Todoist

التنظيم هو دائما مشكلة المشكلات! المشروع الذى قد يستغرق معك خمسة أيام قد يستغرق عشرة بسبب عدم التنظيم!
بالطبع هناك عشرات من البرامج التى تساعدك على هذا ولكن أن تجد البرنامج المناسب تلك هى المشكلة!
لمعايير التى وضعتها للاختيار هى كالتالى:

- أريد أن يكون البرنامج على الانترنت web software لا أن يكون على الجهاز Desktop software وذلك حتى يمكننى متابعته من أى مكان.
- بالنسبة لعملى فان المشروع الواحد يتكون من عدة مشاريع صغيرة, وكل مشروع صغير يحتوى على مهام وبعض المهام تتكون من عدة خطوات, لذا كان من المهم أن يدعم البرنامج خاصية ال subprojects, subtasks.
أكمل القراءة

طريقة عمل قائمة رئيسية أفقية بال CSS

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

أكمل القراءة

طريقة عمل Flexible rounded corners

لمشاهدة ديمو اضغط هنا

فى الدرسين السابقين طريقة عمل خلفية جميلة لفقرة p باستخدام CSS و مثال آخر على طريقة عمل خلفية لفقرة P عرفنا كيف يمكننا عمل خلفية بها Rounded Corners ولكن لفقرة ذات عرض ثابت فماذا لو كان العرض غير ثابت؟
فى الدرس السابق كنا نقسم الخليفية الى ثلاثة أجزاء:
top.png, tile.png, bottom.png
هنا سنحتاج الى أربعة أجزاء لنضعها على الخلفية:
أكمل القراءة

مثال آخر على طريقة عمل خلفية لفقرة P

يفضل قراءة الدرس السابق :
طريقة عمل خلفية جميلة لفقرة p باستخدام CSS
كما فعلنا فى الدرس السابق قمنا برسم الخلفية على الفوتوشوب ثم قمنا بتقطيعها كما فى الصورة

أكمل القراءة