SVG сүрөттөрүнө негизделген мыкты веб-сайттар

SVG мыкты желе

The SVG сүрөттөрү тармактар ​​тармагын толтурууда Ошентип, бир нече жыл ичинде, биз жалпы желе тажрыйбасын жакшы көрө алабыз. Жана сүрөттөлүштүн бул түрү, аныктамада эч кандай сапатын жоготпостон чоңойтуу мүмкүнчүлүгүнөн тышкары, адатта, дээрлик килобайт маалыматтар болуп саналат.

SVG - форматы 2D графика үчүн XML негизиндеги вектордук сүрөт. Бул графикалык формат ар кандай эффекттер, сүрөттөр, анимация жана интерактивдүүлүк үчүн колдонулуп, интеграцияланган веб-сайттарда көбүрөөк ыңгайлуулук берет. Салмагы аз болгондуктан, бул иш-аракеттердин түрлөрү менен ойноого мүмкүнчүлүк берет, ошондуктан биз SVG графикасы бар мыкты веб-сайттарды илхам катары кызмат кылышыбыз керек же кийинки жасоону кантип жасоонун айкын мисалы катары көрсөтөбүз. кардар же жумуш үчүн.

Жөө жүргөндөр агенттиги

Эркектер басуу

SVG сүрөттөрүн пайдалануу үчүн абдан таң калыштуу веб-сайт менен өзүн көрсөткөн санариптик дизайн агенттиги визуалда абдан өзгөчө тийүү үчүн. Эч күмөнсүз, шыктандырган адам. Кызыл чекитке айланган көрсөткүч көзгө урунат, ал желе түзгөн элементтердин ар бирине ылайыкташат.

Популярдуу төлөмдөр

Популярдуу төлөмдөр

Ошол хэштегдерди камтыган эң сонун дизайндагы веб-сайт "калкыма терезелер" катары көрүнөт жана алар эч качан ушул сайт сунуш кылган көрүнүштү жана тажрыйбаны басаңдатышпайт. Алдыга берилиши мүмкүн болгон сүрөттөрдүн өзүлөрү "жеген" айрым хештегдер.

Адриансен

Адриансен

Негизги себеби видео болгондуктан, ал PNG сүрөттөрдү кантип бириктирүү керектиги кызыктуу биз ылдый жылдырганда көрсөтүлгөн текст менен.

10 × 17

10x17

Рухтун жетеги менен жазылган веб-сайт кээ бир анимациялар менен сиздин сонун идеяңыз алардын мазмунун алга жылдырганда, алар бир калыпта жылышат. Бүгүнкү күндө веб-дизайндагы чоң жетишкендиктер болуп саналат жана ал 10-жылы сүйүктүү музыкалык альбомдорун түзгөн 17 сүрөтчүнү көрсөтүү максатында 26 × 2017ге барабар.

Duotix

Duotix

Жөн гана жогорку оң жагында үч горизонталдуу тилкеси бар сүрөтчөнү чыкылдатыңыз менюну чагылдырган кылдат жана жылмакай анимацияларды табуу бул веб-сайттын баш аты. Сайттагы анимацияны кантип тастыктоонун эң сонун мисалы.

Copper & Brave

Copper & Brave

Интернет дүкөнү көп шуулдабай анимацияларда, бирок бул SVG сүрөттөрү менен иштөөнүн дагы бир мисалы болуп саналат.

Рока

Рока

Испаниядан бизде Рока бар сонун түстүү өтүү бул веб-сайттын мазмунун чычкан дөңгөлөгү менен изилдегенде жасалат. Бардык анимациялар менен кооз тажрыйба.

Paradiso

Paradiso

Веб-дизайн анын элементтеринин жөнөкөйлүгүн улуу колдонууга издейт Paradiso сунуш кылган бул сонун веб-тажрыйбада көрсөтүлгөн анимациялардын бир бөлүгүндө тапкычтыкты колдон чыгарбай, толугу менен. Анимацияда жаратманын жогорку деңгээлдеги менюсу эмне менен бүткөндүгүн дагы бир жолу баса белгилейбиз.

Нөл

Нөл

Менен бардык ниетин көрсөткөн Нью-Йоркто жайгашкан чыгармачыл студия биздин алдыбызда ачылган каптал башынын менюсу бир катар анимациялар жана абдан жагымдуу сүрөттөр менен. Эгер сиз веб-сайтыңыз үчүн уникалдуу меню издесеңиз, анда Zero компаниясынын жетеги менен буга чейин илхам ала аласыз. Чычкан көрсөткүчүн анын ар бир варианты боюнча жылдырганда, ушул түстүү сүрөттөр жана анимациялар пайда болот.

Архитектор Париж

архитек

Анын жүктөө экраны жана анын көрктүү формасы кызыктуу акыркы твиттерди, Facebookтагы билдирүүлөрдү көрсөтүү же Instagramдагы сүрөттөр. Веб-экспериментке татыктуу веб-сайт.

Redspace долбоору

Долбоору

Кытай мегаполистеринде убакытты алмаштыруу идеясын камтыган жана ошол эле нерсени көрсөтүү чеберчилигин камтыган долбоор анын өчүп бараткандыгы жана градиенттери менен акылдуу түс схемасын колдонууда. Жогорку сапаттагы анимациялар жана чеберчилик менен пайда болгон жана жоголгон чоң сүрөттөр. Бул көрө албастык.

