اپنی عنصر کی ویب سائٹ کو زیادہ موبائل دوست جوابدہ بنائیں

ایک موبائل ذمہ دار ویب سائٹ کسی بھی آن لائن کاروبار کا ایک اہم حصہ ہے۔

گوگل کسی بھی ویب سائٹ کی سرچ رینکنگ کے کلیدی عامل کے طور پر موبائل پیج لوڈ کی رفتار کو استعمال کرتا رہا ہے۔ اس کی بنیادی وجہ یہ ہے کہ آدھے سے زیادہ عالمی ویب ٹریفک موبائل ٹریفک سے آتا ہے۔

لہذا، آپ کی سائٹ کی صحت اور گوگل سرچ انجن میں بہتر درجہ بندی دونوں کے لیے ایک موبائل ریسپانسیو ویب سائٹ ناگزیر ہے۔ اس مضمون میں، ہم اس بات پر توجہ مرکوز کریں گے کہ ہم Elementor صفحہ بلڈر کے ساتھ موبائل ریسپانسیو ویب سائٹ

عنصر کی ذمہ دار ویب سائٹ ڈیزائن کیا ہے؟

ایک ذمہ دار ترتیب ہر اسکرین کے سائز کے مطابق خود بخود تمام مشمولات کی پیمائش کرکے جدید کام کرتی ہے۔ یہ موبائل اسکرین پر تصاویر اور مواد کو خود بخود تبدیل کرتا ہے تاکہ آپ کے ناظرین کسی بھی کوشش کے آپ کے مواد کو دیکھ سکیں۔

ہم میں سے بیشتر ایسے تھیم خریدتے ہیں جو موبائل کو بھی ذمہ دار قرار دیتے ہیں۔ تاہم ، جب آپ کے تھیم کا ڈیزائن موبائل اسکرین پر مکمل طور پر ٹوٹ جاتا ہے تو چیزیں مایوس کن ہوسکتی ہیں۔

ایسے حالات پر قابو پانے کے لیے، ہم ایک موبائل ریسپانسیو حل لے کر آئے ہیں جہاں آپ Elementor پیج بلڈر کے ریسپانسیو لے آؤٹ ٹولز کا استعمال کرتے ہوئے اپنی ویب سائٹ ڈیزائن کو شروع سے ہی بنا سکتے ہیں۔ ان موبائل ریسپانسیو ٹولز کی مدد سے، آپ اپنی ویب سائٹ لے آؤٹ کے کسی بھی کونے کو خاص طور پر، ٹائپوگرافی، پیڈنگ، اور مارجن اور موبائل الائنمنٹ کو موافقت دے سکتے ہیں۔ اس کے علاوہ، آپ موبائل پر کالم کی ترتیبات اور آرڈر کو تبدیل کرنے کے قابل ہو جائیں گے۔

اب ، آپ موبائل ویو موڈ میں سوئچ کرکے اپنے پیج کی موبائل ترتیب میں ترمیم کرسکتے ہیں اور موبائل لے آؤٹ کے مطابق ایڈجسٹ کرنے کیلئے درج ذیل آپشنز کو چیک کرسکتے ہیں۔

  1. چیک کریں کہ آیا موبائل سکرین پر کوئی ہیڈلائن بہت بڑی نظر آتی ہے۔
  2. مشمولات کے اطراف میں موجود مواد یا جگہ کی بھرتی کو چیک کریں
  3. صفحہ کالم کی سیدھ چیک کریں ، یہ کس طرح کامل نظر آتا ہے۔ مرکز ، دائیں یا بائیں
  4. کالم آرڈر چیک کریں ، اگر وہ صحیح ترتیب میں دکھائے جاتے ہیں یا آپ کو اسے تبدیل کرنے کی ضرورت ہے۔

اب ، ہم گہرائی میں کھوج کریں اور معلوم کریں کہ عنصر پیج بلڈر کے ساتھ چیزیں کس طرح کام کرتی ہیں۔

موبائل ، ڈیسک ٹاپ اور ٹیب کی ترتیبات کو کس طرح ایڈجسٹ کریں

تقریبا all قابل تدوین خصوصیات میں موبائل ، ڈیسک ٹاپ اور ٹیب کی ترتیبات کو ایڈجسٹ کرنے کا اختیار موجود ہے۔ اگر آپ مینو کے نچلے حصے میں جوابی موڈ پر کلک کرتے ہیں

اپنے موبائل ڈسپلے میں ہیڈ لائن ایڈجسٹ کریں

بعض اوقات ہم اپنی ڈیسک ٹاپ سائٹ پر ایک جر boldت مندانہ اور نمایاں سرخی چاہتے ہیں ، اور یہ ڈیسک ٹاپ ڈسپلے پر بالکل ٹھیک نظر آتی ہے ، لیکن جب آپ موبائل ویو کو آن کرتے ہیں تو ، ہیڈنگ پوری اسکرین پر لی جاتی ہے اور اس میں فٹ کی طرح نظر نہیں آتی ہے۔

