چگونه طراح وب سایت شویم

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

طراحی وب سایت به دو قسمت کلی تقسیم می‌شود :

۱- Front-End

2- Back-End

 

1- آشنایی با Front-End

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

 

برای اینکه یک توسعه دهنده‌ی Front-End شویم به یادگیری چه چیزهایی نیاز داریم؟

HTML : اولین قدم برای یادگیری طراحی وب سایت، یادگیری زبان‌های HTML و CSS است. HTML مخفف عبارت Hyper Text Markup Language به معنای “زبان نشانه‌گذاری ابر متن” می‌باشد.

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

 

CSS : مخفف عبارت Cascading Style Sheets به معنای “شیوه نامه‌ی آبشاری” می‌باشد. البته لازم به توضیح است که این معانی کاملا تحت اللفظی هستند و شاید معنی صحیح و واضحی نداشته باشند که البته برای کار ما اهمیت چندانی هم ندارد.

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

برای درک بهتر تفاوت HTML و CSS و لزوم استفاده‌ی همزمان از این دو زبان در کنار یکدیگر به تصمیر زیر نگاه کنید:

تفاوت HTML با CSS

تصویر اول صرفا با استفاده از کدهای HTML نوشته شده اما در تصویر دوم، کدهایی CSS نیز به آن‌ها اضافه شده است.

 

JavaScript : بر خلاف HTML و CSS که صرفا زبان‌های نشانه‌گذاری جهت ایجاد صفحات بوده و فاقد قدرت محاسباتی هستند، جاوااسکریپت یک زبان برنامه نویسی است.

با استفاده از جاوااسکریپت می‌توانیم ویژگی‌های خاص و منحصر به فردی به صفحات وب سایت اضافه کنیم که با HTML و CSS ممکن نبود. به عنوان مثال با استفاده از جاوااسکریپت می‌توانیم آمار بازدیدکنندگان صفحات مختلف به همراه نوع سیستم عامل، نوع مرورگر و… را بدست آوریم (یکی از ساده‌ترین کارهایی که می‌توان با جاوااسکریپت انجام داد)

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

پس تا اینجا برایمان مشخص شد که اگر تصمیم گرفتیم توسعه دهنده‌ی Front-End باشیم نیاز به یادگیری چه چیزهایی داریم. اما حالا به سراغ Back-End می‌رویم…

 

2- آشنایی با Back-End

همانطور که از نام آن مشخص است در بک اند تمامی محاسبات و پردازش‌های وب سایت در این بخش انجام می‌شود. به عنوان مثال فرض کنید می‌خواهید در وب سایتی ثبت نام کنید. ابتدا وارد صفحه‌ی ثبت نام می‌شوید و فرم مربوط به ثبت نام را پر می‌کنید. تا اینجای کار مربوط به Front-End است که فرم را به شما نمایش دهد. اما بلافاصله پس از اینکه بر روی دکمه‌ی “عضویت” یا “ارسال” کلیک می‌کنید، تمامی اطلاعاتی که در فرم ثبت نام وارد شده بود به سرور ارسال شده و پس از پردازش، مقادیر وارد شده در بانک اطلاعاتی ذخیره می‌شوند. این عملیات مربوط به Back-End می‌باشد.

 

برای اینکه یک توسعه دهنده‌ی Back-End شویم به یادگیری چه چیزهایی نیاز داریم؟

برای اینکه یک توسعه دهنده‌ی بک اند باشید، علاوه بر زبان‌های HTML و CSS ، لازم است تا به یکی از زبان‌های سمت سرور نیز مسلط شوید. زبان‌های سمت سرور (Server-Side) زبان‌هایی هستند که به شما این امکان را می‌دهند تا بتوانید داده‌های دریافت شده از کاربر را بر روی سرور ذخیره کرده و به پردازش و بازیابی آن‌ها بپردازید.

زبان‌های مختلفی برای برنامه نویسی سمت سرور وجود دارند که هرکدام ویژگی‌های خاص خودشان را دارند و شما باید به مقایسه‌ی آن‌ها با یکدیگر پرداخته و در نهایت یکی را انتخاب کرده و شروع به یادگیری کنید (بعدها می‌توانید زبان‌های دیگری نیز بیاموزید). در ادامه به معرفی معروف‌ترین زبان‌های برنامه نویسی سمت سرور خواهیم پرداخت…

 

PHP : مخفف عبارت PHP : Hypertext Preprocessor به معنی “پی‌اچ‌پی : پیش‌پردازنده‌ی ابرمتن” بوده و محبوب‌ترین و پر استفاده‌ترین زبان برنامه نویسی تحت وب می‌باشد. برای کسب اطلاعات بیشتر در خصوص زبان برنامه نویسی پی‌اچ‌پی می‌توانید به پست آشنایی با زبان برنامه نویسی PHP مراجعه کنید.

 

Asp.Net : مخفف عبارت Active Server Pages به معنی “صفحات فعال سرور” می‌باشد. Asp.Net یک زبان برنامه نویسی نیست بلکه یک تکنولوژی است که برای شما امکان برنامه نویسی با یکی از زبان‌های دات نت در محیط وب را فراهم می‌کند. Asp.Net متعلق به شرکت مایکروسافت است و برای اینکه بتوانید با آن به برنامه نویسی سمت سرور بپردازید باید به یکی از زبان‌های دات نت مانند سی‌شارپ ، VB.Net و… مسلط باشید.

زبان‌های دیگر : دو مورد بالا پرکاربردترین زبان‌های برنامه نویسی سمت سرور می‌باشند اما زبان‌های دیگری نیز وجود دارند که طرفداران خاص خود را دارند و بعضا طرفداران زیادی پیدا کرده‌اند و استفاده از آن‌ها رو به رشد است. مانند Node.js ، Python ، Ruby on Rails و حتی JAVA و ++C

 

نیاز آخر : یادگیری بانک اطلاعاتی (Database)

آخرین چیزی که به آن نیاز دارید یادگیری یک بانک اطلاعاتی (دیتابیس) است. با کمک بانک اطلاعاتی می‌توانید اطلاعات دریافتی از کاربران را ذخیره کرده، مورد پردازش قرار دهید و در نهایت در مواقع لزوم بازیابی کرده و به کاربر نمایش دهید.

از معروف‌ترین دیتابیس‌ها می‌توان به MySQL ، SQL Server ، Oracle ، MariaDB و MongoDB اشاره کرد. البته بیشترین تعداد کاربران به ترتیب مربوط به MySQL و SQL Server می‌باشد.

 

نتیجه گیری

برای یادگیری طراحی وب سایت در قدم اول باید HTML و CSS را فرا بگیرید. در قدم بعدی باید تصمیم بگیرید که دوست دارید توسعه دهنده‌ی Front-End باشید یا توسعه دهنده‌ی Back-End. اگر علاقمند به Front-End هستید بهتر است جاوااسکریپت را نیز دنبال کنید و اگر علاقمند به Back-End هستید باید یکی از زبان‌های برنامه نویسی سمت سرور (مانند PHP یا Asp.Net) را بیاموزید.