توسعه سمت کاربر وب

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

زبان نشانه‌گذاری ابرمتنی (HTML)

اچ‌تی‌ام‌ال اساس فرایند توسعه یک سایت است که در صورت وجود نداشتن هیچ سایتی وجود ندارد. کدهای اچ‌تی‌ام‌ال هستند که موجب می‌شوند یک چارچوب کلی برای نمایش وجود داشته باشد. اچ‌تی‌ام‌ال توسط تیم برنرز لی توسعه داده شده‌است. بعد از توسعه اچ‌تی‌ام‌ال نسخه‌های مختلفی در وب(WWW) پدیدار شدند. آخرین نسخه اچ‌تی‌ام‌ال را اچ‌تی‌ام‌ال۵ (HTML5) می‌نامند که در تاریخ ۲۸ اکتبر، ۲۰۱۴ توسط کنسرسیوم وب یا به اختصار انگلیسی W3 ارائه و انتشار یافت. این نسخه دارای راه‌های تازه و کارآمدی بود که می‌توان به کنترل کردن فایل‌های چند رسانه‌ای (صوت و ویدیو) اشاره کرد. در حال حاضر اچ‌تی‌ام‌ال۵ در میان توسعه دهندگان سمت کاربر از محبوبیت خاصی برخوردار است. اچ‌تی‌ام‌ال۵ دارای ویژگی‌های بسیاری نسبت به نسخه‌های پیشین خود است.

شیوه‌نامه آبشاری (CSS)

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

جاوااسکریپت (JavaScript)

جاوااسکریپت یک زبان برنامه‌نویسی دستوری رویدادگرا (برخلاف برنامه‌نویسی اعلانی اچ‌تی‌ام‌ال) است که برای یک صفحهٔ اچ‌تی‌ام‌ال ایستا(Static) یک رابط پویا(Dynamic) به وجود می‌آورد. سند اچ‌تی‌ام‌ال براساس یک مدل شیءگرا که به آن DOM گویند نمایش داده می‌شوند که کدهای جاوااسکریپت از این مدل استفاده می‌کنند و به موجب آن می‌توانند سند را دستکاری و رویدادهای که توسط کاربر اجرا می‌شوند را زیر نظر بگیرند.

وانیلا جاوااسکریپت

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

چارچوب‌های جاوااسکریپت

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

برخی از معروفترین چارچوب‌ها عبارتند از

• انگولارجی‌اس
• ReactJS
• ویو جی‌اس
• Meteor.js
• Node.js
• Ember.js
• چارچوب جاوااسکریپت پروتوتایپ

کتابخانه جاوااسکریپت

علاوه بر چارچوب‌ها کتابخانه‌های جاواسکریپت هم وجود دارند.

برخی از محبوبترین کتابخانه‌ها عبارتند از

• ریکو (آژاکس)
• جی‌کوئری
• دوجو
• امبر جی‌اس

کتابخانه جی‌کوئری(jquery)

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

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

همچنین جی‌کوئری با دارا بودن تعداد بسیار زیادی پلاگین که توسط توسعه دهندگان زیادی در سرتاسر جهان نوشته شده‌اند کار توسعه وب را بسیار سریع تر می‌کند.

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

یک توسعه دهنده سمت کاربر علاوه بر ابزارها و تکنیک‌هایی که استفاده می‌کند سعی دارد نکات زیر را در فرایند توسعه اعمال کند.

دسترس پذیری

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

کارایی

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

• کنسرسیوم جهانی وب (W3)
• وبگاه اچ‌تی‌ام‌ال در کنسرسیوم جهانی وب
• وبگاه سی‌اس‌اس در کنسرسیوم جهانی وب

• اسکریپت‌نویسی سمت سرور
• طراحی وب
• چارچوب نرم‌افزاری تحت وب
• بهینه‌سازی موتور جستجو (SEO)
• تایپوگرافی
• تئوری رنگ
• تجربه کاربری