چگونه htmlوcss یادبگیریم؟

HTML چیست؟

HTML مخفف کلمه Hyper Text Markup Language و به معنی زبان نماد گذاری فوق متن می‎‌باشد. بهتر هست بدانید که HTML یک لهجه برنامه نویسی محسوب نمی‌شود بلکه جهت نشانه گذاری ابر نوشته ابتکار عمل شده و هدف از بکارگیری آن، سازماندهی دیتاها هر برگه از وب است. علاوه بر آن، از HTML در جداسازی اجزاء یک برگه وب نظیر عناوین، بندها، تصاویر و… به کارگیری می‌شود.

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

در این زبان، قسمت‌های متعدد یک صفحه، بوسیله تگ‌ها از یکدیگر جدا می‌شوند. بنابراین، به جهت هر عنصر در برگه وب مثل تيتر ، عکس ، جدول و.. می بایست از تگ مربوط به به عبارتی عنصر استفاده کرد. به همین ترتیب، هر مدرک HTML پرونده ای مبتنی بر نوشته میباشد که طبق معمول حیاتی پسوند .htm یا این که .html شناخته می‌شوند، آن‌گاه مرورگرها، برچسب های HTML را خوانده و محتوای صفحه‌ای که دارای همین گویش نوشته شده را Render یا این که نمایان سازی می‌کنند.

حال که دارای لهجه نشانه گذاری HTML آشنا شدید، قصد داریم تا در ادامه شما را با بقیه نسخه‌های HTML که تا کنون منتشر شده‌اند، آشنا کنیم.

انواع نسخه‌های HTML

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

HTML۱,۰

این او‌لین ورژن HTML هست که در سال ۱۹۹۱ منتشر شد و مبنای گویش HTML و ورژن های توسعه و گسترش یافته بعدی آن گردید.

نسخه HTML ۲,۰

این نسخه در سال ۱۹۹۵ منتشر شد و تا ۲ سال بعد، به جهت طراحی و کدنویسی صفحه ها وب به کار گیری می‌شد و توانست بخش اعظمی از ویژگی‌های با HTML را در خود جای دهد. این نسخه، توانست به جهت او‌لین بار از جداول و فرم‌ها نیز پشتیبانی کند.

نسخه HTML ۳,۲

این ورژن که امروزه به وسیله اکثر مرورگرها پشتیبانی نمی‌‎شود، در سال ۱۹۹۷ بوسیله W۳C (کنسرسیوم کانال جهانی وب) آخرین شد. نسخه HTML ۳,۲ امکان پشتیبانی از موادتشکیل دهنده فرم پیچیده را داشت و به جهت صفحات وب این امکان را ایجاد می‌کرد که از معادلات طاقت فرسا ریاضی نیز، پشتیبانی کند.

نسخه HTML ۴,۰.۱

خوشبختنانه همین نسخه، به نسبت نسخه‌های قبلی پایدارتر بوده و پشتیبانی بیشتری از فایل های CSS دارد. نسخه HTML ۴,۰.۱ کلیدی هدف مرتفع کردن مشکلات نسخه‌های گذشته ایجاد شد و توانست از اسکریپت‌ها، فریم‌ها و حتی از استایل شیت‌ها هم پشتیبانی کند.

علی‌رغم ویژگی‌های ذکر شده، نسخه ۴,۰.۱ به خوبی از زبان‌های راست‌چین نظیر پارسی و عربی حمایت می‌‎کند و علاوه بر آن، قابلیت و امکان ساخت صفحه ها پویا توسط زبان‌های اسکریپتی را نیز آماده آورده است.

نسخه HTML۵

این ورژن که از انعطاف‌پذیری بیش‌تری نسبت به نسخه‌های HTML قبلی برخوردار است؛ عاقبت همکاری بین کنسرسیوم شبکه جهانی وب و کارگروه فناوری کاربرد ابرمتن زیر وب می‌باشد که عاقبت در سال ۲۰۰۶ توانستند ورژن HTML۵ را ایجاد کنند.

