مهند عبدالرازق

frontend developer

https://github.com/Muhnad

101 نقاط السمعة
79.3 ألف مشاهدات المحتوى
عضو منذ
تستخدم الـ`data-*` لتخزين وحفظ بيانات قط تستخدم فيما بعد. اما عن الـ`aria-*` فهي تستخدم لما يعرف بقابليه الوصول 'accessibility' وهي اشياء تكتب لجعل قارئات الشاشه 'screen readers' قادرة علي وصف المواقع بشكل جيد للمستخدمين. المقصود باستخدام `aria-hidden` هي منع قارئات الشاشه من قراءة العنصر اى تجاهله. اما عن `aria-label` فهي لوصف العنصر وتقوم قارئات الشاشه بقراءة العنصر بما تحتويه قيمه الـaria-label وتتجاهل الكلام الذي يحتويه العنصر. *مثال*: X في هذا المثال سيري المستخدم العادي ان الـbutton يحتوي علي علامة X
بما انك الان تعملين في كورا كنت من فترة ارسلت الي قسم الشكاوي ان الموقع غير قابل للوصول كليا "Accessibility" وكنت قد كتبت لهم المشاكل والحلول ولكن لم يُجب احد علي ولم يتم تعديل الموقع حتي الان،اتمني ان تعملوا علي الاهتمام بقابلية الوصول في الموقع الفترة القادمة .
شكرا سامر :)
**مصر** ، ولكن انا اتكلم هنا علي الفكرة لا اريد حصر الكلام علي دولة محدده لذلك لم اوضح في البدايه لاي دوله هذا القانون.
بالفعل اقوم كل فترة بنشر مقالة تتحدث عن كيفية إنشاء مواقع سريعه هنا : https://www.makalcloud.com/u/eb86501d4b89123f21557ea63d2c2063 يوجد في منصة udacity مساقين يتحدثان عن تهيئة موقعك لكي يكون ذو اداء وسرعه عالية يمكنك الاطلاع عليهم من هنا : https://www.udacity.com/course/browser-rendering-optimization--ud860 https://www.udacity.com/course/website-performance-optimization--ud884 ايضا كمطور ويب يجب عليك التعرف علي اداوات المطور "DevTools" التي توفرها جوجل كروم لانها تٌطلعك علي كل شئ يحدث لموقعك ومن خلالها يمكنك تحديد اسباب تباطئ موقعك و كل شئ يحدث في موقعك قبل واثناء وبعد التحميل.
بالفعل موقع حسوب سرعتة ليست جيدة وخصوصا بعد التحديث الأخير حيث ان المتصفح يقوم بعمل recalculate style ومن ثم paint هذا يسبب الكثير من الـjank مما يسبب تباطئ سرعة الموقع هذا غير اشياء اخري مثل وجود ملفات تمنع المتصفح من عرض المحتوي كملفات الـCSS & JS و ايضا وجود عدد من الصور كبيرة الحجم والمساحة واشياء اخري تقنية كثيرة اتمني من مطوري حسوب الاهتمام بسرعة واداء الموقع.
المتصفح يقوم بتخزين الملفات في حالة اذا كان المسئول عن الموقع مفعل خاصية التخزين"Cache" في موقعة او الاستضافة توفر ذلك ، لو لم يتم تفعيل الخاصية عند زيارة المستخدم للموقع في كل مرة سيتم تحميل الملفات من جديد.
هذا يتوقف علي حجم ملف الـCSS ، اذا كان حجم الملف صغير فان وضع الملف داخل وسم style في صفحة الـHTML أفضل لانه لن يمنع الصفحة من التحميل او عرقلتها ، بينما اذا كان الملف كبير فانه يتوجب عليك وضعه في ملف خارجي ويمكنك ايضا ان تقوم بتقسيم الملف الي جزئين الجزء الظاهر علي الشاشه للمستخدم عند طلب الصفحة وتضعه في وسم style بينما بقية الملف تضعها في ملف خارجي. هذه النقطة بسبب الحفاظ علي اداء وسرعة الموقع يمكنك الأطلاع
شكرا :)
تم تحديث المقاله يمكنكم الأطلاع عليها الان https://www.makalcloud.com/post/tuxu7vzit
انا لم ارفع شئ الجافاسكريبت هي من تقوم برفع المتغير اى متغير تراه الجافا سكريبت تقوم برفعه دون رفع قيمته وهذه هي أليه عمل رفع المتغيرات في الجافا سكريبت. اما بالنسبة الي الكود التاني تم تعريف المتغير فوق تلقائيا من جافاسكريبت ومن ثم بعد طبعه تم اسناد قيمه له.
لا حضرتك لا يتم احتساب اى عنصر مخفي في بنية الصفحة ، عندما يقوم المتصفح ببناء الـDOM الخاص بملف الـHTML وبعد كده وهو بيبني الـCSSOM للملف لما يلاقي عنصر الصورة واخد display:none مش هيتم استدعاء في الـrender tree يعني مش هياخد اى وقت من تحميل الصفحة. هنا في المقاله دي بتوضح ازاى الصفحة بتظهر للمستخدم https://www.makalcloud.com/post/81x30nadd
دائما قبل بدأ العمل يكون هناك مقابله بينك وبين العميل للتحدث عن تفاصيل العرض والعمل وعندما يطرح العميل افكارة وما يريدة انت في هذه اللحظة بيدك القرار اما الموافقه علي العرض وتكملة العمل او الرفض ، اذا وجدت ان الموقع المراد عملة يتنافي مع افكارك الشخصية ومبادئك اعتذر للعميل ووضح له الاسباب. ولا يوجد حرج في ذلك فقد فعلت ذلك من قبل لعميل و تفهم الأسباب وبعد ذلك في عمل اخر تحدث معي لعمل موقع اخر له. لكن اذا كنت
ما شاء الله مجهود جميل وبالتوفيق دائما وايضا اداه alert جميلة :)
ليس بالضروة المتحدثين باللغه العربيه هم من يستخدمون هذه الاداه يوجد العديد من اللغات غير العربية التي تستخدم ايضا نظام RTL . من الممكن جعل نسخة اخري معربة من الموقع بما ان صاحب الموقع والاداة شخص عربي ولكن النسخة الانجليزية هي شئ اساسي لكي يفهم جميع المستخدمين الاداة كيف تعمل :)
ممكن تستخـدم 3 طرق: 1- عن طريق أستخدام Math.ceil() سوف تقوم بتقريب الناتج الي اقرب رقم صحيح من فوق يعني 4.2 ستجعلها 5. 2- عن طريق أستخدام Math.floor() هي عكس ceil اى انها تقوم بتقربة الرقم الي الرقم الاصغر يعني 4.2 ستجعلها 4. 3- عن طريق أستخدام Math.round() وهي الطريقه الصحيحه حيث انها تقوم بتقريب الناتج الي اقرب رقم صحيح فعلي اى 4.2 ستكون 4 ، 4.6 ستكون 5.
اصلا فكرة السلايدر انه يعرض أكبر كم ممكن من المعلومات في مكان صغير ، فانت لو عندك معلومات كتير وشايف انها هتاخد مساحة كبيرة من الموقع يبقي استخدم السلايدر :)
شكـرا لكِ واتمـني لكِ أيضا وللجميع التوفيق :)
شكـرا يا محـمد :)
أستمـر في الترجمـة أسـلوبك جميـل و سهل وفققـك الله في أنتظـار الباقـي :)
أنت لو عاوز تتعلـم تسـوق السيـارة هـتعمل ايه في الأول ؟ الاول هتتعلم الاساسيـات اللي هي ازاى تشغل العربية أزاى تحركها و هكـذا هنـا برده نفـس الشـئ لازم تبـدا مع الأساسيـات اللـي هي html,css,js وبعد كده تتعلـم لغات البرمجـة، أنما ممكـن تبـدأ تتعلـم لغـات البرمجـة عادي ولكن المسار الصحيـح هو تعلم الاساسيات ومن ثم البرمجـة. اما التصميـم محتـاج تتعلـم أى برنـامج تقـدر تشتغـل و تعمل من عليـة التصميـم في برامـج كتير زي photoshop , sketch ممكـن تسأل حـد متخصص فـي
مصطلح الـweb design أصـلا أتغيـر لم يعـد هنـاك مـُسمـي وظيفي يسمـي web designer ، أصبـح هنـاك : - UI&UX designer وهو المسئـول عـن دراسـة المشـروع و أختيـار الألوان المناسبـة و من ثـم تحـويلهـا الـي تصميـم PSD . - Front-end developer وهـو الذي يقـوم بتحـويـل التصميـم "PSD" الـي واجهـة أماميـة باستخـدام HTML5,CSS3 JS. -backend developer وهـو المسئـول عـن دينامكيـة المـوقع والتعامـل مع البيـانات و السيرفر و يستخـدم لغـات PHP , Asp,sql ولغـات أخري علي حسـب المشروع.
حـلوة الفكـرة جـدا ربنـا معـاكـم يا شبـاب و نشـوف الكتـاب مـُتـرجم الي العربيـة قريـبا
هذا العمل مشابة لهذا العمل http://codepen.io/Jackthomsonn/pen/xZNKzK هل مجرد توارد أفكار بينكما :D