آپ ٹیب اور موبائل پر کسی بھی متن عنصر کے متن کے سائز کو ایڈجسٹ کرسکتے ہیں۔ آپ موبائل ہیڈنگ کے ل text مختلف ٹیکسٹ سائز بھی ترتیب دے سکتے ہیں جو موبائل اسکرین پر بہت عمدہ نظر آتے ہیں اور بہتر انداز میں اسکرین پر فٹ ہوجاتے ہیں۔ اس ڈیمو پیج میں ، میں نے ایک سرخی تیار کی ہے جو ڈیسک ٹاپ سائٹ پر بہت عمدہ نظر آتی ہے ، جبکہ موبائل اسکرین پر یہ پوری اسکرین لیتا ہے۔

اگر میں ہیڈنگ کالم کے ترمیم کے آپشن پر کلک کرتا ہوں تو ، میں ٹائپوگرافی سیکشن میں جاسکتا ہوں جہاں میں سرخی کے سائز کو ایڈجسٹ کرسکتا ہوں جو ڈیسک ٹاپ اور موبائل اسکرین پر بھی ٹھیک معلوم ہوتا ہے۔ میں دونوں کو الگ سے کنٹرول کرسکتا ہوں۔ میرے ڈیسک ٹاپ سائٹ کے نظارے کے لئے ، ہیڈنگ کا سائز 49px ہے ، لیکن موبائل ویو پر ، اس میں فٹ نہیں آتا ہے

دوبارہ ایڈجسٹ کرنے کے ل I'll ، میں موبائل پریسپینٹو موڈ> اسٹائل> نوع ٹائپ> px سائز کو 30 میں ایڈجسٹ کرنے پر کلک کروں گا جو آسانی سے موبائل اسکرین پر فٹ ہوجاتا ہے۔

موبائل کے لئے بھرتی یا مارجن ایڈجسٹ کریں

پیڈنگز کو ایڈجسٹ کرتے وقت ، EM یا فیصد میں سیٹ ویلیو کی بجائے پکسلز میں ویلیوز کا استعمال نہ کرنے کی تجویز کی جاتی ہے کیونکہ یہ اسکرین کے مجموعی سائز کے مطابق سائز برقرار رکھے گی۔

آپ دیکھ سکتے ہیں کہ ہم نے پیڈنگ کو 70px دائیں اور بائیں کے طور پر استعمال کیا ہے ، جو ڈیسک ٹاپ سائٹ پر اچھی طرح سے نظر آتا ہے۔ تاہم اس ترتیب کے لئے موبائل منظر ایک مکمل گندگی ہے۔

ہم ہر طرف 17 px میں بھرتی کو ایڈجسٹ کرسکتے ہیں تو پھر یہ بالکل ٹھیک ہوجاتا ہے۔

متبادل کے طور پر ، آپ پورے کالمز کی ترتیب 750 px پر سیٹ کرسکتے ہیں جہاں آپ کے مواد کو کسی باکس میں ڈسپلے یا موبائل دونوں نظریات پر اسکرین کو ایڈجسٹ کرنے کی ضرورت کے بغیر کسی باکس میں دکھایا جائے گا۔ یہ باکس میں موجود مواد کو خود بخود ایڈجسٹ کرے گا۔

ہر کالم افقی طور پر بنائیں ، اور یہ تمام آلات میں حیرت انگیز طور پر ایڈجسٹ ہوگا

ایک بار جب آپ افقی طور پر کالم بناتے ہیں ، جس کو ڈیزائنرز سب سے زیادہ ترجیح دیتے ہیں ، تب آپ حصوں کی نقل تیار کرسکتے ہیں اور وقت کی بچت کرسکتے ہیں۔ ایک وقت میں ایک حص Createہ بنائیں اور پھر وقت کی بچت کے لئے اگر یہ بہتر ہو تو اسے دوبارہ استعمال کریں۔

موبائل / ڈیسک ٹاپ کے نظارے کے مطابق پس منظر کی تصویر تبدیل کریں

کچھ پس منظر کی تصاویر ڈیسک ٹاپ ویو پر اچھی لگتی ہیں ، لیکن امکان یہ ہے کہ یہ تصویر موبائل اسکرین پر اتنی زیادہ نظر نہیں آئے گی۔ لہذا ، تخلیقی انداز میں سوچیں اور موبائل اسکرین پر ایک مختلف شبیہہ منتخب کریں۔ مختلف موبائل ویو کو منتخب کرنے کے لئے سیکشن> اسٹائل ٹیب> پر کلک کریں اور ڈیوائس آئیکون پر کلک کریں اور موبائل ویو کو منتخب کریں۔ اب ، آپ جو بھی تصویر منتخب کرتے ہیں ، وہ صرف موبائل ویو پر ظاہر ہوگا۔

ڈیسک ٹاپ / موبائل منظر پر کسی بھی حصے کی مرئیت تبدیل کریں

آپ آلے کے مطابق کسی بھی حصے یا کالم کی مرئیت کو بھی کنٹرول کرسکتے ہیں۔

