مقاله طراحی صفحات وب

فرمت : WORD تعداد صفحه :118

بخش اول

طراحی صفحات وب با FrontPage 2000

فصل اول

ایجاد یک صفحه وب

پرکردن صفحه خالی، دانشی است که www آن را از اجدادش در خانواده مکتوبات به ارث برده است: کتابها، مجلات و روزنامه. سنگ نوشته های حکاکی شده را نیز می توان در این زمره به حساب آورد، گو اینکه روش ایجاد آنها کاملا متفاوت است.

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

همچنین متن فوق پیوند را که صفحه را به اسناد دیگر در سایت وب خودتان یا www متصل می کنند تعیین خواهید نمود.

هنگام کار با صفحات، یاد خواهید گرفت که عنوان صفحه را تعیین کرده و رنگ یا تصویر زمینه آن را انتخاب کنید. همه چیز از صفحه خالی تنهایی در وب جاری FrontPage 2000 آغاز می شود.

ایجاد و عنوان دهی به یک صفحه

برای ویرایش یک صفحه، ابتدا باید آن را در نمای Page برنامه FrontPage 2000 بارگذاری کنید.

هر صفحه وب در FrontPage 2000، مثل یک الگو آغاز می شود. اگر می خواهید صفحه جدیدی را از ابتدای کار شروع کنید، بهترین روش استفاده از الگوNormal Page است.

برای شروع صفحه ای جدید، New Page,File یا دکمه New Page درمیله ابزار استاندارد کلیک کنید.

هنگامی که الگوی صفحه جدید را انتخاب کنید، بلافاصله صفحه برای ویرایش در نمای Page قرار می گیرد.

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

از ابتدا به صفحه جدید اسم فایل منحصر به فردی مثل newpage2.htm,newpage1.htm داده خواهد شد. می توانید با کلیک کردن Save As,File نام دیگری برای آن برگزینید و یا بعدا در نمای Folders اسمش را تغییر دهید. روی فایل راست کلیک کنید واز منوی ظاهر شده Rename را برگزینید.

نکته: اگر لیست Folders هنگامی که درنمای Page قرار دارید، قابل مشاهده است، می توانید از آن برای تغییر نام فایل ها استفاده نمایید. دستور Folder List,View را انتخاب کنید تا ظهور یا عدم ظهور آن را کنترل نمایید.

اگر وب جاری را بدون هیچ گونه تغییری در صفحه جدید ببندید FrontPage 2000 از صفحه صرف نظر می کند. در غیر این صورت هنگام بستن وب و یا مشاهده پیش نمای آن در یک مرورگر، به شما یادآوری می کند که آن را ذخیره نمایید.

افزودن حاشیه های اشتراکی به یک صفحه

مورد دیگری که هنگام ایجاد صفحه به آن اضافه می شود، هر نوع حاشیه ای است که با بقیه وب جاری مشترک می باشد.

FrontPage 2000 شما را قادر می سازد نواحی حاشیه داری تعریف کنید که بین تمامی صفحات هر وب مشترک باشند. روی Shared Borders,Format کلیک کنید تا ببینید چه نوع حاشیه های مشترکی مورد استفاده قرار گرفته اند. یک کادر تبادلی باز می شود که نشان دهنده حاشیه هایی است که در وضعیت جاری به اشتراک گذارده شده اند.

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

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

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

عنوان دهی به یک صفحه

به هر صفحه وب، یک عنوان داده می شود. با اینکه FrontPage 2000 عنوان پیش گزیده ای را به صفحه اختصاص می دهد، اما اغلب عبارتی است که باید تعویض شود، مثل "New Page 5" که کمک زیادی به کسانی که در وب شما به گشت و گذار می پردازند، نماید.

عنوان هر صفحه، در نوار عنوان بیشتر مرورگرهای وب یعنی لبه بالایی پنجره ای که مرورگر را در بر دارد ظاهر می شود (مرورگرهای غیر ویژوال و متنی به صورت متفاوتی با عنوان برخورد می کنند).

