近年來，隨著Web技術的發展，越來越多的網站使用HTML5來構建頁面和應用程序。HTML5的一個重要特性就是能夠支持圖形化代碼的實現。

<canvas id="myCanvas" width="200" height="100"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 150, 75);
</script>

上面的代碼使用HTML5的canvas元素創建了一個畫布，并在畫布上繪制了一個紅色的矩形。在HTML5中，可以使用Canvas API來繪制各種圖形，包括線條、矩形、圓形等等。

此外，HTML5還支持使用SVG（Scalable Vector Graphics）創建矢量圖形。與Canvas不同，SVG使用XML格式存儲圖形數據，因此可以很容易地編輯和修改圖形。以下是一個使用SVG創建一個簡單的矢量圖形的例子：

<svg width="100" height="100">
<rect x="10" y="10" width="80" height="80" style="fill:#ff0000;" />
</svg>

上面的代碼創建了一個100x100像素的SVG圖形，并在其中繪制了一個紅色的矩形。與Canvas不同，SVG支持嵌入文本、鏈接、圖片等對象，因此可以用于創建豐富的交互式應用程序。

總之，HTML5的圖形化代碼功能為Web開發帶來了更多的可能性和靈活性，讓我們更方便地創建出漂亮、交互性強的頁面和應用程序。