دوره آموزش زبان html
بنام خداوند یکتا
در این دوره از دوره های آنلاین مجله اینترنتی مبین و وبسایت فناوری اطلاعات مبین میخواهیم بپردازیم به آموزش زبان HTML
در بخش دوم آموزش زبان html آموختیم که چگونه میتوانیم متن را در صفحات وب نمایش بدهیم.حال در این بخش به بررسی نحوه نمایش رسانه (عکس، ویدیو و صوت) در صفحات وب میپردازیم.
بخش سوم
چندرسانه یا همان multi media جزو پرکاربردترین عناصر هر صفحه وبسایت است.تقریبا میتوان گفت تمام صفحات وب دارای تصویر هستند. چراکه تصاویر باعث میشوند تا کاربر و بازدید کننده شما بیشتر با وبسایت یا وبلاگ شما ارتباط برقرار کند.
میتوان گفت تصویر یک راه خیلی ساده برای بیان بهتر و گیراتر محتوا به بینندگان است.اما برای نمایش تصویر در وبسایتمان چه باید کنیم؟
نمایش تصویر :
برای نمایش عکس در صفحات وب باید از تگ img استفاده کنیم. به این صورت :
<img src=”http://mobeen.ir/photo-name.jpg” />
در مثال بالا مقدار src همان مقدار source تصویر یا آدرس تصویر است که درواقع یک تصویر در اینترنت میباشد.
توجه : اگر درحال تست کد ها در کامپیوتر شخصی خود هستید میتوانید تصویری را کنار فایل html خود قرار دهید و ادرس تصویر را به این صورت وارد کنید :
<img src=” photo-name.jpg” />
از موارد مهمی که باید برای تگ img خود وارد کنید مقدار alt است .
مقدار alt چیست ؟
حتما برای شما نیز پیش آمده است که در گوگل یک چیزی جستجو کنید و تعدادی تصویر را نیز به عنوان نتیجه جستجو مشاهده کنید یا مثلا وقتی در بخش images گوگل به جستجو میپردازید برای شما تصاویری متناسب با متن جستجو شده نمایش داده میشود.
برای اینکه تصاویر شما نیز در این نتایج جستجو ها نمایش داده شود باید از مقدار alt استفاده کنید.
<img src=”http://mobeen.ir/photo-name.jpg” alt=”آموزش زبان html” />
به این ترتیب.
اما بی شک فیلم یا ویدیو نیز بسیار کاربردی میباشد.شاید شما بخواهید فیلم معرفی یک محصول را در وبسایت خود قرار دهید تا کاربران شما بتوانند آن را مشاهده کنند.اما چه باید کرد ؟
نمایش ویدیو :
درواقع برای نمایش فیلم باید از تگ video استفاده کنید.به این صورت :
<video width=”۳۲۰” height=”۳۲۰” controls>
<source src=”http://mobeen.ir/movie.mp4” type=”video/mp4”>
مرورگر شما نمیتواند ویدیو پخش کند.
</video>
در این تگ دو ویژگی مهم وجود دارد که یکی مربوط عرض (width) و دیگری ارتفاع (height) میباشد.
ویژگی مهم بعدی نیز controls است که درواقع ابزار هایی مانند کم و زیاد کردن صدای ویدیو، جلو و عقب کردن زمان ویدیو و … میباشد.
تگ source موجود در تگ video مشخص کننده آدرس ویدیو است که درواقع مقدار src همان مقدار آدرس ویدیو است و مقدار type نیز تعیین کننده نوع فرمت ویدیو شما است.
و متنی که در انتها نمایش داده میشود برای این است که اگر مرورگر بازدید کننده ، مرورگر قدیمی باشد و امکان اجرای این تگ را نداشته باشد نمایش داده شود.
و در آخر برای پخش صدا در وبسایتمان چه باید کنیم ؟
پخش صدا :
در اینجا برای پخش صدا باید از تگ audio استفاده کنیم.به این صورت :
<audio controls>
<source src=”http://mobeen.ir/audio.mp3” type=”audio/mpeg” >
مرورگر شما نمیتواند صدا پخش کند.
</audio>
به این ترتیب.
امیدوارم این بخش نیز برای شما مفید واقع شده باشد. لطفا نظرات خود را در انتهای همین پست برای ما ارسال کنید.
جهت سفارش و طراحی وبسایت میتوانید با ما تماس بگیرید : ۰۹۱۲۲۲۰۸۵۶۷ – www.mobeen.org