دانلود ‫پروژه طراحی یک وب سایت

طراحی یک وب سایت


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

و همچنین در طراحی سایت از نرم افزارهایی در این باره و اینترنت یاری جسته ایم.

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

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


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

در مقابل این پیشرفت ها سازمانها و طراحان سایت ها نیز مسئولیتی سنگین تر نسبت به گذشته را خواهند داشت چرا که باید خدماتی را ارائه دهند تا کلیه نیازهای کاربرانی که هر روز تعدادشان افزون می گردد را برآورده سازند.
1،2- انگیزه و هدف از انتخاب موضوع

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

1،3- سوابق و کارهای انجام شده توسط دیگران در موضوع
طراحی سایتهای مختلف و متعدد اینترنتی ، اعم از سایتهای داینامیک و استاتیک ..نرم افزارهایی که توسط شرکتهای بزرگ و مشهور تولید شده تا زمینه تولید و طرحی سایتهای اینترنتی به راحتی و همراه با امکانات گسترده تر مهیا باشد ..
1،4- امکانات و دشواریهای مطالعه و تحقیق در مورد پروژه

مطالعه کتابهای موجود در رابطه با طراحی سایت و بازیابی و ذخیره مطالب مورد نظر از سایت های مشابه موضوع ،در طراحی پروژه موثر بوده است.
و از دشواری های راه اینکه به دلیل هم استان نبودن محل سکونت با استاد راهنما بهره ای کمتر از راهنمائیهای ایشان بردیم.
1،5- ارائه الگوریتم ERD

فصل دوم : ابزارها


در ایجاد این پروژه از نرم افزارهای مختلفی جهت ایجاد صفحات وب سایت، طراحی و ساخت پایگاه داده های مرتبط با صفحات، ایجاد منوهای موجود در صفحات و طراحی رابط کاربر سایت استفاده شده است، که در اینجا به ترتیب معرفی خواهند شد.
2،1- نرم افزار Dreamweaver

Dreamweaver یک ویرایشگر حرفه‌ای HTML است که با آن به سادگی می‌توان به صورت ویژوال و گرافیکی عناصر HTMLی به صفحه‌ی وب اضافه نمود ، با اضافه کردن عناصر، کد HTML آنها اضافه می‌شود .

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

همچنین علاوه بر صفحات ایستای HTML می‌توان از تکنولوژی‌های طرف سرور مانند ColdFusion , JSP , ASP.Net , PHP , ASP برای ایجاد صفحات پویا و ارتباط با پایگاه داده (db) استفاده کرد .
این نرم افزار دارای واسطی زیبا و قدرتمند است که کاربران می‌توانند به راحتی صفحات وب خود را بسازند .

می‌توان فایل‌ها وصفحات سایت را به راحتی مدیریت کرد .

همچنین می‌توان با این نرم‌افزار واز طریق FTP سایت خود را در اینترنت انتشار دهید .می‌توان همزمان از نرم‌افزارهای, firework , flash نیز برای ویرایش محتویات صفحات وب استفاده کرد.

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

شکل شماره در این پنجره شما می توانید دایرکتوری دیگری را به غیر از دایرکتوری پیش فرض برای نصب برنامه تعیین نمایید، توجه داشته باشید که نصب نرم افزار Dreamweaver به 300 مگابایت فضای خالی بر روی هارد دیسک شما احتیاج دارد.

ونیز شما میتوانید اجازه ایجاد shortcut برای استفاده از نرم افزاررا پس از نصب بر روی desktop ویا quicklaunch خود بدهید و سپس کلید Next را فشار دهید.

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

آنهایی را که میخواهید از این به بعد با این نرم افزار باز شوند انتخاب نموده کلید Next را فشار دهید.

شکل شماره اگر همه چیز درست است بر روی کلید Install کلیک کنید تا عملیات نصب آغاز شود.