برای عنوان دهی به هر صفحه Properties.File را انتخاب کنید و یا روی صفحه راست کلیک نموده از منوی ظاهر شده Page Properties را بر گزینید. یک کادر تبادلی باز می شود که حاوی شش کادر تبادلی برگه دار است. می توان آنها را برای ایجاد تغییر در صفحه به کار برد. داخل برگه General، می توانید عنوان جدید را وارد نمائید.

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

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

انتخاب عنوان توصیفگر و مفید و مختصر به دو دلیل اهمیت دارد- کمک می کند افراد بتوانند وب تان را مورد استفاده قرار دهند و کمک می کند که دیگران بتوانند آن را بیابند.

اگر از الگو Table of Contents برای افزودن این نوع صفحه به وب استفاده کنید، تمامی عناوین صفحات در جدول حاصله از فهرست محتویات ظاهر می گردند.

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

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

انتخاب زمینه

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

Background,Format را اجرا کنید تا کادر تبادلی Page Properties که برای انتخاب زمینه به کار می رود، بازگردد.

برای استفاده از تصویر زمینه، دکمه Browse را فشار دهید. کادر تبادلی فایل ظاهر می شود امکان انتخاب هر فایل موجود در سیستم را فراهم می سازد. تصویر زمینه باید در یکی از قالب های jpg,GIF یا PNG به ثبت رسیده باشد.

می توانید از یک URL برای مشخص کردن تصویر زمینه استفاده کنید، اما این کار باعث می شود FrontPage 2000 گرافیکی استفاده کند که بخشی از وبت تان نیست.

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

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

برای انتخاب رنگ زمینه به جای تصویر، کادر بررسی Background Picture را از حالت انتخاب شده خارج کنید و روی منوی کرکره ای Background Colors کلیک کنید. کادر تبادلی انتخاب رنگ استاندارد FrontPage ظاهر می شود که دارای 16 رنگ اولیه است. اگر از هیچ از این رنگها خوشتان نیامد، روی دکمه More Colors کلیک کنید تا کادر تبادلی رنگ پیشرفته تری، ظاهر می گردد.

می توانید یکی از رنگهای نشان داده شده در کادر تبادلیMore Colors را انتخاب کنید یا مقدار شانزدهی رنگ را در فیلد Value وارد نمائید. حتی می توانید دکمه Custom را فشار دهید تا کادر تبادلی انتخاب رنگ سوم با انتخابهای بیشتر، بازگردد.

آشنایی با مقادیر شانزدهی کاملا غیر ضروری است، چرا که در FrontPage 2000 می توانید از طریق دیگری رنگها را برگزینید. برای برطرف سازی حس کنجکاوی: مقادیر شانزدهی، اعدادی هستند در مبنای 16، که بدین معناست شانزده عدد یک رقمی مختلف وجود دارد فایده آنان در برنامه های کامپیوتری به این خاطر است که تنها با دو رقم،255 مقدار را می توان نشان داد. اولین 20عدد شانزدهی عبارتند از 13,12,11,10,F,E,D,C,B,A,9,8,7,6,5,4,3,2,1,0. میکروسافت می توانست اسم فرم افزارش را FrontPage 7DO بگذارد.

رنگ انتخاب شده در پشت محتویات صفحه به نمایش در خواهد آمد.

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

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

افزودن متن به یک صفحه

برای افزودن متن به هر صفحه وب، آن را در نمای FrontPage 2000 باز کنید و شروع کنید به تایپ کردن، کاراکترها در بخش محل جاری انتخاب شده برای مکان نما ظاهر خواهند شد، چه در حاشیه ای اشتراکی چه در بخش اصلی صفحه باشید.

حاشیه های اشتراکی از طریق خطوط نقطه چین در صفحه نشان داده می شوند. این خطوط هنگامی که صفحه در یک مرورگر نشان داده میشوند، ظاهر نخواهد شد.

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

