侯体宗的博客
  • 首页
  • 人生(杂谈)
  • 技术
  • 关于我
  • 更多分类
    • 文件下载
    • 文字修仙
    • 中国象棋ai
    • 群聊
    • 九宫格抽奖
    • 拼图
    • 消消乐
    • 相册

CSS 文件命名规则

前端  /  管理员 发布于 7年前   397

遇到一个很实际的问题:由于不想增加目录的深度,减少磁盘寻址的时间,需要减少一些目录层级。

 

大家都知道建立文件夹是为了让文件管理更加的方便,现在需要减少文件夹,如何保持文件管理的方便就成为必需解决的。很容易我们想到通过命名来解决这个问题,那是不是随便一个命名都能起来方便管理的作用呢?样式的命名规则是否适用?对于样式的命名,在《 [更新] 样式命名规则 》已经有讨论,可是样式的命名规则并不能被应用到文件的命名中,毕竟使用的环境不太一样,要解决的问题也不太一样。样式命名要解决的是名称语义化,通过名称能知道这个定义的作用范围;而文件的命名要解决的是更方便的找到对应的文件,当然如果名称有意义,也会有帮助,更重要是要解决同一文件夹下如何更快找到文件。

怎样才能更快找到需要的文件呢?操作系统通过路径能正确找到对应的文件,因为在每一层目录里,所有的标记(目录名、文件名)都是唯一的。而我们找一个文件,一般会需要下面的信息:

  • 文件名(叫什么,一般这个信息会有缺失)
  • 文件类型(图片?样式?页面?还是什么?)
  • 所在域名、栏目的位置(在哪个地方?)
  • 什么时间修改过
  • 路径(就算知道了,一般也不是直接就能使用的,需要层层点击)

对于电脑来说,它并不需要目录名或文件名多容易看懂,只要符合命名规则、同一层级下唯一就可以。但对于我们来说,更希望能通过命名知道更多的信息,因此需要命名有一定的意义。回到一开始的问题,如果当前就在最后的一层目录里,面对那么多的文件,如何更方便找到需要的文件?没错,通过排序可以将文件进行分类,最常用的排序有三种:

  • 文件名(以每个字母从A-Z的顺序排序)
  • 按修改日期(以文件的修改日期为排序条件)
  • 按文件类型(先将文件以类型分类,同类文件再以文件名排序)

为了更好的让排序发挥作用,文件的命名就需要有一些规则。文件名的组成大家应该清楚吧?一般格式为“名称.扩展名”。扩展名也是文件名的一部分,但这部分比较固定,没有什么可发挥的。前面“名称”的部分是我们讨论的重点。发散下思维,我们可以想到添加一些相对固定的词来起到分类的作用,我们称之为“缀”,从位置上可分为“前缀”和“后缀”。

常用的缀:预设目录名、文件类型、域名、日期、版本号

例如名称为“demo”,加上前缀或后缀的形式如下:
预设目录名:css_demo |demo_css
文件类型:png_demo | demo_png
域名:blog_demo | demo_blog
日期:20090904_demo | demo_20090904
版本号:v1_demo | demo_v1

前缀的作用:区分同一类型的文件名,由于操作系统的排序规则(同一类型的文件以文件名排序),因此前缀能很好的起到区分的作用。比较符合阅读的习惯。缺点是如果使用键盘导航(直接使用键盘可以跳到对应字母的文件位置),由于前缀相同,会有一定的影响。

后缀的作用:后缀一般用于版本的控制,像存档、多版本、备份等等。缺点是如果名称过长,不太直观。

 

我们来看看两种方式的差别在哪:

 

 

 

