امروزه می‌بینیم که بیشتر محتوای موجود در وب توسط کسانی تولید می‌شود که از طراحی وب هیچ اطلاعی ندارند. در گذشته، اگر چنین افرادی می‌خواستند چیزی روی وب منتشر کنند، مجبور بودند علاوه بر هزینه‌های تولید سایت، هزینه‌هایی نیز برای نگه‌داری و به‌روز رسانی آن می‌پرداختند. با آمدن سیستم‌های مدیریت محتوا (CMS) به عرصه‌ی وب، امروز می‌بینیم که این نیاز تا چه حدی کاهش یافته است. کاربر به سادگی می‌تواند یک CMS مناسب کارش انتخاب کند و فقط مطالب دلخواهش را به آن بدهد؛ بدون اینکه کوچک‌ترین نیازی به دانستن html و css داشته باشد. بقیه‌ی کارها را CMS برای او انجام خواهد داد.

اما CMSها چه ابزارهایی ارائه می‌دهند تا کار را برای کاربر عادی راحت کنند؟ مهم‌ترین ابزار مشترک بین همه‌ی سیستم‌های مدیریت محتوا، یک ویرایش‌گر برای گرفتن مطالب دلخواه کاربران است. CMSهای مختلف، ویرایش‌گرهای گوناگونی را ارائه می‌دهند که از جمله‌ی معروف‌ترین این ویرایش‌گرها می‌توان به ویرایش‌گرهای WYSIWYG، ویرایش‌گرهای با قابلیت پذیرش bbCodeها و Textile اشاره کرد. شاید نه پرکاربردترین، ولی کاربرپسندترین آنها، همان WYSIWYGها باشند، چرا که قابلیت قالب‌بندی متن را به سادگی در اختیار قرار می‌دهند. محیط این گونه ویرایش‌گرها شبیه به نرم‌افزارهای واژه‌پرداز همچون Microsoft Word طراحی شده تا کاربران، در محیط وب احساس راحتی بیشتری داشته باشند.

ویرایش‌گرهای WYSIWYG از دید بعضی طراحان حرفه‌ای وب

تا اینجا همه چیز از دید یک کاربر عادی خوب و کافی است. اما چرا کسانی که با طراحی وب آشنا هستند، استفاده از ویرایشگرهای متنی ساده را به این‌گونه ویرایش‌گرها ترجیح می‌دهند؟

Jon Christopher در این پست، عقیده دارد استفاده از ویرایش‌گرهای دیداری، می‌تواند طراحی خوب یک وب‌سایت را به هم بریزد.
Jim Stitzel از TextileWrapper استفاده می‌کند و معتقد است ویرایش‌گر دیداری وردپرس کارایی لازم را برای او ندارد.
Abhijit Nadgouda از نقص‌های ویرایش‌گرهای WYSIWYG می‌گوید. به نظر او این گونه ویرایش‌گرها با آوردن استایل‌ها به کد xHTML از استانداردها فاصله دارند.
نظر شخصی خود من هم به عنوان یک توسعه‌دهنده‌ی وب غیرحرفه‌ای این است که این گونه ویرایش‌گرها، کدی بسیار کثیف، غیر مفهومی و مخالف استانداردهای وب تولید می‌کنند.

محدودیت‌ها و مشکلات ویرایش‌گرهای WYSIWYG

می‌توان گفت بزرگ‌ترین و مهم‌ترین مشکل ویرایش‌گرهای WYSIWYG، غیر Semantic بودن آنهاست. امروزه در استانداردهای وب، یکی از مهم‌ترین مسائل مورد گفتگو، مبحث semantics است. به طور خلاصه semantics در طراحی وب، در مورد معنا و مفهوم بخشیدن به XHTML است. هر تگ هدفی را دنبال می‌کند و برای مورد خاصی به کار می‌رود. به علاوه، attributeهای id و class باید مشخص‌کننده‌ی دلیل وجود آن تگ باشد. به طوری که اگر کسی با XHTML آشنایی کافی داشته باشد، بتواند با مرورکردن کد، تجسم قابل قبولی از ساختار کار پیدا کند.

غیر مفهومی بودن کد تولیدشده توسط این ویرایش‌گرها، موجب غیر استانداردبودن آن می‌شود؛ حتی اگر پوسته‌ی وب‌سایت کاملا استاندارد طراحی شده باشد. نتیجه آن‌که زحمات طراح برای هرچه باکیفیت‌تر و استانداردتر شدن کار، به باد فنا می‌رود!

به علاوه، از آن‌جایی که ویرایش‌گرهای WYSIWYG شبیه به نرم‌افزارهای واژه‌پرداز طراحی شده‌اند و از قابلیت تنظیم دستی قالب‌بندی نوشته (مثل فونت، رنگ، اندازه، …) برخوردارند، دست کاربر را باز می‌گذارند تا خصوصیات قالب‌بندی نوشته را به طور غیرهدفمند و تنها بر پایه‌ی سلیقه‌ی آنی‌اش تغییر دهد، نه بر اساس استایل‌هایی که در CSS پوسته تعریف شده‌اند.

جالب آن که، حتی نرم‌افزارهای واژه‌پرداز مانند Microsoft Word و OpenOffice.org برای استایل‌های خود قابلیت نام‌گذاری گذاشته‌اند تا قالب‌بندی نوشته‌ها با کیفیت بیشتری انجام گیرد؛ اما ویرایش‌گرهای تحت وب ما هنوز همان رویه‌ی قدیمی خود را دنبال می‌کنند!

آن‌چه می‌بینید، همان چیزی است که در نظر داشتید

شاید بهترین راه‌حلی که من برای حل این مسئله دیده‌ام، WYMeditor باشد. ویرایش‌گری از نوع WYSIWYM که کوتاه‌شده‌ی What You See Is What You Mean است. یعنی آن چیزی که می‌بینید، همان چیزی است که در نظر داشتید. ایده‌ی این ویرایش‌گر، ترکیبی از WYSIWYGها برای جلب رضایت کاربران عادی، و توجه بیشتر به هر جزء به کاررفته در کد است.

اساس کار این ویرایش‌گر، بر استایل‌های از پیش تعریف‌شده است. دیگر از تنظیم دستی قالب‌بندی نوشته خبری نیست. بنابراین تگ‌های اضافی و خلاف استانداردها، همچون <font> در کد خروجی دیده نمی‌شود. به جای آن، می‌توانید به هر هدینگ، لیست، پاراگراف و … کلاس‌های از پیش‌تعریف‌شده نسبت داد که با پوسته‌ی وب‌سایت هم‌خوانی داشته باشند.

با این که WYMeditor هنوز ایده‌ی خام و کارنشده‌ای است، به گمان من می‌تواند راه آینده‌ی ویرایش‌گرهای دیداری باشد. ویرایش‌گرهایی که css شما را در هنگام ویرایش اعمال می‌کنند.