طراحی سایت فلت چیست؟

by | دسامبر 6, 2020 | دسته بندی نشده | 0 comments

[vc_row][vc_column][vc_column_text]طراحی سایت فلت[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content” el_class=”firstRowBackground”][vc_column width=”1/12″][/vc_column][vc_column width=”5/12″][vc_empty_space height=”64px”][vc_custom_heading text=”طراحی سایت فلت” font_container=”tag:h2|font_size:3rem|text_align:left|color:%23ffffff|line_height:4.5rem” use_theme_fonts=”yes” font_weight=”600″][vc_column_text]

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

[/vc_column_text][porto_info_box icon_type=”custom” img_width=”70″ icon_border_radius=”500″ title=”حانیه نوری” subtitle=”16 آذر 99″ title_font_color=”#ffffff” subtitle_font_color=”#f2f2f2″ desc_font_color=”#ffffff”]زمان مطالعه : 10 دقیقه[/porto_info_box][vc_btn title=”دانلود PDF” style=”custom” custom_background=”#e5e5e5″ custom_text=”#000000″ shape=”round” size=”xl” link=”url:https%3A%2F%2Ftabaneshahr.com%2Fwp-content%2Fuploads%2F2020%2F12%2F%D8%B7%D8%B1%D8%A7%D8%AD%DB%8C-%D8%B3%D8%A7%DB%8C%D8%AA-%D9%81%D9%84%D8%AA-%DA%86%DB%8C%D8%B3%D8%AA%D8%9F-1.pdf||target:%20_blank|”][/vc_column][vc_column width=”5/12″][vc_empty_space][vc_single_image image=”29022″ img_size=”full” alignment=”center”][/vc_column][/vc_row][vc_row][vc_column][vc_empty_space][vc_custom_heading text=”دیدگاه کوچکی به یک سایت فلت” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_single_image image=”31428″ img_size=”full” alignment=”center” label=””][vc_custom_heading text=”طراحی فلت چیست؟” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

طراحی فلت یک سبک مدرن از UI ( رابط کاربری ) و طراحی گرافیکی می‌باشد ، که در این سبک از طراحی شما باید از حداقل تعداد المان استفاده کنید و از رنگ های پیچیده ، گرادینت ها ، هایلایت ها ، رنگ های براق، تکسچر ها یا طرح های برآمده و سایه زدن ، استفاده نکنید. با تمامی این شرایط ، طراحی فلت آنقدر ها هم فکر می‌کنید ساده بنظر نمیرسد. در مجموع باید گفت که طراحی فلت کمک خواهد کرد که بیشتر تمرکز بر روی محتوا باشد و در عین اینکه در رعایت ساده بودن عناصر تاکید می‌کند ، باعث می‌شود که طرح ها پویاتر ، سریع و آسان برای استفاده باشند ، در سایت های فلت قسمت UX ( تجربه کاربری ) جز بسیار مهم و قابل اهمیتی است.

[/vc_column_text][vc_custom_heading text=”طراحی وب سایت فلت از کجا آمد؟” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

اول از همه ، بیایید بررسی کنیم که طراحی فلت وبسایت برای اولین بار از چه زمانی صورت گرفته است . طراحی UI تخت می تواند ریشه خود را به سبک سوئیس در دهه ۱۹۵۰ برساند، شکل اولیه طراحی گرافیک ! طراحی فلت اولین بار با نام Metro design ، توسط مایکروسافت معرفی شد ،  مایکروسافت در ویندوز 7 و 8 خودش از طراحی فلت استفاده کرد و دلیل آن هم داشتن UX ( تجربه کاربری ) خوب بود که نیاز کاربران را به راحتی تامین می‌کرد. Metro  یک سبک از ‌UI است که در آن همه چیز به صورت روشن و ساده و مدرن است . 

[/vc_column_text][vc_custom_heading text=”رنگ ها” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_single_image image=”31429″ img_size=”full” alignment=”center” label=””][vc_custom_heading text=”فونت ها” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_custom_heading text=”بالابودن قابلیت ریسپانسیو” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_row_inner css=”.vc_custom_1606290644118{background-color: #60509b !important;}” animation_type=”zoomIn”][vc_column_inner][vc_column_text]

برای نمونه ، چند آدرس سایت فلت را برایتان قرار می‌دهیم:  

flatuicolors.com

 flatcolor.ir

[/vc_column_text][/vc_column_inner][/vc_row_inner][vc_empty_space][vc_custom_heading text=”بایدها و نبایدهای طراحی سایت فلت :” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][vc_column_text]

  • نباید از رنگ های جیغ و براق استفاده کنید 
  • باید از آیکن های تخت و یا فلت استفاده کنید
  • نباید تمام فضا را پر کنید و مقداری از آن را خالی نگهدارید
  • باید از فونت های مناسب ، زیبا ، رسمی و بزرگ استفاده کنید
  • نباید از گرادینت استفاده کنید 
  • باید از رنگ های فلت استفاده کنید
  • نباید از رنگ های نامرتبط به هم استفاده کنید، تغییر رنگ نامحسوس باشد 
  • باید فونت  باریک و ساده و بدون stroke باشد
  • نباید از border ها استفاده کنید
  • باید متن و قسمت های مختلف را کاملا تخت بارگذاری کنیم و از bevel  دوری کنیم

[/vc_column_text][vc_custom_heading text=”معایب طراحی سایت فلت” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_custom_heading text=”محبوبیت برای موتورهای جستوجو” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][vc_custom_heading text=”آیکن های فلت” font_container=”tag:h4|text_align:left” use_theme_fonts=”yes”][vc_column_text]استفاده از آیکن های فلت و تخت باید جایگزین آیکن های دیزاین های دیگر شود و از این دسته آیکن ها باید استفاده کرد.[/vc_column_text][vc_single_image image=”31430″ img_size=”full” alignment=”center” label=””][vc_custom_heading text=”تفاوت طراحی فلت با متریال دیزاین” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][vc_custom_heading text=”در نهایت” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes”][vc_column_text]

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

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row”][vc_column width=”1/2″][vc_custom_heading text=”همین حالا برای طراحی سایت و ساخت اپلیکیشن اقدام کنید!” font_container=”tag:h3|text_align:left” use_theme_fonts=”yes” font_weight=”700″][vc_column_text]

شرکت طراحی سایت و اپلیکیشن تابان شهر در تمام زمینه های طراحی سایت و اپلیکیشن و ارائه خدمات مربوط به آنها در خدمت شماست

[/vc_column_text][vc_btn title=”مشاوره رایگان” style=”custom” custom_background=”#ffffff” custom_text=”#ffffff” shape=”round” size=”xl” align=”center” skin=”primary” link=”url:https%3A%2F%2Ftabaneshahr.com%2Fcontact-us1%2F|||”][/vc_column][vc_column width=”1/2″][vc_single_image image=”24739″ img_size=”full” alignment=”center”][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”آخرین مقالات” font_container=”tag:h2|text_align:center” use_theme_fonts=”yes” font_weight=”700″][porto_blog post_layout=”slider” post_style=”grid” columns=”2″ nav_pos2=”nav-pos-inside” nav_type=”nav-style-4″][/vc_column][/vc_row]

امروز شروع کن

تیم کارشناسان تابان شهر آماده ارائه مشاوره رایگان به شما هستند

در هر زمینه فعالیت دارید و در هر کجای آن به هر مشکلی خوردید شرکت تابان شهر می تواند در اون راه شما را همراهی یا اجرا کامل درخواست شما را داشته باشد

By حانیه نوری

دیگر مقالات تابان شهر

برترین امکانات و ویژگی های سایت شرکتی

[vc_row][vc_column][vc_column_text]برترین امکانات و ویژگی های سایت شرکتی [/vc_column_text][/vc_column][/vc_row][vc_row full_width="stretch_row_content" el_class="firstRowBackground"][vc_column width="1/12"][/vc_column][vc_column width="5/12"][vc_empty_space...

read more

اصلی ترین تفاوت سایت شرکتی و فروشگاهی را بشناسید

[vc_row][vc_column][vc_column_text]تفاوت سایت شرکتی و فروشگاهی[/vc_column_text][/vc_column][/vc_row][vc_row full_width="stretch_row_content" el_class="firstRowBackground"][vc_column width="1/12"][/vc_column][vc_column width="5/12"][vc_empty_space...

read more

0 نظر از شما عزیزان

0 Comments

Submit a Comment

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *