آموزش office sharepoint designer [بایگانی]

yousef86

سه شنبه 13 آذر 1386, 18:56 عصر

Expression Web

موضوع نقل از یک سایت آموزشی میباشد
مقدمه

امروزه صنعت طراحی وب در ایران و دیگر کشور ها در اندیشه پیشرفت و پیمودن راه های ترقی برای دستیابی به وب سایت های مکانیزه است. در واقع تمامی شرکت های نرم افزاری پتانسیل خود را بر روی تولید نرم افزارهای پیشرفته در امر طراحی وب متمرکز نموده اند تا بتوانند برای مدتی طولانی امپراطوری نرم افزار های وب را در دست بگیرند. از سال 1994 تا به حال شرکت مایکروسافت با عرضه بسته نرم افزاری فرانت پیج و با کسب 7 جایزه بین المللی به عنوان بهترین تولید کننده ابزار وب توانسته بود جای خود را در میان کاربران بیابد و به واقع خود را یکی از قدرتمندترین های دنیای وب بداند. در پایان سال 2006 میلادی شرکت مایکروسافت با انتشار خبری مبنی بر منسوخ شدن نرم افزار فرانت پیج خبر از انتشار دو برنامه جایگزین داد که در بسته های آفیس 2007 قابل دسترس خواهند بود. در واقع شرکت مایکروسافت با این کار خود پرونده این نرم افزار محبوب را بست و دو برنامه Office SharePoint Designer 2007 و Expression Web را منتشر نمود تا رقابتی تازه و نو را میان رقبای خود به راه بیاندازد. این دو محصول مایکروسافت شاید در ابتدا با برخورد مناسبی از سوی عامه مردم و طراحان مواجه نشد اما با گذشت زمان و استفاده و گسترش این نرم افزار همه به این نکته پی بردند که این عمل از سوی مایکروسافت نه تنها به ضرر آن ها نبوده بلکه در جهت تخصصی تر کردن امور طراحی وب و مکانیزه کردن آن بوده است. هدف مایکروسافت از تجزیه این نرم افزار به دو برنامه واحد جداسازی بین نرم افزارهای طراحی پیشرفته و مبتدی است. در واقع SharePoint Designer نرم افزاری برای طراحی ابتدایی صفحات وب و وب سایت های SharePintو Expression Web برای طراحی پیشرفته اینگونه صفحات و بهره بردن از امکانات پیشرفته طراحی صفحات دینامیک و استاتیک است.

آشنایی با محیط نرم افزار

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

شروع کار با نرم افزار

با باز کردن این برنامه یک فولدر به نام My Web Sites در My Document کاربری شما ایجاد می گردد که شما می توانید صفحات طراحی شده خود را در آن ذخیره کنید و تمامی فایل های مربوط به وب را در آن قرار دهید. در ابتدا برای شروع کار با برنامه به یک صفحه وب نیاز است تا بتوان مندرجات وب سایت را در آن اعمال نمود. در برنامه فرانت پیج فرمت صفحات وب تنها در غالب Html عرضه می گردید. اما در Expression Web امکان تولید صفحات Aspx و Css و Xml و ... وجود دراد و کاربر می تواند متناسب با فعالیت های خود یکی از آن ها را انتخاب کند. برای ایجاد یک صفحه وب که مبنای کاری طراحی می باشد به منوی File رفته و از آنجا گزینه New را انتخاب می کنید. در پنجره باز شده New تمامی فرمت هایی که این نرم افزار ساپورت می کند جای گرفته است. و شما می توانید بنا به نیاز یکی از آن ها را استفاده کنید. در قسمت های Asp.Net و CSS Layout و Style Sheets تنظیمات مربوط به این فرمت ها و انواع مختلف امکانات آن ها در دسترس قرار گرفته است. در قسمت Frames Pages نیز می توانید فریم مورد نظر را برای وب سایت خود انتخاب کنید. (فریم ها صفحاتی هستند که همگی در یک وب پیج قرار می گیرند. فریم ها در واقع هر کدام صفحه وب جدایی هستند که تنها در یک صفحه واحد جمع می گردند و قابلیت های مستقل یک صفحه را نیز دارا می باشند و بسته به نیاز صفحات را به گونه های مختلفی حیطه بندی می کنند.) در منوی General در قسمت Option پیوندی به نام Page Editor Option وجود دارد که توسط آن می توانید تمامی تنظمیات مربوط به صفحه وب خود را انجام دهید. همچنین در منوی Web Site نیز دو قسمت دیگر وجود دارد. یکی از آن ها به نام General در وااقع نوع وب سایت را تعیین می کند. این قسمت دارای سه زیر مجموعه است. One Page Web Site واسطه کاربری است که به هنگام کلیک بر روی آن فایلی به همراه یک وب پیج خالی در My Web Sites شما که در My Document شما واقع شده است ایجاد می گردد و شما می توانید طراحی را در آن آغاز کنید. Empty Web Site تنها رابطی است که یک فایل را در My Web Site ایجاد می کند و هیچ صفحه وب ذخیره شده خالی را نیز در آن قرار نمی دهد. و گزینه Import Web Site Wizard هم به منظور آپلود صفحات وب است که در گام های بعد به آن می پردازیم. در همین منو قسمتی نیز به نام Templates قرار دارد که نمونه های پیش ساخته وب را در اختیار کاربر قرار می دهد و کاربر می تواند بنا بر سلیقه و کار خود یکی از آن ها را انتخاب کند و تنها کاری که می بایست انجام دهد درج کردن مطالب مورد نیاز و عکس های مورد نظر خود به جای مدل های از پیش ساخته شده ای است که این نرم افزار در اختیار کاربر قرار می دهد.

