طراحی سایت و مراحل گام به گام اصولی در طراحی سایت

طراحی وب سایت یعنی ساخت صفحات سایت و همچنین راه اندازی آنها 

 دامنه :

همان آدرس وبسایت می باشد که خود شامل نام دامنه و پسورد آن می باشد .

هاست:

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

سرور:

دستگاهی که اطلاعات شما روی آن قرار می گیرد و به طور ۲۴ ساعته به اینترنت متصل می باشد که اطلاعات شما در هر لحظه توسط کاربران قابل مشاهده باشد سرور نام دارد.

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

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

HTML:

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

 در ادامه با html وCSS بیشتر آشنا خواهیم شد.

هر صفحه وبی که ما میخواهیم طراحی کنیم دو بخش اصلی دارد:

 فرانت اند(front-end) و  بک اند(back-end). به زبان ساده می‌توان گفت  فرانت اند شامل آن چیزی است که پیش روی کاربر می باشد و بک اند چیزی است که کاربران نمی بینند ،همان برنامه نویسی صفحه می باشد.

ما دو نوع سایت داریم:

استاتیک
دینامیک

سایت های استاتیک :

  این سایت ها فقط بخش فرانت اند سایت می باشد یعنی در این سایت ها امکان تغییر محتوا توسط مدیران نمی باشد و باید طراح سایت این کار را انجام دهد.

 سایت های دینامیک :

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

گرافیست:

وظیفه گرافیست ایجاد طرح های اولیه سایت ،طراحی شکل های گرافیکی، تصویرسازی، طراحی لوگو و غیره است.

برنامه نویس سمت کاربر(client side):

وظیفه  این متخصص طراحی رابط کاربری یا همان پوست سایت میباشد.

برنامه نویسی سمت سرور (server side):

این فرد وظیفه ایجاد ارتباط  بین مرورگر و سرور را دارد.برای داشتن یک وب سایت حرفه ای باید بین فردی که کار گرافیک وب سایت را انجام میدهد و طراح قالب وب سایت و طراح وب سایت ارتباط خوبی وجود داشته باشد که بتوانند با انجام وظایف خود به نحوه احسن یک سایت خوب و زیبا طراحی کنند. ابزارهای مشترکی که یک گرافیست و طراح وب باید با آنها آشنایی داشته باشد، فتوشاپ و کرول میباشد. این نرم افزارها  می توان طراحی قالب و لایوت (Lyout) و چیدمان صفحه را انجام داد. برای اینکه یک سایت بتواند سایت خوب و کاملی باشد هم باید از نظر گرافیکی شکل و ظاهر مناسبی داشته باشد و هم از نظر کدهای سمت سرور قوی باشد.

 اصول گرافیک طراحی قالب سایت:

1) استفاده از تصاویر کم حجم:

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

2) استفاده از تصاویر مرتبط با سایت

3)خودداری از رنگارنگ کردن سایت ،استفاده از عکس های رنگارنگ زیاد باعث می شود کاربر از موضوع اصلی سایت دوربماند و بیشتر از متن و محتوا جلب تصاویر شود.

4 )خودداری از چشمک زن ها و حرکت های بی مورد زیاد در سایت

5) استفاده از فونت های تعریف شده برای مرورگر ها،مگر در مواردی میتوان از غیر این فونت های تعریف شده استفاده کرد که زیبایی خاصی به سایت بدهد. چون استفاده از فونت های تعریف نشده سرعت آپلود را پایین می آورد.

6 )اندازه فایل باید از12px بیشتر باشد زیرا کمتر از آن خوانا نیست.

7 )استفاده از فونت های مناسب هرمتن مثلا  نمی توان برای سایت های رسمی از فونت های فانتزی استفاده کرد.

8) پرهیز از به کار بردن سخن و مطلب اضافه و به درد نخور و دور از محتوای اصلی سایت.

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

 اما چرا نباید از قالب ها استفاده کرد؟

۱) برخی از این قالب ها برای برخی تغییرات رمز گذاری می شوند و این یعنی محدودیت برای طراحی حرفه ای.

۲) احتمال وجود کدهای مخرب در این قالب ها وجود دارد که مسائل امنیتی زیادی را ممکن است در پی داشته باشد.

پس بهتر است از قالب های آماده استفاده نکنید تا بتوانید با آزادی هر تغییری را که خواستید در قالب طراحی خود داشته باشید و هیچ مشکل امنیتی نداشته باشید.پس باید برای طراحی قالب وب سایت از پایه کد نویسی را انجام دهیم ،برای اینکه در کدنویسی دوباره کاری انجام نشود حتما باید قبل از شروع به کدنویسی قالب نهایی را انتخاب و تغییرات لازم را در همان ابتدای کار را انجام دهید و بعد شروع به کدنویسی کنید، چون برخی از تغییرات بعد از کد نویسی خیلی زمان بر می باشد. برای این کار بهتر است قالب سایت را به صورت یک فایل تصویری با فرمت psd بسازیم که امکان ساخت این فرمت بابرنامه فتوشاپ،corelliوGLMP وجود دارد، ولی برنامه فتوشاپ از همه این برنامه ها برای این کار مناسب تر است .حال بعد از نهایی شدن قالب شروع به کدنویسی کنیم. برای کد نویسی از زبانهای برنامه نویسی متعددی استفاده می شود. ابتدا باید نسبت به پروژه ای که در دست داریم سیستم مدیریت محتوا یا CMS مناسبی را انتخاب نماییم، این سیستم می تواندورد پرس ،جوملا،دروپال و غیره باشد.زبان های توسعه قالب نیز می‌تواند CSS,HTML,Angular,Botstrap,Javascript وغیره باشد.بعد از این موارد برنامه نویس با استفاده از PSDانتخاب شده و CMSمناسب و زبان توسعه قالب مناسب کار خود را شروع می کند.مدت زمان اين پروسه ممکن است چندین روز یا چندین هفته باشد که این مدت زمان بستگی به اندازه پروژه در دست دارد.