建筑是最容易辨識(shí)的藝術(shù)形式之一。展示一張著名建筑的圖片，多數(shù)人會(huì)立即認(rèn)出它。

它也是驕傲和靈感的源泉。例如，來(lái)自世界各地的人們都?jí)粝雲(yún)⒂^(guān)埃菲爾鐵塔。但這種體驗(yàn)不僅僅是站在前面拍一張自拍。建筑也代表了特定的時(shí)間和地點(diǎn)——這使得它更加特別。

因此，我們不應(yīng)該感到驚訝，網(wǎng)頁(yè)設(shè)計(jì)師是架構(gòu)設(shè)計(jì)的鐵桿粉絲。就像一個(gè)結(jié)構(gòu)可以看起來(lái)和功能都很漂亮一樣，一個(gè)網(wǎng)站也可以。他們之間的關(guān)系比人們第一眼想象的要密切得多。

今天，我們將向您介紹一些引人注目的例子，網(wǎng)頁(yè)設(shè)計(jì)師向世界上最著名的建筑致敬。在許多情況下，對(duì)細(xì)節(jié)的關(guān)注是非凡的——這使它們確實(shí)成為一種合適的敬意。

泰姬陵

泰姬陵完工于1643年，以其錯(cuò)綜復(fù)雜的美景和郁郁蔥蔥的景觀(guān)而聞名。這種CSS和JavaScript渲染絕對(duì)是最小的，但仍然可以立即識(shí)別。建筑的輪廓映襯著金色的天空，以及前景中緩緩移動(dòng)的水道，這些都是我們真正需要的。

灰姑娘的城堡

迪斯尼樂(lè)園的童話(huà)城堡吸引了來(lái)自世界各地各個(gè)年齡層的孩子。在這里，我們有一個(gè)純CSS副本抓住了它的本質(zhì)?？v觀(guān)它的500多款風(fēng)格，這款顯然是一項(xiàng)愛(ài)的勞動(dòng)。

埃菲爾鐵塔

對(duì)很多人來(lái)說(shuō)，埃菲爾鐵塔代表著這座燈光之城的浪漫。無(wú)論從字面上還是比喻上來(lái)說(shuō)，這都是不可錯(cuò)過(guò)的吸引力。這個(gè)CSS動(dòng)畫(huà)也很突出，提供了一個(gè)流暢的360度視圖。

埃及金字塔

金字塔是埃及西部沙漠中一處令人驚嘆的景觀(guān)，是古代世界七大奇跡之一。這種對(duì)金字塔的藝術(shù)呈現(xiàn)也是互動(dòng)的。懸停在現(xiàn)場(chǎng)觀(guān)看太陽(yáng)升起。

測(cè)量標(biāo)志性的摩天大樓

世界上最高的建筑定義了一個(gè)獨(dú)一無(wú)二的城市天際線(xiàn)。你看到帝國(guó)大廈和紐約市立即出現(xiàn)在腦海中。想看看你最喜歡的游戲是如何相互比較的嗎?這張?jiān)O(shè)計(jì)精美的圖表將幫助你比較哈利法塔和臺(tái)北101。

中國(guó)的長(zhǎng)城

中國(guó)的長(zhǎng)城近22000公里長(zhǎng)，可能太大了，無(wú)法用CSS完全重現(xiàn)。因此，可以理解的是，這個(gè)片段只是它令人瞠目結(jié)舌的場(chǎng)景的一部分。我們知道了。

太空針?biāo)?/p>

西雅圖的太空針?biāo)柫⒃诿绹?guó)西部城市，為游客提供了一些壯觀(guān)的景色。世界上很多人可能還認(rèn)得一個(gè)動(dòng)畫(huà)版本，上世紀(jì)90年代的電視劇《歡樂(lè)一家親》(Frasier)以極簡(jiǎn)主義風(fēng)格開(kāi)場(chǎng)時(shí)，就用過(guò)這個(gè)著名的動(dòng)畫(huà)版本。這個(gè)超高的CSS渲染跨越了現(xiàn)實(shí)和簡(jiǎn)單之間的界限。

變形的地標(biāo)

想在幾秒鐘內(nèi)游覽世界上最著名的地標(biāo)嗎?這個(gè)華麗的變形動(dòng)畫(huà)將帶你去里約熱內(nèi)盧，比薩，巴黎和北京。再一次，剪影的使用證明了這些地方是多么容易辨認(rèn)——即使沒(méi)有所有的細(xì)節(jié)。

建筑是如何啟發(fā)網(wǎng)頁(yè)設(shè)計(jì)的

無(wú)論你是在設(shè)計(jì)建筑還是網(wǎng)站，都有一些相同的通用主題。以美為例。出色的外觀(guān)必須由深思熟慮的底層結(jié)構(gòu)來(lái)支持。忽略這一關(guān)鍵組件將導(dǎo)致一定的失敗。

此外，復(fù)雜性并不一定是成功的保證。最復(fù)雜的代碼并不總是最好的路徑，對(duì)于結(jié)構(gòu)也是如此。簡(jiǎn)單往往是最有效的方法。

我們希望這些世界上最著名的地標(biāo)建筑的效果圖能啟發(fā)你!如果你想看更多的例子，請(qǐng)查看我們的CodePen集合。