میله ابزارfor matting این دکمه ها را دارا می باشد:

Bold- باعث می شود متن به صورت توپر ظاهر گردد.
Italic- متن را کج می کند.
Underline- متن را زیر خط دار می کند.
Align Left- تمامی متن و سایر عناصر صفحه ای را در حاشیه چپ صفحه تنظیم می نماید.
Center- عناصر صفحه ای انتخاب شده را در مرکز قرار می دهد.
Align Right- عنصر انتخابی را در حاشیه راست قرار می دهد.
Increase Indent- حالت دندانه ای عناصر انتخابی را کاهش می دهد.

بیشتر این دکمه ها در نرم افزارهای مختلف مشترک هستند به ویژه شمایل های U,I,B که برای توپر کردن، کج کردن و زیر خط دار کردن به کار می روند.

نکته: FrontPage 2000 می تواند در یادگیری هدف هر یک از دکمه های به کار رفته در میله های ابزار Standard و Formatting یاری رسان باشد. اگر مکان نما را چند لحظه روی دکمه ای نگه دارید، FrontPage یک نکته را که حاوی اسم آن دکمه است به نمایش می گذارد.

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

فشردن کلید Enter باعث ظاهر شدن یک انفصال پاراگرافی می شود. این عمل حتی در صورتی که در حال مرتب سازی تصاویر و سایر عناصر صفحه در کنار متن باشد، صورت می پذیرد.

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

اگر اولین بار است که FrontPage 2000 برای انتشار یک صفحه وب استفاده می کنید، باید با کمی کنترل روی ظاهر صفحه به نمایش در آمده آشنا باشید.

بر خلاف رسانه ای نظیر چاپ، که صفحه دقیقا آن طور که طراح می خواسته به نظر خواهد رسید، وب رسانه ای سیال است که صفحات می توانند خودشان را برای پر کردن فضایی که در اختیار دارند، تنظیم نمایند.

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

متن صفحه بسته به فضای در اختیار آن به گونه ای متفاوت ظاهر می شود.

هر انفصال پاراگرافی در صفحه وب باعث می شود که خطی حالی در اکثر مرورگرها، از جملهNetscape Nevigator و Microsoft Internet Explorer ظاهر گردد. برای آغاز متن از حاشیه چپ بدون درج انفصال پاراگرافی، می توانید انفصالی خطی را با انتخاب Break,Inster و سپس گزینه Normal Line Break از کادر تبادلی بعدی، درج نمایید.

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

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

تبدیل متن به فوق پیوند

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

هر چیزی را که بتوان در صفحه قرار داد، می توان با فوق پیوندها نیز مرتبط ساخت: متن، تصاویر، اپلت های جاوا، فیلمهای Quick Time، فایل های صوتی WAV و هر چیز دیگر. به هر کسی که پورتی TCP/IP را از طریق اتصالی مناسب مورد استفاده قرار دهد، می توان فوق پیوندی را ایجاد کرد.

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

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

برای ایجاد یک فوق پیوند باید با آن مرتبط گردد پررنگ ساخته و دستور Hyperlink,Instead را انتخاب کنید یا دکمه Hyperlink راروی میله ابزار Standard فشار دهید.

دانلود فایل >>>

سایر محصولات :
مقاله طراحی صفحات وب

مقاله طراحی صفحات وب ...

پروژه پایانی بررسی وضعیت بانکهای خصوصی در ایران با فرمت ورد word

پروژه پایانی بررسی وضعیت بانکهای...

دانلود پروژه پایانی بررسی وضعیت بانکهای خصوصی در ایران با فرمت ورد word

دانلود پروژه پایانی بررسی وضعیت...

طراحی سایت با flash و front page

طراحی سایت با...

ساختار های کنترلی vb

ساختار های کنترلی vb...

زبان تخصصی