آموزش رفع خطاهای قالب سایت در W3C

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

این استاندارد‌ها از طریق سازمان w3c تعیین می‌شود و می‌توانید سایت خود را در آدرس https://validator.w3.org از این نظر بررسی کنید که چه مقدار به این استاندارد نزدیک است.

در هنگام کدنویسی سایت یا قالب وردپرس ممکن است بعد از پایان کار گاهی خطاهایی به وجود بیایند و شما در سایت ببنید که دلایلی متعدد دارند و ما در این جا با ذکر نوع خطا به شما کمک می‌کنیم که چگونه ارورهای مختلف رو رفع کنید و در تاییده‌ی اعتبار رو از سایت w3 دریافت کنید .

خطاهای متداول

1 – عدم تعریف خاصیت alt برای عكس‌ها

خطای نمایش داده شده :

required attribute “alt” not specified

این خطا به دلیل تعریف نکردن خاصیت alt برای تگ img در html ایجاد می‌شود

رفع خطا :

كد عكسی كه بدون alt در قسمت فراخوانی عکس قرار گرفته شده و خطا گرفته شده :

 <img src="https://www.yekweb.com/image.jpg" />

كد عكس alt اضافه شده و صحيح و بدون خطا :

<img src="https://www.yekweb.com/image.jpg" alt="yekweb" />

2 – استفاده نادرست از خط شكن ، تگ <br>

خطای نمایش داده شده :

end tag for “br” omitted, but OMITTAG NO was specified

رفع خطا :

قرار دادن تگ

<br />

به جای

<br>

در تمامی کدهای پوسته یا قالب

3 – قرار ندادن / در آخر تگ‌های متا ، استایل ، img

خطای نمایش داده شده :

end tag for “meta” omitted, but OMITTAG NO was specified

رفع خطا :

مثال غلط كه در انتهای تگ / وجود ندارد و خطا گرفته می‌شود

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >

مثال درست و بدون خطا

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

4 – استفاده از id بیشتر از یکبار در قالب

خطای نمایش داده شده :

ID “yourID” already defined

An “id” is a unique identifier. Each time this attribute is used in a document it must have a different value. If you are using this attribute as a hook for style sheets it may be more appropriate to use classes (which group elements) than id (which are used to identify exactly one element).

رفع خطا :

اگر در استایل قالب و سایت آیدی‌ای به صورت زیر تعریف شده بود ، از این آیدی فقط یک بار باید در كل قالب استفاده کنیم

#class
{
}

اگر نیاز به چندین بار استفاده است باید در استایل به جای # ،  . قرار دهیم و يا اگر id هست كه چند بار ازش در قالب استفاده شده بايد تغییر داده شود

.class{

}

5 – وجود </div> اضافه در كدهای قالب

خطای نمایش داده شده :

Line 154, Column 45: end tag for element “div” which is not open

رفع خطا :

با توجه به خطی كه در خود خطا گفته شده است بررسی کرده و div اضافه رو پاك می‌كنیم ، يا div‌هارو دنبال کرده به ترتيب و هر كدام كه اضافی بودند پاک می‌كنیم.

6 – </a> اضافه در قالب (بسته شدن تگ a در صورتی که اصلا باز نشده)

خطای نمایش داده شده :

Line 225, Column 24: end tag for element “A” which is not open

رفع خطا :

</a> اضافه رو با توجه به خطی که توی ارور هست پیدا کرده و حذف می‌کنیم ،

اين خطا ممكن است برای سایر تگ‌های

</td>
</tr>
</table>
</ul>
</li>
</p>

هم اتفاق بیافتد كه به همین صورت رفع خطا می‌كنیم.

7 – ارور UTF -8

خطای نمایش داده شده :

رفع خطا :

برای رفع این خطا ابتدا باید برنامه‌ NotePad++ رو دانلود و روی کامپیوتر خودتون نصب کنید ،

بعد فایل‌های قالب سایت را به ترتیب باز کرده و از منو بالای برنامه به قسمت encoding رفته و گزینه encoding in utf-8 without bom را انتخاب کنید و فایل را ذخیره کنید . برای تمامی فایل‌های PHP قالب این کار را انجام بدید و قالبتون رو از نو آپلود كنيد ، حالا ديگه قالب شما با utf-8 مشکلی نخواهد داشت و خطا رفع شده است.

8-استفاده تگ های h در محل نامناسب

خطای نمایش داده شده :

element “H3″ undefined

… <div class=”sidebar-box-right”><H3><div class=”title”>برچسب‌ها</div></H3>

✉You have used the element named above in your document, but the document type you are using does not define an element of that name. This error is often caused by:

incorrect use of the “Strict” document type with a document that uses frames (e.g. you must use the “Frameset” document type to get the “<frameset>” element),

by using vendor proprietary extensions such as “<spacer>” or “<marquee>” (this is usually fixed by using CSS to achieve the desired effect instead).

by using upper-case tags in XHTML (in XHTML attributes and elements must be all lower-case

رفع خطا :

در اين خطا تگ h3 به این صورت استفاده شده است

<h3><div class="title">برچسب‌ها</div></h3>

كه اشتباه است و خطا گرفته خواهد شد ، كد صحيح برای قرار گيری به اين صورت است :

<div class="title"><h3>برچسب‌ها </h3></div>

9-قرار دادن دستور charset برای تگ جاوا اسکریپت

خطای نمایش داده شده :

Element script must not have attribute charset unless attribute src is also specified.

رفع خطا :

در سایت کدهایی چون

<script type="text/javascript" charset="utf-8">

را به

<script type="text/javascript">

تبدیل کنید.

 10-قرار دادن ویژگی زبان برای تگ جاوا اسکریپت

خطای نمایش داده شده :

The language attribute on the script element is obsolete. You can safely omit it.

<script language="Javascript">

<script type="text/javascript">

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

همینطور می‌توانید سوالات و مشکلات خود را در این مورد با ما در قسمت نظرات درمیان بگذارید.