طريقه ضبط الاستايل الاساسى لتنظيم عرض الصفحه داخل القالب

اكثر من 80% من نسبه ضياع الارباح وضياع الزوار بيكون سببها القالب وعلشان كده بنلاقى ان المبرمج بياخد فلوس اااد كده ?? طبعا لان بدون برمجه سليمه للقالب وبدون تكويد صحيح وتنظيم مناسب للاكواد يبقى الموقع كله باللى فيه ملوش لزمه بس لاحظ انى قولت ضياع الارباح ولم اقل اسباب الارباح




مثلا لو عرض المحتوى عندك غير متجاوب بالنسبه لاطار عرض الصفحه والزائر دخل من متصفح على جهاز صغير هيلاقى الشاشه فاضيه ابيض يا ورد
وده علشان فى صوره او اعلان عريض جدا بيخلى الجزء المرئى من الشاشه ملوووح ناحيه الشمال او ناحيه اليمين حسب اللغه المستخدمه يعنى العربى يمين والانجليزى يسار وبكده هيخرج بسرعه لان الصفحه فاضيه واوعى تقولى ان الاعلان متجاوب فيظهر متجاوب مهما كان الاخطاء, لاء الاعلان متجاوب اه لكن لازم كمان الديف او الحاويه التى تضمنه هى الاخرى تكون متجاوبه لان لو الحاويه عريضه اوى بدون تحديد متجاوب بالتالى الاعلان اللى جواها هيكون بنفس العرض بتاعها ودى مشكله فى معظم القوالب العشوائيه او مجهوله المصدر

شاهد ايضا: هل فى مقاله ممكن تظهر فى البحث بدون وصف تعريفى يوضح الغرض منها

جوجل ذكر حل نهائى لهذه المشكله بشويه خطوات او تأكيدات بسيطه تقدر من خلالها جعل الموقع متجاوب بالكامل مع جميع مقاس الشاشات وايضا جعل المحتوى والاعلان يتجاوب تماما داخل الحاويات المختلفه حاويه الموضوع او حاويه الاعلان او حاويه الاضافات او اى حاجه داخل الصفحه هتكون متجاوبه

اول شىء إتاكد من وجود هذا السطر البسيط ضمن اكواد الهيدر تحت ال <head> مباشره او فى بلوجر بعض القوالب كده &lt;head&gt;

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
اى سطر مختلف لعلامه الميتا دى استبدلها فورا لان ساعات بيكون فى زياده ملهاش داعى كما نصح جوجل فى مقالته

ثانى شىء إتاكد من وجود امر استجابه الحاويه اللى هى الديف <div> للنسبه الموجوده لاطار العرض لكل جهاز ولا تخرج عنه ابدا والامر ده هو

ضبط حجم المحتوى بالنسبة إلى إطار العرض

.div.fullWidth {
width: 100%;
}

هتلاقيه موجود ضمن الاستايل الاساسى لتنظيم عرض الصفحه داخل القالب ايضا هيكون ما بين <head> و </head>
هذه الاشياء البسيطه كفيله بتحقيق تجاوب كامل مع اى مقاس شاشه يفتح منها الزائر