8 أمثلة جميلة لنماذج الاتصال + كيفية إضافتها إلى موقع الويب الخاص بك

خمس نصائح لإبراز تصميم نموذج الاتصال الخاص بك

قبل أن ندخل في أمثلة نماذج الاتصال الحقيقية ، دعنا نأخذ منعطفًا سريعًا ونتحدث عما يجعل نموذج الاتصال رائعًا. سيحدد هذا الانعطاف المرحلة حيث نناقش ما يفعله كل مثال من نماذج الاتصال بشكل جيد في القسم التالي.

من المرجح أن يكون لديك نموذج اتصال لأنك تريد من الناس تعبئته. فكيف تجعل المزيد من الناس يستخدمونها؟ إليك بعض أفضل الممارسات ...

1. قم بالإبلاغ بوضوح عن الغرض من استمارتك

إذا كان لديك نشاط تجاري أو موقع ويب مزدحم ، فقد يكون لديك عدة نماذج اتصال لاستخدامات مختلفة. على سبيل المثال ، يمكن أن يكون:

• نموذج استفسارات المبيعات

• نموذج دعم العملاء

• نموذج طلب عبر الإنترنت

• استمارة طلب رد

• إلخ.

هناك طريقتان أساسيتان للتعامل مع هذا وسترى كلاهما في أمثلة نموذج الاتصال الواقعي أدناه:

1. أشكال منفصلة. أنشئ نماذج منفصلة لكل حالة استخدام وأضف نصًا يوضح بالضبط ما يفعله كل نموذج.

2. حقل منسدل. أضف حقلاً منسدلًا في أعلى النموذج يسرد حالات الاستخدام المختلفة ويوجه نموذج الاتصال تلقائيًا إلى المكان الصحيح.

في كلتا الحالتين ، استخدم تسميات النموذج والنص المحيط لتوضيح الغرض من كل نموذج اتصال للزائرين تمامًا.

2. تحديد طول النموذج لمزيد من التحويلات (ولكن لا تنس الجودة)

مع تساوي كل الأشياء ، يبدو أن البيانات تشير إلى أن نماذج الاتصال الأطول تعني عددًا أقل من عمليات الإرسال.

على سبيل المثال ، قام HubSpot بتحليل أكثر من 40000 صفحة مقصودة ولاحظ وجود ارتباط واضح بين معدلات التحويل وعدد حقول النموذج.

يبلغ معدل التحويل الأقصى حوالي ثلاثة حقول. ينخفض ​​معدل التحويل بشكل مطرد حتى ثمانية حقول نموذجية ، قبل التسطيح:

مصدر

في ملاحظة أكثر قصصية ، اختبر Marketo ثلاثة أشكال بنتائج مماثلة لـ HubSpot:

• 5 حقول - معدل التحويل 13.4٪

• 7 حقول - معدل التحويل 12.0٪

• 9 حقول - 10.0٪ معدل التحويل

بالطبع ، قد لا يكون مجرد الحصول على المزيد من عمليات إرسال نماذج الاتصال هو هدفك الحقيقي ، لذا فإن الأمر ليس بهذه البساطة مثل مجرد خفض عدد الحقول في النماذج الخاصة بك إلى الحد الأدنى.

على سبيل المثال ، بينما قد تحصل على المزيد من عمليات الإرسال عن طريق تقليل الحقول ، فقد لا تكون هذه الطلبات عالية الجودة لأن حاجز الدخول منخفض للغاية.

بشكل عام ، هناك قاعدة عامة جيدة تتمثل في التخلص من جميع الحقول غير الضرورية ، ولكن لا تستبعد الحقول التي تجمع المعلومات المهمة فقط من أجل تقصير نموذجك ، خاصةً إذا كانت هذه المعلومات تعمل على تأهيل العملاء المتوقعين.

3. استخدم التصوير المصغر الذكي لشرح المجالات

إذا كان نموذج الاتصال الخاص بك يحتوي على أكثر من مجرد حقول "الاسم ، البريد الإلكتروني ، الرسالة" القياسية ، فإنك تخاطر بإرباك الزائرين.

على سبيل المثال ، إذا كان لديك حقل "ميزانية" ، فقد يكون من غير الواضح الغرض من هذه الميزانية. هل هو للمشروع بأكمله؟ هل هو لجزء محدد فقط؟

