ادیتورهای تحت وب

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

  1. در شرایط مختلف خروجی های ادیتور را چک کنید. اگرچه بازار پر است از ادیتور هایی که با تغییر پیکربندیشان کدهای استاندارد HTML یا حتی XHTML تولید می کنند، برای این ادیتورها تولید کد نامعتبر غیر عادی نیست.
  2. بعضی ادیتورها دارای امکان نمایش کد منبع (source-code view) هستند. بسته به سطح کاربران نویسنده محتوی سایت، این خصوصیت ممکن است نیاز به فعال و یا غیر فعال شدن داشته باشد. بعضی ادیتورها دارای نوعی الگوی مجوز دهی هستند که می تواند برای بعضی کاربران امکان نمایش کد منبع را فعال کند و برای بعضی نه.
  3. خصوصیات مرتبط به کنترل نحوه نمایش محتوی (لایه دوم) در ادیتور باید محدود شوند. امکاناتی که رنگ فونت، نوع فونت و رنگ پس زمینه را کنترل می کنند را غیر فعال کنید. همانطوریکه می دانید این خصوصیات فقط باید با CSS کنترل شوند.
  4. ادیتور باید امکان اعمال کردن کلاسهای CSS را داشته باشد. یک ادیتور خوب پیوستگی یک فایل CSS را به ادیتور پشتیانی خواهد کرد. بعضی ادیتورها نیاز دارند که توسط طراح برای اینکه کدام گزینه به منوی CSS آنها افزوده شود تنظیم شوند. بهترین ها از نوع محتوی متن حمایت خواهند کرد و فقط اجازه بکار بستن کلاسها بر پایه قوائد CSS را خواهند داد. مانند جلوگیری از افزودن قائده p.error به یک <span>.
  5. پشتیبانی کلاسهای CSS توسط ادیتور باید شامل امکانی برای اعمال کردن CSS به عناصر معین شده باشد. به عبارتی دیگر دادن کلاس به یک <li> در داخل <ul> توسط نوعی فرایند انتخاب، باید به سادگی دادن کلاس به یک <ul> باشد. یک روش رایج برای این کار یک کلیک ساده برای انتخاب آن عنصر در ساختار درختی DOM در نوار وضعیت است. (body > div > ul > li > a).
  6. به علت اینکه ممکن است قوائد تعریف شده در CSS اصلی برای تفسیر توسط ادیتور خیلی پیچیده باشند و قوائد محتویات کامل، مانند عنصر <p> داخل contents# در مقابل related# ممکن است قابل اجرا و پشتیبانی نباشد، فایل های CSS ی که با ادیتور پیوسته شده است ممکن است خلاصه ای از فایل های CSS اصلی باشد. بسته به محتوایی که ویرایش می شود، استفاده از چندین فایل CSS می تواند راه حل دیگری باشد.
  7. ادیتور باید تگ های پایه معنی گرای XHTML مانند تگ های سرصفحه (h1-6)، قالبندی پاراگرافها، حداقل دو نوع از لیستها، بلاک نقل قول (blockquote)، متن از قبل قالبندی شده و آدرس ها را پشتیبانی کند.
  8. همچنین یک ادیتور مناسب تگ های نامعتبر و ناخواسته را از محتوی الصاقی از Clipboard پاک می کند و یا تنظیماتی برای پاکسازی محتویات الصاقی خواهد داشت. غالباً هنگام الصاق محتویات از برنامه های پردازشگر متن یا صفحات وب به داخل ادیتورهای WYSIWYG، قالب بندی آنها حفظ می شوند. وقتی این اطلاعات با کدهای معتبر ترکیب می شوند اغلب باعث نامعتبر شدن آنها شده و Style هایی را به محتوی اضافه می کنند که باید از بیرون محتویات و توسط CSS اضافه و کنترل شوند.
  9. ممکن است لازم باشد که به نویسنده محتوی بگویید در صورتیکه برنامه ادیتور آنها تگ های نامعتبر را از محتویات ورددی پاک نمی کند، آنها باید قبل از الصاق محتویات در داخل ادیتور WYSIWYG، با الصاق آنها در داخل یک ادیتور متن ساده (مانند Notepad) محتویات را از هرگونه قالبندی پاکسازی کنند.
  10. به دنبال ادیتور تحت وبی باشید که بیشترین مرورگرها را پشتیبانی کرده و به خصوصیات اشاره شده در بالا دست بیابد. اگرچه ادیتورهای امروزی برای Windows و هم برای Mac OSX با قابلیت سازگاری با تقریباً هر مرورگری در دسترس هستند، این غیر عادی نیست که ادیتور WYSIWYG ی پیدا کنید که فقط برای IE پیکر بندی شده باشد.

