V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
qzhai
V2EX  ›  分享创造

我是怎么又开始做导航的

  •  1
     
  •   qzhai · 200 天前 · 2185 次点击
    这是一个创建于 200 天前的主题,其中的信息可能已经有所发展或是发生改变。
    我是一个非常喜欢看网页的人,但是跟大多数人不一样,我喜欢看的是网站的样式,动效,优化和细节。日积月累看的多了,因此每年我都会评选出一个当年我发现的非常不错的网站。
    我称之为 好看的皮囊

    比如这个 22 年 https://www.14islands.com/
    23 年: https://www.truestaging.co.uk/
    今年如果不出意外: 应该是 https://activetheory.net/

    我甚至并不是很关注这些网站内容具体是干什么。只是觉得某些动效或者想法值得借鉴。
    又或者我实在不知道具体实现方法是怎样的。这也许是一种职业病(因为我是个前端)。

    我这个爱好是从苹果发布第一代垃圾桶,我点开官网的介绍页开始的。不知道当年有没有也被惊艳过的,可以说是因为这个垃圾桶我才决定是个前端的。没想到从业以后,压根就没有遇到过类似的活让我做。

    有时候我会去看一个刚遇到的产品的官网,去看看他们官网的文章列表的图片是不是大于 1M ,结果经常会出现个 5M 以上的图。 不管是腾讯还是阿里也都出现过类似的问题。
    我们费尽心思的优化打包体积,拆分 js ,调整加载顺序。结果一个运营上传的原图就什么都白费了。

    但是在好的网站里,不光是这样的细节。比如苹果,以前新出的手机、pad ,网站会做非常多好看华丽流畅的动效,如果你仔细看,每一个素材都是做过处理。并且还是响应式。并且禁用 js 依旧可以正常展示内容。

    不管是什么,越优秀的东西往往就是让你忽视它的存在。

    这么些好的内容, 光放收藏夹是没有什么大用的。

    于是我开始写导航站,其实不是大家认知里的网址导航,可以算是个酷站集合。但是我的这个爱好太小众了。基本很早就凉凉了。所以还是要做一些正常一点的导航。

    后来,vue 2.0 发布了,我发现导航站非常适合拿来练手。每当我知道一个新的框架我都尝试写一个试试,WordPress ,angular ,react ,我都试过。用来提升经验确实很不错。

    直到有一天我渐渐地发现,导航的本质是及时的新内容,我的貌似一直在重构代码。
    虽然我建立之初安慰自己大不了就我自己用,但是,还是想有人用。

    所以我开始转变思路。(是今年才开窍的,之前因为域名没续费,域名都没得了,不得不换了个域名,从头开始)

    这次我做导航,定了几个基调

    1.做好 SEO 和性能 lighthouse ,web vitals 要绿,尽量满分
    虽然是导航站,但是依然要做 SEO ,并且要做好,所以这次选择的就是 WordPress 。
    虽然 wordpress 的性能口碑一直都不好,但好在我高中就在玩 dz 和 wp 了,算是有那么一点经验。但目前看来还挺不错的。




    2.要好看
    尽量符合我的审美,虽然我很喜欢看好的网站,但不一定自己能写的出来,毕竟我的活是还原设计稿,自己设计还真是需要有点水平的,但又要带点不一样的东西。最终的效果是这样的,小人的动画是网上的源码,我拿来修改了一下支持部分人说话,首页的小人会喊话一些热搜。其他页的小人会讲对应行业里的一些梗。我知道做这个一点毛线用没有,但我就是喜欢这种。。看上去就热热闹闹的感觉。(我想等 8.20 黑神话发售那天给每个小人镶一个金箍)



    3.内容尽量新鲜
    内容来源。这个我最不用担心,我可是一个光从一个网站顺着友链能看一天网站的人。
    其次,我还把一些比较容易获得新内容的网站都收录到导航里了。

    4.坚持更新内容。
    这个应该是最难得吧,在座的导航内容绝对没有自己的收藏夹内容多吧。是不是有一大堆跟我一样,发现一个网址放收藏夹,想着之后更新到导航里,后来就不了了之了。
    我的解决方案是,写了一个浏览器的插件,调用后能直接自动获取当前网页的 TDK 信息以及 icon ,并且可以拉取导航分类一键添加。这真的是大大的提高了我的收录速度。
    不光如此,我还单独做了处理,如果是公证号文章,可以一键获取公证号信息,steam 游戏也能一键获取游戏的信息。(因为我有公众号分区和游戏分区)主打的就是一个方便快捷。
    剩下的信息,比如网站的介绍和网站截图,(因为考虑到 SEO ,加上这些会好点),我在我本地的电脑里写了一个 node 的服务,会定期自动更新网站截图,网站介绍,我是接了 AI ,批量跑的。









    最终成品: https://n.mumingfang.com/

    比较特色的收录就是摸鱼板块,有自己的摸鱼站欢迎评论,我秒收录。
    https://n.mumingfang.com/my

    ——————

    其他
    因为用的是 wordpress ,方便做文章,所以我还在做一个实验,就是 AI 生成一些问答类的文章会不会被搜索引擎收录。我会通过站长之家、爱站、5118 这些词库里选一些疑问词库,然后基于某个 ai 生成文章,现在基本上是个半自动的状态,只要我输入关键字,就会自己生成自己发布。
    但是目前疑问类的都还没被收录,反而基于一些长尾词生成的垃圾文章都收录了。
    这个需要长期去做调研。
    33 条回复    2024-12-08 16:33:05 +08:00
    apple
        1
    apple  
       200 天前
    小人的设计挺有意思的,是什么开源代码吗?
    qzhai
        2
    qzhai  
    OP
       200 天前
    @apple 在一个动效网站上看到的,具体的地址没留~
    hccsoul326
        3
    hccsoul326  
       200 天前   ❤️ 4
    我以为你要做高德和百度
    PeterXx
        4
    PeterXx  
       200 天前
    大佬,麻烦可以收录一下这个室内设计渲染 AI 工具吗?谢谢
    www.kainoai.com
    bug51
        5
    bug51  
       200 天前
    有站外链接的 一般通过不了备案的了,所以这种网站没办法人手一个复制。

    看到下面只有 ICP 备案哦哦没事了。
    zhangjiashu2023
        6
    zhangjiashu2023  
       200 天前
    https://imgur.com/mVe8VKq 左上角首页显示 bug ,设备 m2 air 13 寸,建议搜索栏可以上移,背景纯白,人物可以下移,两者不要重合。
    jiguanqiang
        7
    jiguanqiang  
       200 天前
    大佬,麻烦可以收录一下这个设计素材吗?谢谢
    https://ilogo.fun/
    qzhai
        8
    qzhai  
    OP
       200 天前
    @zhangjiashu2023 哈哈~,还没开始适配 pad ,真的是很抱歉个~
    yyysuo
        9
    yyysuo  
       200 天前
    作为普通用户,看网站就是看信息,第一眼没有感兴趣的信息,或者非得找一下,基本上第 2 秒就关掉了。
    qzhai
        10
    qzhai  
    OP
       200 天前
    qzhai
        11
    qzhai  
    OP
       200 天前
    @yyysuo 感谢提醒
    qzhai
        12
    qzhai  
    OP
       200 天前
    @PeterXx 已收录
    qzhai
        13
    qzhai  
    OP
       200 天前
    @hccsoul326 是我造次了~~
    qzhai
        14
    qzhai  
    OP
       200 天前
    @bug51 自己注册个体户,备案走企业,方便的多~
    wanxiaoba123
        15
    wanxiaoba123  
       200 天前
    创建了一个 Midjourney --sref code 的精选网站 求收录~ https://midjourneysref.com/

    背景介绍:
    在 Midjourney 的 prompt 输入 --sref xxx ,可以固定生成某种特定风格的图片。这对很多人来说非常方便,不用写一堆效果词,只要记住几位数字就可以。
    但“--sref xxx”有大概 40 亿个左右,其中重复或者质量不佳的不在少数。因此做了一个网站把一些个人觉得不错的 sref code 收集起来并进行分类,方便新人或者设计师检索。
    chlinlearn
        16
    chlinlearn  
       200 天前 via Android
    值得一读技术博客 https://daily-blog.chlinlearn.top
    EmbraceQWQ
        17
    EmbraceQWQ  
       200 天前
    大佬 收录一下呗 https://www.toolcat.cloud/ 图片相关的工具站
    zhangjiashu2023
        18
    zhangjiashu2023  
       199 天前
    @qzhai 不是哦,这是 mac 电脑
    wbwm
        19
    wbwm  
       199 天前
    你小人跑那么快,是怕我看清楚他说的话吗?
    sunhuawei
        20
    sunhuawei  
       198 天前
    看得出来作者是有品味的,求收录摸鱼热榜站: https://rebang.today
    qzhai
        21
    qzhai  
    OP
       198 天前   ❤️ 1
    @sunhuawei 以收录
    CHTuring
        22
    CHTuring  
       198 天前   ❤️ 1
    @sunhuawei #20 不是,你的网站还要收录啊?我天天用来摸鱼...V2EX 真是什么作者都在啊。😂
    zhiyu1998
        23
    zhiyu1998  
       198 天前 via Android
    能不能问一个技术问题 那个搜索导航下人来人往是如何做的?
    qzhai
        24
    qzhai  
    OP
       198 天前
    @zhiyu1998 一个 canvas ,基于一张雪碧图,然后建个小人的类,随机走动
    zhiyu1998
        25
    zhiyu1998  
       198 天前
    @qzhai #24 有现成方案吗?直接复制粘贴的那种
    chenquincy
        26
    chenquincy  
       197 天前
    负载不行呀,已经挂了? ping 都没 ping 通
    ShayneWang
        27
    ShayneWang  
       197 天前
    打不开呀
    qzhai
        28
    qzhai  
    OP
       197 天前
    @chenquincy
    @ShayneWang
    ping 不通是因为服务器禁用了
    打不开是因为流量有点大上 cdn 了,现在已经可以了
    gouLang
        29
    gouLang  
       197 天前
    收藏了,支持一个
    zhiyu1998
        30
    zhiyu1998  
       184 天前
    佬,可以收录下我的《大橘和朋友们的周刊》(分享日常冲浪互联网看到好玩的网站、app 应用、资源分享、效率软件工具集等)吗?

    https://rrorangeandfriends.site/
    qzhai
        31
    qzhai  
    OP
       184 天前
    @zhiyu1998 已收录,我们也在做社区,欢迎来我们社区分享 https://mumingfang.com/
    zhiyu1998
        32
    zhiyu1998  
       184 天前
    @qzhai #31 ok
    xoxo419
        33
    xoxo419  
       19 天前
    感觉这个主题很清爽哇,是自己设计开发的吗,还有用的什么主题?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2629 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 04:13 · PVG 12:13 · LAX 20:13 · JFK 23:13
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.