لتجنب مثل هذا الالتباس ، يمكنك إضافة "صورة مصغرة" إلى نموذج الاتصال الخاص بك.

Microcopy هو في الأساس نص توضيحي صغير يصاحب حقول النموذج لجعلها أكثر وضوحًا. على سبيل المثال ، انظر إلى حقل حجم المدفوعات أدناه (سترى هذا المثال لاحقًا أيضًا):

4. تجربة أشكال مختلفة

عندما يفكر معظم الناس في نموذج الاتصال ، فإنهم يصورون نفس النموذج الأساسي المضمن الذي تراه في معظم مواقع الويب. ولكن إذا كنت ترغب في تسهيل اتصال الأشخاص بك ، فمن المفيد أحيانًا تجربة طرق عرض مختلفة ، مثل النافذة المنبثقة أو شريط التنبيهات.

على سبيل المثال ، يمكن أن يكون وجود زر اتصال عائم على جانب موقعك أمرًا رائعًا لنموذج الاتصال بالدعم. إنه يجعل من السهل جدًا على المستخدمين الاتصال بك فور حدوث مشكلة ، دون مطالبتهم بالبحث عن صفحة الاتصال الخاصة بك:

5. أخبر الناس بالخطوات التالية وحدد التوقعات

لم ينته تصميم نموذج الاتصال الخاص بك بمجرد أن يضرب الأشخاص "إرسال"!

لتقديم تجربة مستخدم أفضل ، يجب أن تخبر الأشخاص بالضبط بما سيحدث بعد ذلك والوقت الذي سيستغرقه. على سبيل المثال…

• هل تجيب على كل الاستفسارات أم على بعضها فقط؟

• كم من الوقت سيستغرق الرد؟

• هل سترد عبر البريد الإلكتروني أو بأي طريقة أخرى؟

إذا حددت توقعات واضحة ، فلن يتساءل زوارك عما يحدث وما إذا كان النموذج الخاص بك يعمل أم لا.

ثمانية نماذج اتصال رائعة من مواقع الويب الحقيقية

الآن بعد أن تعرفت على أفضل الممارسات ، دعنا نلقي نظرة على بعض تصميمات نماذج الاتصال في العالم الواقعي لإلهام تصميمك الخاص وإظهار أفضل الممارسات لك أثناء العمل.

1. شريط

يُعد نموذج الاتصال الخاص بالمبيعات في Stripe مثالًا رائعًا على كيف أن جمع القليل من المعلومات الإضافية في بعض الأحيان يمكن أن يجعل نماذج الاتصال الخاصة بك تولد المزيد من العملاء المحتملين المؤهلين (حتى لو كان ذلك قد يقلل من معدل التحويل الأساسي قليلاً).

بالإضافة إلى حقول المعلومات القياسية ، يضيف Stripe حقل حجم المدفوعات حتى يتمكنوا من فهم الجودة المحتملة لكل عميل متوقع بشكل أفضل.

علاوة على ذلك ، هناك بعض خيارات التصميم الرائعة الأخرى بما في ذلك:

• دليل اجتماعي - تضيف تلك الشعارات الموجودة على الجانب دليلًا اجتماعيًا من خلال عرض جميع الشركات الناجحة التي تستخدم Stripe.

• Microcopy - قد يكون مصطلح "حجم الدفعات" مربكًا بعض الشيء ، لذلك يضيف Stripe بعض النسخ المصغرة المفيدة التي تشرح كيفية ملء الحقل.

• الغرض - يوضح Stripe تمامًا أن هذا النموذج مخصص فقط لاستفسارات المبيعات. هذا يضمن عدم جعل الأشخاص يحاولون استخدامه للدعم أو للاستخدامات الأخرى غير المتعلقة بالمبيعات.

2. Getsitecontrol

هنا في Getsitecontrol ، نتعامل مع تصميم نموذج الاتصال الخاص بنا بشكل مختلف قليلاً.

بدلاً من إنشاء صفحة "اتصل بنا" مخصصة يتعين على الزائرين الانتقال إليها ، نقوم ببساطة بتضمين رابط " اتصل بنا" الذي يفتح نافذة منبثقة هناك ، وبعد ذلك - لا يلزم إعادة تحميل الصفحة.

