تاریخچه طراحی سایت

زمانی که Tim Berners-Lee در سال 1989 اینترنت را خلق کرد احتمالا فکرش را نمی کرد که دنیای اینترنت از آن زمان تا این حد تغییر کند.در واقع تاریخچه طراحی وب سایت با تاریخ اینترنت گره خورده و پس از آن تقریبا هرسال دچار تغییرات مهمی شده است.امروزه به جایی رسیده ایم که شاید تصور دنیایی بدون اینترنت و بدون وب سایت ها برایمان دشوار باشد.

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

·         کد نویسی هسته (Core) وب سایت که تمام اتفاقات اصلی و پشت صحنه وب سایت در آن جا رخ می دهد.

·         طراحی قالب سایت که بخش عمده ای از آن را پوسته ظاهری وب سایت تشکیل می دهد و بخش دیگر نیز در تعامل با core وب سایت بوده و پوسته سایت را با هسته مرتبط می سازد.

 هرچند زبان های برنامه نویسی طراحی سایت در این سال ها تغییرات و پیشرفت های فوق العاده ای کرده اند و ویژگی ها و امکانات وب سایت ها فراتر از تصور شده است اما مبحث این مقاله در مورد تاریخچه طراحی سایت بیشتر پیرامون رخدادها و پیشرفت های صورت گرفته در طراحی پوسته ظاهری وب سایت می باشد.

عصر تاریک طراحی سایت (1989) :

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

جدول ها – آغاز طراحی سایت (1995) :

طراحی های جدول محور (Table-Base) و تولد اولین مروگرهایی که قادر بودند عکس و تصاویر را نمایش دهند ، اولین مرحله به سمت طراحی سایت به معنای امروزی خود محسوب می شود.بهترین گزینه برای دسته بندی اطلاعات استفاده از مفهوم جدول (Table) بود که امروزه نیز در تگ های HTML به همین نام وجود دارد و مورد استفاده قرار می گیرد.به همین ترتیب قرار دادن جدول ها در داخل هم راه هوشمندانه ای برای طراحی سایت بود که اولین بار توسط David Siegel مطرح شد.هرچند این کار کاملا درست به نظر نمی رسید ، زیرا هدف اصلی طراحی جدول ها ، دسته بندی اعداد محسوب می شود اما بهرحال این روش ، برای مدتی معمول ترین روش طراحی سایت به شمار می رفت. مشکل دیگر نگهداری و همچنین کار کردن با چنین ساختار شکننده ای بود.در همین دوره بود که مفهوم طراحی قطعه قطعه (Slicing Design) شروع به محبوب شدن نمود.به این صورت که طراحان، طرح های گرافیکی می ساختند و برنامه نویسان این طرح ها را به قطعات کوچک تبدیل کرده و سپس برای سرهم کردن و نمایش یکپارچه آن در وب راه حلی می اندیشیدند. در طرف دیگر اما جدول ها نیز مزایای زیادی داشتند مانند نمایش داده ها به صورت عمودی و قابلیت تعریف اندازه براساس پیکسل یا درصد.

جاوا اسکریپت –راهی برای نجات (1995) :

جاوا اسکریپت (JavaScript) پاسخی به محدودیت های HTML در طراحی سایت بود و نقش مهمی در تاریخ طراحی سایت ایفا نمود و همچنان نیز این نقش ادامه دارد.برای مثال اگر یک صفحه popup می خواستید و یا اگر تصمیم داشتید دسته بندی و نحوه چینش چیزی را بصورت خودکار تغییر دهید پاسخ کار JavaScript بود.مشکل اینجا بود که جاوا اسکریپت بصورت لایه ای جدا از ساختار کلی بود وباید بصورت جداگانه لود می شد.در بسیاری از مواقع برنامه نویسان کم استعداد یا تنبل از جاوا اسکریپت برای انجام کارهای بسیار ساده استفاده می کردند در صورتی که هر زمان که از جاوا اسکریپت بصورت هوشمندانه استفاده می شد قدرت واقعی خود را نشان می داد.

امروزه در اغلب مواقع هنگام طراحی سایت تلاش می شود اگر قابلیت ایجاد یک ویژگی در CSS یا HTML وجود دارد از JavaScript استفاده نگردد زیرا همچنان یکی از مشکلات جاوا اسکریپت کاهش سرعت لود سایت به حساب می آید.با این حال جاوا اسکریپت امروزه نیز یکی از مهمترین زبان های برنامه نویسی برای طراحی سایت به شمار می رود و بخصوص در قالب jQuery و  Node.js که ویژگی های بسیار خارق العاده ای را می تواند به یک وب سایت اضافه نماید.

فلش –عصر طلایی آزادی (1996) :

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

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

CSS – (1998) :

