طراحی سایت با HTML

چرا صفحه وب سایت می بایست استاندارد w3c باشد

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

اجرا کردن ویدئو توسط html5 در وب سایت

قرار دادن ویدئو در صفحه توسط html5 بسیار آسان است و از قرار دادن تصویر در صفحه سخت تر نیست. در این مقاله مزایای استفاده از ابزار اجرا کننده داخلی ویدئو مرورگر بحث خواهد شد. به راحتی می توانیم با استفاده از تگ <video> و بدون استفاده از هیچ پلاگین خارجی ویدئو را اجرا نماییم. پیش نیازها می بایست از Chrome, Safari یا Internet Explorer 9+ استفاده نمایید. در مرورگرهای Firefox و Opera این کد به دلیل تداخل با ابزارهای داخلی مرورگر کار نمی کند. برای انجام این کار می بایست فرمت ویدئو شما .mp4 باشد. ایجاد فریم ورک اصلی…

قرار دادن Audio و Video در وب سایت توسط html

قرار دادن Audio و Video در وب سایت توسط html ایجاد Video و Audio در سایت توسط کدهای html5 که طراحان وب سایت به راحتی میتوانند در سایت ایجاد نمایند, فقط کافیست دستورالعمل های زیر را انجام دهید تا در سایت مثال عکس بالا ویدئو و یا صفحه پخش موزیک داشته باشیم : کد html برای اجرا Video در سایت : <video width=”700″ height=”420″ controls> <source src=”video/movie.mp4″ type=”video/mp4″> <source src=”video/movie.ogg” type=”video/ogg”> Your browser does not support the video tag. </video> کد html برای اجرا Audio در سایت : <audio controls> <source src=”music/amin.ogg” type=”audio/ogg”> <source src=”music/amin.mp3″ type=”audio/mpeg”> Your browser does not…

طراحی بهترین فرم برای وب سایت

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

نمایش آمار بازدید کنندگان وب سایت بر روی نقشه جهان

جهت نمایش آمار بازدید کنندگان سایت خود بر روی نقشه جهان و وضعیت بازدید کنندگان فعلی سایت و اینکه از چه کشورهایی هستند از کد زیر استفاده نمایید: <script type=”text/javascript” src=”http://jg.revolvermaps.com/2/1.js?i=6akfnjfekk1&amp;s=220&amp;m=0&amp;v=false&amp;r=false&amp;b=000000&amp;n=false&amp;c=ff0000″ async=”async”></script> و نتیجه چیزی شبیه به این خواهد بود: برای انجام تغییرات بر روی آن از آدرس زیر استفاده نمایید: http://www.revolvermaps.com/?target=setup این ابزار بازدید کنندگان فعلی وب سایت را به صورت چشمک زن نمایش می دهد و در صورتی که بر روی صفحه بزرگنمایی کلیک شود جزئیات آمار سایت نمایش داده می شود این ابزار آمار سایت را در یک محیط سه بعدی نمایش می دهد و در دو…

تفاوت میان html ، xhtml و xml

در ژانویه ۲۰۰۰ ، W3C اعلام نمود که html 4 به xhtml 1 تغییر پیدا نموده است و xhtml کد html 4 می باشد که به صورت xml نوشته شده باشد. xhtml از دو بخش اصلی تشکیل شده * html 4 html 4 زبان برنامه نویسی می باشد برای نمایش متن و مطالب در پلتفرم های مختلف. در این زبان قابلیت های بسیاری برای نمایش مطالب، تصویر و فایل های مولتی مدیل وجود دارد. * xml یک زبان برنامه نویسی مارک آپ قابل گسترش می باشد که سادگی و و قدرت html را دارد و پیچیدگی خاصی چندانی ندارد. XHTML…

ساخت پرزنتیشن توسط ابزار HTML5

