توسعه دهنده‌های فرانت‌اند باید پیکسل‌پرفکت باشن

حدودا 3 دقیقه • 534 کلمه

توی این سالها من با توسعه دهنده‌های front-end زیاد کار کردم. کسانی که توی اولین گفتگوها میگن من عاشق HTML و CSS هستم. معمولا کار ما با این افراد با ارائه یه طرح در قالب PSD شروع میشه که قراره به یه صفحه HTML تبدیلش کنن.

توسعه دهنده‌های فرنت‌اند توجهی به جزییات ندارن

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

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

نتیجه کار اغلب توسعه دهنده‌های فرنت‌اند، اونها رو خیلی بی ذوق و علاقه نشون میده.

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

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

رایج‌ترین اشتباهات چه چیزهایی هستن؟

عدم توجه به جزییات باعث بروز اشتباهاتی در اجرا میشه. اشتباهاتی که مربوط به المنتهایی مثل متن‌ها، عکس‌ها، آیکن‌ها، دگمه‌ها، باکس‌ها، منو‌ها و … هستن و رایج‌ترین اونها عبارتند از:

  • اشتباه در اندازه و سایز
  • اشتباه در فواصل (Margin و Padding)
  • اشتباه در ترازبندی
  • اشتباه در شدت و ضعف (رنگ، حاشیه و خمیدگی گوشه‌ها)

من خیلی دارم تند میرم؟

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

من فکر می‌کنم توسعه دهنده‌های فرنت‌اند باید در مقابل این دو مسئولیت پاسخگو باشن:

  1. کد نویسی فرنت‌اند رو تر و تمیز و ماژولار انجام بدن. اگه کدی که نوشتن قابل بسط نباشه، کار برای توسعه‌های بعدی سخت میشه. طبیعتا یه موضوع مهم اینه که توی کد نویسی بروز باشن. زبان‌های برنامه نویسی دارن به سرعت تغییر می‌کنن و مهمه که برنامه نویس از بروزترین تکنیکها استفاده کنه.
  2. مسئولیت بعدی اینه که پیاده سازی طرح رو به صورت پیکسل پرفکت (یعنی با توجه بسیار زیاد به جزییات) انجام بدن. غیر از این باشه کار نهایی اصلا جالب از آب در نمیاد.

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