بعض اوقات ، ہم اپنے مواد یا تصاویر کو دو یا تین حصوں یا مختلف کالموں میں ڈسپلے کرتے ہیں ، لیکن ہم اسے موبائل پر آویزاں کرنا پسند نہیں کرتے ہیں۔ اسی لئے ایلیمینٹر وہ سیکشن چھپا سکتا ہے جسے آپ موبائل ویو پر دکھانا پسند نہیں کرتے ہیں۔

> سیکشن کی ترتیبات> اعلی> ذمہ دار پر جائیں وہاں آپ کو مختلف امکانات یا بصری ترجیحات نظر آئیں گی۔ آپ ڈیسک ٹاپ پر والے حصے کو چھپا سکتے ہیں ، ٹیب پر چھپ سکتے ہیں یا اپنی ترجیح کے مطابق موبائل پر چھپ سکتے ہیں۔

کالم آرڈر کو تبدیل کریں

آپ کالم آرڈر کو سیٹنگ سیکشن سے بھی تبدیل کرسکتے ہیں۔ کے پاس جاؤ؛ حصے کی ترتیبات> اعلی درجے کی> قبول> کالم کو تبدیل کریں اور ہاں پر کلک کریں۔

متبادل سیکشن بنائیں

موبائل اور ڈیسک ٹاپ ویو پر متبادل حصے بنائیں۔ بعض اوقات ، سلائیڈر سیکشن موبائل پر اتنا کارآمد نہیں لگتا جتنا ڈیسک ٹاپ پر ، لہذا آپ سلائیڈر سیکشن کو استعمال کرنے کے بجائے کسی اور حصے کو استعمال کرسکتے ہیں۔ آپ گو ایڈوانس ٹیب کے ذریعہ یہ کرسکتے ہیں> اس سیکشن کی مرئیت کو چالو یا بند کردیں جس پر آپ اس پر کوئی متبادل تصویر ڈسپلے اور شامل نہیں کرنا چاہتے ہیں۔

کالم کی چوڑائی کو ایڈجسٹ کریں

جب آپ موبائل ویو پر دیکھتے ہیں تو کالم کے سارے حصے میں 100 width چوڑائی مل جاتی ہے۔ تاہم ، موبائل پر کالم کی چوڑائی کے مطابق چوڑائی کو تبدیل کیا جاسکتا ہے۔ اگر آپ کے دو کالم ہیں تو ، آپ ہر حصے کی زیادہ سے زیادہ چوڑائی 50٪ مقرر کرسکتے ہیں۔

نتیجہ اخذ کرنا

ایلیمینٹر تمام سکرین کے سائز کے جوابی کالم لے آؤٹ کو کنٹرول کرنے کے لئے تمام طاقتور خصوصیات کے ساتھ آتا ہے۔ یہ آپ کو دیکھنے کے موڈ کے انتخاب کے مطابق ہر سیکشن کو ایڈجسٹ کرنے کی سہولت دیتا ہے۔ موبائل دوستانہ ویب سائٹ رکھنا ناگزیر ہے کیونکہ گوگل الگورتھم موبائل کو دوستانہ ویب سائٹوں میں درجہ بندی کو سب سے زیادہ سمجھتا ہے۔ بہتر ویب سائٹیں نہ صرف بہتر SEO حاصل کرنے کے لئے ضروری ہیں ، بلکہ آپ کو زیادہ ٹریفک حاصل کرنے کی بھی ضرورت ہے ، کیونکہ 80٪ سے زیادہ ٹریفک موبائل ویوز سے آتا ہے۔

اب عنصری پیج بلڈر خصوصی خصوصیات کے ساتھ آتا ہے جو اپنے صارفین کو بغیر کسی کوشش کے ایک موبائل دوستانہ سائٹ بنانے کی اجازت دیتا ہے۔ امید ہے کہ ، آپ کو میرا مضمون مفید معلوم ہوا اور ایلیمینٹر کا استعمال کرتے ہوئے ایک ذمہ دار ویب سائٹ بنانے کا طریقہ سے متعلق اپنے سارے جوابات مل گئے۔

"اپنی Elementor ویب سائٹ کو زیادہ موبائل دوستانہ جوابدہ بنائیں" پر 5 خیالات

    1. ہائے، کالم کی ترتیب کو تبدیل کرنے کے لیے آپ ڈریگ این ڈراپ براہ راست یا سیکشن ایکسپلورر استعمال کر سکتے ہیں۔ مرئیت کے بارے میں یہ سیکشن کا ایڈوانس سیٹ اپ ہے، آپ کو ڈیسک ٹاپ، ٹیبلیٹ اور موبائل کی مرئیت کو بند کرنا ہوگا۔

    1. ہائے، پیڈنگ بالکل جوابی نہیں ہے، یہ ایک مقررہ قدر ہے۔ اگر آپ کو کوئی جوابی مسئلہ ہے تو آپ کو ڈیسک ٹاپ، ٹیبلیٹ اور فون کے لیے مختلف پیڈنگ ویلیو کی وضاحت کرنی ہوگی۔

ایک تبصرہ چھوڑ دو

آپ کا ای میل پتہ شائع نہیں کیا جائے گا۔ مطلوبہ فیلڈز نشان زد ہیں *