Eyoz

Weekly #022


文章推荐

Making noisy SVGs

https://daniel.do/article/making-noisy-svgs

这篇文章讨论了在网页设计中使用带有噪点纹理的 SVG 图形的方法。作者通过使用 SVG 规范编写了一个简单的插图,其中包含噪点纹理效果。文章介绍了如何使用渐变、遮罩和滤镜来实现这种效果,并展示了最终的插图效果。

HTML: The Bad Parts

https://www.htmhell.dev/adventcalendar/2023/13

这篇文章讨论了 HTML 在可访问性和可用性方面存在的一些问题。作者列举了一些常见的问题,如 <select multiple><i> 元素、<ul><ol> 元素、title 属性、<datalist> 元素、<input placeholder><input type=number><input type=date>

CSS Frameworks vs Custom CSS – What’s the Difference?

https://www.freecodecamp.org/news/css-frameworks-vs-custom-css

这篇文章讨论了使用 CSS 框架和编写自定义 CSS 两种不同的应用 CSS 的方法。CSS 框架提供了预定义的样式和组件,节省了时间并保持一致性,但学习曲线较陡,可能会导致冗余代码和限制自定义设计。自定义 CSS 则提供完全的控制和更清洁的代码,但需要更多时间和经验。选择哪种方法取决于项目需求和个人能力,也可以结合两种方法使用。最终目标是创建质量高、易用性好的网站。

Finding the best way to create animated gradient borders in CSS

https://bejamas.io/blog/css-animated-gradient-border

本文介绍了在 CSS 中创建渐变边框并对其添加动画的几种方法。这些方法包括使用 border-imagebackgroundmask 以及 CSS Houdini 来实现动画效果。此外,作者还在文章中比较了每种方法的优缺点,并给出了选择最佳方式的流程图。

CSS Scroll Snapping Aligned With Global Page Layout: A Full-Width Slider Case Study

https://www.smashingmagazine.com/2023/12/css-scroll-snapping-aligned-global-page-layout-case-study

本文介绍了如何使一个全宽度的滑块组件与页面上的其他元素对齐。作者通过使用 CSS Scroll Snapping 技术,改进了一个简单的滑块,使其在滚动时能够停留在图片上。然后,作者探讨了如何在现有页面布局中实现滑块与其他元素的对齐,以及如何使用 CSS 变量来实现这种对齐。

工具介绍

Codify

https://codify.ghostkode.com

Codify 是一个可以将代码转化为美观图片的网络应用程序。它能够让用户以优雅的方式展示自己的项目,使自己的代码展示更有吸引力。

Firesnap

https://www.firessnap.com

Firesnap 是一个全能截图工具套件,可以轻松定制背景、阴影效果,并实现无限创意的无缝协作。用户可以自由选择背景颜色、渐变或自定义颜色,调整边距以达到完美的构图。

EnglishXYZ

https://englishxyz.com

EnglishXYZ 是一个可以将 YouTube 打造成个人英语学习教室的插件,它提供双语字幕、沉浸式学习、快捷查词和收藏等功能。可以通过鼠标悬浮在单词上来查看释义,并可以收藏单词以便日后复习。同时,插件还记录学习历程,并支持将已收藏的单词导入欧路词典。

//功能上和 Language Reactor 类似,不同的是后者支持网站多一些。

Github Worth

https://github-worth.vercel.app

Github Worth 是一个根据 GitHub 用户总贡献、总星标和总粉丝来估算其账号价值的工具。

//类似工具还有 Weekly #003 推荐的 Twitter Account Worth

Whisper Turbo

https://github.com/FL33TW00D/whisper-turbo

Whisper Turbo 是一个快速的、跨平台、支持 GPU 加速并且完全在您的浏览器中运行的 Whisper 程序。

Gemini Next Web

https://github.com/blacksev/Gemini-Next-Web

Gemini Next Web 是一个基于 GeminiPro 并且免费、隐私优先的在线聊天 AI 工具,支持多种语言和功能,具有一键部署、Markdown 支持、快速加载速度等特点,可满足用户的各种需求。

// ChatGPT Next Web 现在也支持 Gemini 了。

资源汇总

Betterfox

https://github.com/yokoffing/BetterFox

Betterfox 是一个针对 Mozilla Firefox 的 about:config 调整的工具,旨在提升浏览器的速度、安全性和隐私保护,同时保持简洁和易用性。它包括了一系列设置和建议,可以帮助用户优化他们的 Firefox 浏览器,并提供了一些可选的增强功能。

Just Laws

https://www.justlaws.cn

Just Laws 是一个简洁、便捷的法律文库,它提供了一个简洁且方便的平台,可以浏览和查询中国的法律文件。该文库具有清晰的结构和整洁的界面,提供了优雅、纯净、极致的阅读体验。

SearchEmoji

https://searchemoji.app

SearchEmoji 是一个支持 30 种语言的表情符号搜索引擎,可以通过关键字搜索或浏览分类来找到所需的表情符号。它提供了最大的全球表情符号收藏,用户可以预览并一键复制到文档、消息和社交媒体帖子中。

Comflowy 社区

https://www.comflowy.com/zh-CN

Comflowy 是一个致力于以 ComfyUI 和 Stable Diffusion 为核心,打造更优质生产工具的社区。社区提供系统的 Stable Diffusion 和 ComfyUI 教程,同时建立了 Workflow 和模型数据库,帮助用户分享和选择适用的 Workflow 和模型。此外,社区还计划提供一个开源版的 Better ComfyUI,改进用户体验,推动 ComfyUI 的发展。

A Hacker’s Guide to Git

https://wildlyinaccurate.com/a-hackers-guide-to-git

一份关于 Git 的入门指南,它解释了 Git 的核心概念,包括仓库、树对象、提交、引用和分支等,并强调了理解 Git 内部工作原理的重要性,以及如何使用 Git 的高级功能。

Python Tutorial for Beginners (with mini-projects)

https://www.youtube.com/watch?v=qwAFL1597eM

本教程是为初学者设计的完整的 Python 编程课程,课程包含了许多小型项目,让学习者能够立即将所学知识应用到实践中。课程内容涵盖了 Python 中的运算符、数据类型、用户输入、列表和元组、字典和集合、循环、函数、递归、作用域、闭包等基础知识,并且课程最合还包括了一个最终项目,帮助学习者综合运用所学知识。

随便看看

豆瓣 2023 年度读书榜单

https://book.douban.com/annual/2023

//22 年加入书架的书还没看完,23 年的就来了 😂。