فاوآيكون چيست؟

اگر در حوزه طراحي سايت و يا برندسازي فعاليت داشته باشيد قطعا با فاوآيكون (Favicon) و اهميت طراحي آن آشنايي داريد. اما فاوآيكون چيست؟ طراحي فاوآيكون چه اهميتي دارد؟

حتما تا كنون براي شما نيز پيش آمده است كه در زمان وبگردي و باز كردن چندين صفحه در مرورگر خود آيكون‌هاي كوچكي در كنار URL هر وب سايت و يا تب‌هاي بالاي مرورگر مشاهده كرده باشيد. اين تصاوير كوچك فاوآيكون نام دارند كه به كاربران كمك مي‌كنند تا به راحتي بتوانند وب سايت شما را در ميان چندين تب‌ مرورگر و يا بوك مارك پيدا كرده و آن را به عنوان لوگو و يا نماد رسمي سايت‌تان به خاطر بسپارند.

بسياري از طراحان و وب مستران در زمان راه اندازي سايت، بخش عمده‌اي از توجه خود را به سئو و ساختار فني آن معطوف كرده و زمان اندكي را صرف طراحي فاوآيكون مي‌كنند و در برخي مواقع نيز حتي از ساخت آن غافل مي‌شوند. در صورتي كه همين آيكون به ظاهر كوچك، عنصري قدرتمند و تاثيرگذار در فرآيند طراحي سايت است كه به آن هويت و اعتبار مي‌بخشد. در ادامه اين مطلب موضوع فاوآيكون چيست؟ را به طور كامل مورد بررسي قرار مي‌دهيم و شما را با اهميت و نحوه طراحي آن نيز آشنا خواهيم كرد. با وبكده همراه باشيد.

فاوآيكون چيست؟

در پاسخ به پرسش فاوآيكون چيست؟ در ابتدا بايد بگوييم كه Favicon از تركيب دو كلمه Favourite و Icon ساخته شده است كه به عنوان يكي از مهم‌ترين عناصر در طراحي و راه اندازي وب سايت‌ها شناخته مي‌شود. فاوآيكون‌ها در واقع نمادهاي مربعي شكل كوچك و پيكسلي هستند كه در مرورگرهاي وب جهت نمايش يك وب سايت يا يك صفحه مورد استفاده قرار مي‌گيرند. فاوآيكون‌ها معمولا پيش از URL در نوار آدرس مرورگر، در تب‌هاي مرورگر و در كنار نام سايت، در ليست بوك مارك‌هاي (نشانك‌ها) مرورگر كاربران، نوار ابزار، صفحات نتايج موتورهاي جستجو (SERP)، تاريخچه و نتايج جستجو مشاهده مي‌شوند. در برخي موارد همچون Google Chrome، فاويكون‌ها حتي در صفحه اصلي مرورگر شما نيز ظاهر مي شوند.

بيشتر بخوانيد: طراحي سايت فروشگاهي در تهران

فاويكون به عنوان نماد وب سايت يا يك شناسه بصري براي كاربران جهت شناسايي سايت شما در سراسر وب عمل مي‌كند. گوگل يكي از شناخته شده ترين فاويكون ها را دارد كه مي‌توانيد G چند رنگ آن كه همان فاوآيكون است را پس از باز كردن گوگل در نوار آدرس مرورگر خود مشاهده كنيد.

چرا فاوآيكون مهم است؟

فاوآيكون‌ها عليرغم اندازه كوچكشان، نقش مهمي را در فرآيند بهبود تجربه كاربري، برندسازي، آگاهي از برند و ايجاد تصوير ذهني مثبت براي بازديدكنندگان ايفا مي‌كنند و وب سايت شما را حرفه‌اي تر جلوه مي‌دهند. زماني كه كاربران سايت شما را بوك مارك مي كند، فاوآيكون شما در كنار عنوان صفحه و در ليست بوك مارك‌هاي آنها نمايش داده مي‌شود و به كاربران كمك مي‌كند تا بتوانند محتواهاي شما را در ميان ساير محتواهاي بوك مارك شده به راحتي پيدا كنند. برخي از مهم‌ترين دلايل اهميت طراحي فاوآيكون براي وب سايت‌ها شامل:

تجربه كاربري (User Experience)

فاوآيكون‌ها به عنوان نشانه‌ها و نمادهاي بصري به ياد ماندني براي وب سايت شما عمل مي‌كنند و موجب بهبود تجربه كاربري بازديدكنندگان خواهند شد. Favicon به كاربران كمك مي‌كند تا به راحتي تب وب سايت شما را در مرورگر خود و در برنامه‌هاي مختلف مانند نوار بوك مارك پيدا كنند كه اين امر بازديد مجدد از سايت شما را براي آنان آسان‌تر مي‌سازد. فاوآيكون‌ها همچنين تاثير مثبتي بر تجربه كاربران در تلفن همراه نيز خواهد داشت؛ زيرا طراحي وب در تلفن همراه با هدف تاثيرگذاري بر كاربران انجام مي‌شود و طراحي فاويكون به شما كمك مي‌كند تا وب سايت و يا برند خود را به طور موثر در ذهن كاربران ثبت نماييد.

برندسازي (Branding)

براي ساخت يك برند منسجم و قدرتمند حتي بايد به كوچكترين جزئيات توجه داشته باشيد. فاوآيكون‌ عليرغم اندازه و ابعاد كوچك، با گسترش زبان برند شما در خارج از سايت و قرار دادن آن در مرورگر وب به برندسازي و ديده شدن وب سايت شما كمك بسياري مي‌كند. فاوآيكون همچنين ميزان اعتبار و حرفه‌اي بودن وب سايت شما را افزايش مي‌دهد و آن را به وب سايتي جامع و كامل در نگاه بازديدكنندگان تبديل خواهد كرد.

اعتبار (Credibility)

در حالي كه فاوآيكون‌ها هيچ تاثيري بر امنيت سايت شما ندارند اما به آن اعتبار مي‌بخشند و اعتماد كاربران را جلب مي‌كنند؛ زيرا اين نمادهاي كوچك به بازديدكنندگان حس امنيت و واقعي بودن را انتقال مي‌دهند. بنابراين براي آنكه بتوانيد به وب سايت خود رسميت و اعتبار بخشيد، تاثير طراحي فاوآيكون در اين امر را دست كم نگيريد.

بازگشت كاربران (Return Users)

فاوآيكون‌ها يك شناسه برند قدرتمند و تاثيرگذار هستند كه به راحتي وب سايت شما را چه در صفحات نتايج جستجو و چه در تاريخچه مرورگر كاربران از ساير وب سايت‌ها متمايز مي‌سازند. از اين رو طراحي يك فاوآيكون قابل تشخيص و خاص به كاربران كمك مي‌كند تا دفعات بيشتري به سايت شما بازگردند. علاوه بر اين نيز زماني كه كاربران سايت شما را بوك مارك (نشانه گذاري) مي‌كنند، وجود يك فاوآيكون اختصاصي، پيدا كردن آن را در ميان ساير موارد ذخيره شده، آسان‌تر مي‌سازد.

بنابراين طراحي فاوآيكون به تقويت هويت يك برند كمك بسياري كرده و وب سايت شما را براي كاربران، قابل تشخيص و به يادماندني خواهد كرد.

طراحي فاوآيكون چه تاثيري بر سئو سايت دارد؟

فاوآيكون‌ها به طور مستقيم بر سئو و رتبه بندي وب سايت شما تاثير نمي‌گذارند اما از آنجايي كه موجب افزايش تعامل مثبت كاربران و بازگشت مجدد آنها به سايت مي‌شوند، به نوعي بر بهبود سئوي سايت تاثير خواهند داشت. مواردي همچون ميزان مشاركت، تعامل، بازديد و نرخ بازگشت كاربران به يك سايت از جمله فاكتورهاي اصلي موتورهاي جستجو براي رتبه بندي آن هستند كه با طراحي فاوآيكون مي‌توانيد به راحتي تمامي آنها را در وب سايت خود بهبود بخشيد.

اگر بازديدكنندگان يا مشتريان نتوانند به سرعت تشخيص دهند كه كدام تب متعلق به سايت شما است، بعيد به نظر مي‌رسد كه نسبت بازديد مجدد از آن اقدام نمايند. بنابراين با طراحي فاوآيكون مي‌توانيد وب سايت خود را از ساير وب سايت‌ها متمايز ساخته و يك نشانه خاص به كاربران معرفي كنيد تا از طريق آن بتوانند سايت شما را در ميان چندين سايت شناسايي كنند. به طور كلي فاوآيكون به صورت ارگانيك، رتبه سايت شما را در نتايج جستجو بهبود مي‌بخشد كه اين امر نيز ارتباط مستقيمي با سئو سايت دارد. در نتيجه مي‌توانيم بگوييم كه طراحي فاوآيكون تاثيرات مثبت و البته غيرمستقيمي بر سئو يك سايت خواهد داشت.

