×
دریافت قیمت
+ مشاوره رایگان

بهمن 12, 1401
لایت باکس( Lightbox) چیست و چه کاربردی دارد؟

لایت باکس( Lightbox)  چیست ؟

 

 

لایت باکس چیست

 

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

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

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

 

لایت باکس در وب سایت چیست؟

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

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

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

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

 

چگونه یک لایت باکس برای وب سایت خود بسازیم

 

 

چگونگی ساخت لایت باکس

 

 

شما می توانید از ابتدا یک لایت باکس ایجاد کنید، اما لازم است که با HTML، CSS و جاوا اسکریپت آشنا باشید. غیرتوسعه‌دهنده‌ها می‌توانند ابزارهایی را پیدا کنند که فرآیند را ساده‌تر می‌کنند، بنابراین نیازی به لمس یک خط کد برای ایجاد یک لایت باکس سفارشی برای وب‌سایت خود ندارند. فرآیند ایجاد یک لایت باکس بسته به پلت فرم ساخت وب سایت یا ابزار شخص ثالثی که استفاده می کنید متفاوت است.

 

نحوه استفاده از لایت باکس

جعبه های لایت بسیار ساده و آسان برای استفاده هستند. امروزه آنها ممکن است با برخی عملکردهای اضافی مانند توانایی کم کردن و روشن کردن نور شما با لمس یک دکمه ارائه شوند. اما عملکردهای کلی هنوز یکسان است.

 

نمونه های لایت باکس

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

 

لایت باکس تبلیغاتی

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

 

لایت باکس موبایل

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

 

لایت باکس ایمیل

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

 

لایت باکس کوکی ها

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

 

زمان و نحوه استفاده از پنجره بازشوی لایت باکس در وب سایت خود

 

 

نحوه استفاده از لایت باکس

 

 

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

 

  • فوراً یک پنجره بازشو نشان داده نشود. در مورد آن فکر کنید . چرا بازدیدکنندگان می خواهند در لیست پستی شما ثبت نام کنند، اگر حتی نمی دانند برند شما چه کاری انجام می دهد؟ لایت باکس را طوری تنظیم کنید که زمانی ظاهر شود که کاربران شما مدتی را صرف مرور کرده اند و قبلاً در سطحی درگیر شده اند.

 

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

 

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

 

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

 

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

 

نکات طراحی لایت باکس و کپی رایتینگ

 

1.آن را ساده نگه دارید.

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

 

2.زبان واضح و دقیق را پیاده سازی کنید.

 مطمئن شوید که پیامی که می‌خواهید ارسال کنید به راحتی با کلمات ساده‌ای که دور از ذهن نیستند قابل درک است. البته، همیشه می توانید یک تفاوت ظریف شخصی کوچک اضافه کنید که هویت برند شما را تقویت کند.

 

3.از سلسله مراتب بصری در متن خود استفاده کنید.

 پیام مرکزی پنجره بازشو را مشخص کنید و سپس مطمئن شوید که برجسته ترین متن در طراحی شما است. به عنوان مثال، اگر می خواهید به مشتریان خود 10 درصد تخفیف ارائه دهید، این اطلاعات باید با اندازه بزرگتر و داشتن فضای خالی در اطراف آن برجسته شود.

 

4.با بقیه هویت برند خود هماهنگ باشید.

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

 

5.دکمه CTA (Call-to-Action) خود را برجسته کنید.

 به طور کلی باید فقط یک دکمه وجود داشته باشد که کاربران باید روی پنجره بازشو کلیک کنند و آن معمولاً دکمه ثبت نام یا شکل دیگری از  CTAاست. با استفاده از یک رنگ غالب که در پس زمینه برجسته است، آن را برجسته کنید یا با یک حاشیه بر آن تأکید کنید.

 

6.متن واضح را در CTA خود بگنجانید.

کاربران باید فوراً بفهمند روی چه چیزی کلیک می‌کنند. بسته به زمینه، عباراتی که معمولاً استفاده می‌شود عبارتند از «ثبت‌نام» یا «اشتراک»، اما می‌توانید با استفاده از عبارتی مانند «مرا در جریان نگه دارید» یا «به سرگرمی بپیوندید» کمی شخصیت به آن اضافه کنید.

 

7.اضافه کردن یک تصویر چشم نواز که متناسب با برند شما باشد را در نظر بگیرید.

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

3.5/5 - (2 امتیاز)
مقالات مرتبط
پیام بگذارید