有人给我发了邮件
我应该采用什么方法来构建网站?
- 构建一个响应式的网站
- 在一个域名上构建网站,但检测移动设备并呈现单独的移动网站
- 在子域名上构建一个单独的移动网站
有趣的是,大型行业定义的对话是如何迅速淡出人们视野的。这可能是过去十年中网页设计和开发中最大的问题,我们得出了一个答案:答案是 #1,您应该构建一个响应式网站。任何其他答案都意味着您正在构建多个网站,而由此带来的痛苦主要来自工作量的加倍、团队的分裂、跨团队的沟通问题、网站之间的一致性问题以及该行业多年来一直在努力解决的其他众多痛点。
但是,网络是一个很大的地方。
这封邮件的发送者特别提到了 imdb.com 作为他们的示例。IMDB 是一个绝对庞大的网站,拥有庞大的团队(他们属于亚马逊)以及大量的资金流动。如果 IMDB 团队决定构建多个网站会更好,那么这是他们的业务。他们有资源可以做任何他们想做的事情。
我个人选择了第二个选项。原因是:你不能把方形木桩塞进圆形孔里。是的,这很痛苦,但比看到一个布局糟糕的网站要好,客户在小屏幕上无法阅读,需要左右滚动。您失去了连续性的效果,因此整个页面毫无用处
你甚至知道什么是响应式网站吗?那些网站没有水平滚动条……除非开发者做得不好 :)
我建议了解一些响应式组件库的工作原理。 https://bootstrap.ac.cn/docs/4.4/layout/overview/
响应式网站绝对可以在移动设备和桌面设备上完美运行,并且大多数公司、博客、个人网站等都可以在多种设备上使用单个代码库正常运行。即使是内容在移动设备上移动位置的问题,也可以在现代 CSS 中解决(想到 flex order)。永远不要低估媒体查询和开发人员判断力的力量。偶尔在设计或构建上做出一些妥协,总比把自己锁定在一个后来会后悔的痛苦过程中要好。一如既往,在网络世界中,如果您可以改进,那就去做。
听起来像是有人不知道什么是响应式网站。
请记住,响应式和自适应之间存在差异。
我没有任何关于您具体需求的详细信息,因此您可能是确认规则的特殊情况。
不过,总的来说,如果以响应式方式构建网页,不太可能出现更糟糕的情况。这取决于团队的能力。
响应式和精简的网站绝对是最佳选择,但我很好奇其他开发人员如何看待 Google AMP。有时是否值得创建一个完全响应式的网站和一个 AMP 版本?
对我来说,这取决于您网站的需求。由于 JS 大小限制,AMP 不允许您大量使用 JavaScript。这对于性能方面来说可能是一件好事,但您可能被迫失去一些未实现/AMP 不支持的关键功能。此外,我认为在 AMP 下,广告的盈利效果并不理想。
另一方面,从 SEO 的角度来看,Google 推广 AMP 的力度有多大将是关键,因此……根据您维护两者的资源,我会选择两者,直到未来更加明朗。
从哲学角度来看——AMP 弊大于利。它使用非标准标记,并受单个营利实体控制。它是开放网络的对立面。
从技术角度来看——AMP 弊大于利。无需第三方资源依赖,就可以轻松创建更快的网站。
从商业角度来看——AMP 弊大于利。Google 偏爱 AMP 网站以进行排名/功能。
同意第一个选项,但重要的是要考虑根据设备提供必要的最小代码以获得更好的性能。(对您的 JavaScript 和 CSS 进行良好的覆盖,最少的 HTML 标记等。)
我敢打赌,绝大多数网页开发者会选择响应式网站作为首选,但我感觉我们在这个方法中可能会遗漏一些东西。
也许在大多数情况下,两者之间的区别仅仅是元素的适当大小和排列问题:在这种情况下,响应式网站是一个非常优雅的解决方案。
否则我会说这取决于具体情况。我无法立即想象什么样的网站需要一个与桌面网站截然不同的移动网站,但这很容易存在。
除非您真的需要移动版本,否则一个版本应该能够覆盖任何设备上的响应性。上面有人急于指出 Bootstrap,这又是胡说八道。您的网站就是您的网站,没有版本号,没有框架,没有花哨的标签。它是为您构建的,满足您的需求。
感谢 Chris Coyier。他的邮件发送者确实节省了我的时间,我和他/她一样,也担心工作量过大,但 Coyier 的回答成为了我的正确选择。我之所以这么说,是因为我正在学习 Bootstrap 4,我搜索了一下,然后找到了您这篇有趣的文章以及其他关于响应式网页设计的有用信息。我大声说:“设计一个响应式的移动优先网站需要与设计两个网站一样多的努力,外加一些您应该了解的技巧”。伙计们,在没有挑战的情况下,很难赶上现代响应式网页开发。
我只会构建响应式网站,主要是因为成本限制。但随着我们超越了这场讨论,对我来说变得更加清楚的是,纯粹的响应式方法本质上是所有方法中最差的,是最简单的解决方案,可以在所有设备上都能正常运行。毫无疑问,您花费更多时间优化不同的视口,这些视口就会越好/感觉越好/使用越好。
我认为理想的情况是多个响应式网站,您可以在其中花费更多时间来满足不同视口和设备(特别是输入方法)的独特需求和限制。但是,从现实、实用和经济高效的角度来看,唯一的真正答案是一个响应式网站,尤其是在我们的 CSS 布局越来越好的情况下。
理想情况下,您应该拥有一个单一的精简响应式网站,但在电子商务/imdb 中,这根本行不通。标记、样式和脚本差异太大。
基本上,如果您拥有一个访问量较低的博客或网站,请使用响应式设计,
如果您的网站是电子商务或类似 imdb 的网站,并且用户众多,则您应该有两个版本。
如果知道自己在做什么,今天的技术允许 100% 的响应式网站!绝对不需要两个网站!
Eddy
绝对只有一个网站。我认为您在一些大公司看到分离是因为他们的网站和平台在从桌面到移动的过渡期间已经太大,所以他们可能不得不继续进行修补以服务移动设备,而无需像亚马逊那样完全彻底地改造他们的平台。
为什么 #2 或 #3 有时更好?发送的数据量和用户的个人喜好。
在电脑上,长长的滚动页面已经很痛苦了,在智能手机上更是如此。
下载一堆我们不需要的数据到智能手机上会消耗我们有限的数据连接。您可以在电脑上显示复杂的页面,但在智能手机上不行。因此,您必须选择发送给每个设备的内容。
使用“display:none”不可行,因为数据无论如何都会发送。