Webflow 與 Squarespace 您應該選擇哪一個?

已發表: 2020-12-09

Tooltester 受到像您這樣的讀者的支持。 當您透過我們的連結購買時,我們可能會賺取聯盟佣金,這使我們能夠免費提供我們的研究。

為設計師設計網站建立器的想法可能看起來有點違反直覺。 模板? 預建佈局? 人工智慧? 不完全有利於創造力,對嗎?

嗯,幾年前這可能是真的。 但網站建立器已經發展,隨之而來的是專門為設計師和創意人員創建的一代網站建立器。

當然,我說的是 Webflow 和 Squarespace。 快速瀏覽他們的網站,你會發現兩個非常時尚和精緻的網站建立器,它們都能夠製作具有引人注目的流行設計的網站。

webflow 與 squarespace 首頁

Webflow 和 Squarespace 的主頁

那麼哪一款適合您呢? 在本篇綜述中,我將比較 Webflow 與 Squarespace 的不同功能,以協助您根據您的要求選擇最佳平台 - 無論是作品集、攝影網站、商業網站、線上商店或其他類型的網站。

Webflow 與 Squarespace:誰贏得了這場比較? (劇透警告)

類別網路串流方空間
使用方便0 1
範本0 1
設計彈性1 0
部落格功能0 1
搜尋引擎優化1 1
網路商城0 1
應用程式和小部件1 0
支援1 1
價格1 1
全部的5 7

這是一場相當激烈的比賽,但最終 Squarespace 擊敗了 Webflow——請繼續閱讀以找出原因……(如果您很著急,請跳至結論)。

主要區別是什麼?

Webflow 和 Squarespace 都是美國公司(Webflow 來自舊金山,Squarespace 來自紐約),並得到了一些相當大的風險投資的支持。 然而,產品本身存在一些關鍵差異。

Squarespace 的建立方式與傳統網站建立器類似,可讓您在其範本和編輯器的範圍內建立網站。 儘管您擁有一些設計控制權,但您只能進行到目前為止的自訂 - 模板在很大程度上決定了您網站的樣式。

Webflow 的市場份額不斷增長,更多地可以被視為網站建立器和 CMS 的混合體。 憑藉其視覺畫布和動態內容功能,它為您提供了完整的設計靈活性。 因此,它無疑是兩者中更強大的一個——但這並不總是意味著「更好」。

讓我們看看它們在我們的第一個類別中的表現如何:易用性

使用方便

根據定義,網站建立器應該易於使用。 不過,我不認為 WebflowSquarespace 是最直覺的工具。 不,您不需要精通 HTML 或 CSS 來使用它們,但肯定有一個學習曲線。

對於 Webflow 來說尤其如此。 它的設計靈活性是有代價的——有太多的自訂選項,可能需要一段時間才能掌握它們。 擁有良好的技術知識、熟悉 Sketch 或 Figma 等工具,並準備好投入時間學習該系統,這些都是充分利用該系統的關鍵。

webflow 與 squarespace 設計師

在 Webflow 的設計編輯器中建立頁面

Webflow 的一大優點是提供了大量的支援資料 幫助用戶熟悉它,包括課程、教學、影片和論壇。

相比之下,Squarespace 就簡單得多。 您可以透過自己探索來很好地了解系統(介面簡單且簡約),而不需要大量額外的幫助(儘管如果您需要的話可以使用)。

squarespace 與 webflow 儀表板

瀏覽 Squarespace 的網站編輯器

但它並不那麼直觀。 編輯元素有時需要額外單擊幾次,並且每次進行更改時都需要手動儲存。

不過,毫無疑問,如果您追求的是易用性,那麼Squarespace將是您的最佳選擇。 與 Squarespace 的比數是 1:0!

範本

如果您不想在建立網站時從頭開始,Webflow 和 Squarespace 都提供了大量模板可供選擇。

事實上,Squarespace 的模板選擇是其最常被吹捧的賣點之一 -我不得不說它非常令人印象深刻。 大約有 110 種不同的行動響應模板,涵蓋作品集網站、部落格、線上商店、商業網站等。 而且,正如您所期望的,所有這些都經過精心設計,符合最新的網頁設計趨勢。

不過,借助 Squarespace Blueprint,您現在可以從頭開始建立模板。 這個指導設計系統將引導您完成建立專業主題所需的所有步驟。

squarespace 與 webflow 模板

Squarespace 令人驚嘆的模板之一

Webflow 提供了類似數量的模板,而且大多數設計都非常現代,儘管我不確定它們是否真的符合 Squarespace 的高級設計美學。

webflow 與 squarespace 模板

Webflow 中的模板