ادیتور پیشنهادی: CKEditor

CKEditor با مرورگرها و سیستم عامل های مطرح سازگار استCKEditor نمایی از ادیتور

بعد از مدتها جستجو و آزمایش ادیتورهای مختلف، به این نتیجه رسیدم که ادیتور CKEditor بیشترین قابلیت تنظیم و سازگاری را با موارد اشاره شده دارد. CKEditor، ادیتور کد باز (open source) و رایگانی که توسط Frederico Caldeira Knabben نوشته شده، از محبوب ترین ادیتورهای موجود بین طراحان و توسعه دهندگان وب است. امکان Word clean-up این ادیتور بطور خودکار محتویی که از Microsoft Word الصاق می شود را شناسایی و پاکسازی می کند. همینطور با ویرایش چند فایل به سادگی امکانات این ادیتور قابل تنظیم است.

لینکهای مرتبط

نتیجه گیری

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

این پست با نگاهی به کتاب Adapting to Web Standards توسط Christopher Schmitt نوشته شده است.

 همچنین بخوانید

نکته روز رویاگر را به سایت یا وبلاگ خود اضافه کنید

نکته روز رویاگر را به سایت یا وبلاگ خود اضافه کنید

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

طراحی منوهای متحرک بدون نیاز به فلش، بخش دوم: Markup و CSS

طراحی منوهای متحرک بدون نیاز به فلش، بخش دوم: Markup و CSS

در بخش اول این مقاله با تکنیکها و روشهای لازم برای ایجاد فایل های تصویری مورد نیاز برای منوی کاربری متحرک آشنا شدیم. در ادامه بصورت قدم به قدم به ایجاد Markup و استایل دهی به آن، همراه با اشاره به توضیحات و نکات لازم مانند تکنیک CSS Sprite می پردازیم.

طراحی منوهای متحرک بدون نیاز به فلش، بخش اول: تهیه منابع تصویری

طراحی منوهای متحرک بدون نیاز به فلش، بخش اول: تهیه منابع تصویری

احتمالاً شما به عنوان طراح سایت (نه بازدید کننده سایت!) از دیدن منوهای متحرک و زیبای سایتهای فلش لذت برده اید. بعد از آشنایی با استانداردهای وب متوجه خواهید شد که عناصر فلش بخاطر مشکلات دسترسی پذیری و موارد دیگر جای چندانی در طراحی یک وب سایت استاندارد ندارند. حال چگونه می توان بدون استفاده از فلش منوهایی متحرک طراحی کرد؟

کنترل عنوان و متا تگ های صفحه بصورت پویا

کنترل عنوان و متا تگ های صفحه بصورت پویا

عنوان صفحات و متا تگ ها از عناصر کلیدی مورد توجه موتورهای جستجو هستند. استفاده از Master Page در پروژه های ASP.net در نگاه اول مانعی برای استفاده از عناوین و متا تگ های مستقل برای هر صفحه است. اما با استفاده از چند دستور ساده می توانید کنترل کاملی روی این قسمت از صفحات پویای سایت خود داشته باشید.

بکارگیری FCKeditor در ASP.NET

بکارگیری FCKeditor در ASP.NET

این مطلب در رابطه با طریقه نصب، یکپارچه سازی و تنظیم ادیتور FCKeditor در ASP.NET بنا به درخواست یکی از دوستان سایت رویاگر است. در این مقاله بطور قدم به قدم چگونگی دریافت، نصب، یکپارچه سازی و تنظیم این ادیتور قدرتمند را به همراه تمام نکاتی که باید هنگام نصب و استفاده رعایت شوند را خواهیم آموخت. در صورتیکه از ادیتوری غیر از FCKeditor استفاده می کنید و یا به دنبال ادیتوری کامل و سازگار با وب استانداردها برای سایت خود هستید مطالعه این مطلب را به شما توصیه می کنم.

مشاهده همه یادداشت ها

 نظرات این مطلب

نظر شما

فرم ارسال نظر
کد
ارسال نظر

لیست نظرات

زهرا

زهرا

  • ﺳﻪشنبه، 03 شهریور 1388
