我一直在使用SVG做很多事情，并且能够获得想要的确切结果。这让我想知道为什么我们不能用它们建立整个网站...
我不是说要用index.html替换index.svg。更像是拥有基本的HTML框架（用于元标记，样式表，脚本等），然后为<body>提供一个内联<svg>子元素，以代替其他任何事情。 （文本，布局，缩放比例等）
我最初的假设是，该网站在表单功能，SEO和可访问性方面将不完善。但是，如果可以通过某种方式将其规避，那么可以使用强大的SVG功能来呈现可有效缩放到任何设备尺寸的轻量级图形效果。
以前尝试过这种方法，用SVG进行“替换” HTML的潜在陷阱是什么？表单功能，SEO和可访问性是否应该受到关注？
也许是时候再次回答这个问题。欢迎进行贡献和编辑。
SVG内容是视觉内容。这本身就限制了可访问性。尽管如此，即将发布的SVG2规范在ARIA attributes上有一段段落试图至少提供一些帮助。如果仔细观察，您会发现例如图形图元将获得默认值aria-role="graphics-symbol"，这并没有太大帮助。
屏幕阅读器是否实现了我所不知道的任何方法。
SVG使您可以在任何地方添加<title>和<desc>标签。但是HTML5通过标签提供的标准语义丢失了。没有标题，没有节，没有目录或导航。尝试想象Firefox Reader View可以从这样的页面中产生什么：什么都没有。
甚至linking to partial content of a page也很困难。尽管存在规范，但语义仍然受到限制：您是否真的要通过放大链接目标以覆盖整个视口来突出显示链接目标？
最后，[[SEO只是可访问性的一个特殊方面。具有HTML <header>段，可能会发生一些事情。也许其他人可以对Google的实施发表评论。
inline-size，但它仅针对HTML实现，而在SVG中不起作用。）CSS在提供诸如flex和grid布局之类的布局机制上付出了很多努力。在SVG中，您丢失了所有这些用于重新排序内容的技术，而倾向于简单的自动缩放。
互动
<foreignObject>标记中的HTML输入，也可以通过将键盘输入捕获到<text>元素中来从头构建文本输入小部件。对于大多数其他形式的用户输入，SVG甚至可能是高级平台。例如，单击/触摸以对其进行标记并在周围拖动/滑动它只是基本相同交互的两个方面。
尤其是Web组件是SVG的完美补充，用于构建交互式小部件。 （尽管您仍必须通过polyfills才能与Firefox兼容。）
表格提交
结论
如果您需要以响应方式更改页面的布局，SVG将无济于事。
SVG为创造性的，面向视觉的用户交互提供了许多其他可能性。只要您为视障用户找到后备解决方案，您的页面就会从中受益。
总体而言，SVG为您提供页面上特定区域和窗口小部件的创造力，但缺少网页必须回答的基本语义问题：您的网页与网络上的其他资源有何关系？您页面上的内容是什么，元信息是什么，装饰是什么？
两全其美是通过使用混合匹配方法来实现的：用HTML构建页面，用SVG图形装饰页面，以及使用SVG以及Web组件构建交互式/动画小部件。
[您可以使用SVG构建整个网站。我一直都在使用Adobe Illustrator创建页面。
您可以转到我的网站，ozake.com查看一个不错的示例。与可能的情况相比，这甚至是非常基本的。[起初我都是手工完成的，但是重复的部分很烦人，所以我建立了一个名为Svija的工具（svija.com，也仅是SVG）。
基本上，您只是将SVG放在html body标签内。
有几件事要注意：
Microsoft浏览器需要精确的像素尺寸，否则将以错误的尺寸绘制SVG。
Safari浏览器无法平滑缩放字体
（请参阅我对this page的回答）。结果是，如果SVG大小变化，则如果您有两个相邻的文本块，则它们之间的间隔将随机变化。如果您想拥有多个SVG，例如>（一个用于页面，一个用于页脚，一个用于菜单，以及一个用于特殊事件），您需要注意内部编号不同。
否则，第二个SVG的颜色样式可能会应用于第一个SVG，结果无法预测。SVG内的[您可能需要更新字体样式定义
，使其与Web字体一起使用。我同时使用Google字体和上传的WOFF。您可以将表单制作为单独的HTML层
基于Adobe Illustrator坐标系。我只是在Illustrator中构建表单，然后将每个元素的位置和大小复制到绝对定位的HTML元素中。正如我在上面提到的那样，为重复元素构建单独的SVG更容易。无需将页脚复制到每个SVG，只需将页脚制作为单独的SVG，即可在主页顶部绘制。
我构建Svija的部分目的是确保每个SVG具有唯一的内部ID并处理字体命名转换。您可以
链接到外部字体和图像
，就像在HTML中一样。您可以使用您想要的任何动画
，并使用GSAP。该网站通常由Google列出
，但文本将按照其在SVG中的显示顺序排列。如果优先考虑，则在构建SVG时需要注意。为了处理可访问性，我将页面文本放在SVG之前的单独DIV中。从理论上讲，页面阅读器应该阅读内联SVG中的文本，但是我无法确定是否是这种情况。我不想试图推动我的项目。完全可以手动完成所有操作。
欢迎来到未来！