برنامه نویسی

یاد بگیرید همانطور که شما کد: HTML و CSS! (قسمت 1)

این اولین پست از مجموعه ای است که شما را برای یادگیری دو زبان اصلی توسعه وب به چالش می کشد. و بهترین راه برای یادگیری کدنویسی، کدنویسی است! بنابراین، همانطور که یاد می گیرید، کدنویسی کنید، و همانطور که کد می نویسید، یاد بگیرید! هر یک از این پست ها شامل یک درس مختصر و یک چالش خواهد بود. مطمئن شوید که واقعاً چالش را کامل کرده اید و تا پایان این مجموعه می توانید وب سایت های خود را به صورت محلی در رایانه خود ایجاد کنید!

HTML چیست؟

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

HTML مخفف Hypertext Markup Language است و از همان ابتدا زبان اینترنت بوده است. در واقع، سازنده شبکه جهانی وب، تیم برنرز لی، این زبان را توسعه داده است! جالب است، اما HTML چیست، چه کاری انجام می دهد؟ خوب، ما می توانیم اصطلاح را تجزیه کنیم. Hypertext یک کلمه فانتزی برای متن است که متن را به متن دیگر متصل می کند و نشانه گذاری کلمه ای برای آماده سازی متن برای ارائه است. بنابراین، در مجموع، HTML زبانی است که متن را برای ارائه در اینترنت آماده می کند و بخشی از آن متن را به اسناد دیگر در اینترنت متصل می کند! به سادگی، HTML ساختار محتوای یک صفحه وب را فراهم می کند.

CSS چیست؟

HTML ساختار را ایجاد می کند و محتوای یک صفحه وب را تعریف می کند، اما، اگر چیز دیگری به مرورگر وب نگویم، چندان جذاب به نظر نمی رسد. بنابراین، باید سند دیگری اضافه کنیم که به مرورگر شما می‌گوید چگونه همه عناصر صفحه مختلف را نمایش دهد، چیزهای جالبی مانند: از چه فونتی استفاده کنید، متن چقدر باید باشد، چه نوع رنگ پس‌زمینه‌ای را می‌خواهید، و در کجا. صفحه ای که باید باشد!

CSS زبانی است که این مشکل را حل می کند. CSS مخفف عبارت Cascading Style Sheets است. این مجموعه ای از قوانین است که به مرورگر می گوید چگونه انواع مختلف عناصر HTML را نمایش دهد. چیزی که برای من دیوانه کننده است، این است که صفحات وب HTML حدود چهار سال قبل از پیاده سازی CSS وجود داشتند. این زبان اولین بار در سال 1994 توسط شخصی به نام HÃ¥kon Wium Lie پیشنهاد شد (اگر می دانید چگونه آن را تلفظ کنید، شایسته مدال هستید). بنابراین، به مدت چهار سال، وب‌سایت‌ها فقط پس‌زمینه سفید با متن سیاه، تراز چپ… بسیار بسیار ملایم بودند. این قبل از اینترنت بود که امروز به آن فکر می کنیم. سپس، اینترنت فقط برای محققان و به اشتراک گذاری خام اطلاعات بود. اما، اکنون ما از اینترنت برای همه چیز استفاده می کنیم.

با استفاده از HTML و CSS با هم، می توانید هر طرحی را که می خواهید ایجاد کنید. اگر یاد بگیرید چگونه از آنها استفاده کنید، این دو زبان با هم ابزار طراحی قدرتمندی هستند.

چالش

اگرچه این فقط یک درس مقدماتی است، اما هنوز یک چالش وجود دارد! برای این کار حتی نیازی به ترک این صفحه ندارید! در رایانه رومیزی، روی این پاراگراف راست کلیک کنید! روی “Inspect Element” کلیک کنید و به پنجره ای که ظاهر می شود توجه کنید.

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

اگر این بسیار زیاد به نظر می رسد، اشکالی ندارد! اکثر وب سایت ها بسیار پیچیده هستند و طی سالیان متمادی توسط افراد زیادی ساخته شده اند. اگر این مجموعه را دنبال کنید، دستورالعمل های گام به گام در مورد نحوه ایجاد صفحات وب خود را دریافت خواهید کرد!

دفعه بعد شما را می بینم و یادتان نرود همانطور که کد می گذارید!

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا