當您打開了數十個站點時,成都網站制作的圖標可以幫助您跟蹤不同的網頁。
網站圖標是與頁面標題一起顯示在頁面選項卡上的圖標。它們不僅可以幫助提高客戶瀏覽器中的可見度,還可以幫助加強您的品牌形象。
進一步閱讀以了解什么是網站圖標、它們如何影響SEO、如何使用生成器制作網站圖標以及如何使用HTML將其添加到您的網站。
網站圖標是代表品牌或網站的瀏覽器圖標。最常見于瀏覽器選項卡中網頁標題旁邊的網站圖標,也可以在地址欄、書簽列表、搜索引擎結果頁面(SERP)、工具欄、瀏覽器歷史記錄和網絡上的其他地方找到。
網站圖標不僅會影響用戶體驗和品牌知名度,還會使您的網站看起來更專業。
請注意,在移動SERP中,Joy Us Garden和Easy to Grow Bulbs的網站有花卉圖標,但The Succulent Sourc的網站有一個灰色的地球。對于一個關于多肉植物的網站來說,這沒有多大意義,是嗎?這是因為地球是百度 Chrome為沒有自定義圖標的網站設置的默認圖標。
如果我快速瀏覽結果頁面,出于某些原因,我可能會決定在The Succulent Source上探索Joy Us Garden和Easy to Grow Bulbs 。
它們不僅首先出現在SERP中,而且它們的圖標、URL、頁面標題和元描述都表明它們是致力于所有植物的網站。
現在,在桌面上的瀏覽器選項卡中想象這三個網站。與The Succulent Source的默認圖標相比,記住Joy Us Garden和Easy to Grow Bulbs的自定義圖標要容易得多。在大量打開的選項卡中,我更有可能點擊返回帶有自定義圖標的選項卡,并在這些網站上花費更多時間。
最后,假設我點擊了這些網站中的每一個。在訪問Joy Us Garden和Easy to Grow Bulbs時,我立即注意到自定義圖標是基于網站的徽標。后者的彩色標志如下圖所示。您會認出郁金香是他們的網站圖標。
這有助于加強他們的品牌形象,并使他們的網站更令人難忘。
另一方面,在訪問The Succulent Source時,我將第一次看到他們的徽標。他們可以通過匹配他們的標志和網站圖標來提高他們的品牌一致性。
網站圖標的最佳尺寸是16x16 像素。這就是它們在瀏覽器選項卡、地址欄和書簽列表中的顯示方式。理想情況下,您將創建多種尺寸的網站圖標。這樣您就可以在更大的屏幕上看到適當縮放的版本,而不是16x16的版本。
雖然網站圖標不會直接影響您的搜索引擎排名,但它們確實會影響那些與您的網站互動的人在頁面上花費的時間。
以這種方式考慮,如果您的客戶無法通過圖標快速識別哪個選項卡是您的,他們就不太可能重新訪問該頁面。
擁有一個獨特的標志并將其用作您的網站圖標將使您的品牌形象處于客戶心中的最前沿。
選擇網站圖標時,請確保沒有其他品牌具有類似徽標。您可以通過反向圖像搜索您的徽標來測試這一點,看看其他品牌出現了什么。
確保您的網站圖標在顏色和外觀上都足夠獨特,以便消費者可以輕松識別您的品牌。
網站圖標增加了訪問者將您的頁面保存為書簽的可能性。這在搜索中有很多好處。如果用戶為您的網頁添加書簽, 百度會提升您的網站并提高您的SEO排名。沒有網站圖標肯定會對您的排名產生負面影響,因為沒有網站圖標的書簽對用戶不友好。
此外,如果客戶想回顧您網站上的文章或產品頁面,他們會轉到他們的歷史記錄。Favicons 出現在網絡搜索歷史中,通過幫助客戶快速識別過去的搜索來改善用戶體驗。
現在我們了解了什么是網站圖標、它的用途和不同的大小,讓我們來看看如何制作一個。
您想使您的網站圖標易于識別并與您的品牌標識保持一致。與其從頭開始,不如以公司徽標為基礎。
考慮在Fiverr或Upwork上聘請平面設計師來創建您的徽標,或使用Logo Crisp等工具來設計您自己的徽標。
有了徽標后,就該制作網站圖標了。
請記住:您的網站圖標應與徽標的元素相匹配,但不必完全匹配。Favicons通常需要比品牌標志更簡單,因為它們的尺寸很小。
像谷歌和Facebook這樣的公司在他們的網站圖標中使用他們公司的首字母,并使用與他們的標志相同的配色方案。一些企業將其徽標的倒置配色方案用于其網站圖標,增加了更多的負空間。
如果您沒有平面設計或藝術背景,那么創建徽標可能會讓人覺得力不從心。如果你選擇聘請平面設計師,一定要征求他們對配色方案、字體類型和整體形象的意見。
查看此博客,了解2023年品牌徽標趨勢。
一旦你對你的標志感到滿意,你就可以開始制作你的圖標了。不幸的是,這并不像將您的徽標壓縮成16x16正方形然后收工那么簡單。例如,您的徽標可能包含文本,這些文本在縮小時將無法辨認。
這就是為什么您想使用徽標中最容易識別的部分并將其作為您的網站圖標的原因。Easy to Grow Bulbs通過從他們的標志中取出郁金香并將其作為他們的圖標來做到這一點。
要進行此類更改,您可能需要使用IconEdit2等圖標編輯軟件。使用大多數圖標編輯軟件,您可以將多種尺寸添加到單個圖標文件中。
一旦您對網站圖標圖像和尺寸感到滿意,您可以將文件保存為PNG或JPG格式并將其上傳到網站圖標生成器。
如何在HTML中添加網站圖標
創建網站圖標后,您必須告訴瀏覽器和其他網絡應用程序在哪里可以找到它。為此,您必須在HTML文件的部分添加一行代碼。
假設您將 PNG文件保存為“favicon.ico”。然后,您可以在標記之間的任意位置添加以下代碼片段:
請注意:您的網站圖標不必放在網站的根目錄中——通常是這樣。如果您將其保存在其他位置,只需確保 href 屬性準確無誤。因此,如果您將它保存到名為“images”的子文件夾中,那么您將輸入
現在假設您創建了多種網站圖標尺寸。您可以通過將每種尺寸的代碼行添加到HTML文件的部分來將它們全部加載到您的網站上。
網站圖標是網頁設計的重要元素。它們可以改善訪問者體驗,增強您的品牌形象,并使您的網站看起來更可信。
不要犯忽視它們的錯誤——尤其是當它們很容易創建和添加到您的站點時。您只需要一個免費的圖標生成器和對HTML的一些熟悉。
總的來說,為您的成都網站制作圖標是一項重要的工作。通過使用合適的圖標,您可以提高網站的用戶體驗,增強其視覺效果,并吸引更多的用戶。