# מעצב HTML

URL: https://shahid09.is-a.dev/he/tools/html-formatter/
Author: Muhammad Shahid (https://shahid09.is-a.dev/)
כלי חינמי · רץ בדפדפן שלכם

הפכו HTML מבולגן או מכווץ לקוד נקי, קריא ועם הזחה אחידה.

**תשובה קצרה:** הדביקו HTML וקבלו מיד קוד נקי עם הזחה, כולל CSS ו־JavaScript מוטמעים. בחרו 2 רווחים, 4 רווחים או טאב ורוחב שורה אם תרצו. הכלי משנה רק את פריסת הקוד. ה־HTML לעולם לא מורץ ושום דבר לא מועלה, ו־HTML שבור מעוצב כמו שהוא ולא מתוקן.

## איך משתמשים

1. **הדביקו HTML.** דף מלא או קטע, גם אם הכול בשורה אחת.
2. **בחרו סגנון.** הזחה ורוחב גלישה אם תרצו.
3. **העתיקו את התוצאה.** היא מתעדכנת תוך כדי הקלדה.

## דוגמה

שורת HTML אחת, עם הזחה של 2 רווחים:

קלט:

```
<div><h1>Title</h1><ul><li>One</li><li>Two</li></ul></div>
```

פלט:

```
<div>
  <h1>Title</h1>
  <ul>
    <li>One</li>
    <li>Two</li>
  </ul>
</div>
```

## שגיאות נפוצות ואיך לתקן אותן

- **ההזחה נראית שגויה**: תג לא סגור או לא תואם משבש את המבנה. מצאו את התג החסר, או הריצו את בודק W3C.
- **הופיע מרווח קטן בין אלמנטים**: רווח בין אלמנטים בתוך שורה יכול להופיע בדף. השתמשו ב־flexbox או השאירו אותם בשורה אחת.

## שאלות נפוצות

### מהו מעצב HTML?

כלי שמוסיף מעברי שורה והזחה אחידים כדי שהקוד יראה את המבנה שלו. הוא לא משנה את מה שהדף עושה.

### האם עיצוב יכול לשנות את מראה הדף?

לעיתים נדירות כן: רווח בין אלמנטים בתוך שורה, כמו span או קישור, יכול להופיע כמרווח קטן. בדקו פריסות שבהן אלמנטים כאלה צמודים.

### האם זה מתקן HTML לא תקין?

לא. הכלי מעצב את מה שיש. השתמשו ב־W3C Nu HTML Checker כדי למצוא שגיאות כמו תגים לא סגורים.

### 2 רווחים או 4?

שניהם בסדר, כל עוד הפרויקט אחיד. 2 רווחים נפוצים ב־HTML, כי הקינון עמוק.

### האם זה מעצב CSS ו־JavaScript מוטמעים?

כן. גם התוכן של תגי style ו־script מקבל הזחה.

### האם בטוח להדביק HTML עם סקריפטים?

כן. ה־HTML מטופל כטקסט, ולא מורץ או מוצג כדף.

### איך פורסים HTML מכווץ מאתר?

העתיקו מ"הצגת מקור" והדביקו כאן. התוצאה קלה לקריאה, אבל ההערות והשמות המקוריים כבר אינם.

### האם משהו נמחק?

לא. התגים, המאפיינים והטקסט נשמרים, ורק הרווחים ביניהם משתנים.

### איך מקטינים HTML במקום לסדר?

עיצוב מגדיל את הקוד. ל־CSS ולסקריפטים בדף, [מכווץ CSS](https://shahid09.is-a.dev/he/tools/css-minifier/) ו[מכווץ JavaScript](https://shahid09.is-a.dev/he/tools/javascript-minifier/) מקטינים את הגודל.

### איך מציגים קוד מעוצב בדף?

קודדו אותו קודם ב[מקודד HTML](https://shahid09.is-a.dev/he/tools/html-encoder/), כדי שהדפדפן יציג אותו כטקסט ולא יריץ אותו.

## קשור

- [מכווץ CSS](https://shahid09.is-a.dev/he/tools/css-minifier/)
- [מכווץ JavaScript](https://shahid09.is-a.dev/he/tools/javascript-minifier/)
- [מקודד HTML](https://shahid09.is-a.dev/he/tools/html-encoder/)

## מקורות

- [W3C Nu HTML Checker](https://validator.w3.org/nu/)
- [js-beautify](https://github.com/beautifier/js-beautify)