راهنمای کامل شروع یادگیری طراحی وب برای علاقمندان !



visibility  
mode_comment   ۷۰

:: خیلی از دوستان در سوالاتی که مطرح کرده بودند ، می گفتند که دوست دارن طراح وب بشن و نمیدونن از کجا و به چه شکل شروع به کار کنند ، چه زبانی رو یاد بگیرند ، از چه ابزاری استفاده کنند و سوالاتی ازین قبیل . امروز به صورت کامل به این مسئله می پردازیم و برای کسانی که دوست  دارند طراح وب بشن ، یه مسیر و راهنمای کامل رو مطرح میکنیم که حداقل بدونید برای طراح وب شدن در چه مسیری پیش برید ، چه زبان های برنامه نویسی رو یاد بگیرید و از چه ابزاری برای سریعتر شدن روند یادگیریتون استفاده کنید .

:: خوب بهتره زودتر شروع کنیم . در یک پاراگراف مسیر کلی حرکت شما به سمت یادگیری طراحی وب رو مطرح میکنم . برای این منظور اول از همه باید زبان html رو فرار بگیرید ، html برای طراحی شالوده و ساختار اصلی صفحه ی وب استفاده میشه . بعد از اون باید زبان CSS رو یاد بگیرید تا بتونید جزئیات شیوه ی نمایش صفحات وبتون رو تعیین کنید . پس از اون در صورت تمایل بد نیست که به سراغ جاوااسکریپت برید تا بتونید به صفحات وبتون پویایی و امکانات ویژه تری اضافه کنید . بعد از اون هم اگه قصد دارید حرفه ای تر کار کنید باید به سراغ یک زبان برنامه نویسی سمت سرور (server-side) مثل php یا asp.net برید تا بتونید اسکریپت ها و برنامه های اختصاصی تحت وب برای خودتون بنویسید . بعد از یادگیری این موارد هم باید بشینید و حسابی به صورت عملی و تجربی کار کنید تا دستتون راه بیافته و تجربتون افزایش پیدا کنه .

:: برای طراح وب شدن به ترتیب باید گام های زیر رو پیش برید :

:: گام اول : یادگیری زبان HTML

برای شروع کار و آغاز طراح وب شدن ، لازم و ضروریه که اول از همه زبان html رو یاد بگیرید . زبان html برای ایجاد بدنه و ساختار اصلی صفحات وب به کار میره . شما از هر زبان برنامه نویسی (مثل php) که استفاده کنید نهایتا باید خروجی رو به صورت کدهای html بسازید .

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

:: مطالب مربوط به آموزش html رو که ما تهیه کردیم میتونید از اینجا و اینجا مطالعه کنید که در حال توسعه و افزایش مطالب هست .

ما در سونلرن دوره آموزشی طراحی وب (HTML و CSS پیشرفته) رو برای شما به صورت 50 ساعت آموزش ویدیویی تهیه کردیم که می تونید با بهره گیری از اون یه طراح وب کاملا حرفه ای بشید .

:: اگر زبانتون بد نیست پیشنهاد من اینه که بخش آموزش html سایت w3schools رو هم حتما برای شروع کار مطالعه کنید . در اونجا مثال های زیادی زده شده و این مزیت هم وجود داره که همزمان میتونید کدها رو خودتون تست کنید و نتیجه اش رو در خروجی ببینید . منتهی اگر می خواید در عمل بتونید موفق باشید دوره طراحی وب خیلی مفید تر هست براتون.

:: گام دوم : آموختن و فراگیری زبان CSS

با html ساختار و پیکربندی کلی یک صفحه وب رو میسازیم . ولی برای اینکه ظاهر صفحه وب رو آراسته کنید باید از CSS استفاده کنید . با CSS میتونید برای هر کدوم از تگ های html خصوصیاتی چون رنگ ، فونت ، سایز ، پس زمینه و ... رو تعیین کنید . CSS رو به این منظور ایجاد کردند که ساخت پیکربندی صفحه وب رو از شیوه ی نمایش اون جدا کنند (seperation of concepts).

اگر می خواید CSS رو خیلی کامل یاد بگیرید دوره آموزشی طراحی وب (HTML و CSS پیشرفته) رو دنبال کنید تا صفر تا صد CSS رو فرا بگیرید.

:: گام سوم : یادگیری زبان جاوااسکریپت

متخصص جاوا اسکریپت
با جاوا اسکریپت جادوگری کنید! آیا می دونید با زبان جاوااسکریپت می تونید، برای فرانت اند و بک اند وبسایت ها برنامه نویسی کنید؟ همینطور اپلیکیشن دسکتاپ و موبایل بسازید؟ اگر دوست داری اینکارها رو انجام بدی و React, ElectronJS, ReactNative, NodeJS,MongoDB و ... رو تو یه دوره یاد بگیری، متخصص جاوااسکریپت سون لرن رو حتما ببین : متخصص جاوا اسکریپت arrow_back

