ݺߣ

ݺߣShare a Scribd company logo
Responsive design
или новото чудо голямо
Що е то?



Подход към създаването на уеб сайт, така
че да бъде оптимално видим, лесен за
четене и навигация в голям набор от
различни устройства и екранни
резолюции - от десктоп монитор до
смартфон
Как изглежда?
Как става?


Вълшебните думички: CSS 3, Media
queries, fluid grids, flexible images

и

нов процес: research > define > content
priority guide > style prototype > final
design> code responsive templates >cms
integration > launch
Малко примери - от света


http://skinnyties.com/
http://www.indochino.com/
http://www.awwwards.com
http://www.anderssonwise.com/
http://www.whitelotusaromatics.com/
http://mashable.com/
http://www.bostonglobe.com/
http://mattkersley.com/responsive/
Малко примери - у нас


fibank.bg
http://parvite.com/successful-business/
http://www.bgsite.org/step/
kaksepishe.com
http://www.uxsofia.com/bg/
Откъде се взе?


- възход на мобилния уеб
- много устройства, много екрани, много
резолюции
- много версии на сайта
- Итън Маркот - 2009, 2010
Защо всички говорят за него?


- модерно - #2 в Top Web Design Trends
2012 от сп. .net
- интересно
- революционно (може би)
- решава реални проблеми
Кои проблеми решава?


User Experience
Usability
1 URL
По-бързо и изгодно от >2 специални
версии
Бъдещето
Кои проблеми създава?


User Experience - навикът

Usability - контекст, архив, навигация,
старите браузери
Кои проблеми създава?


Планирането на сайта - съдържанието,
навигацията, визиите, all content for all
context

Ами приходите от реклама? - RCD, IAB,
пример

Времето и цената за разработка? - около
1.5 разлика
Задължителен ли е?


В момента и за повечето сайтове - НЕ
 - сложно и скъпо
 - мобилните браузери се справят добре

... Но скоро и за следните случаи - ДА:
• - mobile first
• - сайтове на събития
• - сайтове предимно с текст - блогове,
  WP-базирани, новинарски
БЛАГОДАРЯ!

  Горица Белогушева
gbelogusheva@abcbg.com

More Related Content

Responsive design или новото чудо голямо

  • 2. Що е то? Подход към създаването на уеб сайт, така че да бъде оптимално видим, лесен за четене и навигация в голям набор от различни устройства и екранни резолюции - от десктоп монитор до смартфон
  • 4. Как става? Вълшебните думички: CSS 3, Media queries, fluid grids, flexible images и нов процес: research > define > content priority guide > style prototype > final design> code responsive templates >cms integration > launch
  • 5. Малко примери - от света http://skinnyties.com/ http://www.indochino.com/ http://www.awwwards.com http://www.anderssonwise.com/ http://www.whitelotusaromatics.com/ http://mashable.com/ http://www.bostonglobe.com/ http://mattkersley.com/responsive/
  • 6. Малко примери - у нас fibank.bg http://parvite.com/successful-business/ http://www.bgsite.org/step/ kaksepishe.com http://www.uxsofia.com/bg/
  • 7. Откъде се взе? - възход на мобилния уеб - много устройства, много екрани, много резолюции - много версии на сайта - Итън Маркот - 2009, 2010
  • 8. Защо всички говорят за него? - модерно - #2 в Top Web Design Trends 2012 от сп. .net - интересно - революционно (може би) - решава реални проблеми
  • 9. Кои проблеми решава? User Experience Usability 1 URL По-бързо и изгодно от >2 специални версии Бъдещето
  • 10. Кои проблеми създава? User Experience - навикът Usability - контекст, архив, навигация, старите браузери
  • 11. Кои проблеми създава? Планирането на сайта - съдържанието, навигацията, визиите, all content for all context Ами приходите от реклама? - RCD, IAB, пример Времето и цената за разработка? - около 1.5 разлика
  • 12. Задължителен ли е? В момента и за повечето сайтове - НЕ - сложно и скъпо - мобилните браузери се справят добре ... Но скоро и за следните случаи - ДА: • - mobile first • - сайтове на събития • - сайтове предимно с текст - блогове, WP-базирани, новинарски
  • 13. БЛАГОДАРЯ! Горица Белогушева gbelogusheva@abcbg.com