ميهن مگ

چگونه میتوان یک سیستم طراحی صفحه فرود ایجاد کرد؟

چگونه میتوان یک سیستم طراحی صفحه فرود ایجاد کرد؟

یک راهنمای گام به گام برای ساخت صفحات فرود کاملا سفارشی در مقیاس _ بدون منابع مهندسی.

ساختن صفحات فرود می‌تواند فرآیند طولانی و پیچیده ای باشد که شامل چندین نفر در بخش های مختلف شود. اجازه دهید ببینیم چگونه می‌توان آن را مانند پر کردن یک فرم آسان نمود.

برخی از سریعترین شرکت های در حال رشد جهان موفق به ایجاد صفحات شخصی فرود برای بهینه سازی سرعت گفتگو، SEO و سایر کمپین های بازاریابی شده اند. اما هزینه تولید این صفحات فرود می‌تواند به سرعت به افزایش و کاهش بازده سرمایه گذاری شما کمک کند.

شرکت‌هایی مانند اینترکام حتی مشتری و ابزار داخلی را برای ساخت صفحات فرود در مقیاس ایجاد می‌کنند. اما شما نیازی به استفاده از منابع مهندسی با ارزش برای ساخت این ابزارها یا این صفحات ندارید.

دراین راهنما ، به شما نشان خواهیم داد که چگونه یک سیستم طراحی صفحات فرود ایجاد کنید که شما را  قادر سازد تا به سرعت (در عرض چند ثانیه) و به راحتی بسیاری از تغییراتی که شما از فرود سفارشی می‌خواهید را اعمال کنید.

ما به شما نشان می‌دهیم که چگونه بدون استفاده از سازنده‌ها‌ی صفحه ی فرود و بدون یک قالب پیش بینی شده (یا با آن، اگر خودتان ترجیح می‌دهید) مانند هر کسی دیگر آن را انجام دهید.

اما چگونه این موتور را طراحی کنید ؟ با طراحی صفحات فرود پویا با استفاده از CMS. یا در این مورد CMS Webflow.

این طراحی تنها ۶ مرحله دارد:

۱- محتوای خود را طراحی کنید : عناصر را در صفحه انتخاب کنید.

۲- مجموعه های خود را ایجاد کنید : یک پایگاه داده در Webflow CMS ایجاد کنید که صفحات شما ، دارایی‌ها را از آنها بیرون بکشند.

۳- اقلام مجموعه خود را ایجاد کنید : اقلام مجموعه خود را ایجاد کنید- این صفحه فرود شماست.

۴- صفحه فرود خود را طراحی کنید : صفحه واقعی‌ای را طراحی کنید که محتوا را از مجموعه ی شما بیرون بکشد.

۵- فیلد های مجموعه خود را بهم متصل کنید : عناصر نقشه در صفحه را در مجموعه قرار دهید.

۶- سایت خودرا منتشر کنید : با چند کلیک،صفحات خود را به وب ببرید.

برای کمک به شما ، یک سیستم صفحه فرود ایجاد کردم که شما می توانید آن را شبیه سازی کنید و صفحه خودتان را ایجاد کنید ، اما همچنین می‌توانید از ابتدا شروع به کار کنید.

من یک صفحه فرود در طول این GIF  ساخته ام.

مرحله اول : محتوای خود را طراحی کنید.

