سیر تکامل در کدنویسی HTML

منتشرشده در آموزش طراحی سایت
یکشنبه, 21 تیر 1394 ساعت 12:38

پیدایش اینترنت و زبان کدنویسی HTML

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

اولین نسل از زبان HTML

در دهه 90 میلادی و بهمراه افزایش ارتباط کاربران با اینترنت، امکان خواندن مطالب در فضای اینترنت با استفاده از کدنویسی HTML مهیا شد. در آن زمان صفحات وب از متن هایی محدود و در یک ستون تشکیل میشدند و مودم های دیال آپ سرعت بسیار پایینی داشتند به همین دلیل طراحان وب هرگز به فکر استفاده از تصویر و فیلم در صفحات سایت نبودند.
Mosaic نام اولین مرورگر برای ارتباط و درک صفحات وب بود که بر روی سیستم عامل Unix راه اندازی شد. برای غلبه بر این مشکلات و محدودیت ها تلاش های فراوانی صورت گرفت تا دنیای وب به شکل امروزی آن رسیده است.

نسل دو زبان کدنویسی HTML

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

کنسرسیوم جهانی وب

کدنویسی HTML

استفاده از فضای منفی در طراحی سایت

منتشرشده در آموزش طراحی سایت
یکشنبه, 21 تیر 1394 ساعت 12:36

فضای منفی در طراحی چیست؟

فضای منفی یا همان Negative Space تکنیکی قدرتمند در طراحی سایت است که به تازگی توجه بیشتری به آن شده است. در واقع نگاهی مینیمالیستی داشته و جزئی مهم در طراحی نوین است.

شباهت فضای منفی و سطح سفید

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

ماکرو و میکرو در فضای منفی

نیم فاصله در وردپرس

منتشرشده در آموزش طراحی سایت
یکشنبه, 21 تیر 1394 ساعت 12:33

رعایت نیم فاصله در وردپرس

رعایت اصول نگارشی مانند نیم فاصله و توجه به نکات دستور زبان در کنار پرهیز از غلط املایی، خواندن و درک یک نوشته یا مطلب را برای کاربران راحتتر میکند. با توجه به تفاوت های نگارشی میان زبان فارسی و انگلیسی امکان رعایت تمام اصول در سیستم های مدیریت محتوا وجود ندارد. مهمترین و پرکاربردترین سیستم مدیریت محتوا، وردپرس است و یکی از مشکلات نگارش فارسی در آن رعایت نیم فاصله هاست.
نیم فاصله یا به گفته ی ویکی پدیا فاصله مجازی نویسه ای در استاندارد یونی کد است و در مواردی که دو حرف به هم نمی چسبند ولی فاصله مرئی نیز ندارند بکار میرود. بعنوان مثال در کلماتی مانند “همسایه ها” یا “می روم” بهتر است که نگارش بصورت “همسایه‌ها” و “می‌روم” باشد.
در نرم افزارهای ویندوزی کلیدهای میانبر مشخصی برای استفاده از نیم فاصله در متن تعریف شده است که مهمترین آنها عبارتند از Alt+Shift+2 و Shift+Spacebar. ولی متاسفانه امکان استفاده از آنها در سایت و یا بخش ویرایشگر وردپرس وجود ندارد. نخستین راهی که به ذهن وبمستران برای حل این مشکل رسید استفاده مستقیم از کد تعرف شده برای نیم فاصله در استاندارد یونیکد بود که در واقع به شکل ” ‌” است. با قرار دادن این کد میان دو حرف یا دو کلمه در بخش ویرایشگر متنی (در ویرایشگر دیداری عمل نمیکند) عملکردی مشابه با نیم فاصله مشاهده خواهید کرد.
ولی مسلما برای نوشتن هر روزه، رعایت نیم فاصله با این کد کاری سخت و بیهوده خواهد بود و یا حتی اگر در نوشته های جدید خود رعایت کنید برای مطالب قبلی سایت کاری نمیتوان کرد. راه حل مناسب چیست؟