سلام، اختیار دارید، آدم که وارد اینجا می شه تازه می فهمه استاد کیه! مدتها بود یک وب سایت مستقل انقدر به دلم ننشسته بود و مشخصه که چقدر مطالبتون براتون ارزش داره که اینهمه زیبا و مرتبه، اینها بدون تعارف بود (چون من حسودم خیلی کم از کسی تعریف میکنم!!!! :D )
باز هم سر خواهم زد!
مصطفی مقدم

مصطفی مقدم

  • ﺳﻪشنبه، 03 شهریور 1388
متشکر از لطف شما. لینک سایتتون رو در رویاگر خواهم گذاشت.
علیرضا

علیرضا

  • چهارشنبه، 04 شهریور 1388
سلام و سپاس بخاطر پست مفیدتون. اما یک سوال ؟
من فکر می کنم یکی از نکاتی که خیلی می تونه مهم باشه اینه که قابلیت File Upload و همچنین File Browser خوبی برای آن پوشه ای که جهت این کار تعریف شده داشته باشد.

FckEditor این قابلیت را بخوبی و بصورت سورس باز پشتیبانی می کند. آیا ادیتور CK هم همچین قابلیتی دارد ؟

نکته بعدی در مورد زمان بارگذاری این ادیتور هست! آیا شما این ادیتور را از نظر زمان بارگذاری برتر از FCK می دانید ؟

باز هم ممنون به خاطر این پست. این روز ها بحث استفاده از ادییتور خیلی گرمه.
مصطفی مقدم

مصطفی مقدم

  • چهارشنبه، 04 شهریور 1388
@علیرضا:

علیرضای عزیز، ادیتور CKEditor همون FckEditor سابقه که بخاطر اسم نامناسبش در زبان انگلیسی از نسخه 3 به بعد به این نام خونده می شه. این ادیتور در این نسخه پیشرفت های زیادی داشته.

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

Max

  • پنجشنبه، 05 شهریور 1388
سلام .
البته من از tinyMCS استفاده مي كنم اما اين رو هم گرفتم تا اگر تونستم استفاده كنم .
اينكه كد رو از استايل هاي ورد تميز ميكنه خيلي خوشم مياد .
در پناه خدا موفق و پيروز باشي
مصطفی مقدم

مصطفی مقدم

  • ﺳﻪشنبه، 10 شهریور 1388
علی جان هدفم از معرفی این ادیتور تبلیغ برای اون نبود. ادیتور شما هم ادیتور خوبیه. مهم اینه که با روشهای گفته شده ادیتور خودمونو طوری تنظیم کنیم تا زحماتمونو هدر نده.
حمید

حمید

  • چهارشنبه، 11 شهریور 1388
با سلام!
از این ادیتور چطور در پروژه های Asp.Net استفاده کنیم؟
هر چی باهاش ور رفتم نتونستم کاری بکنم!
اگه نمونه پروژه ی دات نتی که از این ادیتور (آخرین نسخش) استفاده کرده، ممنون میشم برام ارسالش کنین.
ایمیل من: Hrhb.Mail@Gmail.Com
مرسی
حمیدرضا

حمیدرضا

  • پنجشنبه، 12 شهریور 1388
با سلام . من با این لینکی که گذاشتید ckeditor نسخه 3 رو دانلود کردم . برای راه اندازی فایل dll لازم داره که من نتونستم پیدا کنم تو سایتشم نبود. هر چی هم تو اینترنت گشتم پیداش نکردم
منم اینو برای دات نت می خوام ، اگه ممکنه یه لینک کامل برای دانلود بذار و اگر محبت کنی یه راهنمایی هم برای نصبش بگی ممنون میشم.
مصطفی مقدم

مصطفی مقدم

  • پنجشنبه، 12 شهریور 1388
@ حمید:

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

مصطفی مقدم

  • پنجشنبه، 12 شهریور 1388
@ حمید رضا:

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

مصطفی مقدم

  • یکشنبه، 15 شهریور 1388
متوجه شدم که هنوز کنترل های سمت سرور برای NET. آماده نشده اند. و تنها راه استفاده از این ادیتور کامل در این زمان، استفاده از API های جاوا اسکریپته اونه.

خود آقای Frederico Caldeira Knabben فرمودند: "بعد از انتشار اولین سری از نسخه 3 این ادیتور، کنترل های سرور که فقط شامل امکان یکپارچه سازی جاوا اسکریپته رو عرضه می کنیم."

