为什么日本的网站看起来如此不同

news2024/12/23 11:28:30

首发于公众号 大迁世界,欢迎关注。📝 每周一篇实用的前端文章 🛠️ 分享值得关注的开发工具 😜 分享个人创业过程中的趣事

该篇文章讨论了日本网站外观与设计的独特之处。作者指出日本网站设计与西方设计存在明显差异。文章首先强调了日本网站的视觉风格,包括丰富的色彩、可爱的角色和复杂的排版。作者解释了这种风格背后的文化和历史因素,包括日本的印刷传统和动漫文化。

文章还讨论了日本网站的信息密集型布局,这种布局适应了日本语言的特点,使得页面能够容纳大量文字和图像。此外,文章提到了日本网站的功能丰富性,如弹出式窗口和互动元素,以及这些元素在用户体验方面的作用。

作者强调了日本网站在技术和创新方面的进步,尽管在过去存在技术限制。最后,文章提出了一些关于如何将日本网站设计的元素应用到其他文化中的建议。

下面是正文~~~

多年来,我朋友与日本的网站有过许多接触——无论是研究签证要求、计划旅行,还是简单地在线订购东西。而我花了很长时间才适应这些网站上的大段文字、大量使用鲜艳颜色和10多种不同字体的设计,这些网站就像是直接冲着你扔过来的。

image.png

虽然有许多网站都采用了更简约、易于导航的设计,适应了西方网站的用户,但是值得探究的是为什么这种更复杂的风格在日本仍然盛行。

只是为了明确起见,这些不是过去的遗迹,而是维护的网站,许多情况下,它们最后一次更新是在2023年。

image.png

我们可以从几个角度来分析这种设计方法:

  • 字体和前端网站开发限制
  • 技术发展与停滞
  • 机构数字素养(或其缺乏)
  • 文化影响

与大多数话题一样,很可能没有一个正确的答案,而是这个网站设计是随着时间的推移而相互作用的各种因素的结果。

字体和前端网站开发限制

对于会一些基本排版知识、掌握适当软件并有一些空闲时间的人来说,为罗马化语言创造新字体可能是一项有趣的挑战。然而,对于日语来说,这是一个完全不同层次的努力。

要从头开始创建英文字体,需要大约230个字形——字形是给定字母的单个表示(A a a算作3个字形)——或者如果想覆盖所有基于拉丁字母表的语言,则需要840个字形。对于日语而言,由于其三种不同的书写系统和无数的汉字,需要7,000至16,000个字形甚至更多。因此,在日语中创建新字体需要有组织的团队合作和比其拉丁字母表的同行们更多的时间。

这并不令人意外,因此中文和(汉字)韩文字体也面临着类似的工作量,这导致这些语言通常被称为CJK字体所覆盖。

由于越来越少的设计师面对这个特殊的挑战,建立网站时可供选择的字体也越来越少。再加上缺乏大写字母和使用日文字体会导致加载时间较长,因为需要引用更大的库,这就不得不采用其他方式来创建视觉层次。

以美国和日本版的星巴克主页为例:

美国的:

image.png

日本的

image.png

就这样,我们就可以解释为什么许多日本网站倾向于用文字较多的图片来表示内容类别了。有时,你甚至会看到每个磁贴都使用自己定制的字体,尤其是在限时优惠的情况下。

image.png

技术发展/停滞与机构数字素养

如果你对日本感兴趣,你可能对现代与过时技术之间的鲜明对比有所了解。在许多地方,先进的技术与完全过时的技术并存。作为世界机器人领导者之一的国家,在台场人工岛上放置了一座真人大小的高达雕像,却仍然依赖软盘和传真机,面对2022年Windows资源管理器关闭时感到恐慌。

image.png

在德国,前总理安格拉·默克尔在2013年称互联网为“未知领域”后,遭到全国范围的嘲笑。然而,这在2018年被前网络安全部长樱田义孝轻易地超越,他声称自己从未使用过电脑,并且在议会被问及USB驱动器的概念时,他被引述为“困惑不解”(来源)。

对于那些尚未有机会窥探幕后幻象的人来说,这可能听起来很奇怪,但日本在技术素养方面严重落后于更新计划。因此,可以推断这些问题也在阻碍日本网站设计的发展。而具体来说,日本的网页设计正面临着这一挑战——只需在谷歌或Pinterest上搜索日本海报设计,就能看到一个非常不同和现代化的平面设计水平。

image.png

文化影响

在分析任何设计选择时,不应低估文化习俗、倾向、偏见和偏好的影响。然而,“这是文化”的说法可能过于简单化,并被用作为各种差异辩解的借口。而且,摆脱自己的观点偏见是困难的,甚至可能无法完全实现。

因此,从我们的角度来看,看这个网站很容易…

image.png

感觉不知所措,认为设计糟糕,然后就此打住。因为谁会使用这个混乱不堪的网站呢?