Responsive Design در طراحی سایت

منتشرشده در آموزش طراحی سایت
یکشنبه, 21 تیر 1394 ساعت 12:30

طراحی سایت Responsive

Responsive design به معنی طراحی یک سایت برای نمایش مناسب در تمام مرورگرها و دستگاه های احتمالی کاربران است. در این روش ظاهر سایت با توجه به ابعاد صفحه نمایش کاربر تغییر کرده و سایر بخش ها متناسب با آن تنظیم میشود. شاید 5 سال پیش که اثری از گوشی های موبایل هوشمند، تبلت و گجت های متنوع نبود نیازیبه Responsive design احساس نمیشد ولی با ورود مدل ها و برندهای متنوع و استقبال کاربران از این دستگاه ها طراحی سایت نیز دچار تغییراتی اساسی و مهم شد.

Responsive design چیست

تکنیک طراحی سایت Infinite Scrolling

منتشرشده در آموزش طراحی سایت
یکشنبه, 21 تیر 1394 ساعت 12:27

استفاده از Infinite Scrolling یا صفحات بی پایان تجربه کاربری بهتری به بازدیدکنندگان سایت شما خواهد داد. با این وجود در کنار برتری های استفاده از این روش در طراحی سایت میتوان معایب و اشکالاتی نیز در آن دید. با شناخت صحیح توانایی ها و مشکلات تکنیک Infinite Scrolling در طراحی سایت میتوانید تصمیم گیری بهتری برای بکارگیری یا چشم پوشی از آن بگیرید.
کاربران اینترنتی از دسترسی سریع به اطلاعات و راحتی کار با یک سایت لذت میبرند ولی استفاده نادرست از تکنیک Infinite Scrolling میتواند موجب سردرگمی آنها و یا خستگی از حضور در یک صفحه شود.

مزایای تکنیک Infinite Scrolling

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

تکنیک Infinite Scrolling

طراحی سایت روان چیست؟

منتشرشده در آموزش طراحی سایت
شنبه, 20 تیر 1394 ساعت 13:58

طراحی روان یا Liquid Design

انتخاب روش طراحی سایت و تکنیک شما در میان طراحی روان، ثابت یا Responsive بستگی زیادی به نوع فعالیت سایت، بودجه شما و میزان توجه به کاربران دارد. در این مقاله قصد داریم به معرفی تکنیک Liquid Design یا همان طراحی سایت روان پرداخته و معایب و مزایای آن را بررسی کنیم. در مقاله با عنوان طراحی سایت Responsive مزایا و کاربردهای این تکنیک روز بررسی و معرفی شده که پیشنهاد میکنیم آن را نیز مطالعه کنید.

زمانیکه یک سایت را برای طیف وسیعی از کاربران طراحی میکنید باید تفاوت های احتمالی میان بازدیدکنندگان را در نظر داشته باشید که شامل موارد زیر می باشد:

  • رزولوشن صفحه نمایش
  • نوع مرورگر شامل فایرفاکس، کروم، اینترنت اکسپلورر و…
  • تولبارهای اضافی نصب شده بر روی مرورگر کاربران مانند تولبار الکسا
  • سیستم عامل کامپیوتر کاربران

توجه به موارد بالا ممکن است کار یک طراح سایت را تا حد زیادی مشکل کند ولی در نقطه مقابل میتواند تاثیر بالایی در کارایی سایت و رضایت کاربران بهمراه داشته باشد. تکنیک طراحی سایت Liquid به این بخش توجه ویژه ای دارد.

فروشگاه ساز طراحی وب سایت شرکت طراحی وب سایت خبری طراحی وب سایت تخفیف گروهی طراحی وب سایت آگهی طراحی وب سایت شخصی

آیا نیاز به مشاوره دارید؟

مشاوره طراحی وب سایت

با ما در تماس باشید

گروه طراحی وب پویا
طراحی وب سایت
031-36612265 , 09133045663 , 09129252046
info@webpouya.com

نظر مشتریان طراحی سایت

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