چگونه براي سايت خود Favicon بسازيم؟

سوالي كه اكنون ممكن است برايتان پيش آمده باشد اين است كه چگونه براي سايت خود Favicon بسازيم؟ اغلب وب سايت‌ها معمولا از لوگوي خود به عنوان فاوآيكون نيز استفاده مي‌كنند. بنابراين شما نيز مي‌توانيد در صورت دارا بودن لوگوي اختصاصي براي كسب و كار يا شبكه‌هاي اجتماعي خود، آن را به فاوآيكون تبديل كنيد. اما فاوآيكون را در سايزي بسازيم؟ فاوآيكون بايد به صورت مربع باشد و اندازه آن در حالت ايده آل 16*16 پيكسل است اما مي‌توانيد آن را در ابعاد بزرگ‌تر همچون 32*32 نيز طراحي كنيد. با اين حال براي طراحي و ساخت فاوآيكون بايد مراحل زير را طي كنيد:

مرحله اول: تصوير موردنظرخود را بسازيد

براي طراحي تصوير دلخواه خود به عنوان فاوآيكون مي‌توانيد از ويرايشگرهايي مانند Fireworks، Photoshop، Corel Paint يا يك جايگزين رايگان و متن باز مانند GIMP استفاده نماييد. همانطور كه اشاره كرديم، بسياري از شركت‌ها به منظور ثابت ماندن هويت بصري برندشان از لوگوي خود به عنوان فاوآيكون استفاده مي‌كنند. براي سهولت در ويرايش، طراحي فاوآيكون را با مربع 64*64 پيكسل شروع كنيد و بعدا مي‌توانيد آن را به مربع 16*16پيكسل كاهش دهيد. سپس بايد فايل خود را با فرمت‌هايي همچون jpg، .png، .gif، bmp. يا .tif ذخيره نماييد.

مرحله دوم: تصوير خود را تبديل كنيد

پس از نهايي شدن طرح تصوير فاوآيكون خود بايد آن را با فرمت favicon.ico ذخيره كنيد كه در واقع يك فرمت پيشنهادي است كه توسط اكثر مرورگرهاي وب پشتيباني مي‌شود. براي تبديل فايل خود به فرمت ico ممكن است لازم باشد از يك ابزار آنلاين مانند iconifier.net، prodraw.net يا faviconer.com استفاده كنيد. كار با اين ابزارها بسيار ساده است و تنها كافي است تصوير خود را در آنها آپلود كنيد، اندازه نماد را انتخاب كرده و سپس فايل جديد را با فرمت .ico دانلود نماييد.

مرحله سوم: تصوير را در وب سايت خود بارگذاري كنيد

فايل .ico بايد در دايركتوري ريشه وب سايت شما آپلود شود تا در زمان مراجعه به www.yoursite.co.uk/favicon.ico تصوير آن قابل مشاهده باشد.

مرحله چهارم: كد اصلي HTML را اضافه كنيد

براي آنكه به مرورگرهاي قديمي كمك كنيد تا فاوآيكون شما را شناسايي كنند بايد صفحه HTML وب سايت خود را ويرايش نماييد. اكثر مرورگرهاي جديد، فايل فاوآيكون شما را بدون نياز به اضافه كردن كد پيدا مي كنند. اما براي حصول اطمينان از اينكه تمامي مرورگرها آن را به درستي نمايش مي‌دهند بايد عبارت زير را در تگ‌هاي صفحه خود به هدر اضافه كنيد:

با طي كردن اين چهار مرحله ساده به راحتي مي‌توانيد فاوآيكون طراحي كرده و آن را به وب سايت خود اضافه نماييد. طراحي فاوآيكون يك راه حل بسيار آسان براي بهبود برندسازي آنلاين شما در محيط وب است كه بدون نياز به صرف هزينه‌هاي گزاف موجب بهبود تجربه كاربري و ماندگاري نشان تجاري يا لوگوي شما در ذهن كاربران خواهد شد.

نكات مهم ساخت فاوآيكون

شايد گمان كنيد كه طراحي فاوآيكون به دليل كوچك بودن اندازه آن كار بسيار ساده و آساني است؛ در صورتي كه چنين نيست و براي طراحي اين آيكون ظاهرا كوچك بايد به جزئيات مهمي توجه داشته باشيد تا بتوانيد يك فاوآيكون تاثيرگذار و به يادماندني خلق نماييد. برخي از مهم‌ترين نكاتي كه در هنگام ساخت فاوآيكون بايد به آنها توجه داشته باشيد شامل:

سادگي

