آموزش طراحی سایت
راهنمای جامع آموزش طراحی سایت – طراحی سایت را از کجا شروع کنیم
خیلی از دوستان نمی‌دانند آموزش طراحی سایت را از کجا و با چه زبانی شروع کنند و این موضوع شده یکی از مهم‌ترین دغدغه های کسانی که تمایل دارند طراح وب شوند.
ما قصد داریم در این متن به شما کامل راهنمایی کنیم که یادگیری طراحی و دیزاین وبسایت را از کجا و با چه زبانی شروع کنید.
گام یک در آموزش طراحی سایت
قدم اول در این مسیر یادگیری بدون شک و تردید آموزش HTML می‌باشد. شما باید در ابتدای این مسیر بتوانید آموزش طراحی سایت با HTML را فرا بگیرید.
مهم نیست شما آیا قصد دارید جاوا بخوانید یا جاوااسکریپت، PHP و یا حتی ASP، هر مسیری که در آینده شما قصد داشته باشید طی کنید قدم همه این مسیرها یادگیری HTML می‌باشد.
زبان HTML ساختار و بدنه اصلی صفحات سایت را مشخص میکند و خروجی زبان‌ها همه به کمک HTML است. منابع بسیاری به شکل PDF و یا کتاب‌های کاغذی هستند ولی پیشهاد نمی‌شود، چرا که به روز نگه داشتن کتاب‌ها و PDF ها با تاخیر بسیاری امکان‌پذیر است.
منبع خوب می‌تواند یک سایت خوب و به روز باشد. به عنوان مثال سایت W3school چنین ویژگی‌هایی دارد. البته شما در سایت میزفا هم می‌توانید آموزش های HTML را به شکل رایگان دنبال کنید.
مشاهده آموزش HTML کلیک نمایید.
گام دو در آموزش طراحی سایت
گام دوم به گام اول بستگی داره، یعنی باید ابتدا آموزش HTML پیش ببرید و سپس آموزش CSS شروع کنید. درواقع HTML بدون CSS عملا به درد نخواهد خورد. با HTML ما ساختار سایت و بدنه یک وبسایت را پیکربندی می‌کنیم با CSS به ساختار و بدنه سایت رنگ و استایل می‌دهیم.
مثلا در همین صفحه از چه نوع فونت و یا رنگی استفاده شده؟ پیش زمینه این صفحه به چه شکل است؟ چپ و راست کردن المان‌های HTML و متن‌ها همه به کمک CSS صورت میگیرد.
وقتی شما HTML و CSS فرا گرفتید می‌توانید طراحی سایت را شروع کنید. مثلا در ابتدای کار می‌توانید برای وبلاگ‌ها نمونه طرح بزنید تا هم قابل استفاده برای کاربران باشد و هم یک نمونه کار اولیه برای شما حساب شود.
گام سه در آموزش طراحی سایت
گام سه کمی مهم و سخت می‌شود، البته سختی در انتخاب صحیح مسیر است، نه آموزش دیدن طراحی سایت. شما می‌توانید در این مسیر به سمت زبان جاوا اسکریپت بروید و یا به سمت زبان‌های PHP و ASP که بسیار جامع هستند بروید.
-> حال چه فرقی دارند؟
ما یک سری زبان سمت کاربر داریم که در مرورگر لود می‌شود همانند زبان نمادگذاری HTML و CSS و همینطور زبان جاوااسکریپت. ولی یک سری هم زبان داریم که سمت سرور لود می‌شوند، همانند زبان‌های قدرتمند PHP و ASP، البته زبان‌های دیگر هم داریم که ما صرفا همین ۲ زبان معروف را مورد بحث قرار می‌دهیم.
نکته: HTML و CSS زبان برنامه نویسی نیستند و به آن‌ها زبان نمادگذاری می گویند ولی جاوااسکریپت، PHP و ASP زبان برنامه نویسی هستند و زبان‌های برنامه نویسی زبان و انرژی بیشتری نیاز دارد تا شما یاد بگیرید درحالی که زبان نمادگذاری HTML وCSS شاید اگر روزی دو ساعت زمان مفید بگذارید بتوانید در دو هفته به خوبی این دو را فرا بگیرید. ولی برای زبان‌های برنامه نویسی به نظر بنده اگر روزی دو ساعت وقت بگذارید بعد از سه ماه می‌توانید به یک سطح قابل قبول برسید.
-> حال چه کنیم؟ کدام را انتخاب کنیم؟
شاید مسیر درست ولی بسیار طولانی این باشد که آموزش جاوا اسکریپت Javascript را بخوانید و سپس یکی از آموزش PHP و یا آموزش asp.net را انتخاب کنید.
-> آیا بین PHP و ASP فرقی است؟
خیر، فرقی ندارد شما کدام زبان را انتخاب می‌کنید. هر ایده‌ای داشته باشید می‌توانید با هر دو زبان قدرتمند پیش ببرید. مهم این نیست که شما کدام را انتخاب می‌کنید مهم این است که هر کدام انتخاب کردید تا اخر دنبالش باشید و یاد بگیرید تا متخصص شوید. در بازار امروز کمبود متخصص است وگرنه افراد زیادی هستند که از هر زبان کمی می‌دانند.
پس آموزش طراحی سایت با ASP و یا آموزش طراحی سایت با PHP را شروع کنید ولی قبل آن پیشنهاد میزفا را بخوانید:
-> پیشنهاد میزفا کدام است؟
ما با یک تیر دو نشان زدیم. آموزش طراحی سایت را طوری پیاده سازی کردیم که به اندازه کافی درباره جاوا اسکریپت JavaScript بدانیم و همینطور زبان قدرتمند ASP را هم به شکل جامع با پروژه های متعدد یاد بگیریم. درواقع محوریت آموزش ما ASP.NET در اخرین نسخه Core خود است و در بین این آموزش طراحی ما به اندازه‌ای که نیاز داریم جاوا اسکریپت را هم می‌آموزیم.
این آموزش ۶۰ ساعت فیلم آموزشی است. جهت مشاهده روی لینک زیر کلیک نمایید.
-
جلسه ۴۴ – خاصیت overflow در CSS
منظور از خارج از باکس چیست ؟ منظور از Overflow چیست ؟ چطور از اورفلو استفاده کنیم؟ چطور بخش های خارجی صفحه را محو کنیم؟ خاصیت overflow، می‌تونه محدوده ی محتوای داخل یه عنصر رو کنترل کنه و نزاره که محتوا از عنصر پدر، بیرون بزنه. در این مقاله می‌خواهیم…
بیشتر بخوانید » -
جلسه ۴۳ – مقایسه flexbox و grid
تو این مقاله، سعی کردیم به شکل مناسبی در مورد ۲ روش طبقه بندی grid و flexbox صحبت کنیم. اگه با این دو روش آشنایی ندارین، می‌تونین درباره اون ها در مقالات آموزش flexbox و آموزش Grid در میزفا مطالعه کنین. سوالی که پیش میاد اینه: از فلکس باکس استفاده…
بیشتر بخوانید » -
جلسه ۴۲ – طبقه بندی به روش grid
منظور از Grid چیست؟ گرید چیست؟ چگونه از grid در css استفاده کنید. چگونه از grid سیستم در طراحی ریسپانسیو استفاده کنیم؟ آیا grid برای واکنش گرایی صفحات استفاده می‌شود ؟ در این مقاله به صورت کامل در رابطه با گرید صحبت می‌کنیم. مقدار grid در جلسه قبلی به آموزش…
بیشتر بخوانید » -
جلسه ۴۱ – طبقه بندی به روش flexbox
Flexbox چیست؟ فلکس باکس چیست؟ در این مقاله می‌خواهیم به آموزش کامل Flexbox بپردازیم و به مقایسه فلکس باکس و گرید می‌پردازیم. flexbox، توانایی های پیچیده تر و بیشتری از inline و block داره و می‌تونه عناصر موجود در صفحه وب رو به راحتی پشت سر هم بچینه. برای استفاده…
بیشتر بخوانید » -
جلسه ۵۴ – منو های عمودی در CSS
منو های عمودی، همونطور که از اسمشون پیداست، به منو هایی گفته می‌شن که گزینه ها در اون‌ها به صورت عمودی زیر هم چیده شده. برای یاد گرفتن نحوه طراحی این منو ها، یک منوی ساده رو مرحله به مرحله با هم طراحی می‌کنیم. مرحله اول – ساختار منو های…
بیشتر بخوانید » -
جلسه ۴۰ – خاصیت display
چگونه از display در Css استفاده کنیم ؟ منظور از Display چیست؟ چگونه می‌توانیم یک بلاک را به صورت خطی چاپ کنیم؟ منظور از inline block چیست؟ در این مقاله می‌خواهیم با خاصیت display یا ویژگی display به صورت کامل آشنا بشیم. خاصیت display با استفاده از خاصیت display می…
بیشتر بخوانید » -
جلسه ۳۹ – مفاهیم inline و block
چه تگ هایی از نوع inline هستند ؟ چه تگ هایی از نوع block هستند ؟ چگونه تگ ها را از inline به block تبدیل کنیم؟ چگونه تگ ها را از block به inline تبدیل کنیم؟ inline چیست؟ block چیست؟ منظور از inline level و block level چیست؟ اولین و…
بیشتر بخوانید » -
جلسه ۳۸ – خاصیت float در CSS
چگونه می‌توانیم چینش متن یا اشیاء را در CSS تغییر دهیم؟ چگونه Element ها را به سمت چپ چینش کنیم؟ چگونه از Float استفاده کنیم؟ Float چیست؟ چینش چیست؟ همونطور که تو مقدمه فصل float مطالعه کردیم، متوجه شدیم که float، از اولین روش هایی هست که از اون، به…
بیشتر بخوانید » -
جلسه ۳۷ – خاصیت position در CSS
منظور از ویژگی position چیست ؟ چگونه می‌توانیم از Position Absolute استفاده کنیم؟ تفاوت Position Absolute با Position Relative چیست ؟ تفاوت Sticky و Fixed چیست؟ همونطور که تو مقدمه فصل ۱۴ هم گفتیم، می‌تونیم توسط خاصیت position، رابطه عناصر باهم رو دستکاری کنیم و در کل، این روابط رو…
بیشتر بخوانید » -
جلسه ۳۶ – مثال های باحال تر و کارت های زیبا با استفاده از Shadow
چطور با Shadow مثال های کاربردی بسازیم؟ چگونه با Shadow کارت های زیبا طراحی کنیم؟ چگونه در CSS کارت طراحی کنیم؟ در این مقاله می‌خواهیم چند مثال کاربردی و باحال را با Shadow ایجاد کنیم. با سایه ها میشه خیلی کارهای باحالی انجام داد. ساده ترینشون، ساخت و طراحی کارت…
بیشتر بخوانید »