همانطور که گفتیم نسخه‌های پیشین HTML، اهمیت ایرادات و باگ‌های بخش اعظمی بودند و حساس ساخت نسخه بعدی، تا حدی از نواقص همین گویش کاسته می‌شد تا این که حیاتی بر روی عمل وارد شدن ورژن HTML۵، خیر تنها اکثر اوقات باگ‌های موجود در نسخه‌های گذشته از بین رفت بلکه ویژگی‌های ذیل نیز به جهت گسترش دهندگان و طراحان وب ایجاد گردید.

HTML۵ اصلی استفاده از API جاوا اسکریپت Geolocation، قابلیت شناسایی حالت مکانی اعضا را دارد.
نسخه HTML۵ از کلیپ ویدیو و صدا هم به مهربانی پشتیبانی می‌کند.
تگ‌های جدیدی در HTML۵ تعریف شده اند که از میان آن ها می‎توان به تگ‌های صفات همچون number ،date ،time ،calendar و range، تگ‌هایی عنصرها گرافیکی مانند: <svg> و <canvas> و حتی تگ‌های معنایی نظیر <header> ،<footer> ،<article> و <section> اشاره کرد.

کاربرد های حساس HTML

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

ابتدا ساختار اساسی صفحه ها وب حیاتی کمک تگ های موجود در HTML تولید شده، بعد مهم به کارگیری از زبان برنامه نویسی CSS، به صفحات جان بخشیده می‌شود. به این معنی که می‌توان دارای افزودن زیبایی‌های بصری همچون فونت، اندازه، رنگ و… صفحات وب را زیبا نموده و آن ها را قابل به کار گیری کرد.

تگ (Tag) چیست؟

همانطور که گفتیم HTML یک گویش نشانه گذاری است که از بخش‌های متمایز به نام تگ ایجاد شده است. از سوی دیگر، به جهت طراحی یک وب تارنما حرفه‌ای نیاز به به کارگیری از سایر زبان‌های برنامه نویسی مانند جاوا اسکریپت، سی اس اس و… می‌باشد درحالی‌که مرورگرها فقط کدها و عناصر HTML را می‎‌توانند نمایش دهند و قوی نمی باشند کدهای بقیه لهجه های برنامه نویسی را به سناریو بگذارند.

بنابراین، تگ‌ها نه فقط در HTML بلکه در فرایند طراحی سایت، دوچندان حائز کلیدی هستند. و در اصل، همین تگ‌ها میباشند که قدرت دوچندان متعددی را به HTML می‌‎دهند. به کلمه دیگر، تگ‌ها در HTML توان تولید گزاره ها، تصاویر، جداول و بقیه بخش‌های وب وبسایت را دارا هستند و باید برای هر یک از این بخش‌ها (عناصر) از تگ مربوط به آن استفاده کرد.

مثلا <article> تگ تعریف و تمجید یک پست یا این که مقاله هست و یا این که <audio> تگ تعریف و تمجید کننده محتوای صوتی می‌‎باشد که مرورگرهای مختلف حساس فراخوانی این تگ‌ها، می‌توانند اطلاعات موجود در کدها را به سناریو بگذارند. در ادامه به چندین تگ کاربردی دیگر اشاره می‎‌کنیم.

به یاد داشته باشید طراحان و توسعه دهندگان وب، به دلیل تعداد بالای تگ‌ها، همه آن ها را حفظ نیستند.

تگ <body> تولید بدنه اهمیت محتویات صفحات

تگ <button> طولانی تر کردن سوییچ در صفحات

تگ <a> ساخت لینک در برگه وب

تگ < address> تعریف داده ها تماس نویسنده در وب

CSS چیست؟

CSS مخفف کلمه Cascading Sheet Style و به مضمون‌ «برگه‌های سبک آبشار» یا «برگه‌های آبشاری» است. احتمالا همین سؤال به جهت شما نیز پیش آمده که خواسته از برگه‌های آبشاری چیست و اصلا چه ربطی به یک برنامه نویسی دارد!

به همین دلیل به CSS برگه‌های آبشاری گفته می‌شود که استایل یک ورقه CSS، به طور مستقیم بر روی موادسازنده فرزند (Children) آن کاغذ نیز تأثیر می‌گذارد. به عنوان مثال در صورتی که شما برای یک برگه از سایت، رنگ آبی را گزینش کرده باشید، تمام هدینگ‌ها و پاراگراف های آن ورقه که اصطلاحا فرزندان آن صفحه CSS میباشند هم به رنگ آبی نمایش دیتا می‌شوند.