نوار وضعیت

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

Visual Aids

این قسمت از نوار ابزار قابلیت نمایش خط و خطوط مخفی و به طور کل هر پارامتر مخفی دیگر را در وب دارا می باشد. در واقع برای درک این مفهوم می توان به بیان دیگر گفت در مواردی که Visual Aids در حالت On باشد شما تمامی مندرجات صفحه وب خود را از جمله جدول بندی های Text Box ها و غیره را مشاهده می کنید. اما در مواقعی که Visual Aids در حالت Off باشد در واقع شما تصویری از وب سایت خود را مشاهده می کنید که عین آن را در مرورگرهای اینترنتی مشاهده می کنید.
[/URL]
برای فعال یا غیر فعال کردن Visual Aids می توانید با دوبار کلیک کردن بر روی واژه Visual Aids بر روی نوار وضعیت حالت On و یا Off بودن آن را انتخاب کنید. همچنین می توانید با مراجعه به منوی View و در قسمت Visual Aids آن را فعال و یا غیرفعال کنید. و همچنین می توانید با استفاده از این منو تنظیمات مربوط به این پارامتر را به انجام برسانید. این تنظیمات در واقع شامل مواردی است که در هنگام On بودن Visual Aids می بایستی به نمایش درآید. لازم به ذکر است که این تنظیمات نمایش یا عدم نمایش حاشیه ها و المنت ها و بویژه خطوط جداول را نیز پوشش می دهد. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_visual_aids.bmp)

Style Application (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_visual_aids.bmp)

این پارامتر که در واقع طریقه انتخاب نوع وب سایت را که انواع آن در منوی File و در قسمت New قابل دسترسی بود را نشان می دهد و دو حالت کلی Manual و Auto را دارا می باشد و در تنظیمات اغلب به صورت Auto می باشد. Auto به این معناست که Style مورد نظر بدون هیچ تغییری و به عنوان پیش فرض یا Default در دسترس کاربر قرار می گیرد. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_visual_aids.bmp)
(http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_style_app.bmp)
Size (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_style_app.bmp)
در کنار Style Application پارامتری به نام Size قرار دارد که حجم وب مورد نظر را بیان می کند. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_style_app.bmp)
(http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_style_app.bmp)
Standard (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_file_size.bmp)

این قسمت نوع اطلاعات صفحه وب را بیان می کند. در واقع اکثر وب سایت ها اطلاعاتشان به صورت DocType بر روی اینترنت قرار می گیرد . این حالت استاندارد وب می باشد. برای تغییر این پارامتر می توانید به منوی File رفته و از آنجا با استفاده از پنجرهNew به گزینه Page Editor Optionمراجعه کرده و این پارامتر را تغییر دهید. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_file_size.bmp)
(http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_file_size.bmp)
Page Size (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_render_mode.bmp)

در این قسمت می توانید اندازه صفحه وب خود را مشاهده کنید. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_render_mode.bmp)
(http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_render_mode.bmp)
Html Schema (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_page_size.bmp)

این قسمت در واقع با قسمت Standard رابطه مستقیم دارد و نوع وب پیج را که بر چه اساسی ساخته شده است(در اغلب موارد بر مبنای DocType ) را نشان می دهد. برای تغییر این پارامتر می توانید به منوی File رفته و از آنجا با استفاده از پنجرهNew به گزینه Page Editor Option مراجعه کرده و این پارامتر را تغییر دهید. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_page_size.bmp)
(http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_page_size.bmp)
CSS Schema (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_schema.bmp)

این قسمت در واقع همانند Html Schema نوع CSS به کار رفته در وب پیج را نشان می دهد. (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_schema.bmp)

