قائمة الأمنيات .. الخاصة بالـ CSS :)

قياسي

مرحبا ..

صباحكم رضا لا يشبه الفرح ولا يغشيه الحزن 🙂

صباحكم جنَّة .. وصحائف اليمين تبشرون بها الأحباب بالفردوس /

وصباحكم CSS .. الجمال .. حروفًا وشيفرات !

.

.

يحدِّثنا ميخائيل كالوري من موقع webmonkey عن 15 مصممًا شهيرًا للويب ، قام موقع css-tricks بسؤالهم حول أمنياتهم المستقبليَّة في تطوير الـCSS ، ويطلب ميخائيل من زوَّار موقعه كتابة قائمة أمنيات مشابهة لغرض المتعة .

تبدو الفكرة مسليَّة ومثيرة ومحفَّزة للخلايا الرماديَّة الصغيرة ، كما أنَّها مفيدة للقائـمين على 3w.org الموطن الرسمي للـCSS .

بحثتُ في جووجل عن مواقع أخرى تتحدَّث في ذات الهدف ، ففوجئتُ بمواقع شهيرة تطلب من زوارها المشاركة في قائمة الأمنيات الخاصَّة بالبرنامج أو المنتج للمساهمة في تطويره ، منها الموقع الخاصّ بمتصفِّح أوبرا والَّذي يعرض في الـopera wiki قائمة أمنيات تمكِّن عشاقها من عرض أفكارهم عليها ، وأيضًا مدونة googlesystem طلبت من زوارها في نهاية عام 2006 عرض أمنياتهم المستقبلية من جووجل لعام 2007 ، الموقع الإجتماعي Myspace له صفحة خاصَّة اسمها wish-myspace-was-better ، هذا عدا مئات الهواة في العالم الَّذين يكتبون قائمة أمنياتهم لمنتجاتهم ومواقعهم المفضَّلة .

أعود إلى الـCSS وموقع webmonkey مستعرضةً أمنيات الزوَّار ، أعجبتني بعض الأفكار كثيرًا ، أطرحها هنا :

:

مراعاة ألاَّ يكون الإرتفاع الخاصَّ بالكائنات الَّتي تمَّ ضبط الـposition الخاص بها بقيمة absolute يؤثِّر في الإرتفاع الخاصّ بالكائن الحاوي عليه  .

:

فكرته هي ذات الفكرة الَّتي تراودني دائمًا ، وهي أن تعطي الـCSS المصمم القدرة على تحديد خصائص مميزة لكلماتٍ معينة .

كمثال :