وقتی که html و CSS رو خوب یاد گرفتید ، می تونید صفحات وب استاتیک رو طراحی کنید . مثلا میتونید قالب های وبلاگ سرویس های مختلفی مثل بلاگفا ، میهن بلاگ ، پرشین بلاگ و بلاگ اسکای رو طراحی و ویرایش کنید . اما اگر میخواید حرفه ای تر کار کنید باید بعد از html و CSS سراغ javascript برید . با جاوا اسکریپت میتونید پویایی و طراوت خاصی به صفحات وبتون بدید . می تونید اسکریپت های بدرد بخور و لازم برای خودتون بنویسید و صفحات وبتون رو جذاب تر کنید . جاوااسکریپت برخلاف html و CSS یک زبان برنامه نویسی هست ، در صورتی که html و CSS زبان های نمادگذاری هستند . پس به منظور یادگیری javascript باید وقت بیشتری بزارید تا با مفاهیم برنامه نویسی هم در کنار یادگیری این زبون آشنا بشید . تازه لذت کار با جاوااسکریپت رو زمانی که از library هایی مثل jQuery استفاده می کنید خیلی ملموستر و بیشتر لمس خواهید کرد .

ما برای اینکه در جاوااسکریپت و جی کوئری هم حرفه ای بشید یه دوره فوق العاده جامع، کاربردی و پروژه محور رو برگزار کردیم . اگر می خواید جاوااسکریپت و جی کوئری رو هم حرفه بشید و در صفحات وبتون جادوگری کنید حتما دوره آموزشی جاوااسکریپت و جی کوئری رو بگذرونید .

:: سایت w3schools قسمتی هم برای آموزش جاوا اسکریپت داره که بد نیست دنبالش کنید . برای آشنایی اولیه مختصر و مفیده .

:: گام چهارم : یادگیری زبان برنامه نویسی اسکریپتی مثل PHP  گام بعدی اینه که شما به سراغ یک زبان برنامه نویسی سمت سرور مثل php یا asp.net برید . با استفاده از این زبون ها شما میتونید برنامه های تحت وب بزرگ و دلخواه خودتون رو بنویسید . یادگیری این زبان ها وقت ، تلاش و کار عملی زیادی رو می طلبه و فقط هم زمانی توصیه میشه که واقعا علاقمند باشید و برنامه ای برای توسعه و نوشتن نرم افزارهای تحت وب داشته باشید . و در صورتی که می خواید در حد ویرایش و طراحی قالب وبلاگ ها و صفحات ایستای وب کار کنید ، 3 گام اول براتون کافیه . :: بعد از یادگیری این نوع زبان ها هم باید با مفاهیم پایگاه داده (Database) آشنا بشید تا بتونید محتوای ورودی و خروجی برنامه های نوشته شده رو ذخیره و استفاده کنید .

در حال حاضر دوره کامل و حرفه ای آموزش زبان php رو هم برای شما تهیه کردیم که می تونید اونو بخونید و ببینید . ما به شما این تضمین رو میدیم که این دوره از کاملترین و با کیفیت ترین دوره هایی هست که در ایران داره برگذار میشه و شما با ثبت نام در این دوره می تونید PHP رو به صورت کاملا کاربردی و عملی یاد بگیرید . فقط کافیه نگاهی به سرفصل های دوره ی PHP بیاندازید تا از کامل بودن اون مطمئن شید !

ولی برای شروع باز می تونید به بخش های آموزش php ، آموزش asp.net و آموزش SQL (زبان کار با پایگاه های داده) در سایت w3schools مراجعه کنید . ناگفته نماند که من اینجا این دو زبان رو پیشنهاد دادم ، در صورتی که زبان های دیگری هم مثل perl ، ruby ، پایتون و .. هم برای نوشتن برنامه های تحت وب موجوده که البته کاربرد و استفاده ی کمتری دارند .

:: ابزار مورد نیاز برای نوشتن کدها بهتره از ادیتور هایی که قابلیت های پیشرفته ای مثل پیشبینی کد ، کامل کردن خودکار کد (auto completion) ، رنگ گذاری کلمات کلیدی ، تشخیص خطاها ، فرمت بندی کدها و ... رو دارند استفاده کنید تا سریعتر کد بزنید ، درصد خطاتون پایین بیاد و کارتون راحتتر و استانداردتر باشه . :: پیشنهاد من استفاده از برنامه ی phpStorm هست که برای همه ی زبان های فوق امکانات فوق العاده ای داره . سعی می کنم در مطلب بعدی این برنامه رو برای دانلود بزارم . همچنین توصیه می کنم که نرم افزار notepad++ رو هم حتما نصب کنید . به خاطر سبک بودن و امکانات نسبتا خوبش میگم . همچنین برنامه های خیلی زیاد دیگه ای در این زمینه وجود داره که می تونید از اونها اسفاده کنید. من اسم بعضی از معروف ترین هاشو در زیر میارم که میتونید سرچ و دانلود کنید یا از فروشگاه های سی دی تهیه کنید :

  • PhpStorm (html,css,javascript,php)
  • Microsoft Visual Studio (asp.net)
  • Microsoft Expression Web
  • Notepad++
  • Adobe Dreamweaver
  • Komodo Edit
  • Aptana Studio
  • NetBeans

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