還有另外一個很大的差別。 Squarespace 的模板都是免費的,而Webflow 只提供約 40 個免費模板。 絕大多數(我想說的是品質更好的)需要購買,價格在 19 美元到 149 美元之間。

另外值得注意的是,Webflow 和 Squarespace 的模板預設都是適合行動裝置的,儘管 Webflow 採取了額外的步驟,允許您針對不同的螢幕尺寸調整其模板。

當然,如果您打算從頭開始,則模板品質並不是您真正需要考慮的問題。 然而,如果您想要一流的模板選擇,我想說Squarespace是這裡的贏家。 紐約2:0!

設計彈性

使用 Webflow 與 Squarespace 相比,您對網站設計的控製程度如何? 這是兩個平台之間差異巨大的類別。

在設計方面,Webflow 確實讓您處於主導地位。 除了為您提供三個選項(從頭開始、選擇模板或選擇預設佈局)之外,您還可以完全控制網站的每個視覺元素。 內容、位置、樣式和互動都可以在 Webflow 的拖放編輯器中進行調整。

此外,Webflow 還為您提供嵌入自訂 HTML、CSS 或 JavaScript 程式碼的選項。 正如我之前提到的,您還可以編輯最多七個(!)不同斷點的設計,讓您可以自由地設計您喜歡的行動體驗。

webflow 與 squarespace 移動

在 Webflow 中針對行動螢幕進行編輯

使用 Squarespace,您會受到更多限制。 模板帶有一組有限的樣式和佈局。 這有助於確保設計的一致性,但也意味著更少的創作自由。 它們可以定制,但僅限於一定程度。 雖然可以透過 Squarespace 商業計劃上的程式碼覆蓋樣式,但這肯定不是理想的客製化體驗。

編輯器本身也有一定的限制。 內容是逐節編輯的,由於 Squarespace 的編輯器不是真正的拖放編輯器,因此將元素放置在正確的位置需要使用列和間隔元素。 一個好處是它允許您上傳自己的自訂字體,就像 Webflow 一樣。

squarespace 與 webflow 編輯器

在 Squarespace 編輯器中編輯部分

儘管 Squarespace 在其最新版本 (7.1) 中大幅改進了其模板系統,但您仍然可以使用Webflow獲得更大的靈活性。 這使得 Squarespace 的領先優勢縮小為 2:1。

部落格功能

哪個是更好的部落格工具? 你可能會感到驚訝。

Webflow 提供了可靠的部落格解決方案。 您可以根據需要自由設計部落格模板,並且可以利用 Webflow 的動態內容功能自動建立部落格文章。

webflow 與 squarespace 博客

Webflow 中的範例博客

但要讓其他功能發揮作用,例如評論、RSS 提要或社交媒體共享,需要做一些額外的工作。 這些都需要手動設置,通常需要一些代碼。

事實證明, Squarespace 是我們遇到過的最好的部落格網站建立者之一。 它的部落格功能令人難以置信——評論、多作者、帖子安排和 AMP(加速移動帖子)支持,全部都是開箱即用的。 它還提供內建電子郵件活動、社交媒體整合、行動編輯,甚至播客託管。 感人的!

squarespace 與 webflow 博客

使用 Squarespace 建立的博客

因此,雖然您確實可以透過 Webflow 更好地控制博客的設計,但如果您優先考慮博客,我認為Squarespace是更完整的解決方案:這使我們的得分為 3:1!

搜尋引擎優化

目前,Squarespace 牢牢領先,在 4 輪比賽中拿下了 3 場。 但這兩者哪一個提供更好的 SEO 功能呢?

我必須說, Webflow 和 Squarespace 在這方面相當旗鼓相當。 兩者都有可靠的 SEO 編輯選項,讓您能夠完成所有基礎操作(編輯頁面標題、URL、描述等)。 但它們甚至提供高級 SEO 功能,例如讓您設定 301 重定向、編輯 robots.txt 檔案以及生成網站地圖。

兩者還具有一些獨特的優勢。 Squarespace 更努力確保您的網站對 Google 友好,讓您可以為部落格文章啟用 AMP、建立產品資料以定位 Google 豐富的搜尋結果,並透過其關鍵字搜尋面板提供與 Google 資料的直接整合。

squarespace 與 webflow seo

Squarespace 中的部落格文章 SEO 設定

在 Webflow 中,完全控制網站響應能力的能力可以幫助您在行動裝置友善性方面獲得加分,這是 Google 的關鍵排名因素。 它還允許您為集合頁面(例如部落格文章)建立「自動生成」的元標題和描述,您可以定義其結構。

webflow 與 squarespace seo

在 Webflow 中編輯主頁的 SEO 設定

Webflow 和 Squarespace 都是 SEO 遊戲領域的專家,所​​以這一輪是平手——Squarespace 得 4 分,Webflow 得 2 分。