شکل شماره بر روی دکمه Fnish کلیک کنید تا نصب نرم افزار Dreamweaver را به پایان رسانید.

شکل شماره 2،2- نرم افزار SqlServer2000 Sql Server یک نرم افزار بسیار جامع و کامل و قدرتمند برای کار با پایگاه داده ها می باشد.

از این نرم افزار برای ساختن پایگاه داده ها ، ایجاد جداول و ارتباط بین آنها، وارد کردن اطلاعات به درون جداول ،گرفتن انواع گزارشها از داده ها، ایجاد Stored Procedur ها ، Rule ها، دایاگرام ها و...

استفاده می شود.

طریقه نصب این نرم افزار بصورت زیر می باشد: نصب SqlServer 2000 نسبتا ساده و بی دردسر است.

Setup را اجرا کنید (اگر Autorun بصورت خودکار اجرا نشد توجه کنید که با یکی از Account های Administrator باید Login کرده باشید).

شکل شماره با انتخاب گزینه اول که SQL Server Components است این پنجره نمایش داده خواهد شد : شکل شماره در مرحله بعد باید نوع نصب را انتخاب نمایید : شکل شماره گزینه Remote Computer برای نصب بر روی یک سیستم که در دسترس نیست (مثلاً سرور سایت شما در جایی خارج از کشور که تنها IP آن و یک Login در اختیار شما قرار دارد) مورد استفاده قرار می گیرد.

گزینه ای که احتمالاً شما همیشه از آن استفاده خواهید کرد، همان گزینه اول یا Local Computer خواهد بود.

شکل شماره در این کادر هم گزینه اول را انتخاب می کنید تا Sql Server بر روی سیستم نصب شود.

شکل شماره وارد کردن نام و نام شرکت و خواندن مقررات استفاده از Sql Server یا همان software License Agreement که بخصوص در ایران به شدت و با دقت خوانده می شود، کارهای بعدی هستند که انجام می دهید.

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

در صورتیکه یک نرم افزار نوشته اید، بر روی کامپیوتر Server نصب را با گزینه وسط ادامه دهید و برای دیگر کامپیوترها با گزینه اول یا Client Tools Only.

شکل شماره در این مرحله نام سرور (نام نمونه سرور را که Sql Server با آن شناخته می شود) را باید وارد کنید.

می توانید همان گزینه Default را بگذارید باشد و یا اینکه یک نام دلخواه اختصاص دهید.

شکل شماره در این مرحله هم که کاملاً مشخص است : انتخاب چگونگی نصب از نظر نوع و تعداد Component ها که توصیه من Typical است و در صورت آشنایی شما با Sql Server می توانید Custom را نیز انتخاب کنید.

شکل شماره این مرحله کاملا مهم است.

شما باید تصمیم بگیرید که سطح امنیتی دسترسی به سیستم چگونه باشد.

در حالت Windows Authentication Mode تمام User های تعریف شده در Windows NT امکان دسترسی به بانک ها را خواهد (با توجه به Permission های داده شده) اما در حالت Mixed Mode علاوه بر اینکه باید جزو کاربران NT باشند باید User Name و Password خاص SQL Server را نیز داشته باشند.

روش دوم به نظر ایمن تر است اما دردسرهای آن هم بیشتر است.

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

شکل شماره آخرین قسمت نصب نزدیک است!

پس از نصب یک کادر دیگر نیز نمایش داده می شود که کافی است Finish کنید.

پس از نصب Sql Server باید سرویسهای مربوطه را اجرا کنید.

دو راه برای این کار وجود دارد.

یکی اجرای سرویس بصورت دستی و دیگری تنظیم آن برای شروع خودکار سرویس هنگام شروع کار ویندوز.