comment دیدگاه کاربران
raoof

ببخشید من همش مزاحم میشم ولی این کارم کردم ولی بازم کار نکرد یعنی جای کد رو خالی میزاشت ولی عکسو نشون نمیداد.؟؟؟

zani

با سلام خسته نباشید
دادشی به صورت کاملا ضروری به کمکت نیاز دارم
من خیلی چیزا توی وب سایت تو یاد گرفتم و الان خودم کم کم شروع کردم به کد نویسی میخواستم اول از همه بابت همه کمکات و اموزش هات ازت تشکر کنم
و درباره ازت کمک بگیرم: من میخوام یه کد بنویسم که کاربرم با کلیک روی یه باتن بتونه از هاستم یه اکانت ftp بگیره لطفا کمکم کن دارم تمومش میکنم وب سایتمو فقط این جاشو نمیدونم بسازم بازم ممنون 😳 😳 😳

لقمان آوند

سلام
در این زمینه خیلی نمی تونیم کمک کنم . اطلاعاتم کامل نیست .

محمدسینا معراجیان

دوست عزیز فک نمی کنم اینکار کار شما باشه اگه زیاد کار نکردید بهترین راه حل به نظرم اینه که از اسکریپت استفاده کنید!

ANiTA

سلام
ببخشید یه سوال داشتم……….
این نرم افزارایی که معرفی کردین باهاشون میشه برای وب سایت های ایرانی(مثل بلاگفا)قالب طراحی کرد یا نرم افزار های دیگه ای برای این کار وجود داره؟
درضمن……..اگر کد نویسی بلد نباشیم میتونیم قالب طراحی کنیم؟

لقمان آوند

سلام
آره با این نرم افزارها همه جور صفحه وب و قالب میشه طراحی کرد ، منوط به اینکه طراحی وب و کدنویسی وب بلد باشید . هم اکنون در سایت آموزش های طراحی قالب در حال قرار گیری است . پیگیری کنید …

Mohammad Arabiyan

با عرض سلام وخسته نباشید
میشه بفرمایید فرق بین PhpStorm و WampServer چیست؟
با تشکر فراوان 😳

محمدسینا معراجیان

اساسا ربط زیادی به هم ندارند از اولی برای نوشتن برنامه استفاده میشه و از دومی برای راه انداختن سرور

Mohammad Arabiyan

یعنی بجای phpstrom میتوان از نرم افزار Notepad++ هم استفاده کرد,درسته؟

Mohammad Arabiyan

من نرم افزار phpstrom را نصب کردم ولی نمیدونم چه کار باید کرد. ایا فایل اموزشی برای کار با این نرم افزار دارید؟
با سپاس

لقمان آوند

خیر متاسفانه آموزش این نرم افزار رو نداریم

محمدسینا معراجیان

خوب نه phpstorm فایل php رو هم ران می کنه

مجید

لقمان جان واقعا مارتون عالیه. خسته نباشید 😳 😳

لقمان آوند

ممنون . مار خودت عالیه عزیز 😀

مجید

سوتی دادم 😥 ببخشید کارتون

کد خود را در اینجا قرار دهید …
😳 😳

مصطفی

سلام
چند وقتی به سایت سر نمیزدم مطالبتون خیلی جالبه ممنون
ی سوال داشتم.من برای طراحی سایت سراغ کدوم زبان برم؟php یا asp.net
ی سوال دیگه اینکه حقوق ی طراح سایت php کار چقدره؟
مرسی

لقمان آوند

سلام
php و asp هر دو قوی و کاملن . یادگیری php آسونتره و کاربردشم همینطور . در مورد php vs asp.net یه سرچ بکن ا مقایسشون رو ببینی .
حقوق هم بستگی به نوع کار (ساعتی ، ماهی ، پروژه ای و …) ، تجربه و تخصص فرد و شرکتی که می خواد براش کار کنه متفاوته .

R0ni

سلام
ممنون از مطالب خوبتون
من تازه شروع به یادگیری طراحی وب کردم..Html و Css رو تقریبا تموم کردم و یه چند وقتی هست که دارم PHP میخونم ..میخواستم بدونم قبل از PHP حتما باید جاوا اسکریپت رو یاد بگیرم؟

لقمان آوند

سلام
ممنون ، شما لطف دارید .
این دو رو می تونی همزمان با هم یاد بگیری . هیچ کدوم پیش نیاز دیگری نیست . ولی بهتره که جاوااسکریپت رو اول بلد باشی بعد بری سراغ php . یه سری مفاهیم برنامه نویسی توی هر دوی این زبون ها مشترکند .

R0ni

ممنون از راهنماییتون

sahar20

با سلام
خیلی سایت خوب و مفیدی دارید…تشکر از شما و همکارانتون
اگه ممکن هست آموزش asp.net را هم داشته باشید…البته من تازه عضو این سایت شدم شاید مطلبی در این مورد بوده و من مشاهده نکردم …ممنون می شم راهنماییم کنید….با تشکر

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.
1 2 3 4