CSS نیز در همان دوره Flash متولد شد.روشی برای دسته بندی ساختار طراحی سایت که از نظر فنی و تکنیکی روش بهتری محسوب می شد.مفهوم اصلی CSS - Cascading Style Sheets – در جدا سازی بخش محتوای سایت از بخش نمایشی و ظاهری آن بود.بنابراین ظاهر و نحوه نمایش وب سایت در CSS تعریف می شد و محتوای سایت در HTML.اولین نسخه های CSS از انعطاف و گستردگی بسیار کمی برخوردار بودند اما مشکل اصلی در تطبیق پذیری مرورگرهای مختلف با آن بود.چندین سال طول کشید تا مرورگرها بصورت کامل خود را با این تکینیک جدید در طراحی سایت تطبیق دادند و در برخی موارد همچنان ایرادهایی همگام نمایش وب سایت در آنها وجود داشت. همچنین دوره ای در تاریخچه طراحی سایت وجود دارد که در آن یک مرورگر دارای آخرین آپدیت بوده و توان استفاده از آخرین ویژگی های CSS را داشت اما مرورگرهای دیگر همچنان با برخی از امکانات جدید آن مشکل داشتند و این موضوع تبدیل به کابوسی برای برنامه نویسان شده بود.

در حقیقت CSS یک زبان برنامه نویسی محسوب نمی شود بلکه بیشتر زبان اخباری است. آیا برنامه نویسان باید یاد بگیرند چگونه کد های CSS را بنویسند ؟ شاید. آیا لازم است نحوه کار CSS را درک کنند ؟ قطعاً.

ظهور موبایل – شبکه بندی و چارچوب (2007) :

مرور وب سایت توسط موبایل چالشی اساسی در این دوره از تاریخ طراحی وب سایت بود.نحوه نمایش محتوای سایت در صفحه های کوچک موبایل به موضوعی مهم بدل گشت.سرعت لود وب سایت نیز مسئله ای دیگر بود بصورتی که در آن زمان لود شدن کل محتوای یک وب سایت می توانست هزینه استفاده از اینترنت موبایل را بشدت افزایش دهد. اولین قدم برای غلبه بر این مسائل ، ایده column grids بود که در واقع طراحی سایت بصورت لایه های جدا از هم و با حد و مرز مشخص است. پس از کش مکش های فراوان نهایتا سیستم 960 grid برنده شد و تقسیم بندی 12 ستونی (12-column division) به روشی متداول در طراحی وب سایت بدل گشت. مرحله بعد استاندارسازی عناصری که در سایت به تناوب استفاده می شد بود.عناصری مانند فُرم ها ، منوها ، دکمه ها و..

برای این منظور کتابخانه ای از عناصر بصری که تمام کدهای لازم را در خود داشته باشند باید بوجود می آمد. Bootstrap و Foundation دو چارچوب (Framework) موفق در این عرصه بودند. هرچند که یادگیری کد نویسی های این دو Framework بسیار مشکل می نماید اما می توان بدون نیاز به یادگیری کد نویسی های آنها از کتابخانه آنها به منظور طراحی وب سایت واکنشگرا (Responsive) استفاده نمود.

طراحی سایت واکنشگرا (2010) :

نابغه ای بنام Ethan Marcotte تصمیم گرفت روش های موجود را به چالش بکشد و برای اینکار تصمیم گرفت از محتوای یکسان اما قالب های متفاوت برای نمایش وب سایت در صفحه های نمایش مختلف استفاده کند و مفهوم طراحی سایت واکنشگرا یا Responsive را وارد تاریخچه طراحی سایت نمود. برای یک طراح سایت، Responsive بودن به معنی طرح ریزی چندین قالب (Layout) مجزا است. از نظر کاربر این به معنی کارکرد صحیح وب سایت در موبایل است است اما از نظر برنامه نویس ایجاد روشی است که در آن مشخص می شود عکس ها چگونه نمایش داده شوند ، سرعت دانلود چگونه باشد، نحوه نمایش عناصر مختلف وب سایت در دستگاه های گوناگون به چه ترتیبی باشد و .. مهمترین مزیت این کار یکسان بود محتوا است. به این معنی که شما یک وب سایت و یک محتوا دارید که در دستگاه ها و صفحه های مختلف بخوبی نمایش داده می شود.

دوره طراحی های ساده (2010) :

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

آینده روشن در طراحی وب سایت (2017) :

امروزه دیگر بدلیل رشد فزاینده استفاده از موبایل، مبحث طراحی وب سایت به صورت Responsive به امری بدیهی بدل گشته و موضوعات دیگری از جمله طراحی وب سایت های موبایل دوست (Mobile-Frienfly) مطرح است.به این معنی که اهمیت ندارد وب سایتی طراحی کنیم که در موبایل های مختلف بخوبی نمایش داده شود بلکه باید وب سایت، بگونه ای طراحی شود که علاوه بر نمایش صحیح، استفاده از آن نیز در گوشی های موبایل بسیار راحت باشد.حتی ایده هایی مانند طراحی وب سایت بر پایه موبایل (Mobile First Design) مطرح شده است که طراحی سایت از ابتدا برای موبایل انجام میگرید و سپس برای نمایش در دستگاه های دیگر تطبیق داده می شود.

همچنین با ورود ورژن های جدید ابزارهای طراحی سایت مانند CSS3 و HTML5 نیاز برنامه نویسان به استفاده از JavaScript یا دیگر ابزارهای طراحی سایت کمتر شده و وب سایت های تولید شده بسیار ساده تر ، سبک تر و کارآمدتر از قبل محسوب می شوند.

هرروزه نیز روش و تکنولوژی های جدید جهت هرچه زیباتر و کارآمدتر شدن وب سایت ها خلق می شود.ایده هایی مانند Video Slider ، Parallax و صفحه های Scrolling باعث هرچه زیباتر و کارآمدتر شدن وب سایت ها شده اند.

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

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

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

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

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