網路商城

當您想到電子商務時,他們可能不是第一個想到的網站建立者。 儘管如此,如果您打算在網站上銷售實體或數位產品, Squarespace 和 Webflow 都配備了建立線上商店所需的工具

那麼他們如何比較呢? 此表提供了 Webflow 與 Squarespace 電子商務功能的快照:

特徵網路串流方空間
客製化程度高的。 雖然您可以使用模板,但您還可以設計產品頁面和集合/列表,以及結帳頁面、確認頁面和購物車中等的。 您可以透過調整一些設定來編輯產品和結帳頁面的設計,但不能透過拖放元素來編輯
產品限制500-3000 件物品之間,具體取決於您的計劃。 請注意,項目不僅包括產品,還包括產品變體、類別和 CMS 項目無限
數位下載是的是的
支付網關條紋,貝寶Stripe、PayPal、Square(用於 POS)
交易費用標準計劃 2%; 更高級別的計劃不收取任何費用商業計劃的 3%; 更高級別的計劃不收取任何費用
自動稅計算是的,適用於美國、加拿大、歐盟和澳洲(透過 TaxJar) 不,儘管您可以將 TaxJar 連接到您的商店
即時運費否,這些需要手動設定是的,美國商店的最高計劃(提前)
客戶帳戶不是開箱即用的。 您可以使用第三方整合(例如 Foxy)來新增這些是的
分析不是內建的,但您可以與 Google Analytics 集成是的,透過 Squarespace Analytics 中的銷售面板。 您也可以與 Google Analytics 集成

雖然不是最強大的電子商務網站建立者,但我想說,如果您的商店規模較小,Webflow 和 Squarespace 都可以提供相當複雜的電子商務解決方案。 然而,如果我們根據功能對它們進行比較,我認為Squarespace只比 Webflow 多幾個選項。

squarespace 與 webflow 商店

使用 Squarespace 建立的產品頁面

Squarespace 以 5:2 的巨大領先優勢! Squarespace最近幾輪還能維持連勝嗎?

應用程式和小部件

如果您想為網站添加額外的功能怎麼辦? 讓我們仔細看看在 Webflow 和 Squarespace 上建立的網站可以走多遠。

Squarespace 於 2019 年 12 月推出了 Squarespace Extensions 市場。目前它提供 36 種不同的擴展,其中大多數與電子商務和會計相關(例如 Shippo、Printful、Quickbooks Online)。 4 年內推出 36 個擴充功能並不算令人印象深刻。

squarespace 與 webflow 擴展

Squarespace Extensions 上提供的一些應用程式

如果您購買 Squarespace 的商業計劃或更高版本,您還可以存取其內建附加元件,例如行銷彈出視窗、表單、照片庫、預約安排、會員區等。 此外,還有一些第三方工具可以透過程式碼注入添加到您的網站,如果您有電子商務網站,則可以設定 API。

Webflow 的整合略有不同。 儘管其庫列出了 200 多個集成,但這些並不是直接的應用程式集成,而是如何手動添加工具的指南。 有幫助,但它們需要比簡單地啟用擴展更多的工作。

webflow 與 squarespace 集成

Webflow 的廣泛集成

不同的方法,但都在增強網站方面提供了相當多的多功能性。 本輪比賽將進入Webflow! 5: 3

支援

我們的比較即將結束,所以讓我們來看看一個非常重要的類別:支持。

雖然網站建立者因提供支援緩慢而臭名昭著(尤其是當您真正需要它時!),但我可以直接告訴您,Squarespace 的情況並非如此。 借助 Squarespace 的即時聊天,您幾乎可以立即獲得答案,他們還提供 24/7 電子郵件支援以及全面的知識庫。

squarespace 與 webflow 幫助

您可以直接從編輯器存取 Squarespace 的說明中心

如果您正在尋求 Webflow 的個人支持,您可能會發現他們的回應速度有點慢。 這是因為他們(目前)不提供任何電話或即時聊天支援 - 電子郵件是唯一可用的管道,他們承諾在 1-2 個工作天內回應。 不太敏捷。

不過,如果您喜歡自行修復類型的用戶,那麼您可能會喜歡在 Webflow University 上梳理 Webflow 的大量資源,其中包括課程、影片和逐步指南。 還有論壇、部落格和自動聊天機器人可以幫助您指明正確的方向。

因此,雖然 Squarespace 的個人支援比 Webflow 快得多,但我認為 Webflow 的出色資源有助於彌補這一點。 雙方又打成平手,比數來到6:4。

價格

現在進入最後一類:哪一個提供更好的性價比?

