طراØÛŒ وب چیست؟ همه چیز درباره‌ی طراØÛŒ وب سایت (web design)
اگر در دنیای وب تازه کار باشید Ùˆ به تازگی وارد دنیای برنامه نویسی شده باشید، Øتما واژه‌ی طراØÛŒ وب را بارها Ùˆ بارها شنیده اید. Ùˆ Øتما این سوال برایتان پیش آمده است Ú©Ù‡ طراØÛŒ وب چیست . شاید هم هنوز نتوانسته اید طراØÛŒ سایت تÙاوت واژه های طراØÛŒ وب را با برنامه نویسی وب درک کنید. در این مقاله Ùˆ آموزش ویدئویی بصورت کامل به این سوال « طراØÛŒ وب چیست » پاسخ میدهیم Ùˆ چند Ù…Ùهوم دیگر را نیز تا Øدودی ØªÙˆØ¶ÛŒØ Ù…ÛŒØ¯Ù‡ÛŒÙ… Ùˆ منابع Ù…Ùیدی را برای یادگیری آن‌ها معرÙÛŒ میکنیم.
طراØÛŒ وب چیست
در مقاله ای به نام برنامه نویسی چیست، درباره‌ی برنامه نویسی توضیØات ساده‌ای را ارائه دادیم. در این Ùایل آموزشی میخواهیم به این سوال پاسخ دهیم: طراØÛŒ وب چیست
اگر به دنبال یک پاسخ خیلی ساده ولی کاربردی برای سوال طراØÛŒ وب چیست هستید، Ùیلم زیر را مشاهده کنید
وب چیست؟
اگر بخواهیم به سوال طراØÛŒ وب چیست پاسخ بدهیم، اول باید بدانیم Ú©Ù‡ وب چیست Ùˆ به Ú†Ù‡ چیزی وب میگویند. در زیر یک تعری٠بسیار ساده (Ùˆ شاید تا Øدودی اشتباه از Ù„Øاظ ÙÙ†ÛŒ) از وب ارائه میدهیم:
وب یا همان شبکه جهانی یا World Wide Web که به اختصار www نامیده میشود، همان چیزی است که امروزه به آن اینترنت میگوییم. امروزه از طریق یک مرورگر و با اتصال به این شبکه‌ی جهانی، میتوانیم به تمام اطلاعات درون آن دسترسی داشته باشیم.
اگر به دنبال یک تعری٠خیلی جامع Ùˆ تخصصی هستید، صÙØه‌ی وب جهان گستر در ویکی پدیا میتواند برای شما Ù…Ùید باشد. اما همین تعری٠ساده برای ما کاÙÛŒ است، Ú©Ù‡ بدانیم اینترنت Ù…ØÙ„ÛŒ از داده‌هاست Ú©Ù‡ میتوانیم به آن متصل شویم.
وب سایت چیست؟
بعد از پاسخ به سوال وب چیست ØŒ میرسیم به وب سایت. Øتما شما هم بارها اسم وب سایت به گوشتان خورده است. میخواهم با یک مثال Ù…Ùهوم وبسایت را برایتان ØªÙˆØ¶ÛŒØ Ø¯Ù‡Ù….
همانطور Ú©Ù‡ ما در دنیای واقعی بخشی از زمین را برای زندگی Ùˆ یا کسب Ùˆ کار اجاره میکنیم، در دنیای اینترنت هم میتوانیم اینکار را انجام دهیم. به این معنی Ú©Ù‡ میتوانیم بخشی از اینترنت را اجاره کنیم Ùˆ آن‌ قسمت را مدتی برای خودمان داشته باشیم. به بخشی Ú©Ù‡ ما روی اینترنت اجاره میکنیم Ùˆ برای مدتی متعلق به ما می‌باشد وب سایت میگویند. در واقع وب سایت ها، زمین های ما در اینترنت هستند Ú©Ù‡ میتوانیم از آن‌ها استÙاده های مختلÙÛŒ داشته باشیم.
طراØÛŒ وب چیست؟
با Ù…Ùهوم وب سایت نیز آشنا شدیم. Øالا میخواهیم برسیم به سوال اصلی خودمان: طراØÛŒ وب چیست .
همانطور Ú©Ù‡ در دنیای واقعی از Ú¯Ú† بری، رنگ، کابینت، وسایل خانه و… برای زیبا شدن خانه استÙاده میکنیم، در دنیای اینترنت هم از ابزارهایی میتوانیم برای زیبایی سایت‌مان استÙاده کنیم. به زابن دیگر، در دنیای آنلاین ابزارهایی در اختیار ما قرار داده شده است، Ú©Ù‡ با استÙاده از آن‌ها میتوانیم سایت‌مان را ابتدا بسازیم Ùˆ سپس آن‌را زیبا کنیم.
در دنیای واقعی، ابتدا زمینی را اجاره میکنیم یا میخریم، سپس با استÙاده از بتن، سیمان، میل گرد، آجر و… آن‌را میسازیم Ùˆ در مرØله‌ی آخر با Ú¯Ú† کاری، رنگ، سرامیک، ک٠پوش و… آن را زیبا میکنیم. در دنیای وب نیز دقیقا به همین Ø´Ú©Ù„ است. ابتدا سایت‌مان را میسازیم، Ùˆ سپس با استÙاده از ابزارهایی آن‌را زیبا میکنیم.
پس در پاسخ به سوال طراØÛŒ وب چیست میتوانیم بصورت بسیار ساده بگوییم: هر آن چیزی Ú©Ù‡ Ú©Ù…Ú© میکند وبسایت ما بهتر Ùˆ زیباتر دیده شود را طراØÛŒ وب میگوند.
یک Ø·Ø±Ø§Ø ÙˆØ¨ مشخص میکند Ú©Ù‡ المان های مختل٠یک وبسایت مثل متن ها، عکس ها، لینک ها و… به Ú†Ù‡ Ø´Ú©Ù„ نمایش داده شوند Ùˆ Ù…ØÙ„ هرکدام از بخش های سایت مثل لوگو، مقالات، منو و… در کجای صÙØÙ‡ وب قرار بگیرد.
طراØÛŒ وب را با برنامه نویسی وب اشتباه نگیرید!
اشتباهی Ú©Ù‡ معمولا اÙراد تازه کار به آن مبتلا Ù…ÛŒ شوند این است Ú©Ù‡ طراØÛŒ وب را با برنامه نویسی وب اشتباه میگیرند. در صورتی Ú©Ù‡ این دو Ù…Ùهوم کاملا با یکدیگر متÙاوت هستند Ùˆ نباید به جای دیگری از آن‌ها استÙاده کرد.
طراØÛŒ وب به مجموعه کارهایی Ú¯Ùته میشود Ú©Ù‡ زیبایی ظاهری سایت را ایجاد میکند. در واقع هر آن چیزی Ú©Ù‡ کاربر با آن مواجه میشود Ùˆ آن‌را در صÙØÙ‡ مانیتور خود میبینید، Øاصل طراØÛŒ وب Ùˆ کار Ø·Ø±Ø§Ø ÙˆØ¨ است. در واقع کار اصلی یک Ø·Ø±Ø§Ø ÙˆØ¨ØŒ طراØÛŒ چیزهایی است Ú©Ù‡ کاربران با آن بصورت مستقیم در ارتباط هستند Ùˆ آن‌را در مانیتور خود مشاهده میکنند.
اما برنامه نویسی وب متÙاوت است. یک برنامه نویس وب کدهایی را مینویسد Ú©Ù‡ کاربر نمیتواند آن‌ها را ببیند Ùˆ آن کدها بصورت مستقیم تاثیری روی ظاهر سایت ندارند Ùˆ در پشت صØنه اجرا میشوند، برای مثال مقالات را از پایگاه داده یا دیتابیس در پشت صØنه میگیرند Ùˆ به کاربر نشان میدهند.
Ø·Ø±Ø§Ø ÙˆØ¨ کیست Ùˆ Ú†Ù‡ وظایÙÛŒ دارد؟
تا اینجا درباره‌ی طراØÛŒ وب صØبت کردیم Ùˆ الان پاسخ دادن به سوال « طراØÛŒ وب چیست » برایمان کار زیاد سختی نیست. Øالا میخواهیم درباره‌ی وظای٠یک Ø·Ø±Ø§Ø ÙˆØ¨ صØبت کنیم Ùˆ بگوییم Ú©Ù‡ یک Ø·Ø±Ø§Ø ÙˆØ¨ Ú†Ù‡ کاری باید انجام دهد.
Ø·Ø±Ø§Ø ÙˆØ¨ یا به Ø§ØµØ·Ù„Ø§Ø Front End Designer کسی است Ú©Ù‡ با استÙاده از تکنولوژی‌های مختل٠(مثل HTML – CSS – Javascript Ùˆ … ) ظاهر یک سایت را طراØÛŒ میکند Ùˆ کاری به کدهای پشت صØنه ندارد.
ممکن است برایتان سوال پیش بیاید Ú©Ù‡ Front End چیست Ùˆ Ú†Ù‡ تÙاوتی با Back End دارد. سوال بسیار خوبی است Ú©Ù‡ در Ùیلم Ùˆ مقالات آموزشی آینده Øتما درباره آن صØبت میکنیم.
زبان های طراØÛŒ وب
همانطور Ú©Ù‡ در قسمت قبل یک اشاره‌ی Ú©ÙˆÚ†Ú© داشتیم، یک Ø·Ø±Ø§Ø ÙˆØ¨ برای طراØÛŒ صÙØات وب از تکنولوژی ها Ùˆ زبان های برنامه نویسی مختلÙÛŒ استÙاده میکند.
یک Ø·Ø±Ø§Ø ÙˆØ¨ØŒ برای اینکه بتواند یک صØÙه‌ی وب را طراØÛŒ کند، از تکنولوژی های زیر استÙاده میکند:
HTML (یا HTML5)
CSS (یا CSS3)
جاوا اسکریپت
جی کوئری
و…
Û´ موردی Ú©Ù‡ در بالا نام بردیم، Øداقل دانشی است Ú©Ù‡ شما برای طراØÛŒ صÙØات وب Ùˆ تبدیل شدن به یک Ø·Ø±Ø§Ø ÙˆØ¨ نیاز دارید. البته میتوانید Ùقط با Û² مورد اول یعنی HTML Ùˆ CSS نیز سایت هایی را طراØÛŒ کنید،‌ ولی جاوا اسکریپت Ùˆ جی کوئری میتوانند به کار شما بسیار قدرت دهند.
باید به این نکته توجه کنیم که به دلایلی نمیتوانیم به HTML و CSS زبان های برنامه نویسی بگوییم. زیرا اصلا ویژگی های زبان های برنامه نویسی را ندارند. بلکه آن‌ها را زبان های نشانه گذاری یا تگ گذاری میدانیم.
برای طراØÛŒ وب به Ú†Ù‡ ابزارهایی نیاز داریم
تا اینجا سعی کردیم به سوال طراØÛŒ وب چیست پاسخ دهیم. Øالا میخواهیم ببینیم Ú©Ù‡ برای طراØÛŒ وب به Ú†Ù‡ ابزارهایی نیاز داریم.
برای طراØÛŒ صÙØات اینترنتی، نیاز به داشتن امکانات پیچیده نیست. Øداقل هایی Ú©Ù‡ نیاز داریم را در زیر مشاهده میکنید:
یک Ù…Øیطی Ú©Ù‡ بتوانیم کدهایمان را در آن بنویسیم. این Ù…Øیط میتواند Notepad ویندوز باشد Ùˆ یا یک Text Editor یا IDE ØرÙه‌ای تر(مثل phpStorm)
یک مرورگر اینترنتی (Browser) Ú©Ù‡ بتوانیم کدهایمان را از طریق آن اجرا کنید (مثل ÙایرÙاکس، Ú¯ÙˆÚ¯Ù„ کروم و…)