[URL="http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_schema.bmp"] (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_schema.bmp) (http://barnamenevis.org/forum/ms-help://MS.EXPRWD.12.1033/EXPRWD/content/sb_css_schema.bmp)
این هم قسمت پنجم از آموزش نرم افزار ExpressionWeb
Page Properties
بعد از ایجاد یک صفحه وب
نوبت به آن رسیده است تا یکسری تنظیمات را در قبال صفحه ایجاد شده انجام دهیم.
تنظیمات ابتدایی برای یک وب پیج شامل Title وب سایت و مواردی از این قبیل است. برای دسترسی به این آیتم به
منوی فایل رفته و از آنجا گزینه Properties … را انتخاب کنید.
بعد از باز شدن پنجره Page Properties در پوشه General کاربر قادر خواهد بود تا یکسری تنظیمات پیش فرض را انجام دهد. در قسمت Location کاربر می تواند محل ذخیره شدن صفحه وب را مشاهده کند. قسمت Page Description مخصوص نوشتن توضیحی کوتاه در مورد صفحه وب است و همچنین قسمت Keywords نیز برای نوشتن لغاتی است که در واقع ریشه در موضوع صفحه وب پیدا می کند و کار موتور های جستوجو گر را برای یافتن وب سایت های مورد نظر آسان تر مینماید. در قسمت BaseLocation کاربر می بایستی محل اصلی وب را که اغلب موارد همان آدرسی است که در Location درج شده است را در این قسمت نیز درج کند. در قسمت Background Sound کاربر می تواند موسیقی را در متن وب سایت قرار دهد تا به هنگام بارگذاری
کامل وب سایت شروع به پخش شدن کند. نرم افزار Expression Web فرمت های ذیل را مورد پشتیبانی و پخش در وب سایت قرار می دهد:
Wave/Midi/Ram/Ra/Aif/Aifc/Aiff/Au/Snd/Mpeg/Mp3/Asf
□ با توجه به این که Expression Web قابلیت قرار دادن موسیقی به هنگام تمام شدن بارگذاری وب سایت را دارد اما این موضوع یعنی پخش یک موسیقی بدون تمایل کاربر و به صورت خود کار اغلب کار پسندیده ای نیست و در اکثر موارد موجب آزردگی کاربران نیز می گردد. در ضمن لازم به ذکر است که این موسیقی در هنگام بارگذاری خطوط اینترنت کاربر را اشغال می کند و همین امر باعث کاهش سرعت اینترنت وی می گردد. بنابراین اگر هم طراح علاقه ای برای قرار دادن موسیقی بر روی وب سایت خود دارد می بایستی آن را با اجازه کاربر و زیر نظر وی پخش موسیقی را آغاز نماید و این امکان به کاربر داده شود تا هنگامی که کاربر از پخش موسیقی منصرف شد بلافاصله اقدام به این کار نماید. برای اینکار باید دکمه هایی تعبیه گردد تا توانایی پخش و ایستادن موسیقی را داشته باشد.

در پوشه Formatting یکسری تنظیمات مربوط به رنگ های وب مورد نظر وجود دارد. در قسمت Background کاربر می تواند یک عکس را به عنوان پیش زمینه در صفحه وب خود قرار دهد و به راحتی می تواند عکس مورد نظر را از طریق دکمه Browse انتخاب کند. همچنین کاربر نیز می تواند از قسمت Colors در همین پوشه برای پیش زمینه وب خود از قسمت Background یک رنگ را به این عنوان انتخاب کند. در قسمت Colors طراح می تواند تنظیمات مربوط به رنگ Hyperlink ها را وضع نماید.( Hyperlink ها پیوند هایی هستند که یک متن و یا یک تصویر را به یک صفحه دیگر متصل می کنند و با کلیک کردن بر روی آن ها کاربر را به صفحه مورد نظر ارجاع می دهند. در مورد در مورد مبحث Hyperlink جلوتر به طور مفصل بحث خواهیم کرد.) در قسمت Text طراح می تواند رنگ نوشته های خود را مشخص کند.(تمامی این تنظیمات به عنوان Default برای صفحات قرار می گیرند.) در قسمت Hyperlink طراح می تواند رنگ متنی را که واسطه Hyperlink است مشخص کند و هنگامی که یک کلمه زا واسطه Hyperlink قرار می دهد کلمه مورد نظر به آن رنگ درآید. در قسمت Visited Hyperlink کاربر قادر خواهد بود تا رنگ واسطه های Hyperlink را که از آن ها بازدید شده است را از دیگر گزینه ها جدا کند و آن را به رنگ مورد نظر در آورد. در قسمت Active Hyperlink نیز می توان رنگ واسطه ای را که موس بر روی آن قرار دارد تغییر داد و رنگ مورد نظر را انتخاب کرد. همچنین در قسمت Hovered Hyperlink نیز می توان رنگی را مشخص کرد تا به هنگامی که موس در حال کلیک کردن بر روی واسطه است تغییر رنگ دهد.

نکته ای که در اینجا مورد نظر قرار می گیرد این است که طراح تنها می تواند یکی از گزینه های Active و یا Hovered Hyperlink را انتخاب کند. به این دلیل که اجرای هر دوی آن ها به طور همزمان امکان پذیر نیست.

در پوشه Advanced طراح قادر خواهد بود تا حاشیه های صفحه وب خود را بنا به سلیقه خود تعیین نماید. در پوشه Language یکسری تنظیمات مربوط به زبان به کار برده شده در وب و رمزگذاری های مربوط به آن است. در قسمت Page Language می توانید زبان مورد نظر خود را انتخاب کنید و در قسمت Html Encoding که مروبط به رمزگذاری های زبانی است می توانید نوع رمز مورد نظر خود را انتخاب کنید. اما اگر آن ها را تغییر ندهید گروهی بیشتری بدون عوض نکردن رمز می توانند مطالب وب شما را بخوانند و در غیر این صورت بازدیدکننده وب سایت شما می بایست Encoding را تغییر دهد تا قادر به مطالعه مطالب باشد.