上面几个图是将添加了前缀和后缀的文件放到同一目录下,分别使用三种排序的结果。由于模块化的制作方式,文件一般会以模块为单位分布,使用前缀的时候往往会因为文件类型不一样使同一模块的文件被分散到不同的位置,而使用后缀反而可以很好的将同一模块的文件归到一起。从上面的图可以看出这点。因此在这种情况下,使用后缀会更方便于文件的查找。


  • 上一条:
    CSS 样式命名规则
    下一条:
    CSS 背景全攻略
  • 昵称:

    邮箱:

    0条评论 (评论内容有缓存机制,请悉知!)
    最新最热
    • 分类目录
    • 人生(杂谈)
    • 技术
    • linux
    • Java
    • php
    • 框架(架构)
    • 前端
    • ThinkPHP
    • 数据库
    • 微信(小程序)
    • Laravel
    • Redis
    • Docker
    • Go
    • swoole
    • Windows
    • Python
    • 苹果(mac/ios)
    • 相关文章
    • 使用 Alpine.js 排序插件对元素进行排序(0个评论)
    • 在js中使用jszip + file-saver实现批量下载OSS文件功能示例(0个评论)
    • 在vue中实现父页面按钮显示子组件中的el-dialog效果(0个评论)
    • 使用mock-server实现模拟接口对接流程步骤(0个评论)
    • vue项目打包程序实现把项目打包成一个exe可执行程序(0个评论)
    • 近期文章
    • 在windows10中升级go版本至1.24后LiteIDE的Ctrl+左击无法跳转问题解决方案(0个评论)
    • 智能合约Solidity学习CryptoZombie第四课:僵尸作战系统(0个评论)
    • 智能合约Solidity学习CryptoZombie第三课:组建僵尸军队(高级Solidity理论)(0个评论)
    • 智能合约Solidity学习CryptoZombie第二课:让你的僵尸猎食(0个评论)
    • 智能合约Solidity学习CryptoZombie第一课:生成一只你的僵尸(0个评论)
    • 在go中实现一个常用的先进先出的缓存淘汰算法示例代码(0个评论)
    • 在go+gin中使用"github.com/skip2/go-qrcode"实现url转二维码功能(0个评论)
    • 在go语言中使用api.geonames.org接口实现根据国际邮政编码获取地址信息功能(1个评论)
    • 在go语言中使用github.com/signintech/gopdf实现生成pdf分页文件功能(0个评论)
    • gmail发邮件报错:534 5.7.9 Application-specific password required...解决方案(0个评论)
    • 近期评论
    • 122 在

      学历:一种延缓就业设计,生活需求下的权衡之选中评论 工作几年后,报名考研了,到现在还没认真学习备考,迷茫中。作为一名北漂互联网打工人..
    • 123 在

      Clash for Windows作者删库跑路了,github已404中评论 按理说只要你在国内,所有的流量进出都在监控范围内,不管你怎么隐藏也没用,想搞你分..
    • 原梓番博客 在

      在Laravel框架中使用模型Model分表最简单的方法中评论 好久好久都没看友情链接申请了,今天刚看,已经添加。..
    • 博主 在

      佛跳墙vpn软件不会用?上不了网?佛跳墙vpn常见问题以及解决办法中评论 @1111老铁这个不行了,可以看看近期评论的其他文章..
    • 1111 在

      佛跳墙vpn软件不会用?上不了网?佛跳墙vpn常见问题以及解决办法中评论 网站不能打开,博主百忙中能否发个APP下载链接,佛跳墙或极光..
    • 2016-10
    • 2016-11
    • 2017-06
    • 2017-07
    • 2017-08
    • 2017-09
    • 2017-10
    • 2017-11
    • 2018-03
    • 2018-04
    • 2018-05
    • 2018-06
    • 2018-09
    • 2018-11
    • 2018-12
    • 2019-02
    • 2020-03
    • 2020-04
    • 2020-05
    • 2020-06
    • 2021-04
    • 2021-05
    • 2021-07
    • 2021-08
    • 2021-09
    • 2021-10
    • 2021-11
    • 2022-08
    • 2022-09
    • 2022-10
    • 2022-11
    • 2022-12
    • 2023-01
    • 2023-02
    • 2023-03
    • 2023-04
    • 2023-05
    • 2023-06
    • 2023-07
    • 2023-09
    • 2023-10
    • 2023-11
    • 2023-12
    • 2024-01
    • 2024-02
    • 2024-03
    • 2024-04
    Top

    Copyright·© 2019 侯体宗版权所有· 粤ICP备20027696号 PHP交流群

    侯体宗的博客