CSS در کنار HTML قرار می‌گیرد تا هر دوی آن ها هسته ایجاد یک وب تارنما را به وجود بیاورند. برای یک طراح سایت، استعمال از CSS بهترین و سریع‌ترین خط مش رخ دهی به سایت و ساخت حساس خوب در اعضا وب سایت است.

اگر کدهای HTML وظیفه دارند که مقام هر یک از موادسازنده را در برگه معلوم کنند، برگه‌های CSS هم مسئول قرار دادن نوشته و سایر تگ های HTML هستند. بنابراین، ویژگی های ظاهری همین موادسازنده همچون اندازه، رنگ، چیدمان، گرافیک و… را نیز همین لهجه CSS بایستی برعهده بگیرید و در غایت یک ورقه وب کاربردی، زیبا، مطابق اصلی نیازها و در راستای علائق عضو را تولید نماید.

معرفی انواع نسخه های CSS

CSS اصلی ۴ ورژن زیر می‌‎باشد که اولین نسخه آن در سال ۱۹۹۶ معرفی شد و به مرور نسخه‌های دیگری از همین زبان ساخت شد که مثل نسخه‌های HTML، هر کدام از نسخه‌های جدیدتر باگ‌ها و ایرادات ورژن قبلی را برطرف ‌کرده و ویژگی‌های خاص خود را دارد.

CSS دارای چه کاربردهایی است؟

به طور کلی می‎توان گفت هدف از تولید CSS، زیباتر کردن صفحات وب مهم امداد کدهای HTML است. پس در صورتی که ما زبان CSS را در اختیار نداشتیم، اهمیت میزان متعددی از تگ‌های و کدهای نا آشنا روبرو بودیم که تلاوت یک ورقه از وب را برایمان شکیبایی فرسا می‌کرد.

در نتیجه، مهم‌ترین کاربرد CSS زیبا سازی صفحات وب در روزگار طراحی آن‌ها می‎‌باشد تا تجربه کاربری به نحوه چشمگیری ارتقا یافته و عضو بتواند به راحتی در صفحات یک تارنما وارد شود، مطالعه نماید و در یک کلام، احساس راحتی مضاعف بالایی از حضور در سایت داشته باشد.

HTML و CSS چه تفاوت هایی دارند؟

پیش از این به ابلاغ خصوصیت ها و رده به کارگیری هر یک ز گویش های HTML و CSS پرداختیم و توضیح دادیم که کل بسط دهندگان وب و همینطور طراحان سایت، برای ساخت یک وب تارنما بایستی به اصول اولیه کدنویسی HTML و CSS مسلط باشند. اما در حالت کلی، هر دو زبان گفته شده، اصلی تفاوت‌هایی هستند که در ادامه این تفاوت‌ها را تفسیر می‌دهیم.

وظایف منحصر به فرد به فرد

هرچند اساسی به کارگیری از هر دو گویش می‌توان یک کاغذ وب ساخت کرد البته هر یک از آن‌ها توانایی‌ها و ویژگی‌های مختص خویش را دارد. شما با بکار گیری لهجه HTML می‌‎توانید یک کاغذ از وب و محتوای داخل آن را تولید نمایید در حالی‌که توسط CSS، استایل وبسایت یا زیبایی ظاهری صفحه وب را تولید می‌کنید. بنابراین نخست می بایست ساختار کلی صفحه وب را ساخت کرده سپس، به زیباسازی ظاهری و طراحی عناصر بصری آن بپردازید.

تمایز فولدر آیتم استفاده برای هر زبان

از دیگر تفاوت های بارز و اصلی همین دو زبان این می باشد که از CSS در یک فولدر HTML می‌توان به کارگیری کرد اما عکس همین شرایط قابل انجام شدن نیست. به این معنی که استفاده از سند HTML در یک فایل CSS، به هیج تیتر شدنی نیست.

فرمت گوناگون بین HTML و CSS