شروع دستی Sql Server به این صورت امکان پذیر است : شکل شماره در صورت لزوم مدیر خدمات SQL Server را Start کنید : شکل شماره با اجرای SQL Server Service Manager آیکون آن کنار ساعت روی TaskBar به این صورت نمایش داده می شود : برای متوقف کردن Service Manager کافی است روی کلید Stop کلیک کنید : شکل شماره یک پیام اخطار نمایش داده خواهد شد که با کلیک بر روی YES مدیر سرویس SQL SERVER متوقف خواهد شد.

چگونه مدیر خدمات SQL SERVER را بصورتی تنظیم کنیم که بشکل خودکار شروع به سرویس دادن کند؟

برای انجام این کار به Control Panel ----> Administrative Tools بروید و پنجره Services را باز کنید : شکل شماره و بعد از سرویسهای درحال اجرا، سرویس MSSQLSERVER را پیدا کنید : شکل شماره اگر در ستون Sturtup Type عبارت Automatic وجود نداشت با کلیک راست بر روی آن منو نمایش داده می شود.

در این منو، با انتخاب Properties پنجره جدیدی به این صورت نمایش داده می شود : شکل شماره با انتخاب Automatic و بعد Apply یا OK کردن، SQL Server Service Manager از این به بعد با Start شدن (روشن یا Restart شدن سیستم) شروع به کار می کند.

2،3- نرم افزار Flash 8 فلش یکی از مهمترین برنامه ها در تاریخ رسانه های جدید می باشد.

قابلیتهای گسترده ای که این برنامه ارائه می دهد باعث شده است که این نرم افزار را طیف گسترده ای از طراحان بکار برند.

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

فلش عمدتا برای ساخت وب سایت هایی با قابلیت های گرافیکی بالا به کار برده می شود.

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

فایل های فلش دارای اندازه کوچکی می باشند و بدین ترتیب پهنای باند کمی را نیاز دارند.

نصب Flash 8 بعد از اجرای Setup برنامه این پنجره نمایش داده می شود: شکل شماره پس از انجام عملیات مربوطه پنجره زیر نمایان میشود، بر روی کلید Next کلیک کنید: شکل شماره پنجره بعدی شامل توافق نامه نرم افزار می باشد، گزینه اول را انتخاب کرده و سپس کلید Next را فشار دهید.در این پنجره شما می توانید دایرکتوری دیگری را به غیر از دایرکتوری پیش فرض برای نصب برنامه تعیین نمایید.

شکل شماره در پنجره بعدی میتوانید اجازه ایجاد shortcut برای استفاده از نرم افزاررا پس از نصب بر روی desktop ویا quicklaunch خود بدهید و سپس کلید Next را فشار دهید.

شکل شماره در این پنجره نیز بر روی کلید Next کلیک کنید: شکل شماره اگر همه چیز درست است بر روی کلیدInstall کلیک کنید تا عملیات نصب آغاز شود.

شکل شماره در این قسمت باید منتظر بمانید تا فایل ها کپی شوند: شکل شماره در این قسمت نصب برنامه به پایان رسیده، بر روی دکمه Fnish کلیک کنید تا نصب برنامه به پایان برسد.

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

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

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

در این فاز برای اجرای پروژه ابتدا کلیه نرم افزارهای مورد نیاز که در فصل دوم به تفصیل آورده شده اند، نصب و راه اندازی گردید.

3،1- نصب سرویس Internet Information Service (IIS) در ابتدا سرویس Internet Information Service (IIS) بر روی ویندوز XP Pro.

توسط سی دی ویندوزنصب گردید.

نصب این سرویس از طریق بخش کنترل پنل، Add or Remove Programs و قسمت ADD/Remove Windows Components انجام گردید.

شکل شماره 3،2- طراحی بانک اطلاعاتی بانک اطلاعاتی مربوط به پروژه توسط نرم افزار MSSQLServer 2000 ساخته شد.

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

شکل شماره این جدول دارای سه فیلد، شماره عکس، نام اثر و تاریخ خلق اثر می باشد.