这就是因为无知而导致有趣的见解被忽视的地方。现在,我没有资格告诉你日本文化如何影响了这种设计。然而,我很幸运能够从与日本本土人士的交谈中获得启发,以及在日本工作和生活的经验。

与这个分析相关的一次对话实际上不是关于网站,而是关于YouTube的缩略图 - 有时候它们也同样令人不知所措。

image.png

对于习惯了许多西方频道所采用的极简和时尚设计——只有一个标题、重复的色彩搭配和有限的字体——上面的缩略图确实有些难以接受。然而,当我询问一个日本本土人士为什么许多极受欢迎频道的缩略图都是这样设计时,他对这种设计被视为令人困惑的想法感到惊讶。他认为日本的设计方法使视频看起来更加引人入胜,提供了一些信息碎片,从而使我们更容易做出是否有趣的明智决策。相比之下,我给他看的英文视频缩略图在他看来非常模糊和无聊。

也许正是这种寻求信息的态度导致了我们的观念如此不同。在日本,对风险的回避、反复核对和对迅速做出决策的犹豫明显高于西方国家。这与更加集体主义的社会心态紧密相连——例如,在将文件发送给商业伙伴之前进行两次(或三次)检查可能需要更长时间,但错误的风险显著降低,从而避免了任何参与者丢面子的情况发生。

尽管有人认为这只适用于足够高的赌注,而迷惑外国游客似乎不符合条件——搜索一下“Engrish”这个词,然后感谢我吧。

回到网站设计,这种文化角度有助于解释为什么在线购物、新闻和政府网站在外部观察者看来常常是“最糟糕的罪犯”。毕竟,这些正是需要大量细节直接对应于做出良好购买决策、高效地保持最新信息或确保你拥有某个特定程序的所有必要信息的情况。

有趣的是,关于美国人和中国/日本人如何感知信息,也有相当多的研究。几项研究的结果似乎表明,例如,日本人更加整体地感知信息,而美国人倾向于选择一个焦点来引导他们的注意力(来源)。这可能给我们提供了另一个线索,解释为什么即使在日语能力较高的情况下,西方人对这类网站也感到困难。

后但并非最不重要的是,必须说的是,网站并不是在一个在线真空中存在。而且,各种媒体,从小册子或杂志到地铁广告,也使用了尽可能多地压缩信息的布局,人们可能已经习惯了这种无处不在的方式,以至于没有人曾经想过质疑它。

长话短说,这并不是为了找到标题问题的绝对答案,也不是为了加强日本人独特性的观点,就像日本人论一样。相反,尤其是在看到了几次关注一个解释为“真正答案”的讨论之后,我想展示科技、历史和文化影响的广度,这些最终塑造了这种差异。

交流

首发于公众号 大迁世界,欢迎关注。📝 每周一篇实用的前端文章 🛠️ 分享值得关注的开发工具 ❓ 有疑问?我来回答

交流

首发于公众号 大迁世界,欢迎关注。📝 每周一篇实用的前端文章 🛠️ 分享值得关注的开发工具 ❓ 有疑问?我来回答

本文 GitHub https://github.com/qq449245884/xiaozhi 已收录,有一线大厂面试完整考点、资料以及我的系列文章。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1019555.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CSS动效合集之实现气泡发散动画

前言 👏CSS动效合集之实现气泡发散动画,速速来Get吧~ 🥇文末分享源代码。记得点赞关注收藏! 1.实现效果 2.实现步骤 定义一个数组bubbles,用来存储气泡列表的基本新,w表示宽高,x表示绝对定位…

一篇关于vue的入门的详细介绍

目录 一.介绍 二.库和框架的区别 三.什么是MVVM模式 四.实例 4.1. Vue开发示例 4.2. 双向数据绑定 4.3. 生命周期 好啦,今天的分享就到这了,希望能够帮到你呢!😊😊 一.介绍 Vue.js是一种流行的JavaScript框架&am…

【CNN-FPGA开源项目解析】01--floatMult16模块

文章目录 (基础)半精度浮点数的表示和乘运算16位半精度浮点数浮点数的乘运算 floatMult16完整代码floatMult16代码逐步解析符号位sign判断指数exponent计算尾数fraction计算尾数fraction的标准化和舍位整合为最后的16位浮点数结果[sign,exponent,fraction] 其他变量宽度表alway…

软件系统性能测试报告+测试策略

一、服务背景 性能测试主要是针对信息系统的应用性能指标制订性能测试方案,通过自动化的测试工具执行测试用例,模拟多种正常、峰值以及异常负载条件来对系统的各项性能指标进行测试,负载测试和压力测试都属于性能测试,两者可以结合进行。 通…

Servlet 和 Cookie-Session 学习笔记(基础)

简单来说:是运行在服务器端的 Java 程序,它作为来自 Web 浏览器或其他 HTTP 客户端的请求和 HTTP 服务器上的数据库或应用程序之间的中间层。 用处: 使用 Servlet,您可以收集来自网页表单的用户输入,呈现来自数据库或者…

