Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Web design

197 vues

Publié le

Web design - trends 2019-2020

Publié dans : Internet
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Web design

  1. 1. Доц. М. Иванова
  2. 2.  Какво е уеб сайт?  Aрхитектура на уеб сайт  Съвременни технологични решения  Различни приложения на уеб сайтове 2
  3. 3. Уеб сайт - дефиниция  Уеб сайтът е колекция от уеб страници, изображения, аудио/видео файлове и други обекти, които се хостват от един или повече уеб сървъри, достъпни през Интернет  Уеб страницата е документ, обикновено написан на HTML, който е достъпен през протокола HTTP, чрез който се предава информацията от уеб сървъра до уеб браузъра на потребителя 3
  4. 4. Видове уеб сайтове  Малък  линеен  йерархичен  Средно голям  йерархичен  използа база от данни  Голям  използва база от данни  използва система за управление на съдържание  използва система за управление на учебно съдържание 4 начална страница страници на основни секции подстраници на секциите
  5. 5. Предназначение на уеб сайтове  Лични уеб сайтове  Информационни  Корпоративни  Блогове и онлайн дневници  Форуми  Онлайн магазини и сайтове за търгове  Онлайн списания  Сайтове за съхраняване и споделяне на файлове  Социални мрежи  Търсещи машини  Портали, директории, жълти страници 5
  6. 6. Използване на ограничен, но подходящ цветови набор  Color Combinations & Web Design: What You Need to Know- https://www.minimist.ca/articles/color-combinations-amp-web-design-what-you-need-to-know  50 Gorgeous Color Schemes – https://visme.co/blog/website-color-schemes/  How to Choose a Good Color Scheme For Your Website – https://www.websitebuilderexpert.com/designing-websites/how-to-choose-color-for-your-website/  7 Rules for Website Color Schemes – https://websitesetup.org/website-color-schemes/ Color Schemes Generator – https://coolors.co/
  7. 7. Изкуствен интелект и ботове  Алгоритми за изкуствен интелект – събиране и анализиране на информация, решаване на проблеми; използване на чатботове – за комуникация с потребителя и отговор на проблеми
  8. 8. Подходящ типографски стил  https://uxplanet.org/10-tips-on-typography-in-web-design-13a378f4aa0d  https://www.toptal.com/designers/typography/web-typography-infographic  Fonts: https://websitesetup.org/web-safe-fonts-html-css/
  9. 9. Използване на векторна графика  SVG (Scalable Vector Graphics)  Adding vector graphics to the Web https://developer.mozilla.org/en- US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web  The Advantages of Using Vector Graphics for Website Creation https://www.templatemonster.com/blog/vector-graphics-website-creation/  Vector images https://www.awwwards.com/websites/vector/
  10. 10. Използване на анимации и микроанимациии  https://digitalsynopsis.com/design/gif-icons-menu-transition-animations/  https://uxplanet.org/boost-your-web-design-different-types-of-web-animations-67d84feb59ff  https://www.intechnic.com/blog/30-creative-website-examples-of-css-animation/  Зареждащ екран, динамичен фон, динамична страница, динамично меню, динамична галерия
  11. 11. Използване на анимации и микроанимациии
  12. 12. 3D графика
  13. 13. Разказ на история в уеб дизайна  https://usabilla.com/blog/10-ways-to-incorporate-storytelling-in-web- design/  https://www.webfx.com/blog/web-design/online-storytelling-methods/  Текст, изображения, графика, анимация, фон, вертикален плъзгач
  14. 14. Линии, кръгове, геометрични форми, шаблони  Комбиниране на форми и шаблони върху уеб страницата  Използване на декоративни елементи и опростени форми  2D изображенията продължават да са актуални
  15. 15.  https://www.theochocolate.com/
  16. 16.  https://www.theochocolate.com/
  17. 17.  http://www.mrchocolate.com/
  18. 18. Ярки цветове  Ярки цветове в съчетание с плосък дизайн и използване на материали на обектите  Правилно комбиниране на цветовете  Избягване на агресивни цветове
  19. 19.  http://www.adobe.com/
  20. 20. Цветови комбинации  http://blog.visme.co/website-color-schemes/  https://designschool.canva.com/blog/website-color-schemes/
  21. 21. Асиметричен дизайн
  22. 22. Уникални изображения и графики  Графични илюстрации
  23. 23. Изображения в съдържанието на уеб страницата
  24. 24.  https://www.musicbed.com/
  25. 25.  https://www.aace.org/conf/elearn/
  26. 26.  https://www.toyota.com/
  27. 27.  http://www.hop.uk.com
  28. 28.  http://www.theflowerstudio.com/
  29. 29.  https://www.hallmark.com/cards/
  30. 30.  http://www.propago.com/
  31. 31. Икони  https://www.ibm.com/
  32. 32.  https://www.ibm.com/
  33. 33.  http://www.solarwinds.com/
  34. 34.  http://www.solarwinds.com/
  35. 35. Икони  https://www.toyota.com/
  36. 36. Икони  http://www.rizn.info/
  37. 37. Икони  https://www.sketchapp.com/
  38. 38. Професионални социални мрежи
  39. 39. Добавена реалност
  40. 40. Отделяне на горната секция
  41. 41. Отделяне на горната секция
  42. 42. Проста навигация  Постоянна навигация –навигацията да бъде на едно и също място върху всички страници от сайта, с лесна достъпност  Инлайн хипервръзки (хипервръзки в текста) трябва да са видими и откроими от останалия текст
  43. 43. Инлайн хипервръзки – различими от останалия текст
  44. 44. Брой колони  Колко текстови колони са необходими?
  45. 45. Лого  https://digitalsynopsis.com/design/top-logo-design-trends-2019/
  46. 46. Отзивчив дизайн - най-напред проектиране на уеб страница за мобилни устройства Отзивчив дизайн – съдържанието да достигне до по-голям брой потребители, независимо от вида на използваното устройство, операционна система или браузър  https://www.zazzlemedia.co.uk/blog/digital-design-trends/#gref
  47. 47. Отзивчив дизайн  Възможност за преглеждане на уеб страницата от различни устройства  Разработва се един сайт и се преглежда на лаптоп, телефон, таблет – спестяват се средства
  48. 48. Литературни източници  https://www.minimist.ca/articles/web-design-trend-predictions-for-2020  https://www.sitejet.io/en/article/10-exciting-web-design-trends-for-2020  https://mobiteam.de/en/the-future-of-web-design-2019-2020-top-3- trends/  https://merehead.com/blog/8-main-trends-of-web-design-2020/  https://sondoramarketing.com/blog/2020-web-design-trends/  https://www.theedigital.com/blog/web-design-trends

×