که با توجه به نوع کاراکتری که در آنها ذخیره می گردد نوع داده هر یک از فیلدها مشخص گردید.

3،3- طراحی قالب اصلی وب سایت پس از تعیین پایگاه داده ها و پیاده سازی آن، طراحی قالب اصلی سایت شروع گردید.

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

برای طراحی این انیمیشن از نرم افزار Adobe Flash 8 استفاده گردید.

شکل شماره 3،4- موارد انجام شده در بخش HTML سایت 1،4،3- مشخص نمودن Unicode ها مشخص نمودن Unicode ها طبق استاندارد UTF-8 .

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

2،4،3- قرار گرفتن اطلاعات در جداول کلیه اطلاعات موجود در صفحات وب سایت (شامل عکسها، مطالب ، انیمیشن و ...) در سطر ها و ستونهای جداول طراحی شده قرار گرفت.

شکل شماره در این روش از بهم ریختگی و جابجا شدن اطلاعات و عکسها در مانیتور های مختلف (مانیتورهای Wide) جلوگیری می شود.

3،4،3- استفاده از فایل CSS (StyleSheet) به منظور هماهنگی در فونتها و سایر موارد.

در این روش به کمک نرم افزارDreamweaver ابتدا یک فایل CSS ایجاد گردید و سپس در این فایل کلاسهای مورد نیاز در سایت به منظور زیبایی و هماهنگی و سهولت استفاده و خوانایی کد HTML تعریف شد.

در همه صفحات از کلاسهای تعریف شده در فایل CSS استفاده گردید.

.(ارجاع به پیوست شماره .1...) شکل شماره 4،4،3- سیستم آدرس دهی نسبی در آدرس دهی پیوندها و عکسها از سیستم آدرس دهی نسبی (Relative) استفاده شده است.

بدین دلیل که اطلاعات بر روی هر سیستم ویا سروری به طور کامل نمایش داده شود.(ارجاع به پیوست شماره ..2..) 5،4،3- نام گذاری نوار عنوان به منظور سهولت کاربرتمامی صفحات در نوار عنوان، دارای عنوان مشخص می باشند.

شکل شماره 6،4،3- انتخاب فایلهای تصویری با حجم پایین در انتخاب فایلهای تصویری، همواره حجم کم فایلها مورد نظر بوده است.

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

7،4،3- تعریف کلاس برای پیوندها دقت در تعریف کلاسهای مربوط به پیوندها بطوریکه فونت و رنگ آنها پس از مشاهده پیوند به هیچ عنوان تغییر نخاهد کرد.

5،3-استفاده از java script در بعضی از صفحات از کدهای Javascript استفاده شده است.

این کدها به منظور جلب نظر و جذابیت، زیبایی و کارآیی هرچه بیشتروب سایت مورد استفاده واقع شده است.

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

شکل شماره 6،3- برنامه نویسی به زبان ASP در بخشهایی از وب سایت نیاز به برنامه نویسی بوده است.

برای رفع این نیاز و آماده سازی امکانات وب سایت از زبان برنامه نویسی ASP استفاده شده است.

.(ارجاع به پیوست شماره .4...) به عنوان مثال در صفحه آثار هنرمند جهت اتصال به پایگاه داده و نمایش اطلاعات در جدول مورد نظر کد نویسی انجام شده است.

شکل شماره فصل 4:نتیجه گیری و پیشنهادات همانطور که مستحضر به موضوع پروژه که طراحی وب سایت اطلاعاتی دکتر فرشچیان هستید،این گروه پروژه ها به منظور اطلاع رسانی و آشنایی افراد طراحی می شوند و مالک وب سایت (شخص حقیقی و یا حقوقی که وب سایت برای او طراحی شده است.) آثار و تحقیقات و یا دانش خود را به همگان معرفی می نماید.

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

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

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

فصل پایانی:پیوست پیوست شماره 1 پیوست شماره 2 پیوست شماره 3 پیوست شماره4