Presentate قصد دارد ساخت معرفی نامه و یا پرزنتیشین را در وب آسان سازد که این فایل قابلیت به اشتراک گذاری نیز دارد. ساخت معرفی نام توسط Presente بسیار آسان می باشد Presentate کاربران را قادر می سازد پرزنتیشن های خود را در مرورگر و با قابلیت به اشتراک گذاری در هر وسیله ای بسازد. این برنامه توسط Faruk Ate و Justin Hileman ساخته شده. آنها قصد داشتند سیستم پرزنتیشنی را طراحی نمایند که بهترین در سطح وب باشد, و HTML5 به آنها این اجازه را داد تا این سیستم را راه اندازی نمایند. File API و History API دو تا از امکانات HTML5 دیده شده…

Marquee و w3c

w3c استفاده marquee را در html5 ممنوع نموده است. به جای استفاده از marquee از موارد زیر استفاده نمایید: ——————– استفاده از javascript به جای marquee استفاده از انیمیشن css که در تمامی مروزگرها قابل اجرا نیست از marquee استفاده نمایید و خطای w3c را در نظر نگیرید از marquee استفاده ننمایید ——————–

۵ ویرایشگر html

توجه: در صورتی که فرمت فایل خاص و یا امکان خاصی مد نظر شماست, شما می تونید لیست قابلیت های هر کدام از این نرم افزارها رو در سایت Wikipedia مطالعه نمایید.

Kompozer (Windows/Mac/Linux, Free)

Kompozer یکی از ویرایشگرهای متن html می باشد. Kompozer دارای تب هایی برای ویرایش است و همچنین قابلیت ویرایش html و نرم افزار کار با ftp نیز دارد و همچنین این نرم افزار قابلیت سفارشی سازی های بسیار دارد. Kompozer ابزاری جهت استاندارد سازی w3c صفحه دارد. این ابزار رایگان است و برای سیستم عامل های windows Mac,و Linux کاربرد دارد و هدف اصلی آن کد نویسی استاندارد و تمیز صفحه است.