در اینجا ، شما عناصر محتوایی که برای پیش بردن مکالمه ها نیاز دارید را انتخاب می‌کنید که اینها به یک پایگاه داده که کپی صفحه ، تصاویر ، فیلم ها و غیره را ذخیره می‌کند،منتهی می‌شود. بدین منظور ، ما بر برخی از عناصر استانداردی که درمقاله مان در مورد چگونگی طراحی یک صفحه فرود بالا-تبدیل بحث کردیم،تکیه می‌کنیم.

  • جهت یابی: در حالیکه متعارفا صفحه فرود شما نباید شامل ناوبری باشد اما من فکر می‌کنم که این موضوع قابل بحث است . من ندیده‌ام که یکی بطور پیوسته بهتر از دیگری عمل کند.
  • بخش قهرمان : قهرمان معمولا تیتر اصلی و تیتر فرعی شما ، و یک تصویر یا ویدیو همگی متمرکز بر این نکته که به بازدیدکننده گفته شود که شرکت/محصول شما چیست را منعکس می‌کند. بهتر است تمرکز برروی منفعت باشد نه ویژگی.
  • فراخوای برای اقدام: شما این را تا جای ممکن برای کاهش اصطکاک ساده می‌خواهید.
  • بررسی اجمالی/راه حل ها : کمی عمیق تر جست و جو کنید که به مردم بگویید محصول شما چیست و چگونه می‌تواند مشکل مشتری شما را حل کند. بهتر است تمرکز بر روی منفعت باشد نه ویژگی.
  • ویژگی ها: جنبه های کلیدی محصول خود که به حل مشکل کمک می‌کند را توصیف کنید.
  • فرم ثبت نام دوم : من متوجه شده ام که یک فرم ثبت نام دیگر در پایین می‌تواند نرخ تبدیل برای صفحات خاص را افزایش دهد.