;{sidebar [“Cat”,”cat”,”“”,”””] { font-weight: bold; color: #666.

:

راودتني فكرته أيضًا 🙂

القدرة على التحكَّم في شفافية الأبناء إذا قمنا بتحديد شفافية الأب ، وهذه مشكلة تمنع المصممين من تقليل شفافية الخلفية إلى أكثر من 70 % كي لا يظهر النصُّ باهتاً .

:

تخصيص أكثر من خلفية لذات العنصر .

وااااااااو ، مجرَّد تخيُل منظر مركبٍ من أكثر من خلفية مختلفة الشفافية يثير شوقي لاقتراف الـCSS الآن 🙂 .

:

فكرته مدهشة ، وربَّما بمقتضاها تتحوَّر الـCSS تدريجيًا للغة برمجيَّة 🙂 .

يقول / أتمنى وجود متغيرات ، يمكنكـ تهيئتها ومن ثمَّ استخدامها في أكثر من عنصر ، كمثال :

{var mycolor = #0080FF h1 { color: mycolor; } div.containbox { border: 1px mycolor@

:

أعتقد بأنَّ الجميع سيتمنى ما تمناه ..

زوايا دائريَّة للعنصر .. بحيث يقلل من جهدنا في رسمها كل مرة بالفوتوشوب .. ويسمح لنا بإظهار إبداعات أكبر 🙂 .

:

اقترح إضافة خصائص الـcellpadding و cellspacing الخاصَّة بوسم الـtable في الـHTML إلى الـCSS .

:

فكرة ذكيَّة أخرى ، إمكانية تحديد صورة كإطار للعناصر ، مثال :

(border-right: url(‘image.png

:

اهتمَّ بتدوير الصور بزوايا مختلفة ، وهي فكرة جيدة .. مثال :

;{img .horiz { rotate:90

.

.

للأسف مدونتي لا تشبه الـwebmonkey ، فزوَّارها قليلون 🙂 ، ولا يعرفها مصممُّوا الـCSS لأني مبتدئة تدوينيًا .

فكَّرتُ في تمرير هذه التدوينة كواجب لمصمِّمي الـCSS الَّذين أعرفهم كي يشاركوا في كتابة قائمة الأمنيات الخاصَّة بهم .

إذا مرَّ من هنا مصممٌّ لا أعرفه فأرجو منه التكرَّم بكتابة أمنياته 🙂 .


أمَّا عن قائمة أمنياتي فهيَ :

1- ربَّما يكون أكثر ما يعاني منه المصممُ مع الـCSS هو اختلاف قراءة المتصفحات لها .

ما الحلَّ ؟ .. الكثير من المتصفحات لا تستجيب للـمعايير القياسية ، وحتى إن استجابت فطريقة عرضها مختلفة للكثير من الخصائص ، إضافةً إلى أنَّ تحديثات الـCSS لا تطبَّق إلاَّ حين إصدار نسخةٍ جديدة من المتصفحات .

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

كيف بس ؟ 😀 خيالي جامح خخخخخخخ .

2- أتمنى أن يعطى المصمِّم قدرةً أكبر على التحكُم بالصور ، خصائص للتحكم بالضبابية | بالإضاءة | بدقة الألوان … إلخ .

3- أتمنى لو أننا نستطيع وضع خلفيات متدرجة الألوان دون الحاجة إلى صور .. سيكون أمرًا رائعًا .

4- أتمنى لو أنِّي أقدر على إضافة تأثيرات تشبه تأثيرات الفوتوشوب على الكائنات ، ظل .. إضاءة داخلية .. إلخ .

5- أتمنى – جدًا – تطوير الـpseudo -classes والـ pseudo-element .

اممممممم ، إذا تذكَرت أمنيةً أخرى فسأضيفها إن شاء الله 😀

ماذا عن أمنياتكم ؟!

هذا الواجب مرِّر إلى كلٍ من :

أبلة نورة | مع وردة

سلوى | اللطيفة جدًا

FTM | مع دعواتٍ بالتوفيق في الزواج 🙂

المصمم توقيع

أ.عوني

.

.

هؤلاء هم الَّذين أعرفهم تقريبًا ..

بقيَّة المدونات .. مدري ، يمكن فيني إحراج لتمرير الواجب لها .

: )

Advertisements

14 responses »

  1. السلام عليكم حياك الله أختي إحسان. معلومات مفيدة. أخشى في الواقع أنك إخترتي الإنسان الخطئ لأداء الواجب، فأنا أصنف من الأميين في لغة الـ css و إن كنت أعرف بعض قشورها.

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

    في أمان الله ..

  2. 🙂

    آسفة أ.عوني كنتُ أعتقد بأنَّك ملمٌ بها ..
    يالا .. نراك في واجب آخر ، عن الكاميرات مثلاً ..

    دعواتي بالتوفيق لك أستاذ

  3. يالله رائع !
    في الحقيقة أتفق معك بالنقطه الأولى وبشدة وهي أكثر الأمور التي أتطلع لحدوثها قريباً
    بالنسبه لرغبة Webmonkey حول الزوايا الدائرية لا أجدها فكرة ملحة جداً على الرغم من أنه سيكون من الرائع دعم ذلك
    إلا أني استخدم دائما بعض هذه الأدوات التي تسهل لي المهمة على سبيل المثال
    http://www.spiffycorners.com/

    السيء في الأمر أن CSS كانت في السابق تدعم الفلاتر كالـblur على الصور والروباط ولا أدري لماذا توقفت منذ عام 2004 ولكن أبت أنها كانت فلاتر لطيفه أحببت استخدامها بديل عن الصور

    شكراً موضوع رائع جداً وسأكتب قائمتي بإذن الله
    وفقك الله (F)

  4. السلام عليكم ورحمة الله وبركاته..
    أهلا بك أختي الكريمة إحسان مجددا، وأهنؤك على اختيارك الرائع هذا..
    حقيقة فكرة رائعة، ولو انني لأ أعتبر نفسي محترفا في عالم css إلا أنني يمكنني ان أدلي ملاحظاتي هنا حسب معارفي وبعد إذنكم طبعا:
    – بالنسبة للنقطة التالية:
    “فكرته هي ذات الفكرة الَّتي تراودني دائمًا ، وهي أن تعطي الـCSS المصمم القدرة على تحديد خصائص مميزة لكلماتٍ معينة .”
    فإنني أتساءل هنا: أليست CSS تمكننا من اختيار التنسيق الذي نرغب به لعنصر معين من خلال استعمال الوسم span؟ عن نفسي فإنني أعلم يقينا أن الوسم span مهمته الأساسية تمكيننا من تخصيص عنصر ما بتنسيق معين خاص به، إلا إذا كنت لم أفهم الأمنية حينها فالعتب على قصر فهمي ^_^
    – أيضا بالنسبة للنقطة التالية:
    “زوايا دائريَّة للعنصر .. بحيث يقلل من جهدنا في رسمها كل مرة بالفوتوشوب .. ويسمح لنا بإظهار إبداعات أكبر” فإن الأمنية رائعة، ولكن هذا لا يعني أن محترفي CSS لم يجدوا حلا للأمر، ولعل في هذه الصفحة مثال على ذلك:
    http://www.html.it/articoli/nifty/index.html
    ولكن طبعا سيكون من الأفضل لو تم توفير إمكانية التحكم في هذا الأمر بوسم خاص دون الإضطرار إلى اللجوء إلى طرق ملتوية، وهذه أمنية من أمنياتي أيضا.
    – بالنسبة لمسألة المعايير القياسية فإن أكبر مسبب لهذه المعظلة هو المتصفح أنترنت إكسبلورر 6 تحديدا لأنه المنتشر بكثرة، وأنا أعتقد هنا أن هذا الجانب يمس مطوري المتصفحات تحديدا، فلو تم إنشاء برنامج صغير نقوم بتثبيته مثلا مع المتصفح ليستطيع قراءة صفحات css بشكل سليم، فإن هذا الأمر سيجعل من css شبيهة بالفلاش أو silverlight مثلا، ولعله من الأفضل جعلها غير مقترنة بإضافة، فالعيب في المتصفح وليس من css نفسها، وهذا ما أعتقده في هذه النقطة..
    – أيضا بالنسبة لأمنيتك أختي إحسان بخصوص إضافة إمكانية تمكننا من إضافة تأثيرات معينة على النصوص من قبيل الظل مثلا، فإنني أذكر أن هذه الإمكانية متوفرة في CSS3 إن لم تخني الذاكرة، لكن المشكل تبقى في تخلف المتصفحات في هذا الجانب إلا القليل منها.
    أما باقي النقط فإنني وجدتها رائعة، ومنها ما هو أمنيتي حقا (منها أن نتوفر على وسوم تمكننا من جعل مربع div مثلا بأركان مستديرة دون اللجوء إلى استعمال صور)، وأيضا المسألة التي تتعلق بالجداول والمتعلقة ب cellpadding و cellspacing فإنني أراها مهمة أيضا..
    لعل الاقتراحات المقدمة لم تترك لي ما أقترح ^_^ وبيني وبينكم لو وفروا لنا ذلك فقط فخير وبركة ^_^
    بالمناسبة أختي إحسان، أعرف صديقا لي وهو محترف css أعتقد أن هذا الواجب سيروقه (وأكاد أجزم أنه على علم به)، وهذا رابط مدونته:
    http://www.cssbit.com
    شكرا مجددا أختي الكريمة إحسان وأرجو ألا يكون مروري ثقيلا..
    مني لك أرق تحية..

  5. أبلة نورة .. يا هلا فيكي بمدونتي يالغالية ، شرفتينا 🙂 .

    مشكلتي مع الـCSS هي أنِّي لا أعرف إلاَّ الـnotepad ، والتعليمات النصية ، ولما أشوف شي يعجبني في موقع أحاول أشوف طريقة تكرار الخلفية ورسمها وزي كده .

    شيء مشجع إنك تستخدم أدوات ومحررات متطورة 🙂 .

    بالنسبة للفلاتر ، صارت تُستخدم لتجنب أخطاء الـIE6 لأنه يدعمها ، تخيلي بس ! .

    يعني مثلاً ، المتصفح IE6 ما يدعم خاصية opacity لتغيير الشفافية ، لكن عشان أتجنب المشكلة هذي أستخدم filter:opacity 🙂 .

    بس ما أعرف فلتر الـblur بصراحة .

    أنتظر قائمتك بفارغ الصبر ، ربنا يبارك فيكِ 🙂

  6. أ.عبد الهادي .. أهلاً بكـ مجددًا 🙂 .. صدقني حتى أنا لستُ محترفة css ، هاوية لا أكثر وبالـ”دف” أصل إلى المتوسط .

    1- بالنسبة للوسم span فهذه ليست وظيفته ، هل سأكون مضطرة لوضع كل كلمة cat تمر أمامي بين وسمي span ؟! .

    2- بالنسبة للزوايا الدائرية ، فهناك الكثير الذين حاولوا أن يوجدوا طرق للتحايل – كما ذكرتم – من أجلها ، وأتذكر درس معقد للأستاذ كتوم حاول فيه رسم حواف دائرية باحترافيه .
    لكن إذا تمَّ تهيئة هذا من الـcss أساسًا ، فسينتقل المبدعون إلى ابتكار أفكارٍ جديدة للتصاميم ، كانت لدي مثلاً فكرة مجنونة ، وهي رسم فتاة كرتون من خلال الـdiv والـcss فقط ، لو كانت الحواف الدائرية موجودة بزوايا نختارها نحن لكان ذلك أسهل بالنسبة لي 🙂 .

    3- عن المتصفحات القياسية .
    يا أستاذ أنا لا يهمني فقط أن أرى الموقع المصمم حسب المعايير بصورة جيدة ، لكن يهمني أيضًا أن تصلني أول بأول تحديثات الـcss .
    هذا سيسهل على المصممين الكثير ، ويقودني إلى الحديث حول النقطة التي تليها .

    هل تعرف بأنَّ الفايرفوكس الأخير لا يدعم إلاَّ بعض خصائص الـcss3 كما قرأتُ والله أعلم ؟! .
    لو كانت هذه الأداة موجودة لما احتجنا إلى انتظار الإصدار الجديد من الفايرفوكس كي نستخدم هذه الخصائص ، ولأصبح الوصول إلى معلومات حول الـcss أكثر يسرًا من متابعة w3.org الغثيثة بالنسبة لي .

    شرفتنا أ.عبد الهادي ..

    نتمنى أن نرى لك دومًا تعليقات في الـspam = تعليقات ثرية 🙂 .

    وبالنسبة للأستاذ الكبير cssbit ، فأنا من متابعي مدونته ، وقد كنتُ أفكر بتمرير الواجب إليه ولكنِّي شعرتُ بالإحراج ، وقد مررتُ إليه الصفحة الآن .

    بالتوفيق ..

  7. وااااز مررة حماس اذا تحققت الأمنيات

    خاصة بعض الأفكار الجنونية <<== انا اسميها ابداعية

    انا اتمنى

    يسير من الممكن عمل خلفيات متعددة للموقع او العنصر
    فيعني مرة افتح الموقع احصل الخلفية حمرة اسوي ريفريش تطلع برتقالية او تتغير اللصورة

    الأداة حق الـ CSS انا اقترح مو بس الـ CSS باقي اللغات مثل الـ XML والPHP و……
    يعني في اسكربتات ما تعمل الا على الـ PHP 5 وفي استضافات متخلفة ما رقت اصدار الـ PHP
    وزي كده الأشياء التانية

    لكن الإضافة ربما تكون افضل لو كانت من نفس النظام يعني تكون مع نظام التشغيل زي الميديا بلير
    لأنو لو فكرت مين الي يركب الإضافة ؟؟
    اغلب الناس مارح تعرفها عوضاً عن تركيبها بس لو كانت موجودة راح تحدث نفسها تلقائياً

  8. التنبيهات: » أماني CSS - توقيع

  9. أهلين أخوي عامر ..

    بالنسبة للخلفيات المتعددة هذي برمجة بالجافا سكربت

    حتى الفكرة الثانية من أفكار webmonkey نفس الشي ، تنفع تسويها بالجافا سكربت .

    لكن فكرة الأداة للغات كثيرة حلوة ، بتفكنا من وجع الراس .. 🙂 .

    وصحيح أفضل تكون تابعة لنظام التشغيل 🙂

    وأهلاً بكـ دائمًا

  10. التنبيهات: css3 مع قرب اصداره , وخمس امنيات تتحقق !

  11. اتمنى تتحقق هالأمنيات

    بالنسبه للتحكم في الزواياالدائريَّة للعنصر اوالاطار فيه كود ممكن يساعدك بس اتوقع IE مايدعمة فقط سفاري و فيرفكس

    و ها هي الخاصيات:
    1- خاصية التحكم جميع الحواف جملة واحدة: (ضعيهما مع بعض بنفس القيمة)
    -moz-border-radius
    -webkit-border-radius

    2- خواص التحكم كل حافة لوحدها:
    * حافة اعلى اليسار:
    -moz-border-radius-topleft
    -webkit-border-top-left-radius

    * حافة اعلى اليمين:
    -moz-border-radius-topright
    -webkit-border-top-right-radius

    * حافة اسفل اليسار:
    -moz-border-radius-bottomleft
    -webkit-border-bottom-left-radius

    * حافة اسفل اليمين:
    -moz-border-radius-bottomright
    -webkit-border-bottom-right-radius

    دعواتكم لي بالشفاء

اترك رد

إملأ الحقول أدناه بالمعلومات المناسبة أو إضغط على إحدى الأيقونات لتسجيل الدخول:

WordPress.com Logo

أنت تعلق بإستخدام حساب WordPress.com. تسجيل خروج   / تغيير )

صورة تويتر

أنت تعلق بإستخدام حساب Twitter. تسجيل خروج   / تغيير )

Facebook photo

أنت تعلق بإستخدام حساب Facebook. تسجيل خروج   / تغيير )

Google+ photo

أنت تعلق بإستخدام حساب Google+. تسجيل خروج   / تغيير )

Connecting to %s