سری آموزش های فصل ششم (HTML):
آموزش HTML : چند رسانه ای در وب
سلام خدمت همراهان عزیز یکشنبه ها و پنج شنبه ها با آموزش زبان برنامه نویسی (HTML) همراه شما هستیم. برای اطلاعات بیشتر به مقاله ی هفته ی قبل مراجعه فرمایید .
انیمیشن و صفحات وب :
گاهی انیمیشن (تصاویر متحرک) نسبت به تصاویر ساکن جذابتر اند به طوری که امروزه یکی از جنبه های متداول در وب است انیمیشن مبتنی بر تصاویر GIF را می توان در نرم افزار هایی مثل Photoshop ایجاد کرده و از آنها در مرورگر های مختلف استفاده نمود.
انیمیشن مبتنی بر GIF:
انیمیشن مبتنی بر GIF تصاویر GIF هستند که حرکت می کنند. همچنین انیمیشن GIF را می توانید به صفحه وب وارد کنید و تنظیم مرزها و سایر ویژگی های آن را دستکاری کنید. اما برخلاف فایلهای GIF معمولی GIF انیمیشن می تواند حرکت کند . GIF انیمیشن می تواند انیمیشن کوتاهی را ایجاد نماید.برای انتقال یک فایل انیمیشن مبتنی بر GIF به صفحه وب همانند یک تصویر GIF معمولی از دستور IMG در HTML استفاده می شود.
مثال:
بر روی کامپیوتر خود یک فایل انیمیشن با نام مشخص ایجاد کنید و آن را با دستورات زیر می توانید وارد صفحه وب کنید.
| <html>
<h1> a sample image </h1> <hr> <“img scr=”c://hand.gif> <html/> |
|---|
فایل را با نام مشخص بر روی دیسک ذخیره کنید و پس از خروج از برنامه notepad آن را به مرورگر وب بیاورید تا انیمیشن را مشاهده کنید . پس از اتمام کار از این مرورگر خارج شوید.
مراحل درست کردن یک تصویر انیمیشن:
1 اگر نرم افزار فتوشاپ در کامپیوترتان نصب نیست آن را نصب کنید همراه با نصب این نرم افزار برنامه ای به نام Image Ready نیز نصب می شود که برای دستیابی به آن می توانید به مسیر Start/Programs/Adobe/Photoshop مراجعه کنید.
2 برنامه Image Ready را به روشی که در قدم 1 گفته شد اجرا کنید (محیط آن مثل محیط فتوشاپ 5/5 است ولی با اندکی تغییر) پس از راه اندازی این برنامه پنجره های Animation و Layers را در کنار سایر پنجره ها مشاهده خواهید کرد.
3 با گزینه (File/New) در(Image Read) فایل جدیدی ایجاد کنید.
4 گزینه Layer/New/New Layer یک لایه جدید ایجاد کنید.
دانلود رایگان:
5 دکمه مولد منوی انیمیشن را در پنجره انیمیشن (دکمه*) کلیک کنید تا منوی ظاهر شود در این منو گزینه New frame را کلیک کنید تا یک فریم جدید در این لایه ایجاد نمایید اکنون یک فریم از تصویر انیمیشن را در این لایه ایجاد کنید برای اینکه کار خود را آسان کنیم متن A Sample Animation را به صورت انیمیشن را به صورت انیمیشن در می آوریم .
برای این کار، عنصر T را از نوار ابزار Image Ready انتخاب کنید تا یک متن انیمیشن ایجاد نمایید . پس از انتخاب این ابزار در نقطه ای از فایلی که باز کردید کلیک تا مکان نما در آن محل قرار گیرد. اکنون حرف A را تایپ کنید و کلید space را فشار دهید یعنی فریم A در لایه یک قرار دارد و حاوی حرف A و یک فضای خالی است.
6 اکنون فریم 2 را باید در لایه 2 قرار دهید برای این منظور یک لایه جدید ایجاد کنید (گزینه Layer/New Layer را انتخاب کنید) و سپس یک فریم جدید ایجاد نمایید (دکمه * را در پنجره انیمیشن کلیک کرده از منوی حاصل New Frame را انتخاب کنید) اکنون حرف S را تایپ کنید.
7 مرحله 6 را برای تمام حروف عبارت A Sample Animation تکرار کنید.
8 برای اینکه این فایل را در محیط Image Ready امتحان کنید دکمه * (play animation) را در پنجره (Animation) کلیک کنید. اکنون حالت انیمیشن مشاهده می شود برای توقف انیمیشن دکمه Esc را از صفحه کلید با دکمه (stop animation) را در پنجره animation کلیک کنید.
پیشنهاد مطلب روز:
9 برای اینکه انیمیشن را در یک مرورگر (مثل Internet Explorer) امتحان کنید گزینه File/preview/Internet Explorer را انتخاب نمایید بدین ترتیب این فایل به آن مرورگر منتقل می شود و حالت انیمیشن در آن اجرا می گردد.
10 پس از کار کردن با مرورگر از آن خارج شوید تا به محیط Image Ready بر گردید.
11 پسوند فایل انیمیشنی که ایجاد کردید Psd است که در مرورگرها قابل استفاده نیست. این فایل باید با پسوند gif ذخیره شود برای این منظور گزینهOptimized As File/Save را انتخاب کرده در کادری که ظاهر می شود نام فایل را (مثلا anim) وارد کنید. پسوند فایل توسط سیستم gif انتخاب می گردد.
12 اکنون از برنامه Image Raedy خارج شوید هنگام خروج از شما در خواست می شود که آیا فایل با پسوند Psd نیز ذخیره شود یا خیر جواب مناسبی بدهید تا از آن خارج شوید.
13 یک برنامه ساده HTML ایجاد کرده تصویر anim.gif را با دستور <IMG> به آن اضافه کنید نام برنامه(HTML) را anim.htmv انتخاب کنید.
14 مرورگر Internet Explorer را اجرا کرده فایل anim.htm را به آن وارد کنید اکنون فایل انیمیشن در این مرورگر اجرا می گردد.
15 پس از کار کردن با انیمیشن از مرورگر خارج شوید.
16 اگر در فزآیند کار مشکل داشتید با ما در تماس باشید.
برگرفته از :
کتاب راهنمای جامع (HTML, BHTML, XML)
دکتر عین الله جعفر نژاد قمی
پاسخ به سوال دوستان :
شاید تاکنون به این فکر کرده باشین که چرا باید برای کسب و کار خود وبسایت داشته باشین ؟
دلیل اینکه می‌گوییم باید سایت داشته باشید این آمار است. توجه کنید که ۸۱٪ از افراد قبل از
تصمیم گیری در مورد خرید و فروش در یک کسب وکار یا خدمات، در اینترنت تحقیق می کنند.
یعنی ۲۵.۹۲ میلیون نفر هستند که مشاغل را به صورت آنلاین جستجو می کنند. با این وجود ۴۶% کسب و کارها فکر می‌کنند نیاز به وب سایت ندارند.
توجه داشته باشید که جهان به سمت دیجیتالی شدن پیش می‌رود و نداشتن وب سایت
برای یک شرکت یا هر کسب و کاری، به منزلۀ جا ماندن از گردونۀ روزگار است.
برای اطلاعات بیشتر با همکاران ما در شرکت آراز پردازش در ارتباط باشید
آدرس ایمیل: info@arazpardazesh.com
اینستاگرام شرکت: https://instagram.com/araz_pardazesh_kla
تماس با ما: https://arazpardazesh.com/contact