اندازه كوچك فاويكون‌ها مستلزم دقيق بودن شما در امر طراحي آن است؛ بنابراين سعي كنيد از بكار بردن عناصر ريز، سايه‌ زني و پرداختن به جزئيات پرهيز كنيد و در عوض يك نماد پررنگ، واضح و ساده طراحي كنيد تا به راحتي قابل تشخيص باشد. به عنوان مثال فاوآيكون‌ شبكه نمايش خانگي نماوا تنها با استفاده از حرف اول نام آن يعني N و رنگ آبي طراحي شده است كه نمادي قابل تشخيص و در عين حال جذابي براي فاوآيكون به نظر مي‌رسد.

طراحي فاوآيكون

حفظ هويت برند

فاوآيكون بايد روح وب سايت و برند موردنظر را در بر بگيرد و براي طراحي آن نيز از زبان بصري و پالت رنگي ساير بخش‌هاي وب سايت استفاده شود. به اين ترتيب فاوآيكون شما با ساير عناصر وب سايت، متناسب شده و مخاطبان به راحتي قادر به برقراري ارتباط و به خاطر سپردن آن خواهند بود. از طرفي ديگر، وجود هماهنگي ميان وب سايت و فاوآيكون به افزايش اعتبار و حفظ هويت برند شما كمك بسياري كرده و آن را در نظر مخاطبان بسيار حرفه‌اي تر جلوه مي‌دهد.

طراحي بدون متن يا با متن اندك

اگر مي‌خواهيد فاوآيكون خود را به صورت متني طراحي كنيد، بهتر است به استفاده از يك الي سه كاراكتر اكتفا كنيد و از نوشتن كامل نام برند خود در آن خودداري نماييد. استفاده از حرف اول نام برند رويكرد رايج و كم ريسكي براي طراحي فاوآيكون به صورت متني است كه جذابيت خاصي به آن مي‌بخشد و بسيار سريع و آسان نيز در ذهن مخاطبان ثبت خواهد شد.

استفاده از لوگو

همانطور كه پيش‌تر نيز اشاره كرديم، بسياري از برندها و وب سايت‌ها از لوگوي خود به عنوان فاوآيكون نيز استفاده مي‌كنند كه انجام اين كار به حفظ هويت و اعتبار آنها كمك بسياري مي‌كند. اما هر لوگويي قابليت تبديل شدن به فاوآيكون را ندارد و بايد تغييراتي در آن اعمال شود. اكثر لوگوتايپ‌ها در صورت كوچك شدن و تبديل به فاوآيكون، خوانايي خود را از دست مي‌دهند؛ از اين رو پيش از استفاده از لوگوي خود به عنوان فاوآيكون بايد تغييراتي همچون حذف تگ لاين‌ها، عناصر و حروف اضافي را در آن ايجاد كنيد. فاوآيكون گوگل بهترين نمونه از اين رويكرد مي‌باشد كه در عين حفظ پالت رنگي و هويت لوگوي آن طراحي شده است. اين فاوآيكون تنها متشكل از حرف اول و آشناي گوگل يعني G است، در حالي كه به طور يكپارچه هر چهار رنگ مارك اصلي گوگل در آن مورد استفاده قرار گرفته است.

رنگ

به خاطر داشته باشيد كه فاوآيكون سايت شما با توجه به زمينه و مرورگر مورد استفاده كاربران و در پس زمينه‌هاي رنگي مختلف نمايش داده مي‌شود. بنابراين پيش از نهايي كردن طرح، حتما فاوآيكون خود را بر روي پس ‌زمينه‌هاي خاكستري، سفيد و مشكي آزمايش كنيد تا از وضوح و جذابيت بصري كافي برخوردار باشد.

با در نظر داشتن اين موارد مي‌توانيد يك نشان كوچك ساده اما در عين حال جذاب طراحي كنيد و از آن به عنوان فاوآيكون وب سايت خود استفاده نماييد.

جمع بندي

ما در اين مطلب موضوع فاوآيكون چيست؟ را به طور كامل مورد بررسي قرار داديم و شما را با نحوه ساخت و نكات طراحي فاوآيكون نيز آشنا كرديم. همانطور كه خوانديد، فاوآيكون‌ يك نماد مربعي كوچك است كه در مرورگرهاي وب جهت نمايش يك وب سايت يا يك صفحه مورد استفاده قرار مي‌گيرد. فاوآيكون موجب متمايز ساختن وب سايت شما از ساير وب سايت‌ها شده و موجب بهبود تجربه كاربري، حفظ هويت و اعتبار برند شما خواهد شد.