مهارت های لازم برای طراحی، ساخت و راه‌اندازی صفحات وب، طراحی وب سایت  گفته می‌شود.

در ماه اوت سال 1991 تیم برنزلی (Tim Berners-Lee) با ساخت یک وب سایت نام خود را به عنوان بنیان گذار وب در تاریخ ثبت کرد. وی در وب سایت خود از اَبَرمتن ولینکی برای پست الکترونیک استفاده کرده بود.

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

در روزهای ابتدایی صفحه های نمایش کاملا سیاه بودند و تنها چند شیء کوچک در آنها وجود داشت. با پیشرفت وب و آمیخته شدن آن با هنر طراحی، زبان نشانه گذاری (اچ تی ام‌ال)، پیچیده‌تر و انعطاف پذیرتر شد. جداول که قبلا برای نمایش نمودارهای داده‌ای استفاده می شد، برای چیدمان‌های پنهان در صفحه‌های وب مورد استفاده قرار گرفتند. با ظهور  CSS  (Cascading Style Sheets)، که روش بهتری برای دسته بندی ساختار طراحی سایت از نظر فنی و تکنیکی محسوب می شد،  طراحی با جداول‌ منسوخ  و زبان کمکی «CSS»  که بخش محتوای سایت را از  بخش نمایشی و ظاهری جدا می­کرد جایگزین آن شد.

استفاده از تکنولوژی­های یکپارچه‌سازی پایگاه داده (Database) و زبان‌های برنامه نویسی سمت سرور (Server-Side Scripting)  مانند CGI ،ruby ،node js ،Python، PHP، ASP. NET، ASP، JSP و ColdFusion و استانداردهای طراحی مدرن با استفاده از ساختارها و الگوهای (CSS)، باعث پیشرفته تر شدن وب سایت ها گردید.  وب سایت های  واکنش گرا یا  ریسپانسیو (Responsive) سایت هایی هستند که با ابعاد دستگاه‌های مختلف سازگاری دارند و کاربران بدون دغدغه اینکه صفحه نمایش دستگاهشان چه اندازه است می توانند از اطلاعات سایت ها استفاده کنند.

انواع وب سایت :

وب سایت های ثابت (Static Website)

این وب سایت‌ها پس از طراحی و قرار گیری اطلاعات مورد نیاز داخل آن‌ها برای تغییر آتی نیاز به یک طراح حرفه‌ای یا نیمه حرفه‌ای سایت دارند. زبان برنامه‌نویسی این‌گونه وب سایت ها غالباً HTML هستند که در نوع توسعه یافته تر از CSS نیز بهره می گیرند. این نوع دسته از وب سایت‌ها به صورت HTML  ساده و در صورت نیاز با استفاده ازJava Script  یا فریمورک های وابسته به آن طراحی می‌شوند.

با توجه به این امر که ایجاد تغییر در وبسایت‌های ثابت توسط افراد عادی امکان پذیر نمی باشد خود باعث افزایش امنیت و بهره مندی از گرافیک و ظاهری زیبا ‌می شود چرا که همه چیز ثابت است در نتیجه می‌توان برای محل قرار گیری هر یک از اجزاء بهترین تصمیم را گرفت. اما این موضوع سبب می‌شود تا قابلیت بروزرسانی وب سایت توسط صاحبان و مدیران سایت امکان پذیر نباشد. وب سایت های ثابت (Static) برای افراد، شرکت‌ها و سازمان‌هایی مناسب است که کمترین تغییرات محتوایی را در طول سال دارند.

وب سایت های پویا (Dynamic Website)

دسترسی و اعمال تغییرات در محتوای وب سایت های داینامیک بعد از طراحی، توسط افرادی که به پنل مدیریت محتوا دسترسی دارند امکان پذیر می باشد.  زبان برنامه‌نویسی وبسایت های داینامیک می‌تواند براساس نیازمندی های افراد متفاوت باشد اما عمدتاً از زبان‌های برنامه نویسی ASP، ASP.Net  و PHP  استفاده می‌شود و همچنین از زبان‌های برنامه نویسی کمکی دیگر برای ایجاد قابلیت‌های ویژه نیز بهره گرفته می‌شود.

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

سیستم هایی که به سیستم مدیریت محتوا یا CMS  (Content Management System) معروفند، جهت تولید وبسایت‌های داینامیک مورد استفاده قرار می گیرند که برای مصارف خاص توسط طراحان حرفه‌ای و یا شرکتهای طراحی حرفه‌ای ایجاد می‌شوند.

پرتال ها (Portal)

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

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

تمپلت یا طرح گرافیک وب سایت

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

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

ابزارهای مورد استفاده در توسعه وب سایت ها

ابزارهای متفاوتی وجود دارد که به توسعه یک وب سایت کمک می‌کنند، تفاوت یک سایت خوب و بد با تشخیص اینکه که کدام ابزار یا تکنولوژی برای چه قسمتی مناسب تر است مشخص می‌شود.

HTML زبان نشانه‌گذاری ابرمتنی HTML (Hyper Text Markup Language)

HTML اساس و چارچوب توسعه یک وب سایت است. این اچ‌تی‌ام‌ال هست که موجب می‌شود یک چارچوب کلی برای نمایش یک وب سایت وجود داشته باشد. پس از توسعه نسخه اولیه اچ‌تی‌ام‌ال نسخه‌های مختلفی ارایه شد که آخرین نسخه عرضه شده اچ‌تی‌ام‌ال 5 است که در تاریخ ۲۸ اکتبر، ۲۰۱۴ توسط کنسرسیوم وب (W3c) ارائه و انتشار یافت. در این نسخه راهکارهای کارآمدی جهت کنترل کردن فایل‌های چند رسانه‌ای (صوت و ویدیو) عرضه شد. در حال حاضر این نسخه در میان توسعه دهندگان وب از محبوبیت زیادی برخوردار است و ویژگی‌های زیادی نسبت به نسخه‌های قبلی خود داراست.

CSS شیوه‌نامه آبشاری (Cascading Style Sheets)

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

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

جاوا اسکریپت (JavaScript)

جاوا اسکریپت یک زبان برنامه‌نویسی بر پایه داینامیک بودن، مفسری و شیءگرا است. جاوا اسکریپت بسیار محبوب است، این زبان را برای برنامه‌نویسی  بک اند و فرانت اند می توان مورد استفاده قرار داد.

کدهای جاوا اسکریپت در هر دو سمت کاربر و سرور ترجمه و اجرا می‌شوند. جاوا اسکریپت با افزودن انیمیشن و افکت‌ها به عکس و یا متن، ایجاد گرافیک‌های دوبعدی و سه‌بعدی و توسعه بازی‌های تحت وب، موجب افزایش کیفیت وب سایت و گرافیک آن می‌شود.