توسعه‌دهنده 🔒 در مرورگر اجرا می‌شود — داده‌ای ارسال نمی‌شود

فرمت‌کنندهٔ HTML

یک خط بلند HTML را به کدی مرتب و تورفته تبدیل کنید که بشود خواند و ویرایش کرد.

ورودی
خروجی

قالب‌بندی آنلاین HTML

HTMLی که از یک ایمیل‌ساز، خروجی یک CMS، یک صفحه‌ساز یا یک سایت فشرده‌شدهٔ production بیرون می‌آید معمولاً یک خط عظیم است و پیدا کردن یک div در آن عذاب است. این صفحه همان فرمت‌کنندهٔ کد است که روی HTML تنظیم شده: کد را بچسبانید تا هر عنصر در خط خودش قرار بگیرد و به اندازهٔ عمق تودرتویی‌اش تورفته شود.

قالب‌بندی با js-beautify انجام می‌شود، یک فرمت‌کنندهٔ متن‌باز پرکاربرد که داخل زبانهٔ مرورگر شما اجرا می‌شود. هیچ چیز آپلود نمی‌شود.

فرمت‌کننده چه می‌کند

  • عنصرهای بلوکی مثل div، section، ul و li هر کدام خط تازه‌ای شروع می‌کنند و زیر والدشان تورفته می‌شوند.
  • عنصرهای درون‌خطی مثل a، b، span و em داخل همان خط متنی که به آن تعلق دارند می‌مانند.
  • ویژگی‌ها (attributeها) دقیقاً همان‌طور که نوشته شده‌اند و به همان ترتیب حفظ می‌شوند.
  • خط‌های خالی که عمداً گذاشته‌اید، تا دو خط پشت سر هم، حفظ می‌شوند.

کی قالب‌بندی و کی فشرده‌سازی

وقتی آدمی باید فایل را بخواند یا ویرایش کند، قالب‌بندی کنید. وقتی مرورگر باید آن را دانلود کند، فشرده کنید: حذف توضیحات و تورفتگی معمولاً پیش از gzip حدود ۱۰ تا ۲۰ درصد از حجم یک صفحهٔ HTML کم می‌کند. برای بیشتر سایت‌ها فشرده‌سازی سمت سرور سود بزرگ‌تری دارد، اما فشرده‌سازی کد هنوز برای قالب‌هایی که درون ایمیل‌ها یا صفحه‌های دیگر جاسازی می‌شوند مفید است.

ابزارهای مرتبط

برای استایل‌شیتی که همراه صفحه است از فشرده‌ساز CSS و برای اسکریپت‌ها از مرتب‌کنندهٔ JavaScript استفاده کنید. برای مقایسهٔ کد قبل و بعد از یک ویرایش، از مقایسهٔ متن استفاده کنید.