هذا مناسب حقًا للأشخاص لأنهم يستطيعون ...

• الوصول إلى نموذج الاتصال الخاص بنا من أي صفحة على الموقع ،

• أرسل رسالة دون مقاطعة أي شيء آخر كانوا يفعلونه (مثل قراءة منشور المدونة هذا!).

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

3. كينستا

لدى Kinsta صفحة "اتصل بنا" واحدة توجه المستخدمين تلقائيًا نحو نموذج الاتصال المناسب دون مطالبتهم بإعادة تحميل الصفحة.

يسرد Kinsta طلبات الاتصال الخمسة الأكثر شيوعًا:

1. التسعير أو الخطط

2. الميزات أو المعلومات الفنية

3. طلب الهجرة أو أي سؤال ذي صلة

4. منشور ضيف ، منشور برعاية ، أو طلب رابط خلفي

5. أي شيء آخر

عندما يحدد المستخدمون هدفهم ، يعرض Kinsta إما نموذج اتصال شخصي أو رسالة.

يسمح هذا لـ Kinsta بجمع المعلومات التي يحتاجون إليها بالضبط ، دون إثقال كاهل الزائرين بحقول غريبة.

على سبيل المثال ، في نموذج الاتصال الخاص بالتسعير أو الخطط ، تضيف Kinsta حقولًا إضافية لفهم عدد مواقع الويب والزوار التي يتطلع الشخص لاستضافتها ، ولكن هذه الحقول لا تظهر في نموذج "أي شيء آخر".

تضع Kinsta أيضًا توقعات واضحة في الأعلى - "سنتواصل معك خلال يوم عمل واحد".

4. فحص الاختيار

فحص الاختيار لديه نموذج اتصال طويل . للوهلة الأولى ، قد تعتقد أن هذا سيقتل معدلات تحويل النموذج. وهذا نوع من الحقيقة - فاختبار الاختيار سيتلقى بلا شك عددًا أقل من الطلبات المقدمة للنماذج مقارنة بنموذج أقصر.

لكن دعنا نتحدث عن سبب هذا في بعض الأحيان ، ولماذا يعد هذا مثالًا رائعًا لنموذج الاتصال.

تعمل خدمة Choice Screening في مساحة متخصصة للغاية بين الشركات. إنهم يحاولون الحصول على عملاء متوقعين مؤهلين سيتحولون إلى عملاء لفترة طويلة ، وليس فقط عمليات إرسال نماذج الاتصال.

من خلال قائمة الخدمات التفصيلية والعديد من مربعات الاختيار الخاصة به ، فإن النموذج سوف يتخلص من الأشخاص الذين ليسوا متأكدين مما يريدون حتى الآن ويسمح فقط من خلال العملاء المتوقعين المؤهلين الذين لديهم فرصة كبيرة للتحول إلى عملاء.

يمكنك القول أن Choice Screening تقوم بفحص عملائها المحتملين باستخدام نموذج الاتصال هذا!

5. جويل كليتك / كتابة الإعلانات غير الرسمية للأعمال

جويل مؤلف إعلانات محترف ، لذا يمكنك المراهنة على تصميم ونسخة نموذج الاتصال الخاص به.

نموذج Joel نفسه بسيط ، مع الحقول القياسية بالإضافة إلى بعض الحقول المؤهلة الإضافية لميزانية الشخص. ومع ذلك ، فإن كل شيء يحدث بجوار النموذج الذي يجعل هذا مثالًا جيدًا على نموذج الاتصال.

في هذا النص ، يقوم جويل بعمل رائع في تحديد التوقعات وتأهيل العملاء المتوقعين. كما أنه يبتعد عن قصد العملاء ذوي الميزانية المنخفضة من خلال مناقشة الحد الأدنى من أسعاره. في حين أن جويل يمكنه إزالة هذه الإشارات للحصول على معدل تحويل أعلى مقدمًا ، فإن القيام بذلك سيؤدي في الواقع إلى نسبة أقل من العملاء المحتملين المؤهلين وينتهي به الأمر إلى إضاعة وقت جويل.

6. نيل باتل

