CSS – 网页设计 Web Design
前言
Web Design 很广很深. 我记得许多年前第一次想介入设计工作 (我是后端工程师), 我就上网搜索了一下.
就看见了乔布斯著名的一句话:
Design is not just what it looks like and feels like. Design is how it works.
我才明白, 为什么低端的设计师总是说: design 就是主观的啦, 我觉得美, 他觉得不美. 没办法丫.
那只是因为他们不了解 how it works.
我学设计的路程
设计很重要, 没有好的设计, 开发会变得很困难. 很多可以用设计解决的问题, 会因为设计师笨, 而加重开发维护成本. 尤其是交互设计.
2021 年 4 月我开始学习基本的设计, 比如使用 Figma, 读一些排版, 字体, 颜色, 交互的文章. 学的很浅, 但至少是开始了. 以前我很排斥学设计. 因为我有个伙伴是负责设计的. 分工呀.
但后来发现他真的很不靠谱, 许多设计问题都是混着过去的. 导致开发成本很重, 后来我才慢慢开始介入, 到现在完全由我负责. 真实开启了我系统学习的旅程.
这里顺便记入一下我目前的心得.
设计分很多类型
网页的前生是 company profile, catelog, flyer, 这些都属于平面设计的范围.
就是排版, 字体, 颜色.
但是网站又多了一些些交互 (nav, expand), 小动画, 表格等
后来又有了 RWD (Responsive Web Deisgn).
后来电子商务, booking 网站, 在线教育的出现, 连交互设计都被涵盖进来了.
于是 Web Deisgn 完全是一个独立的分支了.
这一篇我打算分 2 个部分来讲,
第一个是网页设计 (少量交互, 游览为主, 也包括轻量的电子商务网站),
第二个是 Web App 设计 (大量交互的).
TODO...
CSS – 网页设计 Web Design的更多相关文章
- HTML&CSS精选笔记_HTML与CSS网页设计概述
HTML与CSS网页设计概述 Web基本概念 认识网页 网页主要由文字.图像和超链接等元素构成.当然,除了这些元素,网页中还可以包含音频.视频以及Flash等. 名词解释 Internet网络 就是通 ...
- [转]如何设计自适应屏幕大小的网页 Responsive Web Design
随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...
- 2013年度最新最佳CSS网页设计实例
CSS在网页设计中扮演着举足轻重的角色,尤其是CSS3和HTML5的出现,让我们更加相信CSS能给我们带来无限的遐想和强有力的视觉冲击.今天我要给大家推荐几个最新CSS佳作,虽然本人没有设计头脑,但还 ...
- 快速完成网页设计,10个顶尖响应式HTML5网页模板助你一臂之力
为了寻找一个优质的网页模板,网页设计师和开发者往往可能会花上大半天的时间.不过幸运的是,现在的网页设计师和开发人员已经开始共享HTML5,Bootstrap和CSS3中的免费网页模板资源.鉴于网站模板 ...
- 自适应网页设计(Responsive Web Design)
引用:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html 随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面 ...
- 自适应网页设计(Responsive Web Design)(转)
随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...
- (转)自适应网页设计(或称为响应式web设计)(Responsive Web Design)
随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...
- 自适应网页设计(Responsive Web Design)(转)
作者: 阮一峰 出处:http://www.ruanyifeng.com/blog/2012/05/responsive_web_design.html 随着3G的普及,越来越多的人使用手机上网. 移 ...
- 阮一峰:自适应网页设计(Responsive Web Design)别名(响应式web设计)
随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...
- 自适应网页设计(Responsive Web Design)别名(响应式web设计)转载阮一峰
随着3G的普及,越来越多的人使用手机上网. 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机的屏幕比较小,宽度通 ...
随机推荐
- 使用SVG做模型贴图的思路
大多数情况下,三维模型使用PNG,JPG作为模型的贴图,当然为了性能优化,有时候也会使用压缩贴图来提高渲染效率和较少GPU压力. 今天提供一种新的思路,使用SVG作为模型的贴图,可以达到动态调整图片精 ...
- php.ini文件与php.d
`php.ini` 是 PHP 的主要配置文件,用于全局配置 PHP 的行为和功能.它包含了许多 PHP 的核心设置,如内存限制.错误报告级别.扩展加载等. `php.ini` 文件通常位于 PHP ...
- 顺序表之单链表(C实现)
// Code file created by C Code Develop #include "ccd.h"#include "stdio.h"#includ ...
- Django model 层之聚合查询总结
Django model 层之聚合查询总结 by:授客 QQ:1033553122 实践环境 Python版本:python-3.4.0.amd64 下载地址:https://www.python.o ...
- ABC348
A link 这道题就先输出整个的\(oox\),再输出剩一个两个的. 点击查看代码 #include<bits/stdc++.h> using namespace std; int n; ...
- 新年恭喜发财-scratch编程作品
程序说明: <新年-恭喜发财>是一个基于Scratch平台制作的动画贺卡项目.该项目通过编程和艺术设计,展现了浓厚的中国新年(2024年为龙年)氛围,以及传统的恭喜发财祝福.动画中包含有喜 ...
- JDK安装教程(Windows)
Windows 端: 1. 安装 首先进入官网:https://www.oracle.com/java/technologies/javase-downloads.html 因为我已经安装了 JDK8 ...
- Miniconda 切换python版本
要在 Miniconda 中切换 Python 版本,可以按照以下步骤进行操作: 打开命令提示符或者 Anaconda Prompt(如果已经安装了). 输入 conda info --envs 查看 ...
- 【Vue】 vue-element-admin 路由菜单配置
路由说明见官方文档: https://panjiachen.gitee.io/vue-element-admin-site/zh/guide/essentials/router-and-nav.htm ...
- 深度学习框架 MindSpore —— 华为出品的AI计算框架, docker 安装
深度学习框架 MindSpore -- 华为出品的AI计算框架 官网地址: https://www.mindspore.cn/ 源代码地址: https://gitee.com/devilma ...