V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
fourstring
V2EX  ›  前端开发

前端们都是如何设计网页的?

  •  
  •   fourstring · 2017-01-15 20:22:47 +08:00 · 3485 次点击
    这是一个创建于 2869 天前的主题,其中的信息可能已经有所发展或是发生改变。

    如题,有没有一个图形化设计工具?难道都是写多少多少像素吗???一直很感兴趣的一个问题

    24 条回复    2017-01-16 11:05:48 +08:00
    qiayue
        1
    qiayue  
       2017-01-15 20:27:06 +08:00
    手写 CSS
    fourstring
        2
    fourstring  
    OP
       2017-01-15 20:28:33 +08:00
    @qiayue 手写 CSS 的话,对某些属性值真的只能设置多少多少像素吗?人脑模拟网页显示效果?
    lwjcjmx123
        3
    lwjcjmx123  
       2017-01-15 20:29:13 +08:00 via Android
    浏览器调试啊
    binux
        4
    binux  
       2017-01-15 20:32:04 +08:00 via Android
    前端不设计网页啊
    DoraJDJ
        5
    DoraJDJ  
       2017-01-15 20:33:31 +08:00 via Android
    手写 CSS 和 HTML ,浏览器开着看效果。

    设计是设计师的事。
    fourstring
        6
    fourstring  
    OP
       2017-01-15 20:35:12 +08:00
    @DoraJDJ 啊。。。那设计师的设计稿怎么变成 CSS 呢?比如这个输入框长度有多少像素之类的
    yangxiongguo
        7
    yangxiongguo  
       2017-01-15 20:35:30 +08:00
    用浏览器的开发者工具,直接可以看到效果
    murmur
        8
    murmur  
       2017-01-15 20:43:39 +08:00
    设计个毛的网页 要么用模板 要么抄别的网站 要么实现设计稿
    感觉做程序员久了审美会扭曲
    所以干脆不相信自己 别人给什么稿子出什么页面 除非那种做出来要吃屎的
    Kilerd
        9
    Kilerd  
       2017-01-15 20:52:26 +08:00 via iPhone
    对于个人开发者来说,设计稿就是平时上课发呆的时候无聊画的。
    huihuimoe
        10
    huihuimoe  
       2017-01-15 21:12:54 +08:00 via Android
    《 30 天精通如何在 chrome 从 about: blank 做出一个完整的网页》 (逃
    qiayue
        11
    qiayue  
       2017-01-15 21:17:47 +08:00
    宽、高、字体大小、颜色、等等都是手工输入
    fourstring
        12
    fourstring  
    OP
       2017-01-15 21:21:52 +08:00
    @qiayue !!!真的是这样啊
    bdbai
        13
    bdbai  
       2017-01-15 21:29:18 +08:00 via Android   ❤️ 1
    设计师给个 psd 稿子,该有的信息都有了,前端只要切出素材、还原页面就行。所以以前前端有“切图仔”一称。
    fourstring
        14
    fourstring  
    OP
       2017-01-15 21:31:24 +08:00
    @bdbai 这样啊,明白
    designer
        15
    designer  
       2017-01-15 22:43:22 +08:00
    如果有图形化设计工具,恐怕前端工程师在这一方面的饭碗就给了设计师。
    同时前端就能省下时间去做一个高级的轮子。 2333
    bojackhorseman
        16
    bojackhorseman  
       2017-01-15 22:54:35 +08:00 via Android
    非要说的话倒也有,像 dreamweaver 这种,以前上大学老师就教我们用这个拖控件一样做网页,都不怎么教我们代码,后来会写代码了发现 dw 太 low 了而且极其低级。另,像素颜色啥的都是手写的😔
    murmur
        17
    murmur  
       2017-01-15 22:56:51 +08:00
    @designer 你真以为没这种东西么。。各大厂的内容发布不都是自己手拽? h5 的要多少有多少吧,连 wps 都带 h5 编辑器了,这东西终极目标就是个 powerpoint.js ,就看谁的动画牛逼谁的动画炫酷
    pc 端的奇葩的见过全是 position:absolute 的,不奇葩的就是 bootstrap 那套,就算没有设计器,满大街的模板几百块钱就买一套
    现在就看谁终结单页面应用,搞出个 react desinger 了
    qiayue
        18
    qiayue  
       2017-01-15 23:06:20 +08:00
    @murmur 有木有跟是否大家都用是两回事
    learnshare
        19
    learnshare  
       2017-01-15 23:14:25 +08:00
    Bootstrap 能干一大部分
    qa2080639
        20
    qa2080639  
       2017-01-15 23:32:49 +08:00
    写好 html 结构 开着 f12 打好样式代码 然后再保存到文件里面。实时预览
    lxrmido
        21
    lxrmido  
       2017-01-16 08:18:05 +08:00
    设计师在设计稿上标注像素值,或者前端自行发挥,赶时间的时候大多是自行发挥,这么多年下来对尺寸之类的基本是了然了。
    beilun
        22
    beilun  
       2017-01-16 10:16:43 +08:00 via iPad
    跟着感觉走,没感觉时,就用 bootstrap ,基本不会太难看
    qyc666
        23
    qyc666  
       2017-01-16 10:45:26 +08:00
    用 ps 画,画完用 Markman 标注,当然了,这应该是设计师的活,嘿嘿
    soli
        24
    soli  
       2017-01-16 11:05:48 +08:00
    设计网页是设计师的事儿。
    前端只负责造轮子。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2785 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 11:42 · PVG 19:42 · LAX 03:42 · JFK 06:42
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.