اگر با طراحی سایت یا برنامه نویسی تحت وب آشنایی داشته باشید، احتمالا نام HTML را شنیده اید. HTML یکی از پایه ای ترین فناوری های مورد استفاده برای ایجاد و ساختاردهی صفحات وب است و نقش مهمی در نمایش محتوا در مرورگرها دارد. در کنار HTML، امروزه api های HTML نیز امکانات متنوعی در اختیار توسعه دهندگان قرار می دهند و به آنها کمک می کنند قابلیت های بیشتری به صفحات وب اضافه کنند.
در طول سال های فعالیت وب، فناوری ها و ابزارهای مختلفی برای طراحی و توسعه صفحات اینترنتی به وجود آمده اند، اما HTML همچنان یکی از اصلی ترین بخش های توسعه وب محسوب می شود. شناخت api های HTML می تواند به برنامه نویسان کمک کند تا از قابلیت های داخلی مرورگرها بهتر استفاده کنند. همچنین آشنایی با api های HTML برای ساخت وبسایت های کاربردی و تعاملی اهمیت زیادی دارد و در ادامه با مهم ترین ویژگی های آن آشنا می شویم.
با توجه به پیشرفت فناوری های وب، استفاده از api های HTML در کنار ساختار استاندارد HTML می تواند امکانات بیشتری برای توسعه دهندگان فراهم کند و مسیر طراحی وبسایت های مدرن را ساده تر سازد.
HTML چیست؟
Html کوتاه شده کلمه hyper markup language بوده و در فارسی به آن زبان نشانه گذاری ابرمتن می گویند. همچنین توجه داشته باشید که html یک زبان برنامه نویسی نمی باشد بلکه یک زبان نشانه گذاری محسوب می شود. این زبان عناصر مختلفی مانند پاراگراف، لیست عکس و غیره را کنار هم می گذارد تا چهار چوب اصلی صفحه وب را ایجاد کند. به زبان ساده تر، ما با وجود html ها، بدنه اصلی وب را درست می کنیم.
زبان نشانه گذاری ابرمتن در تمامی مرورگرهای جدید و مدرن پشتیبانی می شود و همچنین همه مرورگرهای قدیمی به طور اتومات عناصر شناخته نشده را به عنوان عناصر درون خطی مدیریت می کنند.
مزایا و معایب زبان html
اچ تی ام ال ها در کنار css و gs هسته اصلی و مهم وب را تشکیل می دهند و یک زبان مهم در دنیای وب محسوب می شوند. این زبان مزایا ومعایبی هم دارد که در ادامه مطلب به آن ها می پردازیم و می بینیم دلیل اصلی ماندگاری این زبان چیست و چرا با وجود این همه مشکلاتی که دارد، در لیست زبان های وب شماره یک دیده می شود.
مزایا
- یاد گیری راحت و لذت بخش
- قابل اجرا شدن در تمام مرور گرها
- متن های قابل دسترس و رایگان
- ترکیب شدن آسان با زبان های دیگر
معایب
- ضعیف بودن در پشتیبانی از مرورگرهای قدیمی
- طراحی جداگانه هر صفحه به دلیل این که قانون خاص و منطقی برای برنامه نویسی وجود ندارد
Api های html
Html5 دارای تعدادی api است که بسیار کاربردی هستند، به خصوص در سامانه های تحت وب. این api های html عبارتند از:
- Sse
- Web workers
- App cache
- Local storage
- Drag
- Geo location
عناصر جدید html5
مهم ترین عناصر html5 شامل موارد زیر است که عبارتند از:
- عناصر جدید معنایی، برای مثال footer ، article، section، header
- ویژگی های جدید کنترل فرم که شامل تعداد، تاریخ، زمان، تقویم و محدوده
- عناصر جدید گرافیک مانند canvas،svg
- عناصر جدید چند رسانه ای که شامل video ،audio
Apiهای جدید در html5
نام دیگر این عبارت، رابط های برنامه نویسی کاربردی است که تحت دستور برنامه اجرا می شود تا به مرورگر درباره آن چه باید در صفحه وب به نمایش گذاشته شود، بگوید. همچنین برای آشنایی جدید ترین رابط ها، نمونه هایی از آنها را برای شما معرفی می کنیم که شامل موارد زیر است:
- موقعیت جغرافیایی
- کشیدن و رها کردن
- ذخیره سازس محلی
- کش کاربردی
- ایجاد کنندگان وب
- Sse در html
عناصر جدید معنایی یا همان ساختار در html5
درلیست زیر عناصر معنایی جدیدی را برایتان شرح داده ایم:
- Article: یک مقاله را در دایکیومنت تعریف می کند
- Aside: محتوای غیر از آن صفحه را توضیح می دهد
- Bdi: قسمتی از متن را که ممکن از متن دیگری فرمت بندی شده باشد را توضیح می دهد.
- Details: جزئیات اضافی را که کاربر می تواند ببیند یا پنهان کند را معرفی می کند.
- Dialog: تعریف از یک کادر محاوره یا پنجره است.
- Figure : محتوایی شامل تصاویر، نمودار ها ، لیست کد و غیره است
- Footer : تعریفی است برای داکیومنت یا بخش
- Main : محتوای اصلی و مهم یک سند را تعریف می کند
- Mark : متن هایلات شده را توضیح می دهد
- Time : یک زمان و تاریخ را نشان می دهد
- Rt : توضیح و تلفظ حروف را می گوید
- Nav : لینک ناوبری در سند را تعریف می کند
- Meter : اندازه گیری عددی در محدودیت شناخته شده توضیح می دهد
- Section : بخشی در سند را تعریف می کند
تگ های html
Html ابزاری است که با وجود آن تگ ها شروع به ساختن همه قالب صفحات وب می کنند. به طور ساده بخواهیم توضیح بدهیم، شما با استفاده از این ابزار قادر هستید، فونداسیون و اسکلت اصلی وب سایت مورد نظر خود را طراحی کنید و همچنین می توانید وب سایتی که طراحی کردید را جذاب تر و چشم نواز تر به نمایش بگذارید.
به یاد داشته باشید هر کاری که با این ابزار انجام می شود، توسط تگ ها است که زبان نشانه گذاری ابرمتن ها را قدرت می بخشد. برای این که شما با این تگ ها آشنا شوید، در زیر از آن ها نام برده ایم و هر کدام را توضیح دادیم. تگ های زبان نشانه گذاری ابرمتن نام های عناصر گرفته شده با براکت های زاویه (<،>) هستند.
- تگ های زبان نشانه گذاری ابرمتن اصولا به شکل جفتی هستند.
- در یک جفت اولین تگ را تگ شروع می گویند و دومین تگ را تگ پایان می نامند.
- تگ پایان هم مانند تگ شروع نوشته می شود فقط با وجود یک تفاوت که در قبل از نام تگ یک علامت / نوشته می شود.
جمع بندی
اگر به طراحی وبسایت علاقه دارید و می خواهید این مهارت را به صورت اصولی یاد بگیرید، باید برای آموزش و تمرین آن زمان و انرژی کافی اختصاص دهید. یادگیری طراحی وب تنها با مطالعه مطالب آموزشی امکان پذیر نیست و تمرین، تکرار و انجام پروژه های مختلف نقش بسیار مهمی در پیشرفت شما دارد. هرچه بیشتر تمرین کنید، درک بهتری از مفاهیم طراحی و برنامه نویسی وب پیدا خواهید کرد.
یکی از نخستین گام ها برای ورود به دنیای طراحی وب، آشنایی با زبان نشانه گذاری ابرمتن یا همان HTML است. بنابراین بهتر است پیش از شروع، مسیر یادگیری مشخصی برای خود در نظر بگیرید و با اصول HTML به خوبی آشنا شوید. پس از یادگیری این مباحث می توانید به سراغ فناوری های دیگر بروید و به تدریج وبسایت های حرفه ای و کاربردی طراحی کنید. در این مسیر، سیتی نت نیز با ارائه خدمات و راهکارهای تخصصی در حوزه فناوری اطلاعات و طراحی سامانه های تحت وب، می تواند به کسب و کارها در ایجاد و توسعه بسترهای آنلاین کمک کند.