讓我們先來看看他們的常規網站計劃,專為那些不打算添加線上商店的人而設計。

  • Squarespace 的個人方案費用約為每月 16 美元,讓您可以在自己的自訂網域上建立部落格或個人網站。 沒有儲存或頻寬限制,但您無法存取 Squarespace 的電子商務、行銷或原始碼功能。 如果您需要這些,您可以以每月 23 美元的價格升級到商業計劃,儘管該計劃的電子商務功能有些有限。
  • Webflow 的同等產品是其基本計劃(在網站計劃下),價格為 12 美元/月。 這為您提供 100 個頁面、50GB CDN 頻寬*、每月最多 25k 訪問量,但沒有 CMS 收集項目。 要增加任何這些限制,您可以轉到更高的計劃,例如CMS (23 美元/月)或Business (39 美元/月)。

*50GB 足夠了,應該可以輕鬆支援每月 25k 的訪問量

電子商務計劃的價格稍高一些:

  • Squarespace 最低的電子商務方案是Basic Ecommerce ,售價為 27 美元/月。 沒有產品限制,但您缺少高級功能,例如廢棄購物車恢復和即時運費。 這些可以在Basic Advanced上購買,價格為 49 美元/月。
  • Webflow 最低的電子商務計劃是其標準計劃,每月 29 美元。 這裡的主要區別是您的商品數量限制為 500 個(包括產品、變體、類別和 CMS 商品)。 如果您需要更多,則需要升級到Plus計劃(1,000 件物品每月 74 美元)或高級計劃(3,000 件物品每月 212 美元)。

因此,很明顯,如果您需要更高的儲存量、頻寬或產品, Squarespace的性價比是最高的。 請同時記住,Squarespace在第一年包含免費的自訂域名,而使用 Webflow 時,您必須在其他地方購買域名。

但也值得注意的是, Webflow 提供了 Squarespace 所沒有的一些優勢

  • Webflow 為您提供了在其Starter計劃中免費建立兩個網站的選項。 Squarespace 不提供任何免費計劃,但您可以試用 14 天
  • Webflow 還提供了許多帳戶計劃,以防您需要建立多個網站(例如為客戶) - 這些計劃起價為 16 美元/月

這就是為什麼我認為Webflow在這一輪中也值得一分,因為您很少會遇到如此廣泛的計劃來滿足不同的需求。

遺憾的是,這仍然不足以讓 Webflow 領先——事實上, Squarespace 以 7 比 5 的比分成為這場對決中無可爭議的贏家!

Squarespace 與 Webflow:並排比較

以下是您在這兩個網站建立器中發現的不同功能的快速回顧:

方形空間評論

4.3

網路串流圖示

3.83
使用方便
設計的選擇和靈活性(模板)
語言
您自己的網域名稱(例如 .com 或 .net)
導航深度
小工具(增加額外功能的小工具)
行動應用

iOS系統

安卓

iOS系統

安卓

電子商務
搜尋引擎優化(SEO)
部落格
訪客統計
聯絡表
密碼保護和會員區
新增 HTML 程式碼
儲存空間無限無限
備份與復原
支援

常問問題

聊天

電子郵件

電話

常問問題

聊天

電子郵件

電話

有趣的因素
價格

個人16 美元

商務23 美元

網上商店(基本) $27

網上商店(高級) $49

開胃菜0 美元

核心19 美元

成長$49

閱讀完整評論

現在就試試!

閱讀完整評論

現在試試

結論

Squarespace 的勝算非常大,您可能會想:為什麼我會選擇 Webflow?

雖然 Squarespace 在許多類別中都更強,但我認為這最終取決於您需要多少設計控制。

如果我想完全從頭開始設計一個網站, Webflow 將是我的選擇。 例如,如果我正在為客戶設計一個商業網站,Webflow 不僅可以讓我完全控制設計,還可以消除開發人員建構它的需求。 這可以節省大量成本和時間,對客戶和我都有利 - 即使它確實需要比 Squarespace 網站更多的工作。

如果優秀的設計對您來說比完全掌控更重要,那麼Squarespace 將是更好的選擇。 例如,如果您想要外觀精美的作品集、攝影網站、部落格或線上商店,這是更快、更乾淨的選擇。 因此,如果我是初學者,或者想要一個維護成本更低的網站,Squarespace 肯定是我的選擇。

有一點是肯定的——Webflow 和 Squarespace 在設計遊戲中都很強大,我們將密切關注它們未來如何繼續發展。

你決定了嗎? 您可以在此處註冊 Squarespace 的 14 天免費試用版,或在此處註冊免費的 Webflow 方案。

提示:使用此獨家折扣代碼即可獲得付費 Webflow 計劃 20% 的折扣: affiliate-tooltester-0228