يدير Neil Patel أحد أشهر مواقع التسويق الرقمي في العالم ، لذا يمكنك أن تكون متأكدًا تمامًا من حصوله على الكثير من عمليات إرسال نماذج الاتصال.

للمساعدة في توجيه هذه الطلبات إلى المكان الصحيح ، يتضمن نيل قائمة منسدلة "أود الدردشة حول" حيث يمكن للأشخاص الاختيار من بين مجموعة محددة مسبقًا من الخيارات. كما أنه يستخدم بعض النسخ المصغرة في مربع العناصر النائبة لمناشدة الأشخاص لإبقاء رسائلهم قصيرة وفي صلب الموضوع.

هذا بسيط - ولكن في بعض الأحيان يكون بسيطًا هو كل ما تحتاجه في تصميم نموذج الاتصال الخاص بك.

7. مختبر التركيز

حسنًا ، هذا ممتع وغريب الأطوار ولن ينجح بالتأكيد في كل الأعمال. ولكن إذا كنت في مساحة إبداعية (أي Focus Lab) ، فإن إنشاء تصميم نموذج اتصال غريب الأطوار مثل هذا يمكن أن يظهر أنك قادر على التفكير خارج الصندوق.

بدلاً من إنشاء نموذج تقليدي ، يستخدم Focus Lab أكثر من نهج على غرار Mad Libs حيث يقوم الزوار بإدخال معلوماتهم في فقرة موجودة. باستخدام هذا النهج ، فإن Focus Lab قادر أيضًا على جمع المزيد من المعلومات (مثل الأهداف والميزانية) دون المظهر المهيب الذي قد يحتوي عليه تصميم نموذج الاتصال التقليدي.

8. CAMICB

CAMICB ، اختصار لمجلس الاعتماد الدولي لمديري الجمعيات المجتمعية ، يقدم شهادة للجمعيات المجتمعية في الولايات المتحدة الأمريكية.

الشيء الملحوظ في نموذج الاتصال CAMICB هو أنه يستخدم هجين منبثق / نهج صفحة "اتصل بنا". عندما يصل المستخدمون إلى صفحة اتصل بنا ، يفتح موقع CAMICB على الفور نموذج اتصال منبثق بسيط حيث يمكن للزوار إرسال رسائلهم.

مع ثلاثة مجالات فقط ، يحافظ CAMICB على شكله قصيرًا ومباشرًا. بعد ذلك ، يقوم النهج المنبثق بإنشاء واجهة لطيفة خالية من الإلهاء حيث يكون التركيز بالكامل على النموذج.

هذا يجعل تقديم استفسار حول أقل احتكاك ممكن.

ولجعل الأمور أسهل ، يعرض CAMICB أيضًا نموذج اتصال منزلق يمكن للمستخدمين الوصول إليه في تذييله:

كيفية إنشاء تصميم نموذج الاتصال الخاص بك القابل للتخصيص

بعد تصفح أمثلة نماذج الاتصال الثمانية هذه ، من المحتمل أن يكون لديك مجموعة من الأفكار تدور حول كيفية تطبيق هذه المبادئ على تصميمات نماذج الاتصال الخاصة بك.

إذا كنت ترغب في البدء ، [Getsitecontrol] (/ feedback-popup / يمكن أن تجعلك تعمل في لمح البصر.

بخلاف معظم حلول نماذج الاتصال ، يتيح لك Getsitecontrol الاختيار من بين أربعة مواضع مرنة وعشرات من القوالب لنموذجك. يمكنك إنشاء نافذة منبثقة تقليدية مثل تلك التي رأيتها باستخدام CAMICB وموقع Getsitecontrol على الويب. أو يمكنك تغيير الأمور باستخدام الشرائح الإضافية وأشرطة الإشعارات والأزرار والمزيد.

ستتمكن من إضافة العديد من الحقول (أو أقلها) حسب حاجتك للحصول على عمليات إرسال مؤهلة ، ويمكنك أيضًا إدراج نسخة مصغرة لمساعدة الزوار على ملء النموذج الخاص بك.

قم بالتسجيل مع Getsitecontrol اليوم ويمكنك الحصول على نموذج اتصال فعال في غضون دقائق قليلة.