Табо Табо Фильмы

Табо

Көрсөтүүчү француз кинотасмаларын жана сериалдарын өндүрүүчү компания заматта өзгөртүү менен видеодогу чоң күч категориялардын ар биринде чычкан көрсөткүчүн басып туруу менен. Веб-дизайн менен тажрыйба жүргүзүү кандай экендигин билүү үчүн, алардын ар бирин ачыңыз.

Джеймс Гиллен

Джеймс

Бул веб-сайтта эки негизги түстөр колдонулат туура контраст түзүү өзүн таануу. Ошондой эле, ал ар дайым кыймылда болгон фондун анимациясы менен айырмаланат.

Киз

Киз

Zen Studio бул веб-сайтты бизге дүйнөгө белгилүү сүрөтчү жана бул вебдин максималдуу мисалы: интерактивдүү видео клип, анда биздин көрсөткүч эксклюзивдүү анимацияны башкарат. Essential.

Spiritualist

Spiritualist

Колдонуучу Бразилияда жайгашкан консалтинг фирмасы көшөгө катары анимациялар ар бир кызматыңызды көрсөтүү үчүн. Жөнөкөй, бирок бош фон үчүн жашыл жана көк түстөрдү колдонууда натыйжалуу.

дивел

дивел

Дагы бир визуалдык тажрыйбага негизделген сары жана кара, жана бул кыйроолорду көрсөтүүгө чоң таасир берет.

Оливье Гиль

Olivier

Frontend портфолиосу а веб көндүмдөр сериясы бул эч кимди кайдыгер калтырбайт.

La Clairiere

Claire

А менен иштөө мейкиндиги максат жашыл түскө коюлган. Ошол жылмакай жана так кыймылдын жардамы менен негизги орунду ээлеген айкын типография үчүн көз жоосун алган анимациялар. Меню сүрөтчөсүн изилдөө сунушталат.

Камсыздандыруу тажрыйбалары

камсыздандыруу

Желе жагымдуу жана бейкапар айтылгандан көп нерсени издебөө.

Европалык Техникалык Мамлекет

Европа

Эгер сиз каалаган кошумча менюлары бар веб-сайт башкалардан өзгөчөлөнүп турган нерсени карап көрүңүз, алар ошол мейкиндиктерди, алардын сезимдерин жана анимацияларын түшүнүүнүн мыкты жолу менен тажрыйба жүргүзүшөт.

Каппов

Каппов

 Веб-дизайндагы чоң баалуулукту көрсөткөн санарип агенттик көрүүгө болот күлкүлүү анимация чычкан көрсөткүчүн анын "K" үстүнөн өткөргөндө.

Buffy Comfortters

Buffy

Деп баса белгилеген дагы бир жөнөкөй веб-сайт коллаж түрү биз ылдый жылдырганда биздин алдыбызда ачылат.

Alps Mleko

Альпско

Колдонгон белгилүү словакиялык бренд сүт жылдыруу аркылуу чалгындоо татыктуу жана көз жоосун алган интернет тажрыйбасын көрсөтүү. Жок дегенде кызык.

Pacificandco

Тынч океан

Испаниялык Herokid студиясы бизге ушул веб-сайттын дизайнын алып келет кара, сары жана бир катар видеолору менен айырмаланат Алар тажрыйбанын мыкты көрктүүлүгүн көрсөтүшөт.


Макаланын мазмуну биздин принциптерге карманат редакциялык этика. Ката жөнүндө кабарлоо үчүн чыкылдатыңыз бул жерде.

3 комментарий, өзүңүздүкүн калтырыңыз

Комментарий калтырыңыз

Сиздин электрондук почта дареги жарыяланбайт.

*

*

  1. Маалыматтар үчүн жооптуу: Мигель Анхель Гатан
  2. Маалыматтын максаты: СПАМды көзөмөлдөө, комментарийлерди башкаруу.
  3. Мыйзамдуулук: Сиздин макулдугуңуз
  4. Маалыматтарды берүү: Маалыматтар үчүнчү жактарга юридикалык милдеттенмелерден тышкары билдирилбейт.
  5. Маалыматтарды сактоо: Occentus Networks (ЕС) тарабынан уюштурулган маалыматтар базасы
  6. Укуктар: Каалаган убакта маалыматыңызды чектеп, калыбына келтирип жана жок кыла аласыз.

  1.   Ship21 ал мындай деди:

    Nave21.com изилдөөсүндө биз SVGге эң жакшы вариант катары көп убакыттан бери коюм туудуруп келе жатабыз. Биз сүйөбүз! жана кардарлар да.

  2.   Гильермо Замаррипа ал мындай деди:

    Ovisoft жарнамасы инвазивдүү жана бул макаланы туура көрүүгө мүмкүнчүлүк бербейт. Абдан жаман, жакшы маалымат камтылган жакшы макала.

    1.    Manuel Ramirez ал мындай деди:

      Аларды шилтемелерден ачып, өз башыңыздан өткөрсөңүз болот: =)