根据3d框的八个顶点坐标,求他的中心点,长宽高和yaw值(Python)

要从一个3D框的八个顶点求出它的中心点、长、宽、高和yaw值,首先需要明确框的几何形状和坐标点的顺序。通常这样的框是一个矩形体(长方体),但其方向并不一定与坐标轴平行。 以下是一个步骤来解决这个问题: 求中心点&a…

深度学习:cross-attention介绍以及与self-attention的区别

1.Cross-attention vs Self-attention Cross-attention的输入来自不同的序列,Self-attention的输入来自同序列,也就是所谓的输入不同,但是除此之外,基本一致。 具体而言, self-attention输入则是一个单一的嵌入序列。 …

长城公开秘密AI团队,杨继峰带队,明年城市NOH落百城

作者|Amy 编辑|德新 传统车企如何打磨智能化,大模型将为车企带来多少助力? 近日,长城汽车原沙龙品牌智能化中心负责人、智能化研发总监杨继峰以TCAL(Technology Center Al Lab,简称「AI Lab」)…

【产品运营】不理想的知识库产品

知识库是将自己平时看到或用到的产品知识进行汇总和整理,这是产品知识体系的初始系统,但很多企业的知识库管理其实并不理想 为什么写这篇文章?有3个原因: 帮前客户做解决方案预研;见过太多失败案例;市面上…

实验4 交换机端口隔离(access模式)

交换机端口隔离(access模式) 实验目的实验拓扑实验步骤(1)在未划分vlan前,配置pc1、pc2的地址,如图所示(2)测试两台pc机的连通性(3)创建vlan,并验…

虚拟化技术:深入浅出

🌷🍁 博主猫头虎(🐅🐾)带您 Go to New World✨🍁 🦄 博客首页——🐅🐾猫头虎的博客🎐 🐳 《面试题大全专栏》 🦕 文章图文…

源码编译Qt 5.15.9+msvc2019

官方文档里给出了详细步骤: Building Qt Sources Building Qt 5 from Git (Wiki) 注:本文基于windows11vs2019x64qt5.15.9,不编译Qt WebEngine 归纳总结如下: 准备阶段 Qt for Windows - Requirements 安装python,…

实战 | 服务端开发与计算机网络结合的完美案例

前言 大家好,我是Martin 后端,可以说是仅次于算法岗之外竞争最为激烈的岗位,而其中的服务端开发也是很多人会选择在秋招中投递的一个岗位,我想对于很多人来说,走上服务端开发之路的起点就是一个回声服务器了。 今天…

canal

1 安装配置 1.1 下载 https://github.com/alibaba/canal/releases/download/canal-1.1.6/canal.deployer-1.1.6.tar.gz 1.2 mysql配置binlog # on 时,代表着开启 show VARIABLES like log_bin; 1.3 创建MySQL canal用户 # 创建用户 create user canal% ident…

LabVIEW使用巴特沃兹低通滤波器过滤噪声

LabVIEW使用巴特沃兹低通滤波器过滤噪声 设备采集到的数据往往都有噪声,有时候这些数据要做判断使用,如果不处理往往会影响最终的结果。可以使用动态平滑,或者中值滤波等方法。这里介绍使用巴特沃斯低通滤波,也是非常方便的。 下…

Python算法练习 9.18

leetcode 1657 确定两个字符串是否相似 如果可以使用以下操作从一个字符串得到另一个字符串,则认为两个字符串 接近 : 操作 1:交换任意两个 现有 字符。 例如,abcde -> aecdb操作 2:将一个 现有 字符的每次出现转…

Stable Diffusion 系统教程 | 强大的ControlNet 控制网

2023年的2月13日,一款名叫ControlNet的插件横空出世,AI绘画变得更加可控 ControlNet直译过来很简单,就叫做控制网,开发者是一名华裔,毕业于苏州大学,目前在斯坦福做读博士一年级,大佬大佬&…

typora补丁

背景: 安装typora后试用期30天,打补丁可解决此问题 补丁路径 某盘 链接:https://pan.baidu.com/s/18MLqJHqTL7DXdCoaZvMfhg 提取码:vkgg 1.安装typora软件 2.打补丁 2.1.下载补丁包 解压 2.2.将解压文件复制到安装目录 2.3重…

【集成学习】对已训练好的模型进行投票

在不同的数据预处理情况下训练得到了三个SVM模型,结果都差不多,对这三个模型的分类结果进行投票 1、三个模型的model_path # 最终model的path self.model_path log_path/model_name_model.gz self.time_log log_path/model_name_time_log.csv# 模型1…

Java 华为真题-新学校选址

需求: 为了解新学期学生暴涨的问题,小乐村要建立所新学校,考虑到学生上学安全问题,需要所有学生家到学校的距离最短。 假设学校和所有学生家都走在一条直线之上,请问学校建立在什么位置,能使得到学校到各个学生家的距离和最短。 输入描述&…