iWeb (, Mac (for iLife bundle

این ابزار توسط Apple ارائه شده و با قابلیت های بسیار ساده دراگ و دراپ خود به طراح این اجازه رو می دهد که سایت رو با کمترین دانش html طراحی نماید. Apple همچنین قالب ها و وب سایت های آماده رو ارائه می نماید که با چند کلیک قابل پیاده سازی هستند. iWeb’s به شما قابلیت مدیریت چندین سایت را می دهد.

Adobe Dreamweaver (Windows, Mac)

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

Microsoft Expression Web (Windows)

Expression Web نرم افزار ویرایشگر html مایکروسافت می باشد. این نرم افزار با استاندارهای طراحی وب سازگاری کامل داره. این نرم افزار همچنین دارای امکاناتی برای طراحی سایت بهینه سازی شده برای موتورهای جستجو می باشد و به شما امکاناتی رو از بایت آن می دهد. این نرم افزار همچنین قابلیت کد زنی css قوی دارد که کار نوشتن css رو برای شما بسیار ساده می سازد.

Flux (Mac )

Flux نرم افزار ویرایشگر html است که مخصوص Mac-based طراحی شده. Flux’s به شما امکان کنترل کامل همه چیز از جمله پدینگ و مترجین و غیره رو با حرکت های موس می ده و همچنین به شما قابلیت ویرایش صفحه رو به صورت دراگ و دراپ می ده. به مانند Dreamweaver  دارای پلاگین های بسیاری برای دانلود است.

در مدت طراحی سایت های اینترنتی از سال ۱۳۸۱ تا کنون این نرم افزارها رو به طور کامل بررسی نموده ایم و پیشنهاد ما به عنوان بهترین گزینه Adobe Dreamweaver می باشد. این نرم افزار قابلیت های فراوانی در ویرایش صفحه به شما می دهد و پیشنهاد می کنیم از این نرم افزار کنار نرم افزارهای ویرایش کد دیگر به مانند notepad++ استفاده نمایید. با تلفیق این دو نرم افزار کلیه نیازهای شما در ویرایش کد صفحات برآورده می شه.

 علاوه بر موارد بالا، امسال بهترین برنامه های ویرایشگر اچ تی ام ال برای ویندوز معرفی شدند:

•NotePad ++

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

•Komodo Edit

دو نسخه کومودو (Komodo Edit و (Komodo IDE وجود داره. Komodo Edit منبع باز و دانلود اون رایگان است. 

Komodo Edit شامل بسیاری از ویژگی های عالی برای توسعه HTML و CSS است. علاوه بر این، می تونید پسوندهایی برای افزودن پشتیبانی از زبان یا سایر ویژگی های مفید مانند بعضی کاراکترهای خاص رو دریافت کنید.

Komodo شاید عالی ترین ویرایشگر نباشه، اما قیمت مناسبی داره.

•Eclipse

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

اگه در حال طراحی برنامه های کاربردی پیچیده ای هستین، Eclipse ویژگی های بسیاری داره که میتونه به ساخت راحت تر اپلیکیشن های شما کمک بزرگی بکنه. جاوا، جاوا اسکریپت و پلاگین های PHP و همچنین یک افزونه برای طراحان اپ موبایلی وجود داره.  

•CoffeeCup Free HTML Editor

این برنامه شامل دو نسخه است؛ نسخه رایگان و همچنین نسخه ی پولی که نسخه ی کامل این برنامه است. نسخه ی رایگانش هم خوبه، اما باید بدونید که بسیاری از ویژگی هایی که این پلتفرم ارائه می ده نیاز به خرید نسخه کامل داره.

اگه در طراحی و توسعه وب مبتدی هستید یا مالک یک کسب و کار کوچکید، این ابزار ویژگی های بیشتری نسبت به Komodo Edit  یا Eclipse داره.

•Aptana Studio

این برنامه به جای توجه روی HTML، روی جاوا اسکریپت و سایر عناصر تمرکز می کنه که به شما امکان می ده برنامه های اینترنتی خوبی رو طراحی کنید. این برنامه ممکن است مناسب نیازهای طراحی ساده وب نباشه، اما اگر به دنبال توسعه بیشتر وب سایتتون هستید، ابزارهایی که در Aptana ارائه میشن، مناسب هستند.

یک نگرانی در مورد Aptana عدم وجود به روز رسانی هایی است که شرکت طی چند سال گذشته انجام داده است. 

•NetBeans

NetBeans IDE یک IDE جاوا است که می تونه به شما در ایجاد برنامه های کاربردی وب کمک کنه.

مثل اکثر IDEها، منحنی یادگیری افزایشی داره چرا که اغلب به همون نحو که ویراستاران وب کار می کنن، کار نمی کنه. با این وجود، وقتی که بهش عادت می کنید بسیار مفید می شه.

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

•Microsoft Visual Studio Community

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

•BlueGriffon

BlueGriffon آخرین مجموعه از ویراستاران وب سایت است که با Nvu آغاز شده است. 

این برنامه برای ویندوز، مکینتاش و لینوکس و در زبان های مختلف است.

این تنها ویرایشگر واقعی WYSIWYG است که این لیست رو ایجاد کرده و به همین ترتیب برای بسیاری از مبتدیان و صاحبان کسب و کار کوچک که مایل به کار بصری بیشتری هستن در مقایسه با رابط مبتنی بر کد، جذابیت بیشتری داره.

•Bluefish

Bluefish یک ویرایشگر کامل HTML است که در سیستم عامل های مختلف از جمله لینوکس، MacOS-X، ویندوز و … اجرا می شه.

آخرین نسخه (۲٫۲٫۷) برخی از اشکالات موجود در نسخه های قبلی رو از بین برده.

ویژگی های برجسته ای که از نسخه ۲٫۰ استفاده می شه، بررسی خودکار املای کد، تکمیل خودکار بسیاری از زبان های مختلف (HTML، PHP، CSS، و غیره)، اسنیپت ها، مدیریت پروژه و ذخیره خودکار است.

•Emacs Profile

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

برجسته ترین ویژگی های این برنامه: پشتیبانی از XML، پشتیبانی از اسکریپت، پشتیبانی پیشرفته CSS و یک اعتبار سنجی داخلی، و همچنین اصلاح HTML با کد رنگی.

محسن اصغری مرزیدره ای