دسته بندی: طراحی وب

راهنمای واحدهای نسبی در CSS

راهنمای واحدهای نسبی در CSS

در این پست قصد داریم واحدهای اندازه گیری نسبی یا relative را در css معرفی کنیم. برخلاف واحدهای مطلق، ماند پیکسل px، واحدهای اندازه گیری نسبی: relative units نسبت به یک چیز دیگر اندازه را مشخص می کنند. این چیزی که واحدهای نسبی بر اساس آن ارائه می شوند می تواند فونت سایز المان والد باشد، یا عرض div والد باشد یا ارتفاع viewport باشد. واژه length در هر دو نوع واحدهای نسبی و مطلق مشترک است اما در واقع واحد length به چه معناست؟ فونت سایزهای نسبی یا relative font-size مانند rem و […]


آموزش وسط چین کردن المان در CSS

آموزش وسط چین کردن المان در CSS

فرقی ندارد شما قالب وب سایت تان را توسط فریم ورک های CSS مانند بوت استرپ طراحی کنید یا خودتان از ابتدا کدنویسی کنید. داشتن یک دانش ابتدایی از html و css ضروری است. زیرا امکان این را خواهید داشت که قالب وب سایت را شخصی سازی کنید. یکی از چالش انگیزترین مباحث در شخصی […]


تمام آنچه که باید درباره بوت استرپ ۵ بدانید!

تمام آنچه که باید درباره بوت استرپ ۵ بدانید!

محبوب ترین فریم ورک فرانت اند در سال های اخیر که می توان توسط آن دیزاین های مدرن و واکنش گرا (responsive)، رابط کاربری داینامیک و صفحات وب حرفه ای طراحی کرد در حال بروز شدن به نسخه 5 است. فریم ورک bootstrap شامل کدهای css، js و جی کوئری رایگان برای طراحی وب سایت […]


قبل از رونمایی سایت جدید چه نکاتی را باید رعایت کنیم؟

قبل از رونمایی سایت جدید چه نکاتی را باید رعایت کنیم؟

  رونمایی و بهره برداری از یک وب سایت جدید می تواند استرس زا باشد. حتی برای افراد مجرب. یک وب سایت جنبه های مختلفی دارد و ممکن است هنگام رونمایی از یک وب سایت جدید برخی از فاکتورها نادیده گرفته شود. مانند لینک های شکسته یا کلمات با غلط املایی. البته برخی از اشتباهات […]


قواعد اساسی طراحی رابط کاربری یا UI Design

قواعد اساسی طراحی رابط کاربری یا UI Design

  اگر شما از دانش مقدماتی در کدنویسی HTML و CSS برخوردار هستید و می خواهید یک رابط کاربری یا UI: User-Interface جذاب و کاربرپسند طراحی کنید، این مقاله مناسب شماست. در این مقاله مهارت های شما را در زمینه طراحی رابط کاربری ارتقا می دهیم و 7 قاعده اساسی و مهم زیر را آموزش […]


۶۵ کلید ترکیبی صفحه کلید برای میانبر زدن در فتوشاپ!

۶۵ کلید ترکیبی صفحه کلید برای میانبر زدن در فتوشاپ!

معرفی کلیدهای میانبر فتوشاپ Photoshop Photoshop Keyboard Shortcuts اهمیت استفاده از کلیدهای میانبر در فتوشاپ: آیا تابحال شده ساعات زیادی را در نرم افزار فتوشاپ سپری کنید و سرعت پیشرفت کارتان کم باشد؟ برای من اتفاق افتاده است. این کارها در واقع شاید حرفه ای و وقت گیر نباشند، مانند Crop کردن تصویر و یا […]


معرفی بهترین دیزاین های صفحه اصلی سایت

معرفی بهترین دیزاین های صفحه اصلی سایت

معرفی بهترین دیزاین های صفحه اصلی سایت Best Website Homepage Design Examples   ویژگی های یک صفحه اصلی مناسب: صفحه اصلی یا Home Page هر وب سایتی، به این دلیل که اولین تاثیر (First Impression) را روی کاربران می گذارد، از اهمیت بسیار بالایی برخوردار است. برای هر کسب و کار آنلاینی، صفحه اصلی سایت […]


دکمه فراخوان عمل یا Call To Action و نحوه تعریف آن

دکمه فراخوان عمل یا Call To Action و نحوه تعریف آن

دکمه فراخوان عمل یا Call To Action و نحوه تعریف آن Call-To-Action (CTA) Tips دکمه های فراخوانی عمل (CTA: Call-To-Action) در همه جای وب حضور دارند. تمام بنرها، پست های بلاگ و مقالات در انتها به یک لینک “اقدام فراخوانی” یا “Call To Action” ختم می شوند. وقتی ما محتوایی را در سایت منتشر می […]


۵ ابزار ساده برای طراحی یک وب‌سایت

۵ ابزار ساده برای طراحی یک وب‌سایت

5 ابزار ساده برای طراحی یک وب سایت 5 easy tools to build a website لزوم داشتن وب سایت برای کسب و کارها: هر نوع کسب و کاری برای ارائه محصولات/خدمات خود به وب سایت نیاز دارد. قبلا برای داشتن یک وب سایت نیاز بود از یک طراح و برنامه نویس وب کمک می گرفتیم […]


۱۰ اشتباه مرگبار در طراحی وب‌سایت

۱۰ اشتباه مرگبار در طراحی وب‌سایت

10 اشتباه مرگبار در طراحی وب‌سایت The 10 Mistakes in Website Design در این مقاله قصد داریم ده اشتباه مرگبار و خطرناک در امر طراحی وبسایت را معرفی کنیم. اگر شما بعنوان طراح وب سایت بتوانید از این اشتباهات اجتناب کنید، سایت تان از رقبا به مراتب موفق تر خواهد بود. اشتباهات خطرناک در امر […]


مقدمه طراحی وب یا وب دیزاین:

طراحی وب به جنبه های بصری و قالب وب سایت مربوط می شود. طراحی وب (Web Design) با مفهوم توسعه وب (Web Development) گره خورده است. حتی اگر شما خودتان را یک فرد خلاق تصور نمی کنید، پیشنهاد می شود طراحی وب را یاد بگیرید. چه بخواهید یک وب سایت استاتیک طراحی کنید و چه یک وب اپلیکیشن داینامیک، طراحی قالب وب سایت یک امر ضروری است.

لزوم طراحی مناسب وب سایت:

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

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

 

فرآیند طراحی وب سایت:

روند طراحی سایت با طراحی قالب روی کاغذ (sketch) یا توسط نرم افزارهای مربوطه مانند فتوشاپ آغاز می شود. سپس قالب طراحی شده روی کاغذ یا فتوشاپ را به کدهای css و html تبدیل می کنیم. صفحات وب با کدنویسی HTML-CSS طراحی می شوند. HTML برای ایجاد ساختار و اسکلت بندی صفحات وب بکار می رود و CSS برای استایل دهی به این ساختار است.

 

طراحی ریسپانسیو قالب وب سایت:

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

 

در دسته بندی “طراحی وب” مقالات و تکنیک هایی در زمینه طراحی وب سایت را ارائه می دهیم. مانند: آموزش طراحی صفحات تماس با ما و صفحه اصلی سایت، تکنیک فضای خالی در طراحی وب، طراحی قالب پارالاکس و…