آموزش استفاده از HTML برای طراحی سایت
شروع هر کاری برای هر کسی می تواند سخت باشد. این موضوع به خصوص در مورد طراحی وب سایت که دنیای گسترده ای دارد حتی می تواند سخت تر و دلهره آورتر باشد. یک شروع خوب که با یک آموزش درست شروع می شود، می تواند شما را از سردرگمی رها کند و به منزله ی یک سکوی پرتاب باشد که شما را دقیقاً به همان جایی که می خواهید برساند.
برای دریافت آموزش طراحی سایت با html که پایه و اساس هر طراحی می باشد، بایستی یک سری قدم ها را طی کنید. برای موفقیت بیشتر لازم است خلاقیت و ابتکار عمل داشته باشید.
اما پیش از هر چیز لازم است با یک سری از مفاهیم آشنا باشید. در ادامه به توضیح بیشتر این مطالب می پردازیم:
چرا html؟
HTML پایه ی همه ی صفحات وب می باشد. بدون html شما نمی توانید وب سایتتان را سازماندهی کنید و متون و تصاویر و ویدئو های مورد نظرتان را به آن اضافه کنید. Html شروع هر چیزی است که شما باید بدانید تا بتوایند یک صفحه ی وب جذاب ایجاد کنید.
صفحه ی وب چیست؟
فایل ها روی رایانه دارای پسوند هستند. به طور مثال فایل هایی که در word ذخیره می شوند، پسوند .docx دارند و یا فایل هایی که در Excel ذخیره می شوند، پسوندی نام .xlsx دارند. بنابراین بسته به نرم افزاری که استفاده می کنید فایل ها پسوند های متفاوتی می گیرند. این پسوند ها برای رایانه ها مهم هستند. زیرا کامپیوترها توسط این پسوند ها متوجه خواهند شد که نوع فایل چیست.
صفحات وب نیز پسوند های مربوط به خود را دارند. پسوند های .htm و .html مربوط به صفحات وب می باشد. مرورگر ها می توانند پسوند ها را تشخیص دهند. اگر پسوند .htm و یا .html را ببینند، متوجه می شوند که فایل مورد نظر یک صفحه ی وب است. سپس سعی در باز کردن آن می کنند. اگرچه مرورگر های مدرن می توانند فایل های دیگری را نیز باز کنند، اما اینترنت اکسپلورر اسناد word و PDF را باز می کند.
هر چند که در پشت صحنه چیزی که اینترنت اکسپلورر واقعاً سعی دارد باز کند یک فایل متنی می باشد که پسوند آن از .txt به .htm تغییر کرده است.
فایل های متنی دارای سمبل ها و کلمات خاصی به نام برچسب ها هستند. وقتی مرورگر این برچسب ها را می بیند که کار می کنند، سعی می کند فایل را باز کند، حتی اگر شما آنها را از دید بازدیدکنندگان مخفی کرده باشید.
اغلب صفحات وب در اینترنت با کدی به نام HTML نوشته شده اند. HTML یک زبان برنامه نویسی نیست و در واقع یک زبان نشانه گذاری است که برای بهبود نمایش متن طراحی شده است. به عنوان مثال در word شما می توانید عناوین را با سایز دلخواتان بنویسید. برای این کار می توانید سایز قلمی که می خواهید را از منو انتخاب کنید. در HTML هم به آسانی می توانید این را انجام دهید. اما این تمام آنچه است که شما در ارائه ی متن و تصویر در HTML می توانید انجام دهید. این کار با استفاده از برچسب ها انجام می شود.
برچسب ها در HTML
در HTML عناوینی وجود دارد به نام برچسب. اولین برچسب به نام خود HTML می باشد که در یک جفت باز و بسته، یکی در بالا و یکی در پایین به صورت زیر نوشته می شود.
<HTML>
</HTML>
این به مرورگر می گوید که کد نوشته شده یک HTML می باشد.
دو نکته در این قسمت قابل ذکر است:
یکی اینکه HTML داخل دو براکت باز و بسته قرار دارد.
دوم اینکه برچسب دوم یک اسلش روبه جلو قبل از HTML دارد.
تمام برچسب های html بایستی داخل براکت های باز و بسته قرار بگیرند. این به مرورگر ها می گوید که یک سری کد html وجود دارد که بایستی اجرا شوند و نباید در صفحات وب نمایش داده شوند. توجه داشته باشید که حتی یک براکت زاویه دار را هم نباید از دست دهید، زیرا این می تواند صفحه ی وب شما را خراب کند.
برچسب اول به مرورگر می گوید که باید کاری انجام دهد و برچسب دوم می گوید که باید کار را متوقف کند. نماد توقف با اسلش روبه جلو نمایش داده می شود.
جفت بعدی برچسب ها، برچسب های عناوین هستند
<HEAD>
</HEAD>
که در بین برچسب <HTML> قرار می گیرد. بخش عنوان در صفحه ی HTML جایی است که شما دستورالعمل های خاصی را برای مرورگر ها می گذارید. وقتی چیزی در بخش HEAD وجود داشته باشد، مرورگر مستقیماً به صفحه ی وب نمی رود. به عنوان مثال اگر می خواهید کلمات “سلام جهان” را در صفحه ی خود نمایش دهید و آن را بین دو برچسب HEAD تایپ کنید، مرورگر ها آن را نادیده می گیرند. زیرا کلمه ی hello world یک متن مستقیم است و نه یک دستورالعمل خاص که مرورگر بتواند بفهمد.
دستورالعمل خاصی که مرورگر شما می تواند بفهمد در برچسب TITLE قرار می گیرد. برچسب TITLE بین برچسب HEAD قرار می گیرد.
برچسب title کار زیادی انجام نمی دهد و واقعاً نباید با نام صفحه اشتباه گرفته شود. آنچه که شما بین دو برچسب Title تایپ می کنید، همان چیزی است که در بالای پنجره ی مرورگر شما ظاهر می شود و این تنها کاری است که انجام می دهد.
قسمت آخر و اسکلت HTML بخش BODY می باشد.
بیشترین بخش کد HTML بین دو برچسب BODY قرار می گیرد. از BODY به عنوان صفحه ی سفید در word استفاده کنید. وقتی چیزی را بین دو بخش BODY تایپ می کنید، بلافاصله می توانید نتیجه اش را در مرورگر ببینید. بخاطر داشته باشید اگر می خواهید محتوایی را بازدیدکنندگان صفحه ی شما ببینند بایستی آن را در بخش BODY تایپ کنید.