احتمالا زمان تمجید از HTML و CSS متوجه همین مسئله شدید که صفحه ها ساخته شده دارای HTML فرمت و قالب خاصی ندارند ولی اساسی ایجاد CSS که توسط سندها HTML رخ می‌گیرد، به همان صفحه ها بدون قالب و خالی از هر جور خصوصیت بصری، فرم هایی زیبا و کاربرپسند داده می‌شود.

یعنی اگر مهم لهجه علامت گذاری HTML یک جدول خالی و بدون هیچ دسته خصوصیتی طراحی می‌کنید، حیاتی به کار گیری از زبان CSS می‌توانید در آن جدول اندازه، رنگ، ارتفاع و دیگر عنصرها زیبایی ساز را طراحی کرده و اصطلاحا به به آن جدول، جان ببخشید.

HTML و CSS اسکلت و آجر های صفحه ها وب!

همانطور که می‌دانید هر وب وبسایت مثل ساختمان های یک‌سری طبقه از اسکلت بندی و نمای مختص خویش برخوردار است. ما در کد نویسی باید بتوانیم یک اسکلت خوب و محکم را در کنار یک نمای دوچندان خوشگل و جالب قرار دهیم تا یک وب تارنما خوب داشته باشیم. طراحی وب وب سایت حساس کدنویسی HTML و CSS دقیقا مثل تولید یک آپارتمان است.

برای ساخت نخست باید شالوده ریزی مطلوب را انجام داد و نقشه سایت را با امداد یک UI عمل به طور تام طراحی کرد. و پس از آن با کمک این دو لهجه اساسی و با در امر طراحی وب صفحه‌ها را یک به یک ساخت. برای آغاز باید از اسکلت یعنی همان کد های HTML استفاده کرد. همین کد‌ها تنها و تنها برای تولید جان اصلی تارنما هستند. همانطور که در قوانین نسخه پنجم همین زبان یعنی HTML ۵ گفته شده می باشد رخ دادن و استایل دهی به وسیله همین گویش یک نادرست در کد نویسی محسوب می‌شود. پیش از این طراحان وب از اچ تی ام ال برای نما دادن به کاغذ هم از آن به کارگیری می‌کردند که آن گاه از ورود CSS به میدان همین تگ‌ها منسوخ شده اعلام شدند.

ساخت <span class=changed>تارنما</span> <span class=changed>حیاتی</span> html css” width=”600″ height=”480″ loading=”lazy” /></p>
<h3 style= نمای سنگ را به جهت ساختمان استفاده کنید

برای زیبا کردن و یا این که به عبارتی سنگ کاری نمای ساختمان از سی اس اس استعمال می کنیم. همین لهجه علاوه بر راحت کردن کار، به ما دسترسی های گوناگون می دهد تا بتوانیم نما را خوبتر ساخت کنیم. در CSS تگ های استایل دهی پیشرفته تر شده اند و می توان به یاری آن جلوه ای خوشگل به جهت وب سایت تهیه و تنظیم کرد. اما در اینجا بایستی به یک نکته اشاره کنیم که مبحث کدنویسی و برنامه نویسی برای بعضی افراد زیاد شیرین و برای بعضا دیگر حقیقتا خسته کننده است. سفارش می کنیم در ابتدا این مورد قضیه را برای خودتان حل کنید.

هیچ چیز دیگر حتمی نیست؟

اگر می خواهید فقط یک تارنما برای خودتان داشته باشید و از آن لذت ببرید تا همین جای کار شما آماده هستید. شما دارای یادگیری کدنویسی HTML و CSS می‌توانید نیاز‌های خود را بر طرف کنید. ( چنانچه وب سایتتان را با سی ام اس های متعدد بسازید، حتی این میزان یاد داشتن کد نویسی از سر سایتتان هم بسیار خیس است!)

اما در صورتی که دوست دارید در زمینه طراحی وب وارد گردید و حرفه‌ای در آن جلو بروید واجب است تا زبان های مکمل دیگری را هم یاد بگیرید. شما می‌توانید دارای امداد اچ تی ام ال و سی اس اس یک سایت را تام طراحی کنید اما به جهت پویا نمودن آن حتمی میباشد تا از زبان برنامه نویسی PHP، جاوا اسکریپت و کتابخانه جی کوئری آن هم استعمال کنید.

سایت خبری مسعود

نوشته‌های تازه

بایگانی‌ها