چگونه کدهای استاندارد و بدون خطا Html بنویسیم؟

+989352589150

آموزش نوشتن کدهای Html به صورت استاندارد به همراه آموزش ویدئویی رایگان و پروژه محور

html,کد نویسی استاندارد Html,آموزش کدنویسی اصولی,html5,کدنویسی استاندارد سئو

چگونه کدهای استاندارد و بدون خطا Html بنویسیم؟

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

نوشتن کدهای Html هیچ ربطی به زبان برنامه نویسی و یا سیستم مدیریت محتوا شما ندارد. پس یک قاعده کلی برای تمام طراحان سایت به شمار می رود.

قوانین پایه در کدنویسی صحیح

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

استفاده صحیح از هر تگ Html

تگ های مختلفی در Html وجود دارد که اگر بخواهیم پر کاربرد ترین آن ها را معرفی کنیم، می توان به موارد زیر اشاره کرد:

  • تگ div
  • تگ های Heading 
  • تگ پاراگراف یا p
  • لیست های ul,li
  • تگ img
  • تگ Article
  • تگ Header
  • تگ Footer
  • تگ a

هر کدام از تگ های بالای دارای کاربرد خودش است. برخی از افراد مبتدی تمام آیتم های یک سایت را داخل تگ Div قرار می دهند و با استفاده از Css به آن ها استایل های متفاوتی میدهند. این کار کاملا اشتباه است.

مثلا عناوین یک صفحه حتما باید داخل تگ های H1 الیH6 قرار بگیرند. هر صفحه باید فقط و فقط یک تگ H1 داشته باشد.ساختار درختی تگ های H باید رعایت شوند.مثلا اول باید تگ H1 در ابتدای صفحه آورده شود و بعد H2 و الی آخر.

خاصیت alt در تصاویر

هر تصویر داری یک خصوصیت alt میباشد که باید با محتوای مناسب و که با تصویر موضوعیت دارد پر شود.

برخی از طراحان اصلا به این نکته توجه نمی کنند و اصلا این خاصیت را در نظر نمی گیرند. موتورهای جستجو از روی خاصیت alt تصویر متوجه موضوع آن می شوند. پس بهتر است برنامه نویس و طراح سایت این مورد را حتما در نظر بگیرد.(در ویدئو آموزشی توضیح کامل تری وجود دارد).

تگ های meta

زمانی که کاربر متنی را در گوگل جستجو می کند لیستی از نتایج نمایش داده میشود.هر لیست شامل عنوان و متن کوتاهی است.این متن کوتاهی که مشاهده می شود همان متا تگ description هست. البته نه همیشه.گاهی اوقات گوگل بر اساس عبارتی که کاربر جستجو می کند متنی را بین صفحه در این قسمت نمایش میدهد.

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

بر طرف کردن خطاهای جاوا اسکریپتی

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

برای این کار کافی است سایت را در مرورگر گوگل کروم باز کرده و کلید f12 را بزنید. پنجره ای باز می شود که اگر صفحه خطا داشته باشد با رنگ قرمز مشخص شده و در داخل آن عددی نوشته شده است. این عدد بیانگر تعداد خطاهای صفحه وب شما می باشد.

در ادامه با ویدئوی آموزشی به توضیح پروژه محور موارد بالا می پردازیم و به صورت عملی و پروژه محور با کد نویسی استاندارد یک صفحه html آشنا می شویم.(به زودی)

 

اگر سوالی در رابطه با این مطلب دارید می توانید از طریق فرم زیر ارسال کنید
  • ایمیل شما به هیچ عنوان در سایت نمایش داده نمی شود
  • شماره تماس اختیاری است می توانید آن را وارد نکنید
  • کامنت شما بعد از تایید مدیر سایت نمایش داده می شود