آموزش html و html5

آموزش html و html5
فهرست مقاله [نمایش]

    HTML مخفف عبارت Hyper Text Markup Language است که برای ایجاد صفحات وب و برنامه های وب استفاده می شود. بیایید ببینیم منظور از Hypertext Markup Language و صفحه وب چیست. متن Hyper : HyperText به سادگی به معنی "متن در متن" است. متنی که در آن لینک دارد ، یک ابر متن. هر وقت  که روی لینکی کلیک کنید که شما را به یک صفحه جدید منتقل  کند،  شما روی یک ابر متن کلیک کرده اید. HyperText روشی برای لینک دو یا چند صفحه وب (اسناد HTML) با یکدیگر است.

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

    صفحه وب: یک صفحه وب سندی است که معمولاً به صورت HTML نوشته می شود و توسط یک مرورگر وب ترجمه می شود. با وارد کردن URL می توانید یک صفحه وب را شناسایی کنید. یک صفحه می تواند ایستا یا پویا باشد. فقط با کمک HTML می توانیم صفحات وب استاتیک ایجاد کنیم.

    از این رو، HTML یک زبان نشانه گذاری است که برای ایجاد صفحات وب طراحی شده استفاده می شود، و باعث می شود در یک مرورگر وب با فرمت زیبا به نظر برسد. یک سند HTML از بسیاری از برچسب های tag) HTML )ساخته شده است و هر تگ HTML  خروجی متفاوتی دارد.

     

    تاریخچه مختصر HTML

    در اواخر دهه 1980 یک فیزیکدان، تیم برنرز لی که با بنیاد علمی CERN همکاری می کرد. در زمانی که او در ژنو با این بنیاد همکاری می‌کرد، طرحی برای یک پروژه با موضوع استفاده از ابرمتن (Hypertext) برای اشتراک‌گذاری اطلاعات بین محققان ارائه داد. در سال 1989 ، او یادداشتی را برای ارائه یك سیستم ابرمتن مبتنی بر اینترنت نوشت.

    تیم برنرز لی به عنوان پدر HTML شناخته شده است. اولین توضیحات در دسترس HTML ، سندی به نام "HTML Tag" بود که توسط "تیم" در اواخر سال 1991 ارائه شد. برنرز لی در حال حاضر مدیر کنسرسیوم بین‌المللی وب (W3C) است. این سازمان وظیفه‌ی نظارت بر پیشرفت دائمی وب و فناوری‌های جدید آن را بر عهده دارد. آخرین نسخه HTML5 ، HTML است که بعدا در این آموزش به آن می پردازیم. 

    از زمان انتشار اولین  ورژن  HTML تا به امروز  نسخه های زیادی از آن  منتشر شده است، در مورد هر کدام  از این نسخه ها توضیح مختصری خواهیم داد.

    HTML 1.0 : اولین نسخه HTML 1.0 بود  این نسخه پیکربندی زبان HTML بود و در سال 1991 منتشر شد.

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

    HTML 3.2: نسخه HTML 3.2 توسط موسسه W3C در اوایل 1997 منتشر شد. این نسخه قادر به ایجاد جداول و پشتیبانی از گزینه های اضافی برای عناصر فرم بود. همچنین می تواند از یک صفحه وب با معادلات پیچیده ریاضی پشتیبانی کند. این مسئله بصورت یک استاندارد رسمی برای مرورگرها تا ژانویه 1997 شد. امروز تقریبا توسط بسیاری از مرورگرها پشتیبانی می شود.

    HTML 4.01: نسخه HTML 4.01 در دسامبر 1999 منتشر شد ، و نسخه ای بسیار پایدار از زبان HTML است. این نسخه استاندارد رسمی فعلی است، و پشتیبانی بیشتری را برای استایل شیت ها (CSS) و قابلیت اسکریپت برای عناصر مختلف چندرسانه ای فراهم می کند.

    HTML5: HTML5 جدیدترین نسخه زبان نشانه گذاری است. اولین پیش نویس این نسخه در ژانویه سال 2008 اعلام شد. دو سازمان بزرگ وجود دارند یکی W3C (کنسرسیوم جهانی وب گسترده) و دیگری سازمان eb Hypertext Application Technology Working Group)WHATWG) کارگروه فناوری کاربرد برنامه Hypertextکه در توسعه نسخه HTML 5 نقش دارند. و این نسخه هنوز هم در حال توسعه است.

    ویژگی های HTML

    1) زبانی بسیار آسان و ساده است. به راحتی قابل فهم و اصلاح است.

    2) تهیه نمایش موثر با HTML بسیار آسان است زیرا دارای تگ های قالب بندی زیادی است.

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

    4) با استفاده از انکرتکست کار برنامه نویسان را برای اضافه کردن لینک در صفحات را راحت کرده است ، بنابراین علاقه به مروردر صفحه را برای کاربر را نیز افزایش می دهد.

    5) مستقل از سیستم عامل است زیرا می تواند در هر پلتفرمی مانند ویندوز ، لینوکس و مکینتاش و غیره نمایش داده شود.

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

    حالا که با HTML و ویژگی ها و تاریخچه آن آشنا شدید پس بهتره به سراغ یادگیری آن برویم. هدف ما در این مقاله آشنایی شما با مبانی HTML  است که تقریبا در تمام نسخه‌ها یکی است، و پس از آن به سراغ  مفاهیم پیشرفته در HTML5 می رویم.

    بیاید با هم  یک  مثال ساده از HTML را ببینیم.

    <!DOCTYPE>  
    <html>  
    <head>  
    <title>Web page title</title>  
    </head>  
    <body>  
    <h1>Write Your First Heading</h1>  
    <p>Write Your First Paragraph.</p>  
    </body>  
    </html>  

    خروجی را با هم ببینیم 

    Web page title

    Write Your First Heading

    Write Your First Paragraph.

     

    <!DOCTYPE>:  برای تعیین نوع سند و نسخه html استفاده می شود.

    <html > :  این تگ به مرورگر اطلاع می دهد که این یک سند html است. متن بین تگhtml صفحه وب را توصیف میکند.این تگ تمام عناصر HTML به جز <! DOCTYPE> را در برمی گیرد.

    <head> :  باید اولین عنصر در درون تگ html باشد.این تگ شامل متا دیتا و اطلاعات مربوط به سند است.تگ head باید قبل از باز شدن تگ body  بسته شود. 

    <title>: همانطور که از اسم آن پیداس برای اضافه کردن عنوان به سند html است.عنوانی که در پنجره مرورگر ظاهر می شود. تگ تایتل درون تگ هد قرار دارد و باید همانجا نیز بسته شود.نوشتن تگ تایتل اختیاری است ولی نوشتن آن برای سئو سایت اهمیت دارد. 

    <body>: تگ body اصلی ترین بخش از یک سند html  است. زیرا در این تگ مطلب اصلی را که  باید  به  کاربر نمایش داده شود را در بر میگیرد.

    <h1> : اولین سطح از هدینگ های 1تا 6  است. و در هر صفحه وب  باید حداقل  یک تگ h1 وجود داشته باشد.

    <p> : تگ p  یا پارگراف اشاره به وجود پاراگراف درمتن دارد.

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

    ویرایشگرهای متنی HTML

    بلوک های ساختاری HTML

    تگ های HTML

     اتریبیوت های Html

     عناصر HTML

    قالبندی متن ها ی HTML یا HTML Formatting

    تگ های عنوان h1 تا h6

    تگ پاراگراف یا P در HTML

    تگ های عبارت یا phrase درHTML

    تگ a  یا Anchor

    تگ img

    تگ Table

    تگ Lists

    تگ from

    html-with-css

    html-classes

     


    • نویسنده: روشن احمدی

    ارسال دیدگاه

    برای افزودن دیدگاه خود، نیاز است ابتدا وارد حساب کاربری‌تان شوید


    دیدگاه کاربران