شخصاً ترجیح دادم که تا آماده شدن نسخه .NET اون صبر کنم. بعد از اون مقاله کاملی راجع به نصب و استفاده این ادیتور در ASP.NET خواهم نوشت. اگر هم نیاز به نصب نسخه قدیمی رو دارید، بگید تا راهنماییتون کنم.
حمید رضا

حمید رضا

  • دوشنبه، 16 شهریور 1388
با سلام و خسته نباشید . ممنون بابت زحمتی که کشیدید . لطفا مراحل نصب نسخه قدیمی اون رو برای دات نت توضیح بدید و لینک معتبر هم برای دانلود معرفی کنید .
ممنون
مصطفی مقدم

مصطفی مقدم

  • ﺳﻪشنبه، 17 شهریور 1388
ظاهراً واسه آماده شدن نسخه جدید تحمل ندارید. با این حال به روی چشم.

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

http://download.cksource.com/CKEditor/CKEditor/CKEditor%203.0/ckeditor_3.0.zip
اصغر نیتی

اصغر نیتی

  • چهارشنبه، 15 اردیبهشت 1389
ba salam.
man az SyrinxCkEditor to websitam estefade kardam.
va ro systeme khodam khili khob javab mide.ro iis7 ham test kardam kar mikard.
vali vagti ro site upload mikonam editor load nemishe.in pigam ro ham, mide: Message: 'CKEDITOR' is undefined
age komakam konin mamnon misham
.merc
مصطفی مقدم

مصطفی مقدم

  • شنبه، 18 اردیبهشت 1389
سلام،

در باره SyrinxCkEditor چیزی نمی دونم ولی اسمش خیلی نزدیک به همین fckEditore!
احساس می کنم در قسمت نصب ادیتور مشکل دارید.
از صحت تنظیماتتون در webconfig و صحت مسیر ها مطین بشید.

موفق باشید.
ریبوار حسین پوری

ریبوار حسین پوری

  • جمعه، 05 شهریور 1389
مصطفی جان مرسی از مطلب قشنگت.
چند آیتم که به نظرم در استفاده از یه ادیتور خیلی مهمه
1- سبک بودن
2- یوزر اینترفیس
3- استفاده راحت

من خیلی وقت پیش این ادیتورو داونلود کردم و ازش راضی بودم، حالا هر چی میگردم رو سیستمم پیداش نمی کنم ،دوباره داونلودش می کنم و مطمئنم از اکثر ادیتورا بهتره

در پناه حق
علی

علی

  • دوشنبه، 08 شهریور 1389
با سلام
ببخشید من ckeditor 3.4 رو دانلود کردم
موقع نصب روی جوملا 1.5 خطا میده که فایل xml وجود نداره
باید چیکار کنم؟ممنون میشم راهنماییم کنید
یاعلی
مصطفی مقدم

مصطفی مقدم

  • دوشنبه، 08 شهریور 1389
سلام،
من متاسفانه تجربه ای با نرم افزار های اپن سرس ندام.

موفق باشید.
mohsen

mohsen

  • چهارشنبه، 14 اردیبهشت 1390
با تشکر زنده باشی عزیز
محمد حسی فخراورین

محمد حسی فخراورین

  • چهارشنبه، 14 دی 1390
با سلام
یک ادیتور خوب مثل fc باید قابلیت همه چیز رو داشته باشه من نسخه 2 که فایل منیجر داشت را بیشتر دوست دارم اما در نسخه 3 رایگانش این امکان نیست.
اما ظاهر در نسخه 3 بسیار عالی شده
ناشناس

ناشناس

  • ﺳﻪشنبه، 25 مهر 1391
سلام من از Ckedditor 3.6 استفاده میکنم. با آپلود عکس مشکل دارم در واقع اصلا نمی تونم عکس آپلود کنم لطفا راهنمایی کنید
با تشکر
مصطفی مقدم

مصطفی مقدم

  • جمعه، 28 مهر 1391
ناشناس عزیز،
حدس می زنم شما به فولدری که می خواهید عکس رو آپلود کنید پرمیشن های کافی رو ندادید.
ناشناس

ناشناس

  • شنبه، 29 مهر 1391
سلام من ckeditor رو دانلود کردم از سایت خودش، اما روی سیستم من اصلا تب مربوط به آپلود عکس فعال نیست
فرم جستجو
large desktopdesktoptabletphone © royagar.com