/ ..::| آموزش جامع html از مقدماتی تا پیشرفته |::..
وندا هاست
طراحی و راه اندازی وبسایت و انجمن توسط ویکی وی بی ویکی وی بی در قبال معاملات صورت گرفته با هر یک از اعضا و سفارشات طراحی خارج از این اطلاعیه هیچگونه مسئولیتی نمی پذیرد
بک لینک ها
تبلیغات شما وندا هاست
صفحه 2 از 2 نخستنخست 12
نمایش نتایج: از 11 به 19 از 19

موضوع: ..::| آموزش جامع html از مقدماتی تا پیشرفته |::..

  1. #11
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت پنجم :.

    --------------------------------------

    وارد کردن تصاویر در صفحات html / تنظیم محل قرار گیری (align) / و alt چیست؟

    --------------------------------------
    وارد کردن تصاویر در صفحات html


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

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

    برای وارد نمودن تصاویر در صفحات وب از این تگ استفاده می شود
    کد:
     <img src=”image.gif” alt=””> 
    این تگ img نشانه قرار گرفتن تصویر در صفحه و خصوصیت src آدرس محل قرار گرفتن فایل تصویر است . اگر صفحه ای که عکس باید در ان قرار گیرد و خود تصویر در یک پوشه قرار داشته باشد شما میتوانید فقط نام فایل را به ادرس کامل بنویسید


    مثلا اگر تصویر شما در این ادرس قرار دارد http://www.wikivb.ir/images/wikivbv1/logofoot.png و صفحه ای که در حال ویرایش آن هستید در پوشه ای غیر از این قرار دارد شما باید تگ زیر را برای اضافه کردن تصویر به صفحه خود به کار ببرید

    کد:
    <img src=”http://www.wikivb.ir/images/wikivbv1/logofoot.png “ alt=””>
    اگر فایل html و تصویر هر دو در یک پوشه ( در این مثال هر دو در پوشه images ) باشند میتوان از این تگ استفاده کرد

    کد:
    <img src=”wikivbv1/logofoot.png”/>
    پسوند فایل حتما نباید gif باشد یعنی شما میتوانید از فرمتی مثل jpg نیز استفاده کنید این دو فرمت از بقیه پر استفاده تر هستند اگر شما تصویری با فرمتی غیر از این دو فرمت دارید میتوانید از برنامه های ویرایش عکس از قبیل فتوشاپ برای تبدیل فرمت استفاده کنید
    برای نمونه من میخواهم یک عکس را با نام php.gif را که در پوشه images قرار دارد در صفحه وب اضافه کنم
    در اینجا از این تگ استفاده میکنم
    کد:
     <img src=”images/php.gif”/>
    
    به این ترتیب یک تصویر را در سمت چپ مرورگر خواهید دید

    6 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 07-31-2013 در ساعت 02:16 AM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  2. نوين وردپرس تبلیغات شما

  3. #12
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    ادامه آموزش قسمت پنجم ...


    align چیست ؟

    با اضافه کردن مقدار align و قرار دادن ان در تگ img شما می توانید چینش تصویر را تعیین کنید
    کد:
    <img src="http://www.wikivb.ir/images/wikivbv1/logofoot.png" align="center" alt="WiKiVb logo"/>

    مقدار align میتواند top.left . right. center باشد که در قسمت های اینده توضیحات بیشتری خواهیم داد

    align ها کاربرد های بسیاری در صفحات وب دارند و خصوصیت بسیار مهمی در نحوه نمایش یک صفحه وب هستند . به خاطر داشته باشید که ادرس محل عکس و نام ان به حروف کوچک و بزرگ و فاصله ها حساس هستند پس ممکن است اگر به جای image.jpg از IMAGE.JPG استفاده کنید مرورگر شما تصویر را در صفحه نشان ندهد پس در نوشتن انها دقت کنید

    alt چیست؟

    alt مخفف کلمه alternate text میباشد که برای اضافه کردن توضیحی کوتاه در مورد عکس مورد نظر استفاده میکنیم

    طریقه نمایش این توضیحات در مثال ها موجود است
    کد:
    <img src="http://www.wikivb.ir/images/wikivbv1/logofoot.png" align="center" alt="WiKiVb logo"/> 



    در مورد اضافه کردن تصاویر به صفحه بعدا با جزئیات بیشتری توضیح می دهیم تا اینجا یاد گرفتیم چگونه یک تصویر به صفحه اضافه کنیم و نحوه قرار گیری آنرا در صفحه تعیین کینم
    .: پایان قسمت پنجم آموزش :.

    سپاس

    5 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 07-31-2013 در ساعت 02:19 AM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  4. #13
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت ششم :.

    --------------------------------------

    table ها / طول و عرض table ها / خصوصیات border/و align و یا چینش در سطرها و ستون ها / table های تو در تو / background color (رنگ پس زمینه جدول )

    --------------------------------------


    table ها

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

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

    table ها به وسیله تگ <table> مرورگر معرفی میشود و دارای ستون و سطر هستن ستون ها به وسیله تگ های <td> و سطر ها به وسیله تگهای <tr> مشخص میشوند

    لازم به ذکر است که تگ های <tr> و <td> به تنهایی کاربردی ندارند و لزوما باید همراه تگ <table >در کد قرار گیرند


    در زیر نمونه ای از یک table با یک ستون و یک سطر میبینید



    کد:
    <table> <tr> <td> </td> </tr> </table>
    به نحوه باز شدن و بسته شدن تگها توجه کنید ( قانون تگهای باز و بسته - قسمت اول آموزش HTML)

    این table میتواند تعداد دلخواهی ستون و سطر داشته باشد و محدودیت از این نظر ندارد برای اینکه بتوانیم کنترول بیشتری بر روی ظاهر این جدول ها داشته باشیم میتوانیم از خصوصیات های این جدول ها استفاده کنیم این نکته را نیز به خاطر بسپارید که تعداد سلول ها ///// <td> در سطر ها در اکثریت موارد و به غیر از مواردی خاص یکسان است

    طول و عرض table ها

    دو خصوصیت width وheight این توانایی را به ما میدهند که طول و ارتفاع این جدول ها را تعیین کنیم

    این طول و عرض میتوانن به صورت وابسته و یا ثابت باشند در حالت وابسته طول و عرض با درصدی از عرض کل صفحه مشخص میشود و در اندازه گذاری ثابت به جدولها و سلول ها داده میشود



    کد:
    <table width="200" height="200"> <tr> <td></td> <td></td> </tr> </table>
    این جدول دارای دو ستون و یک سطر با ارتفاع و عرض 200 پیکسل است و جدول زیر دارای دو ستون با عرض 80% از عرض صفحه است



    کد:
    <table width="80%" height="80%"> <tr> <td></td> <td></td> </tr> </table>
    خصوصیات border

    مرز بین این سطر ها و ستونها با استفاده از خطوط border مشخص میشود که میتوان با استفاده ار این خصوصیت آن را کنترول کرد



    کد:
    <table width="80%" height="80%" border="1"> <tr> <td></td> <td></td> </tr> </table>

    مقدار border نشان دهنده ضخامت ان است و در صورتی که مقدار آن صفر (0) باشد border نمایش داده نمیشود

    6 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 12-03-2012 در ساعت 11:25 AM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  5. #14
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    ادامه آموزش قسمت ششم ...

    align و یا چینش در سطرها و ستون ها

    هر سطر و یا ستون در یک جدول میتواند چینش مختص به خود را داشته باشد یعنی عناصر داخل ان سطر و یا ستون از چینش آن سط و یا ستون پیروی میکنند
    به طور مثال :::




    کد:
    <table width="200" height="200" border="1" align="center"> <tr> <td> ستون اول - سطر اول </td> <td> ستون دوم - سطر اول </td> </tr> <tr> <td> ستون اول - سطر دوم </td> <td> ستون دوم - سطر دوم </td> </tr> </table>

    در این مثال جدول از دو سطر و دو ستون تشکیل شده است در مثال مشخص شده است و کلیه سطرها و ستون ها از چینش که به تگ table در ابتدای مثال داده شده است پیروی میکنند و چینش همه سطر ها و ستون ها center است.

    میتوان به هر یک از سطر ها و ستون ها نیز به تنهایی چینش و align بدهید . به مثال زیر توجه کنید



    کد:
    <table width="200" height="200" border="1" align="center"> <tr> <td align="right">ستون اول - سطر اول </td> <td align="left"> ستون دوم - سطر اول </td> </tr> <tr> <td> ستون اول - سطر دوم </td> <td> ستون دوم - سطر دوم </td> </tr></table>

    در مثال ملاحضه میکنید که نوشته هایی که در بین تگهای <td> </td> نوشته شده اند در ان سلول نمایش داده میشود و در صورتی که هیچ عنصری در بین این تگها نباشد سلول به صورت خالی نمایش داده میشود

    عناصر کوچکتر تشکیل دهنده هر جدول را سلول می نامیم . در مثال بالا جدول دارای چهار سلول است

    table های تو در تو

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


    کد:
       
    
    <table width="200" height="200" border="1" align="center"> <tr> <td align="right"> 1 </td> <td align="left"><table width="200" height="200" border="1" align="center"> <tr> <td align="right"> 2 </td> </tr> <tr> <td> 3 </td> </tr> </table> </td> </tr> <tr> <td> 4 </td> <td> 5 </td> </tr> </table>



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

    background color (رنگ پس زمینه جدول )

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


    کد:
    
    
    <table width="200" height="200" border="1" align="center" bgcolor="red"> <tr> <td align="right" bgcolor="blue"> 1 </td> <td align="left"> <table width="200" height="200" border="1" align="center"> <tr> <td align="right"> 2 </td> </tr> <tr> <td> 3 </td> </tr> </table> </td> </tr> <tr> <td> 4 </td> <td> 5 </td> </tr> </table>




    ملاحضه میکنید که رنگ پس زمینه جدول به رنگ قرمز است ولی رنگ قسمت 1 ابی است و چون خود این سلول دارای رنگ پس زمینه است از رنگ پس زمینه کل جدول پیروی نمیکند


    .: پایان قسمت ششم آموزش :.

    سپاس

    7 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 12-05-2012 در ساعت 07:24 PM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  6. #15
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت هفتم :.

    --------------------------------------

    لیست ها / فقط لیست ها مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

    --------------------------------------


    لیست ها

    لیست ها در حال حاظر کاربرد بسیار گستردهای در طراحی صفحات وب پیدا کرده اند در تکنیکهای جدید طراحی صفحات وب از جمله JQUERY , CSS لیستها نقش بسیار مهمی دارند ( مخصوصا در ساخت منوها)

    لیستها با استفاده از تگ های <li> <ol> <ul> در صفحات html وارد میشوند و دارای چندین نوع هستند لیستها گاهی با عدد شماره گذاری میشوند و گاهی با اشکالی ماننده دایره و مربع و... ( وگاهی بدون نشانه )

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

    به طور مثال :




    کد:
    <ul> <li> www.wikivb.ir </li> <li> www.taakforum.org </li> </ul>
    • www.wikivb.ir
    • www.taakforum.org



    کد:
        
    
    <ol> <li> www.wikivb.ir </li> <li> www.taakforum.org </li> </ol>
    1. www.wikivb.ir
    2. www.taakforum.org



    نحوه نمایش این لیست ها در زیر کد های انها مشخص شده است که در مثال اول با استفاده از اشکال نمایش داده شده است و در مثال دوم با عددها
    در این مثالها تگ <ul> و <ol> نشان دهنده لیست و تگ <li> نشان دهنده اجزاء این لیست هستند

    نوع دیگری از لیست ها نیز وجود دارد که در زیر با ذکر یک مثال به ان میپردازیم




    کد:
    <html> <body> <dl> <td> www.wikivb.ir </td> <dd> مرجع تخصصی و رایگان ویبولتین </dd> <td> www.taakforum.org </td> <dd> انجمن تاک فروم </dd> <dl> </body> </html>

    در این مثال تگ <dl> نشان دهنده لیست در صفحات HTML و تگ <td> نشان دهنده اجزاء لیست و تگ های <dd> نشان دهنده توضیحاتی برای اجزاء میباشد .


    .: پایان قسمت هفتم آموزش :.

    سپاس

    5 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 08-13-2013 در ساعت 12:15 PM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  7. #16
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت هشتم :.

    --------------------------------------

    style sheet چیست؟ / نحوه استفاده از چگونه است؟/ آ شنایی با تگ Head و خصوصیات ان / تگ head چیست؟

    --------------------------------------


    style sheet چیست؟ نحوه استفاده از چگونه است؟

    css یا همان style sheet ابزاری است برای قالب بندی و طراحی و کنترل اجزای صفحات وب بدون استفاده از کد های HTML در اینجا به صورت کلی توضیحاتی در مورد style ها css و نحوه وارد کردن انها در صفحات HTML داده خواهد شد و در آینده به صورت کامل با این کدها آشنا خواهیم شد

    style sheet ها به سه روش در صفحات HTML مورد استفاده قرار میگیرند .




    1. external style sheet
    2. internal style sheet
    3. inline style



    external style sheet

    استفاده از style ها به صورت صفحات بیرونی به فرمت css اگر میخواهید برای تعداد زیادی از صفحات وب یک فرمت و style خاصی را تعریف کرد بهتر است از این روش استفاده کنیم

    از این روش میتوان برای کنترول تمامی اجزای و تگهای مورد استفاده در کلیه صفحات یک وب سایت استفاده کرد به طوری که با وارد کردن این style sheet در صفحات HTML یک وب سایت کلیه صفحات به طور یکسان از style sheet استفاده میکنند و به راحتی می توان با اعمال تغییرات در این سند کلیه اجزاء و صفحات تشکیل دهنده یک وب سایت را کنترل نمود

    برای وارد نمودن صفحات css از سه روش زیر استفاده می نمائیم



    کد:
    <head> <link rel="stylesheet" type="text/css" href="mystyle.css" /> </head>
    internal style sheet

    استفاده از تگ <style> برای وارد کردن style در صفحات HTML / این روش برای نوشتن style هایی خاص برای صفحات به خصوص استفاده میشود به این معنی که کدهای css نوشته شده با این روش فقط بر روی همان صفحه تاثیر میگذارد این style ها با استفاده از تگ <style> در صفحات HTML وارد میشوند و محل قرار گیری انها ما بین تگ <head> است



    کد:
    <head> <style type="text/css"> body {background-color"yellow}p {color:blue} </style> </head>

    inline style

    استفاده از style ها به صورت خطی و درون تگهای HTML از این روش برای دادن فرمت و style خاصی برای یک تگ HTML استفاده میشود برای آشنایی با این نوع style به مثال زیر توجه کنید:



    کد:
    <p style="color:blue;margin-left:20px"> wikivb.ir </p>

    در این مثال font color و margin نگ <p></p> مورد نظر از سمت چپ با استفاده از دستور css تعیین شده است

    4 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 12-20-2012 در ساعت 07:09 AM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  8. #17
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    ادامه آموزش قسمت هشتم ...

    آشنایی با تگ Head و خصوصیات آن

    تگ head چیست ؟

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





    <title> , <base> , <link> , <meta> , <script> , <style>


    1. <title>



    با استفاده از این تگ می توانید سرفصل وب سایت خود را معرفی نمایید از کاربردها و مزایای این تگ میتوان به




    • نمایش محتوای این تگ به عنوان سر تیتر وب سایت شما بر بالای پنجره مرورگر
    • قرار گرفتن محتوایات و مقدار این تگ در لیست علاقه مندیهای ثبت شده توسط کاربر در مرورگر
    • نمایش مقدار این تگ در نتایج موتور های جستجو





    کد:
    <html> <head> <title>ویکی وی بی|مرجع تخصصی ویبولتین</title> </head> <body> <p>ویکی وی بی|مرجع تخصصی ویبولتین</p> </body> </html>

    تگ <base>

    با استفاده از این تگ میتوانید ادرس defualt لینک های خود و یا خاصیت target انها را مشخص کنید


    کد:
              
    
    <head> <base href="http://wikivb.ir/image/" /> <base target="_blank" /> </head>
    تگ <link>


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

    کد:
    <head> <link rel="stylesheet" href="group_file/base.css"type="text/css"> </head>
    تگ <style>

    در مورد این تگ و نحوه استفاده از ان هم قبلا صحبت کرده بودیم و در اینجا به یک مثال اکتفا میکنیم



    کد:
    <head> <style type="text/css"> body {background-color:yellow} p {color:blue} </style> </head>

    تگ <script>

    از این تگ برای تعریف نمودن client-side script ماننده javascript در صفحات وب استفاده میشود استفاده از این تگ ها در خارج از تگ mete نیز صورت میگیرد که در این مورد توضیح بیشتری را خواهیم داد


    تگ <meta>

    با استفاده از این تگ میتوانید توضیحاتی را در مورد وب سایت خود به موتورهای جستجو ارائه کنید و انها را بهتر در شناخت وب سایت خود کمک کنید



    کد:
    <meta name="keywords" content="wikivb,forum,vb,vbulletin" /> <meta name="description" content="wikivb" />
    .: پایان قسمت هشتم آموزش :.

    سپاس

    5 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 12-21-2012 در ساعت 09:59 PM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  9. #18
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت نهم :.

    --------------------------------------

    نگ meta چیست و نحوه تنظیم آن چگونه است ؟ / فواید تگ meta و نحوه تنظیم آن چگونه است ؟ / تفاوت مابین تگهای meta با خاصیت HTTP-EQULV و NAME ؟

    --------------------------------------



    نگ meta چیست و نحوه تنظیم آن چگونه است ؟

    میتوان تگ <meta> را خلاصه ای از مطالب یک وب سایت دانست که شامل توضیحاتی کوتاه در مورد وب سایت و محتویات ان ، کلمات کلیدی برای کمک به موتور های جستجو و همچنین کاربران پیدا کرد مطالب مورد نظر است

    فواید تگ meta و نحوه تنظیم آن چگونه است ؟

    تگ <meta> در ظاهر در صفحات وب نمایش داد نمیشود و البته میتوان به راحتی انها را با source code سند های HTML و مابین تگ <head> پیدا نمود به طور معمول تگهای <meta> برای ارئه توضیحاتی در باره

    محتویات وب سایت ، کلمات کلیدی ، به وجود آوردنده وب سایت ، تاریخ اخرین ویرایش و .. به کار برد

    رعایت کردن نکات زیر میتواند در تایین و تنظیم محتوای تگهای <meta> مفید باشد




    • بهتر است مقادیر keyword , description , title برای هر صفحه وب سایت به صورت مجزا و با توجه به محتویات ان صفحه وب تعیین گردد و از تکرار ان در همه صفحات وب به صورت یکسان خود داری شود



    • بهتر است بین کلمات مورد استفاده در keyword , description , title یک رابطه منطقی موجود باشد و از کلمات تکراری کمتر استفاده شود
    • و در نهایت اینکه محتوایات تگهای <meta> حتما باید به روشنی بیانگر محتویات محتویات ان صفحه وب باشد




    کد:
              
    
    <head> <meta name="keywords" content="wikivb,forum,vb,vbulletin" /> <meta name="description" content="wikivb" /> <title> ویکی وی بی|مرجع تخصصی ویبولتین در ایران </title> </head>
    تفاوت مابین تگهای meta با خاصیت HTTP-EQULV و NAME ؟


    اگر شما به جای <meta name="..."> از <meta HTTP-EQUIV=".."> استفاده نمایید نشان دهنده این موضوع است که محتویات این تگ <meta> به عنوان HTTP headers ارسال میشود

    .: پایان قسمت نهم آموزش :.

    سپاس

    7 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

  10. #19
    MR.P3YM@N آنلاین نیست.
    MR.P3YM@N
    مدير بازنشسته
    800نوشته1,604مورد پسند

    تاریخ عضویت
    Nov 2012
    شماره عضویت
    24
    پسندیده است
    2,158 پست
    بلاگ
    1 پست
    میزان امتیاز
    1603
    ChatSupport.IR
    .: قسمت دهم :.

    --------------------------------------

    HTTP headers چیست ؟ / چگونگی استفاده از اسکریپت ها در صفحات وب / تگ <noscript> /

    --------------------------------------



    HTTP headers چیست ؟

    HTTP headers اطلاعاتی در مورد هر سند است که همراه با ان ارسال میشود . این اطلاعات در صفحه وب نمایش داده نمیشود و قبل از محتویات <HTML> هر صفحه وب ارسال میگردند و شامل اطلاعاتی ماننده cookies و ... هستند در زیر میتوانید نمونه ای از HTTP headers را ملاحظه کنید

    کد:
         
    
    HTTP/1.1 200 ok Date wed, 13 Aug 1997 0250 GMT server: Apache/ 1.2.0 last-modifaed:fri, 04 Jul 1997 2224 GMT ETag: "28fd-810-33bd76b0" content-length: 2064 accept-Ranges: bytes connection: close
    content-Type: text/html
    یک تگ <meta> با خاصیت HTTP-EQUIV به شما این امکان را میدهد که اطلاعاتی را همراه با HTTP headers برای Server ارسال کند

    مثال:
    کد:
    <META-HTTP-EQUIV="Author"CONTENT="...">

    باید به این نکته تاکید کرد که تمام مرورگر ها موضف به استفاده از HTTP-EQUIV هستند اگر واقعا این اطلاعات درون HTTP headers وجود داشته باشند اما همیشه این اطلاعات در درون HTTP headers ساخته نمیشود


    سازندگان و گردانندگان server ها دریافتند که استفاده از تگهای <meta> با خصوصیات HTTP-EQUIV بار محاسباتی بر روی server را افزایش میدهد و این موضوع باعث کند شدن زمان بارگذاری صفحات وب و همچنین فشار بیش از حد بر روی سرورها میشود بنا بر این از خصوصیت <meta name="..."> به عنوان جایگزینی برای <meta HTTP-EQUIV=".."> استفاده میشود


    در حال حاضر تعداد معدودی از سرورها به طور کامل از HTTP-EQUIV پشتیبانی میکنند میتوان اطلاعات بیشتر را در این خصوص از سرویس دهنده وب سایت خود دریافت نمایید


    چگونگی استفاده از اسکریپت ها در صفحات وب

    تگ <script> در واقع برای معرفی client-side script ماننده javascript در صفحات وب مورد استفاده قرار میگیرد

    با استفاده از تگ <script> میتوان اسکریپت ها را به صورت مستقیم و یا با استفاده از یک سند خارجی در صفحات وب وارد نمائید
    کد:
    <script type="text/javascript"> document.write("Hello wikivb !"> </script> OR <script src="myjavascript.js"type="text/javascript"></script>

    تگ noscript


    در مواقعی که اسکریپت ها نمیتوانند بر روی مرورگر شما فعال شوند هنگامی که با استفاده از تنظیمات مرورگر خود اجرای اسکریپت ها را محدود کرده باشند و یا اینکه تعدادی از مرگر ها از ان اسکریپت پشتیبانی نکنند
    کد:
    <script type="text/javascript"> document.write("Hello wikivb !"> </script> OR <noscript> sorry , your browser does not support Javascript!</script>

    .: پایان قسمت دهم آموزش :.

    .: پایان آموزش جامع html از مقدماتی تا پیشرفته :.

    سپاس فراوان از همراهیتون

    پیروز باشید...

    2 نفر از اعضا پست MR.P3YM@N را پسندیده اند


    ویرایش توسط MR.P3YM@N : 12-25-2012 در ساعت 09:30 PM
    تاک وب ، آژانس طراحی وب | تاک موزیک ، رسانه موسیقی ایران

    کامسونت، مرجع تخصصی پشتیبانی شبکه های اجتماعی و ارتباطی (آدرس جدید چت ساپورت)

صفحه 2 از 2 نخستنخست 12

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کلمات کلیدی این موضوع

مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •  
خرید بک لینک
مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی