خصیصه placeholder در html یک یا چند کلمه توضیح کوتاه دلخواه است که  زمانی که فیلد خالی است به کاربر در وارد کردن اطلاعات داخل فیلد کمک می‌کند. در واقع یک نوع راهنمای متنی داخل خود فیلد خالی ست که به کاربر کمک می‌کند چه نوع اطلاعاتی را در فیلد وارد نماید و به محض تایپ کردن کاربر در فیلد مخفی می‌شود.

 

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

 

۱-ترجمه:
مرورگرهایی با ویژگی ترجمه خودکار مثل مرورگر کروم از روی خصیصه ها در زمان ترجمه رد می‌شوند و آنها را نادیده می‌گیرند. برای بیشتر attribute ها این اتفاق می‌افتد. یکی از خصیصه هایی که مروگرها در هنگام ترجمه خودکار آن را نادیده می‌گیرند خصیصه placeholder است. محتوای این خصیصه بدون آنکه ترجمه شود نمایش داده می‌شود در حالیکه که سایر محتوای صفحه ترجمه شده است.
کاربر در زمان ترجمه خودکار انتظار دارد تمام محتوای صفحه به زبان مورد نظر او ترجمه شود. خصیصه placeholder مکررا در صفحه جهت راهنمایی در فرمت های ورودی فیلدها به کار برده می‌شود و این امکان وجود دارد که کاربری که با زبان اصلی سایت ناآشنا باشد قادر به فهمیدن و عمل به آن نوع فرمت ورودی نباشد. این می‌تواند دلیل قانع کننده‌ای برای استفاده نکردن از این خصیصه باشد.

 

۲-تعامل‌پذیری یا هم‌ کنش پذیری
در واقع به قابلیت سامانه‌ها و ساختارهای گوناگون برای کار کردن با همدیگر گفته می‌شود.این اصطلاح بیشتر در حوزه اینترنت و  تکنولوژی‌های کمک‌کننده (دستگاه‌های یاری رسان، سازگار و توانبخش برای افراد ناتوان) کاربرد دارد.
سازگاری معنایی ایی که محتوای شما را توصیف می‌کند.
یک input تعامل پذیر یا هم کنش پذیر با یک المنت label  وابسته به آن ایجاد می‌شود.
در واقع label هدف یک فیلد ورودی را تشریح ‌می‌کند. در واقع شرایطی را جهت واکنش سریع کاربر به پر کردن فیلد ورودی ایجاد می‌کند.
یک راه مرتبط کردن یک label  به یک input  استفاده از خصیصه for  با value مشابه با  خصیصه id  فیلد (input) است. (ما هم در قسمت های مختلف سایت که فیلد ورودی وجود دارد از این روش استفاده کرده ایم)

بدون استفاده از این جفت خصیصه (for / id)  تکنولوژی‌های کمک‌کننده (دستگاه‌های یاری رسان، سازگار و توانبخش برای افراد ناتوان) توانایی تشخیص اینکه  input  برای چه چیزی است را ندارند.
نرم افزارهای ویژه ایی مانند screen readers یا تشخیص صدا (voice recognition)  با استفاده از یک API hook (برنامه ای جهت تغییرات در روند پیشفرض API) قادر به تشخیص این نوع input ها (با خصیصه for/id) هستند.

 


 

۳- یادآوری
همانطور که توضیح داده شد توضیح وارد شده در خصیصه placeholder بعد از تایپ اولین حرف توسط کاربر مخفی می‌شود. بعضی اوقات فرمت ورودی پیچیده می‌شود و کاربر فرمتی که باید وارد کند را فراموش می‌کند. تنها راه دسترسی کاربر به فرمت ورودی پاک کردن محتوای تایپ شده در فیلد input است. این مخفی شدن توضیح بعد از تایپ مطمئنا باعث اذیت شدن کاربران عادی و عدم تجربه کاربری خوب خواهد شد.

 

 

 

۴- کاربردپذیری
طول متن خصیصه placeholder به عرض input محدود می‌شود با توجه به ریسپانسیو شدن وب سایت‌ها، در سایزهای مختلف عرض input ها تغییر می‌کنند که این باعث می‌شود در بعضی از سایزها متن داخل placeholder دیده نشده و موجب شود کاربر اطلاعات مهمی که در آن‌ها نوشته شده است را کامل نبیند.

 

 

۵- تضاد رنگ
رنگ پیشفرض اکثر مرورگرها برای محتوا placeholder خاکستری روشن است که این خود باعث می‌شود یا متن داخل آن‌ها کم دیده شود و یا کاربران با بینایی کم قادر به خواندن آن‌ها نباشند.مشکل بعدی زمانی ایجاد می‌شود که شما بخواهید رنگ پیشفرض آن را تیره تر کنید که با این کار وضعیت را بدتر از قبل خواهید کرد. این کار باعث می‌شود که کاربر فکر کند input پر شده و نیازی به پر کردن آن نیست و باعث سردرگمی کاربر خواهد شد.