菜单
优设网uisdc.com
优设网 - UISDC
首页
设计文章
热门频道
网址导航
培训课程
教程与灵感
设计工具
关于我们
联系我们
文章投稿
意见反馈
广告商务
会员
开通优设VIP星球
尊享13项VIP特权
持续新增
主题打卡挑战
21天带练!告别无效练习
接私单赚外块
VIP优先接,累计金额超百万
优设私房课免费学
价值178元热销课程
你的私人律师
每月可免费咨询30次
开通VIP
领取更多设计师实用特权
投稿
搜索
您还未登录
登录后即可体验更多功能
立即登录
文章收藏
资源下载
提问答疑
我要投稿
响应式设计 话题
首页
设计文章
响应式设计
职场
收录136篇文章
干货
收录152篇文章
版式设计
收录189篇文章
优设大课堂
收录132篇文章
设计流程
收录148篇文章
1 / 3
到第
Go
页
神器推荐
想做响应式测试?试试这个超好用的在线测试神器!
本文介绍的神器可以协助开发者测试网页在移动设备、平板电脑的呈现效果,内建一些常见设备的屏幕尺寸比例,也可自订大小或横向显示。
2021/07/16
土拨鼠
响应式
UI
1.3w
Lyft设计总监:移动端响应式设计的高效方法
约束布局是定义控制应用中内容的规则。这些规则通过使用统一的元素和间距,保持跨平台、跨环境和跨屏幕大小的一致性。通常应用在 iOS 和 Android 中。
2021/07/14
土拨鼠
响应式设计
UI
2.9w
B 端响应式界面应该怎么做?这篇教程超详细!
本文从B端的响应式概念、响应式规则解析和响应式使用建议三个方面,帮你完整掌握B端响应式界面设计。
2021-01-27
酸梅干超人
B端
UI
4.4w
用一篇文章,帮你看懂网页响应式布局原理
本文从响应式页面是什么、响应式布局的规则、响应式的设计流程三个方面,帮你彻底掌握网页的响应式设计原理。
2020-08-20
土拨鼠
响应式
UI
2.2w
腾讯出品!超实用的响应式设计技巧
本文梳理了响应式设计的方法流程,记录问题与思考,帮助以后类似的项目开展更快。
2020-07-30
土拨鼠
响应式
UI
7.4w
这份上万字的指南,帮你学会用栅格系统构建响应式设计
在响应式设计中使用栅格系统是非常重要的,但实际项目中栅格系统到底怎么样运用呢?用一篇万字干货帮你掌握,如何利用栅格系统构建优秀的响应式设计。(文末附作者绘制的 5 套栅格系统库福利~)
2020-04-02
土拨鼠
ui设计
网页
5.1w
可能是最容易看懂的响应式知识科普
本篇文章希望能通过简单明了的文字及图文介绍,对我们设计响应式网站时经常会出现的问题进行清晰的说明。
2019-11-19
土拨鼠
58UXD
UI
9.4w
超全面总结!如何利用栅格系统做响应式设计?
@UX-BOY :本文主要与大家分享如何利用栅格系统完成后台页面响应式设计,介绍响应式设计的思路与方法。一、什么是响应式?按照本人自己的理解,响应式就是通过合理的设计方案配合规范的技术实现策略,使同一个 Web页面在各个终端(设备)不同分辨率屏幕上都能有最佳的用户体验。
2018-10-04
程远
后台产品设计
酷站推荐
1.4w
酷站两连发!收录日本都市图片素材库+响应式在线预览网站
编者按:今天给大家推荐两个网站。一个是专门收录日本几个大城市街景为主的图库网站,可以自由使用于个人或非商业用途。另一个是用来检视自适应设计的免费在线工具。
2017-11-05
程远
响应式网页设计
前端开发
2.7w
这些响应式网页测试工具确保你的设计万无一失
响应式设计几乎是当代网页设计的基础构成之一。在实际设计和开发的过程中,想要让网站按照设计响应不同尺寸屏幕,设计师和前端需要花费相当的时间来进行测试和优化。所以,今天我们搜集了7款功能强大的响应式页面测试工具,下面就一一介绍一下。
2017-10-25
陈子木
响应式
教程
3.6w
超全面!移动端响应式的7种UI布局解析
Tony(作者):响应式 UI能够使我们设计的元素在任何大小屏幕尺寸能够灵活适配,保证布局和体验的一致性。毫无疑问,响应 UI 设计对于现今碎片化的屏幕是非常重要的,它能使我们在最小的资源的情况下完成设计适配,它的工作原理通过断点系统来判断读取布局方式,断点其实就是媒体查询值。比如我们平时做的 Phone 和 Pad 的适配就是通过设定断点来让程序读取对应的布局(断点设定可以根据屏幕分辨率或者屏幕尺寸),今天就和大家聊聊一些常用的响应式 UI 模式常用的布局模式流线布局等比缩放拓展布局分栏布局流动布...
2017-09-04
程远
响应式
教程
1.9w
跨屏幕的响应式设计,你需要这样来设计用户体验
现在的响应式的设计已经很成熟了,一整套设计方案,小到智能手表的屏幕,大到电视显示屏,还兼顾到更普遍存在的智能手机、平板和电脑屏幕。在很多人看来,跨屏幕的响应式设计,只是一套内容调整大小就可以“适配”了,但实际上,它所牵涉到的因素非常的复杂:设计师需要通过设计让内容在不同的平台上体验最大化,确保让用户在任何一个屏幕上看到内容的时候,会觉得这些内容就是为这个平台而设计的,而不是单纯的缩放而来。这种无缝的体验,才是跨屏幕设计的真正难点所在。
2017-07-04
陈子木
响应式
教程
2.8w
浅谈思路!七个技巧帮你搞定响应式网页中的图片设计
响应式网页设计已经是如今当之无愧的标准配置了,我们需要响应式的技术来应对日渐碎片化的屏幕尺寸,网页设计师也力图做好这件事情。而网页中的图片和图库的响应式设计,也是其中的重点难点。它们是网页中最常见,也是最直观可见的元素。
2016-09-13
陈子木
响应式图片
教程
1.3w
翻天覆地!带你总结互联网设计圈这十年的巨大变迁
编者按:互联网带来的变化是翻天覆地的,这种变化不仅仅表现在它对于外部世界、对于我们生活的影响,它本身的转变则显得更加巨大。而设计领域在互联网的影响之下,变化也非常的明显,也许看了今天的总结,你也会为这种改变而惊叹。十年前的互联网,和现在非常的不一样。
2016-09-01
陈子木
iPhone
教程
2.2w
小心无大错!响应式网页图片库设计的九个注意事项
响应式设计无疑是当前网页设计领域当中,不可忽略的必要组成部分。而响应式网页中的图片显示又是老生常谈的问题,许多争论集中在响应式网站的图片应当怎么展示。继续延伸开来,那么响应式网站中的图片库应当如何设计呢?
2016-03-23
陈子木
响应式图库
教程
3.3w
建站福利!帮你5分钟建一个响应式动态网站的Carrd
让建站像搭积木一样简单!今天要介绍的 Carrd 是近期上线的免费建站服务,只要几个简单步骤就能快速设计出美观特色的响应式网站。我花了不到五分钟就做了一个优设网的简介,而且还有动态效果!
2016-03-22
程远
Carrd
教程
2.1w
腾讯干货!响应式图像终于有超赞的解决方案了!
JACE:自从2010年Ethan Marcotte开始讨论响应式网页设计,开发者和设计师们竞相寻求处理响应式图片的方法。这的确是一个棘手的问题 ,因为我们对同一个网站在众多设备宽度下,使用同一图像源。你愿意在一个大显示屏上显示模糊地、马赛克状的图像?
2016-03-22
程远
响应式图片
酷站推荐
2.0w
建站福利!提供超多HTML5+CSS3响应式网页模版免费下载的酷站
今天介绍的HTML5 UP! 提供大量的HTML5 模版,而且这些模版都支持响应式网页设计,有了它我们就不用从无到有、从头到尾来打造一个网站,而是直接就现有的样版去做修改或调整,让建网站难度降低许多,也减少花费的时间和开支。来收!因为自适应网页设计在开发上较为繁琐,一般很少免费提供下载的网站,但 HTML5 UP! 收录一系列共 28 种网页设计,通通都是 HTML5+CSS3 并有响应式设计功能,网站采用的授权方式为 Creative Commons 姓名标示 3.0,也就是说你可以自由分享、修改...
2016-02-23
程远
css3
酷站推荐
1.5w
建站利器!提供超多高质量响应式网页模版的HTML5 Zero
HTML5 Zero 收录来自各个网站的网站模版资源,不过它并不是以数量取胜,而是精挑细选后的结果。在这网站上收集的模版都支持响应式网页设计,也就是能够依照不同的浏览画面尺寸,自动调整、弹性变化为适合阅读的使用体验。网站收录的模版类型除了部分能直接套用于 WordPress、Bootstrap 外,还有近期相当流行的 Material Design,也可以透过颜色、类型、标签等方式来筛选你要寻找的免费网站模版。
2016-02-13
程远
响应式网页设计
教程
1.9w
腾讯干货!手把手带你深入学习Viewport和PX
编者按:今天这篇腾讯游戏七宝同学的干货,不仅给同学们科普了绝对/相对长度单位、屏幕尺寸/分辨率/像素密度、PPI/DPI/SP/PX等一系列基础术语,还对移动页面重构最重要的知识点Viewport作了深入讲解,全程专业干货,设计师收!刚开始接触移动页面重构,是不是很迷惑应该按照多大的尺寸制作?320、640还是720?
2015-11-07
程远
px
教程
2.4w
专业干货!超实用的响应式排版快速指南
@励定洲 :无论是对于印刷、网站或是电视广告来说,排版都是我们用来沟通信息的主要方式。排版之重要性我想已无须赘述。然而,“理解”和“实践”还是相差十万八千里的,特别是在网页设计中,“一个字号走天下”的想法可以歇歇了。
2015-10-12
程远
响应式布局
教程
2.5w
设计小科普!给设计师的模块化设计新手完全入门指南
扁平化设计流行起来之后,现代简约风与之结合产生了许多视觉上以区块为主的网页设计作品。对于设计师而言,这种设计方式既时尚,又富于功能化,网站结构流畅、简单,与响应式的设计也有着天然的兼容性。这种设计趋势的出现,追根溯源就是模块化设计。
2015-08-14
陈子木
优秀网页设计
下载
2.1w
省时高效!9款超实用的响应式导航插件下载
为了适应手机版的网站,网站导航都需要逐一优化,今天分享9款最新的响应式导航菜单插件,帮你节省大量时间 >>>Mmenu这个mmenu插件除了能实现手机侧边栏菜单外,它设计的2级菜单效果也很棒,就像是iPhone的设置菜单一样,可左右滑动展开。还有更多强大功能,比如为菜单加上图标,展开的方式等等。在线DEMO | 下载插件DrawerDrawer的响应式菜单带有多种不同类型的展开方式,从右边、左边、上边、固定等。
2015-05-09
程远
响应式设计
教程
1.4w
再加速!五大技巧帮你提速响应式网页设计项目
没有哪个成功的Web项目是在设计师和开发无法流畅沟通的前提下搞定的,协作才是做好项目的基础。我曾看到经验丰富的设计师和开发者因为沟通不畅和误会导致项目失败,也见过新手设计师和开发团队一起通过高效协同,做出惊艳无比的设计项目。在项目之初充分的磨合,能让项目在后续的快速迭代中更为流畅。
2015-04-30
陈子木
响应式图片
教程
1.9w
实用干货!聊聊3种最常见的响应式设计问题
@十萬個為什麽 :本文重点讨论设计师遇到最多的3个响应式设计问题,也会提供一些规避错误的策略 >>>响应式设计方法对开发者非常有用,因为它使我们的内容在各种设备上广为传播。不用保留几个独立版本的网站,也可以摒除诸如缩放和流式布局这些方法的弊端。缩放、流式布局与响应式这些术语容易造成混淆,设计师常常错误地交替互用。
2015-04-30
程远
响应式图片
教程
2.8w
布局专攻文!如何搞定响应式网页的布局设计?
编者按:作为今年大热的设计趋势,响应式已然是设计师的标配技能。今天阿里的同学从响应式设计的布局类型、布局实现两方面深入讲解,有哪些实现布局的方式,该采用何种方式,都有相当专业细致的解答,不多说,来收 >>>Heyuchan :在谈响应式布局前,我们先梳理下网页设计中整体页面排版布局,常见的主要有如下几种类型:布局类型:布局实现采用何种方式实现布局设计,也有不同的方式,这里基于页面的实现单位而言,分为四种类型:固定布局、可切换的固定布局、弹性布局、混合布局。固定布局:以像素作为页面的...
2015-03-04
程远
响应式布局
教程
3.0w
超级干货!深聊Material Design复杂响应式设计
编者按:Material Design初出茅庐,现在大多数是试水之作,刚好近期有同学接手了一个响应式Web站点的改版设计,笔者参考Material Design总结以下三点,关于如何实现复杂响应式站点的Material Design,希望对大家有帮助。说到Material Design,有一篇强烈推荐:《重磅教程!帮你全面彻底搞定MATERIAL DESIGN的学习笔记》2011年,Gmail邮箱的按钮变得更加扁平化。
2015-02-21
程远
Material Design
教程
1.7w
经久不衰!聊聊响应式设计的现状与趋势
从2012年开始到2014年,各大家对Web设计的趋势预测中,都提到响应式设计。2015年网页设计趋势预测中,响应式仍在继续。这个经历了几年依然大热的响应式,在过去的几年里,快速巩固了自己的地位,并掀起了一股网页设计新标准的浪潮。
2015-01-04
程远
响应式设计
酷站推荐
2.0w
步步为营!20款覆盖全面的响应式网站设计工具
灵活的栅格和布局,响应式的图片和智能的CSS媒体查询,构成了响应式网页的主要特征。当用户扔下沉重的笔记本电脑拿起平板,响应式的网站能够自然而然地随之适配,掏出手机也毫无压力,图片和文字都会随着特定的屏幕和分辨率而调整,这就是它的优势。你以为这就完了?
2014-12-26
陈子木
响应式设计
前端开发
1.5w
响应式不是万能的!教你提升响应式设计的移动性能(一)
你调整了浏览器,笑容攀上脸颊。你感到非常开心,认为自己实现了友好移动的目标。在正式讨论前,让我来预测下未来:你会失掉用户和经济效益,如果你把响应式网页作为唯一目标和唯一的解决办法。
2014-08-11
程远
响应式设计
1/3
1
2
3
下一页
前往
Go
页
大家都在看
交互设计
文章 734
立即查看
App设计
文章 262
立即查看
UI
文章 145
立即查看
设计史
文章 142
立即查看
神器推荐
文章 359
立即查看
优秀网页设计
文章 582
立即查看
视觉设计
文章 175
立即查看
职场经验
文章 158
立即查看
神器下载
文章 129
立即查看
优设读报
2022年07月01日 星期五
01
爱玛换新 LOGO,出自国际著名苹果 LOGO 设计师之手
02
天猫 App 上线「数字藏品」专区,买盲盒送同款数字藏品
03
App Store 新规生效:应用必须内置「删除账号」功能
04
优衣库 UT 推出海贼王剧场版联名新品
05
喜茶携手《梦华录》推出联名特调
查看全部
图标设计
至少20个图标设计杀手级干货
查看专题
专题
已有185.3w位观众
已收录
31
篇持续更新
可直接转代码!超实用的免费SVG图标管理工具: SVGSUS
51498 人阅读
两分钟认识一款优雅的图标管理工具:Nucleo
36275 人阅读
细节
B站的「素质三连」skr啥?
经常看小电视家视频的同学,一定都听过up主说「欢迎大家多点赞,多投币,多关注」。所谓B站的「素质三连」,通常是指观众看完视频内容后对up主进行的「点赞」「投币」和「收藏」三个操作。其实B站特别贴心的为用户们设计了一个「一键三连」的操作。
2018-10-30
AmberDu小白
Bilibili
设计问答
全部问答
如何拒绝朋友帮个忙的设计要求?
邀请你来回答
人情世故,亲戚朋友间互相帮忙是应该的。但不能一味的帮助别人
我来回答
优设琅琊榜
查看全部
2.0w
1/9
用5年时间来寻找自己独特风格!杨权的作品正在惊艳更多人
犬儿
人群中画画的仔
设计神器
全部神器
让Figma变成交互原型神器!ProtoPie这个插件官方都推荐过!
神器推荐
免费转换超过 300 种常见影音格式的「Online Video Converter」
神器推荐
先收藏!27款最新的实用设计工具合集
神器推荐
第三波!2022年5月精选实用设计干货合集
神器推荐
课程
爆款课程!零基础C4D实战就业班
涨薪指数
技能点 · C4D
涨薪必备
名师亲授
课程
如何快速创作火爆全网的手绘作品?
涨薪指数
技能点 · 手绘插画
私单涨薪
必备技能
课程
插画学到什么程度,才够接私单赚钱?
涨薪指数
技能点 · 手绘插画
接单涨薪
快速入门
课程
为什么阿里和OPPO超爱这类插画风格?
涨薪指数
技能点 · 手绘插画
高效实战
百万人气
求职招聘
发布职位
漫画插画师
武汉
学历不限
1-3年
6k-8k
优设内容编辑
武汉
本科及以上
1-3年
8k-10k
UI设计师
北京
学历不限
1-3年
15k-25k
查看全部
行业新闻
发布行业新闻
6月版 Studio 驱动支持 Blender 3.2 等创意应用中的工作流
品牌资讯
设计赋能,共绘未来!2022 海南国际设计岛海口专场推介会成功召开
活动赛事
无科技,不广汽!“科技奔现”2022广汽科技日举行
活动赛事
查看全部
热门频道
设计专题
热门设计知识精挑细选
查看专题
细节猎人
1分钟小短文揣摩设计真谛
查看猎人
优设读报
行业资讯一站知晓
查看读报
优设琅琊榜
顶尖设计作品聚集地
查看榜单
行业新闻
行业大事小事全知道
查看新闻
设计问答
高手大咖在线答疑解惑
查看话题