ممکن است بنظر زیاد پرمحتوا نباشد، اما با توجه به اینکه پیچیدگی زمان تصمیم گیری را بالا میبرد) قانون  (Hick، بسیاری از بازاریاب ها بر این عقیده هستند که آوردن صفحات فرود پایین اطلاعات ضروری موثر است.

توجه داشته باشید : هیچ یک از این عناصر اجباری نیستند. شما باید بر اساس آنچه که برای کسب و کار شما مناسب است اضافه و حذف کنید.

مرحله ۲ : مجموعه های خود را در  Webflow CMS ایجاد کنید.

خوب ، در حال حاضر ما به موتوری می‌رسیم که کل سیستم را  میسازد-Webflow CMS (سیستم مدیریت محتوا) . این کار دارایی ها (کپی صفحه ، عکس ها ، ویدیو و غیره) که صفحه های فرود از آن بیرون می‌آیند را ذخیره می‌کند.

برای شروع ، به Webflow  برو ، پنل CMS را باز کن ،create Collection  را کلیک کن ، و اسم آن را “صفحه فرود” بگذار.

الان یک فیلد  مطابق با نوع محتوا برای هر یک از عناصرمحتوا که در بالا ذکر شد، بساز و مجموعه خود را ذخیره کن.

فیلدهایی که ما بعنوان الگو استفاده کردیم در زیر آمده اند:

۱- سرتیتر(فیلد متن ساده)

۲- زیر تیتر(فیلد متن ساده)

۳- تصویر/ ویدیو قهرمان (فیلد تصویر)

۴- متن پایین (فیلد متن ساده)

۵- لینک پایین (فیلد لینک)

۶- عنوان فرم (فیلد متن ساده)

۷- متن پایین فرم (فیلد متن ساده)

۸- ویژگی ها (فیلد مرجع چند گانه)

اگر می‌خواهید ویژگی‌هایی که در هر صفحه ، نمایش داده می‌شود بر اساس هدف مخاطبان متفاوت باشد،می‌توانید از CMS  برای ایجاد آنها نیز استفاده کنید . برای انجام این کار،شما نیاز به ایجاد یک مجموعه دیگر به نام “ویژگی” با فیلدهای زیر دارید:

۱- اسم ویژگی (فیلد متن ساده)

۲- آیکن ویژگی (فیلد تصویر)

۳- توصیف ویژگی (فیلد متن غنی)

توجه داشته باشید که ممکن است فیلدهایی که شما برای ویژگی استفاده می‌کنید متفاوت باشد،اما این موضوع شروع قوی‌تری را فراهم می‌سازد.

حال که شما مجموعه ویژگی خود را دارید،لازم است آن را به مجموعه ی صفحه فرود خود متصل سازید.

۱- پنل مجموعه ی خود را باز کنید.

۲- برای باز کردن تنظیمات مجموعه ، بر روی آیکن دنده به سمت راست صفحه ی فرود کلیک نمایید.

۳- فیلد جدیدی بسازید.

۴- Multi-reference  را بعنوان نوع فیلد انتخاب کنید.

۵- Features Collection  را بعنوان منبع انتخاب نمایید.

۶- ذخیره کنید.

هنگامی که این مراحل را طی کردید ، قادر خواهید بود هر ویژگی ای که شما در هنگام ایجاد یک صفحه فرود جدید به عنوان اقلام در مجموعه ویژگی های خود اضافه کرده‌اید را انتخاب نمایید.

 

مرحله ۳ : اقلام مجموعه خود را ایجاد کنید.

در حال حاضر بخشی که شما برای هر صفحه فرود که می‌خواهید ایجاد کنید می آید : اقلام مجموعه خود را ایجاد کنید.

۱- Collection  خود را در پانل   Collectionباز کنید.

۲- New landing page  را کلیک کنید.

۳- اضافه کردن محتوا برای هر فیلد Collection

مرحله ۴ : صفحه فرود خود را طراحی کنید.

حالا به یک بخش آشنا بیایید : طراحی کردن یک صفحه فرود واقعی. بیشتر شما می‌خواهیدکه یک طراح آن را برای شما طراحی کند. خبر خوب اینکه آنها فقط باید آن را یکبار انجام دهند و آنچه که طراحی می‌کنند،واقعا کار خواهد کرد. آنها نیازی ندارند اول آن را به یک توسعه دهنده ارسال کنند Webflow.کد واقعی را در پس زمینه درهنگام طراحی خواهد نوشت.

اگرشما منابع را طراحی نکردید، چند گزینه دارید:

۱- از یک قالب استفاده کنید.

۲- کیت UI را شبیه سازی کنید (یاهر سایت Webflow  قابل شبیه سازی) تا عناصر پیش طراحی شده راcopy و به صفحه نهایی paste کنید.

۳- یک کارشناس Webflow  استخدام کنید.

در این مرحله ، درمورد کپی و تصاویر خاص نگران نباشید. فقط صفحه را به طریقی که می‌خواهید بر اساس عناصر مجموعه خود بسازی.

ICYMI : من یک قالب صفحه ی فرود شبیه سازی شده  و غیر مستقیم اینجا ساخته ام.

مرحله ۵ : فیلد Collection خود را به عناصرطراحی خود وصل کنید.

در اینجا جادو شروع می‌شود : عناصر صفحه‌ی خود را به مجموعه CMS  که قبلا ساختید ، متصل کنید. اینگونه است که صفحه شما میفهمد که کجا محتوایی که شما در  CMS  ایجاد کردید را بگیرد.

مرحله ۶ : سایت خود را منتشر کنید.

حالا برای اینکه پیج خود را منتشر  کنید ،Publish  را کلیک کنید. همین. حالا سایت خود را ببینید.

از اینجا،ایجاد یک صفحه ی فرود جدید به آسانی ایجاد یک آیتم Collection است.

کلیه یکپارچه سازی بازاریابی که ما برای شما داریم را  چک کنید تا فرم خود را تکمیل کنید،تبلیغات بگذارید،تجزیه و تحلیل کنید ، برنامه های ایمیل را اجرا کنید.

اینجاست که می‌توان فهمید که قالب صفحه ی  فرود قابل شبیه سازی باعث می‌شود تا سریعتر شروع کنید . شما می‌توانید آن را رایگان در زیر مجموعه یWebflow بسازید و هنگامی که آماده هستید آن را در دامنه خود فعال سازید ، میزبانی را اضافه کنید.

 

 

 

 

 

 

 

 

 

 

 

لطفا امتیاز دهید
0
برچسب ها :

دیدگاه شما

هفت + 17 =

بدون دیدگاه