ארכיטקטורת מידע
Information Architecture: הטכניקות שהופכות דף רגיל לדף שגוגל וגולש רואים בו עומק: היררכיה (איפה הדף בעץ ולאן הוא מוביל) ועומס (כמה תוכן הוא נושא בלי להיראות כבד). כל דף של THE FLOOD נבנה מהן, בסדר הזה.
#cp-hierarchy
1. היררכיה: איפה הדף בעץ, ולאן הוא מוביל
| # | הטכניקה | מה היא עושה לדף | בארסנל |
|---|---|---|---|
| 1.1 | פירורי לחם בשלוש רמות, עם רשימה נפתחת של האחים (הפטרן של Google Drive) | מראה איפה הדף בעץ, ומקפיץ לדף אח בלחיצה, בלי לחזור לאבא. שלוש רמות גורמות לאתר להיראות גדול. | UkBreadcrumb עם siblings |
| 1.2 | כתובת שטוחה לישות, תיקייה לקטגוריה | החלטה (29.10, הפכה את זו מ-28.10): דף של ישות (שירות, תחום) יושב בכתובת שטוחה, /services/website-speed, וקטגוריה (אתרי AI, תגית) שומרת על התיקייה שלה. כך TripAdvisor: היררכיה רק לדפי קטגוריה, ולא למגדל אייפל, ולכן הכתובת לא משתנה כשהקיטלוג משתנה. האבא מופיע בפירורי הלחם ובפס הענף, לא בכתובת. כמו בבלוג. אם יופיעו בעיות בחיפוש, עוברים לתיקיות. | UkBreadcrumb, ו-aiAreaHref ב-data/ai-areas-data.ts |
| 1.3 | תפריט צד: האבא בראש, הילדים מתחתיו | עוד דרך להראות היררכיה: רשימה בצד הדף, האבא ראשון ומודגש, הילדים מוזחים מתחתיו והדף הנוכחי מסומן. מראה את כל הענף בבת אחת, גם כשהוא ארוך מדי לפס טאבים. בפועל אין לזה שימוש באתר, באף מקום (28.10). | לא עכשיו: פס האחים (BranchNav) מראה את הענף כולו |
| 1.4 | פס טאבים בין דפים אחים | מעבר בין אחים בלי לחזור לאבא. | UkSiblingNav |
| 1.5 | פס טאבים שמתחלף לפי המקום (TripAdvisor: ישראל, אילת) | הטאב הראשון הוא המקום שבו אתה עומד, ואחריו אותם צירים (דברים לעשות, מלונות, מסעדות) בתוך המקום הזה. עוברים לאילת, והפס כולו עובר לאילת. מנגנון אחד: ישראל היא רשימה, אילת היא רשימה. | UkSiblingNav, האבא כטאב ראשון (בענף הניסוי) |
| 1.6 | בפס העליון מילה אחת, לא השם המלא | הפס הוא חלק מהפולד: "עיצוב", "קידום", "נגישות", ולא "עיצוב אתרים עם AI" שמונה פעמים. השם המלא נשאר בכותרת הראשית וברשימה הנפתחת של פירורי הלחם. ההיררכיה בפס עצמו: המקום (האבא) ראשון, גדול ומודגש ועם אייקון, ואחריו המילים הקצרות. נגישות: המילים באפור נמדדו 6.5:1 על הרקע של הפס (המינימום 4.5:1), הנוכחי והאבא כמעט שחורים. הפס משותף לאבא ולילדים (28.10): גם בדף אתרי AI הוא במקום פס השירותים, והמעבר לשירותים האחרים עובר לתפריט ולפירורי הלחם. | UkSiblingNav: lead לאבא, שדה tab קצר בנתונים |
| 1.7 | פולד לפי רמה: דף ראשי מול דף עלה | דף ראשי של ענף (TripAdvisor: "Jerusalem, Israel") פותח בסליידר תמונות רחב עם חצים ומונה תמונות, ומתחתיו כותרת גדולה מיושרת להתחלה ומבוא: נראה כמו עמוד של מקום, "ראשי" יותר. דף עלה (TripAdvisor: "Top 15 Things to Do in Banff") מפוצל: מצד אחד כותרת, שורה וכפתור, ומצד שני תמונה. Coursera באותו היגיון (ברפרנסים): דף האבא ("Data Analyst") מפוצל עם דמות חתוכה ובלי כפתור, כי הוא מוביל לילדים; דף הבן ("Generative AI Data Analyst") עם שני כפתורים וכרטיס עובדות. אף אחד מהם לא ממורכז. כל דף יכול להיות דף הכניסה מגוגל, ולכן כל רמה נושאת פולד שלם משלה: המנגנון זהה, רק הצורה מתחלפת לפי הרמה. בענף הניסוי הילדים כבר מפוצלים, עם תמונה שנמשכת לקצה (uk-expand-to-edge עם padding). | אבא: האריחים של הילדים ראשונים (website-building, ענף ה-SEO). עלה: ראש מפוצל, [area]/page.tsx |
| 1.8 | מה ענף חולק, ומה חופשי | דפי ענף חולקים את הפס העליון, את פירורי הלחם ואת השאלות הנפוצות, וזה מה שהופך אותם לענף. הגוף של כל ילד חופשי: התבנית הקלה מעל קובץ הנתונים, או דף סינגל עשיר שנבנה ביד (כמו עיצוב אתרים). עם AI דף עשיר זול, ולכן יש גמישות (28.10). | BranchNav (data/branches.ts), UkBreadcrumb, UkAccordion |
| 1.9 | קטגוריות כאריחי תמונה (Walmart, באג, KSP) | עוד דרך להציג קטגוריות, ויזואלית מאוד: במקום רשימת קישורים או טאבים, הילדים מוצגים בדף כשורת אריחים (או סליידר): תמונה על רקע אפור בהיר ושם קצר מתחת. היתרון: נקי מאוד לעין, גם עם הרבה קטגוריות. העיקרון: בכל תמונה אלמנט אחד בודד (מוצר, חפץ, אייקון), חתוך על רקע שקוף, בלי סצנה ובלי טקסט. הרקע של האריח בא מהעיצוב (אפור בהיר, צבע המותג, כל צבע), ולכן כל האריחים נראים כסדרה אחת. נפוץ גם ב-KSP. מעליהם אפשר שורת גלולות עם אייקון קטן לכל אחת. | UkCategoryTiles (גריד או סליידר, גדול או קטן), דוגמה חיה למטה |
| 1.10 | דף ישות שהתוכן שלו הוא גריד של הקטגוריות שלה, עם בורר במקום פירורי לחם (Legal500: משרד עורכי דין, "Spain") | דרך טובה למלא דף ישות בתוכן אמיתי בלי לכתוב אותו: הדף של משרד מציג כרטיס לכל תחום שהוא מדורג בו (תחום, דירוג), ובורר אחד בראש (דרופדאון של מדינה) מחליף את כל הגריד. הבורר עושה את מה שפירורי לחם ותפריט צד עושים, בפחות מקום: הוא אומר איפה אתה בציר ומעביר לערך אחר שלו. לצידו תפריט צד קצר של חלקי הדף (דירוגים, אודות, צוות, צור קשר). אצלנו: דף עורך דין או משרד בדמו, כרטיס לכל תחום עיסוק, ובורר של עיר או ענף (29.10). | לא עכשיו: מתאים לדמו של עורך דין, לא לאתר הסטודיו |
| 1.11 | הילדים כרשימה או כגריד | דף אבא הוא מבוא שמוביל לילדים שלו. | LinkRows (בסטודיו, לקדם לארסנל), UkToggleList |
| 1.12 | עץ הנתונים: אבא, ילד, נכד, ומי אח של מי | המנוע: כל הקישורים בדף נגזרים ממנו, ודף חדש הוא שורה בעץ. בנוי (29-30.10): הענפים והילדים שלהם, ומהם נבנים פירורי הלחם, פס האחים, האריחים, שורת השירותים, הפוטר, התפריט, החיפוש ומפת האתר. | data/branches.ts (BRANCHES, branchEntities, branchOf) |
| 1.13 | פריט אחד, הרבה רשימות (הטכניקה של TripAdvisor) | פריט מחובר למקום אחד בעץ, וכל דף מעליו מציג אותו ברשימה שלו (מוזיאון בדנבר מופיע גם בקולורדו וגם בארצות הברית). קטגוריה היא תגית שמסננת את אותה רשימה בגלולות. השייכות עולה במעלה העץ: המצפה התת ימי מחובר לאילת, ולכן הוא גם ברשימה של ישראל, בלי שורה נוספת. כך יש דף "ישראל" ודף "אילת" מאותו תוכן, וזו טכניקת הקידום שמאחורי הקלעים. מקום כפול קטגוריה יכול להיות דף מלא, מתוכן שכבר קיים. הגבול הוא החלטה, לא חוק (גם TripAdvisor עצר: אין "קולורדו, מוזיאונים"): דף רק כשיש מספיק פריטים וגם נפח חיפוש. אחרת הפריט מופיע ברשימת האבא, מסונן בגלולה. | בגרסה שלנו: דף מופיע ברשימת הענף שלו ובכל דף תגית שהוא נושא ("עמודים בנושא"). הגלגול כלפי מעלה (אילת → ישראל) לא נדרש ב-14 דפים |
| 1.14 | "יעניין אותך גם": אחים ובני דודים | כל דף מוביל לעוד דפים, ואין דף ללא יציאה. בנוי: האחים הבאים באותו ענף, מסביב לסוף, ואחריהם דפים מענפים אחרים, כך שגם ענף קטן ממלא שלושה כרטיסים. | entityNeighbours ב-data/branches.ts, בתחתית services/[area] |
| 1.15 | רשת קישורים בטאבים (כמו GetYourGuide) | בלוק בתחתית הדף, מעל הפוטר: שורת טאבים ("אטרקציות מובילות", "יעדים", "מדינות", "קטגוריות"), וכל טאב פותח גריד של 20 עד 30 קישורים לדפים באתר. עשרות קישורים פנימיים במקום קטן, ורק טאב אחד גלוי בכל רגע. אצלנו: טאבים כמו "שירותים", "תחומים", "טכנולוגיה", וגריד קישורים מתחת לכל אחד | לא עכשיו: אין מספיק צירים לטאבים |
| 1.16 | צירים של אותו היצע (הפוטר של Meta for Business, ברפרנסים למטה) | אותו היצע נחתך לפי מה שהגולש מחפש: המוצר, הכלים, המטרה ("להביא לידים"), סוג העסק (עסק קטן, סוכנות) והתעשייה. כל ציר הוא רשימה, וכל פריט בו דף. אצלנו כבר יש תחומים (/build-website) וסוגי אתרים (/types). חסר ציר "מה כואב לך": נמדד ב-28.10, ויש נפח רק לשיפור מהירות אתר (210), תחזוקת אתר (140, ועוד 70 לוורדפרס) ושדרוג אתר (30). חידוש אתר, מעבר מוורדפרס ומעבר מוויקס בלי נפח. | תחומים וסוגים קיימים; שני הכאבים עם נפח, מהירות ותחזוקה, הם דפים בעץ (30.10). שדרוג אתר (30) לא שווה דף |
| 1.17 | דפי השוואה: X מול Y (Webflow: 23 ב-/vs, Wix: 14 ב-/compare, Lovable: bolt-vs-lovable) | מי שמשווה בין שתי אפשרויות כבר קרוב להחלטה. כל אחד משלושת בוני האתרים מחזיק דף לכל מתחרה. אצלנו: "Webflow או Wix", "אתר בקוד או בפלטפורמה". נמדד לפני שנבנה. | סוג תוכן ולא מבנה: רלוונטי לאתר שמוכר מוצר מול מתחרים (בוני האתרים), לא לכל אתר. רעיון לתוכן לקידום, כשיהיה לו נפח |
| 1.18 | עמודת קישורים בפוטר | עוד קישור פנימי לכל ענף, מכל עמוד באתר. | הפוטר קורא מקובץ הנתונים |
#cp-load
2. עומס: הרבה תוכן, בלי שהדף ייראה כבד
| # | הטכניקה | מה היא עושה לדף | בארסנל |
|---|---|---|---|
| 2.1 | כותרת רשימה עם שנה ומספר תוצאות (Viator: "All USA Tours & Excursions in 2026", "1,000+ results") | השנה בכותרת אומרת שהרשימה עדכנית, והמספר אומר כמה יש בה. שניהם נגזרים לבד: השנה מהתאריך, המספר מהעץ. אותו מנגנון של TripAdvisor, וגם Coursera עובדים כך. | לא עכשיו: רשימות של 8 פריטים, לא של 1,000 |
| 2.2 | מבוא עם "קרא עוד" | הרבה טקסט בדף בלי שהדף ייראה כבד. | UkReadMore |
| 2.3 | שורת פרטים עם מפרידים | אצל Coursera זה כרטיס עובדות שעולה על תחתית הראש (מספר קורסים, דירוג, רמה, זמן; ברפרנסים). עובדות קצרות ליד הכותרת (משך, מחיר, מיקום) במבט אחד. | לא עכשיו: לשירות אין עובדות של משך ומחיר |
| 2.4 | שורות סליידר של פריטים ("יעדים מובילים"), עם או בלי "הצג הכל" | הרבה פריטים בשורה אחת, ושורה לכל קבוצה: הדף נראה מלא בלי להיות ארוך. "הצג הכל" מוביל לדף הרשימה המלא. | ClassicGrid, עם moreSlide ל"הצג עוד" |
| 2.5 | תפריט סקשנים שעוקב אחרי הגלילה | בדף ארוך, קפיצה ישירה לחלק. | SwiperSubMenu |
| 2.6 | יותר מדי אחים לרוחב: "עוד ⌄" (GitHub, Google) | עץ שגדל מוסיף אחים, ופס הטאבים נגמר לפני שהם נגמרים. בפס מוצגות רק הלשוניות שנכנסות, והשאר נכנסות לכפתור "עוד" בסוף השורה. כשהדף הנוכחי בתוך "עוד", הכפתור מקבל את השם שלו, כך שהפס תמיד אומר איפה אתה. החישוב רץ מחדש בכל שינוי רוחב. עד 30.10 הפס נגלל הצידה עם דהייה, ו-13 תחומים ב-1160 פיקסלים נחתכו, כי לעכבר אין גלילה הצידה. בטלפון הפס כולו הוא כפתור אחד עם רשימה. | UkSiblingNav (moreLabel), בכל פס אחים בלי הגדרה |
| 2.7 | נתיב ארוך בפירורי לחם: "…" בטלפון | עץ עמוק עושה נתיב של חמש רמות, וזה לא נכנס בשורה של טלפון. מ-4 פירורים, הפירורים שבאמצע מתקפלים ל-"…" ונשארים הבית, האבא והדף. לחיצה על "…" פותחת את הנתיב המלא, בלי JS. בדסקטופ הנתיב המלא תמיד מוצג. כל הפירורים נשארים ב-HTML, כך שהסכמה שומרת את הנתיב כולו (30.10). | UkBreadcrumb (collapseFrom, ברירת מחדל 4) |
| 2.8 | שאלות נפוצות | עוד תוכן אמיתי שעונה על חיפושים. | UkAccordion, ו-faq-data.ts |
| 2.9 | מספור ליד כל קישור ("1320 סיורים ופעילויות") | תחושת נפח: כל קישור מראה כמה יש מאחוריו. אצלנו נספר לבד מהעץ, כמה ילדים חיים יש לכל דף (30.10: "בניית אתרים (8)" באריחים של /services). | UkCategoryTiles, השדה count |
| 2.10 | רשימת קישורים ממוספרת תחת נושא (Klook: "Explore more") | בתחתית דף עשיר, כמה כותרות ותחת כל אחת קישורים קטנים עם מספר: אטרקציות בעיר, כל מה שצריך לביקור, יעדים באזור (אחים, צירים, והאחים של האבא). עיצוב קומפקטי לקישורים נלווים מאפשר לשים מתחת לתוכן עשרות קישורים פנימיים, בלי שהדף ייראה כבד. המספר הוא דירוג. | בגרסה שלנו: הפוטר הפתוח, כל הדפים בעמודות (30.10). בלי המספר |
| 2.11 | תגיות: ציר שחוצה את העץ | קטגוריה היא מקום אחד בעץ (אבא וילדים). תגית חוצה אותו: כמה דפים מענפים שונים נושאים אותה, ולה דף משלה שמרכז אותם. אלה שתי הדרכים המרכזיות לארגן תוכן. בנוי (29-30.10): /tags ועשר תגיות. לכל תגית רמה, primary (דף מלא בתבנית של Lovable, בפוטר ובתפריט) או secondary (מה זה, האתר הרשמי, קישורים). parent מושיב אותה תחת שירות (PageSpeed תחת שיפור מהירות), והדרופדאון בפירור האחרון מציג רק אחים מאותו מקום. מקבילה גדולה: 8,761 דפי התגית של Webflow. | AI_TAGS ב-data/ai-areas-data.ts (level, parent), tags/[tag]/page.tsx |
| 2.12 | טופס בסוף הדף | כל דף הוא גם נקודת יציאה לליד. | טופס הצור קשר, עם trackLead |
#cp-order
סדר לדוגמה, מלמעלה למטה
- ניווט
- פירורי לחם, ותחתיהם פס האחים
- ראש הדף (UkInsideHeader): כותרת, מבוא עם "קרא עוד", שורת פרטים
- תפריט סקשנים, בדף ארוך
- דף אבא: הילדים כרשימה או גריד. דף עלה: גוף התוכן
- שאלות נפוצות
- "יעניין אותך גם"
- טופס
- פוטר, עם עמודת הענף
דוגמה לדף שירות, לא סדר חובה: כל דף לוקח את החלקים שמתאימים לו, ובסדר שמתאים לו.
אין שורה חסרה. ⏸️ הם דפוסים אמיתיים שלא נדרשים היום: תפריט צד, גריד של ישות עם בורר, רשת טאבים, כותרת עם שנה ומספר ושורת פרטים לא נדרשים באתר בגודל הזה, ודפי השוואה הם סוג תוכן לאתר מסוים ולא מבנה.
#cp-not-duplicate
למה זה לא שכפול דפים
גוגל מעניש דפים בכמות שאין בהם ערך (Scaled content abuse): אותו דף עם מילה אחרת, בשביל החיפוש בלבד. תבנית חוזרת היא לא הבעיה, ולכן Duda מחזיקים 134 דפי מקצוע ו-Squarespace 60 נכדים. מה שהופך דף מתבנית לדף אמיתי, ומה ש-FLOOD בונה לתוך כל דף:
- חיפוש אחר לכל דף. מילה עם נפח, שאין לה דף אחר באתר. שני דפים על אותו חיפוש הם הקניבליזציה, לא התבנית.
- מקום משלו בעץ. אבא, אחים וילדים משלו, בפירורי הלחם, בפס האחים ובפוטר. דף שמחובר לעץ הוא חלק מאתר, לא דף שנשפך מבחוץ.
- תוכן שמגיע מהנתונים של הדף. הדמואים של התחום, התגיות שלו, השאלות שלו. אצל Duda זה התבנית המוכנה של המקצוע, אצל Webflow התבניות של הקטגוריה.
- כותרת, title ותיאור משלו. נבנים מה-H1, ולא מועתקים מדף אחר (check:seo בודק שאין כפולים).
- דרך לפעולה. פס ליד וטופס: הדף משרת את מי שהגיע, לא רק את גוגל.
הסימן לבעיה: דף שאם מחליפים בו את המילה הראשית, אף אחד לא ישים לב. אצל Duda זה בערך רבע ספציפי ושלושה רבעים זהים, וזה הגבול התחתון. אצלנו כל דף מקבל יותר מזה.
#cp-trees
העצים של בוני האתרים
נספר ממפות האתר שלהם ב-30.10, אנגלית בלבד. רוב העץ הוא קטלוג שמתמלא לבד (תבניות, אתרים של משתמשים, אפליקציות). המספר שלו לא מעניין: 30 תבניות או 23 אלף, זה אותו collection list שמרנדר דף לכל פריט. מה שמעניין הוא הצירים: באילו דרכים חותכים את אותו מלאי. החלק של FLOOD, דף לכל סוג אתר, לכל קהל ולכל מתחרה, הוא עשרות עד מאות דפים. שני דפוסים חוזרים אצל כולם: דף לכל תחום עיסוק (Duda 136, Squarespace 70 בשתי רמות, Base44) ודפי השוואה למתחרים (Squarespace 24, Webflow 23, Framer 19, Wix 14). אצלנו המקבילות: הדמואים הם הקטלוג, /build-website הוא הדפים לפי תחום, וההשוואות חסרות. ל-Bolt אין עץ בכלל: שני דפים במפת האתר.
| האתר | דפים | רוב העץ | החלק של FLOOD |
|---|---|---|---|
| Webflow | 124,600 | אתרים של משתמשים 95,110 · פרופילים של משתמשים 14,257 · דפי תגית של האתרים 8,761 (webflow-localization, web3js…) · תבניות 2,809 · בלוג 1,572 · אפליקציות 345 | אבא /list → 750 ילדים, אחד לכל סוג אתר (about-us, accountant, agency…) · /vs 23 השוואות · /solutions 17 לפי קהל · דוגמה · מפת האתר |
| Wix | 10,724 | תבניות 3,400 · בלוג 1,854 · חנות אפליקציות 1,852 · Studio 953 · דוגמאות של אתרים 438 · דומיינים 330 | דף לכל סוג בונה (website-builder, ai-website-builder, landing-page-builder, portfolio-website, restaurant/website…) · /compare/hub 14 השוואות · מפת האתר |
| Squarespace | 6,365 | הצעות של שותפים (/offers) 4,044 · כתבות עליהם 1,052 · בלוג 869 | אבא /solutions → 10 ילדים (beauty…) → 60 נכדים (makeup-artists, barbershops…) · /compare 24 השוואות · דוגמה · מפת האתר |
| Framer | 3,305 | תיעוד למפתחים 1,910 · מילון מונחים 566 · מרכז עזרה 300 · אקדמיה 171 | /solutions 27 · /compare 19 השוואות · מפת האתר |
| Base44 | 1,450 | תבניות 1,129 · בלוג 174 | אבא /website-builder → ילד business-site → נכדים לכל תחום (roofing, fitness, restaurant, law-firm…) · /use-cases 82 לפי קטגוריה · דוגמה · מפת האתר |
| Jimdo | 390 | בלוג 338. הבית שלהם בגרמנית: 2,981 דפים בכל השפות | אבא /website → 29 ילדים (wedding, restaurant, medical, coaching, real-estate, photography…). בלי השוואות. שחקן קטן: סוגי אתרים ובלוג, וזהו · דוגמה · מפת האתר |
| Duda | 982 | עדכוני מוצר 628 · וובינרים 173 | אבא /website-builder → 134 ילדים, אחד לכל מקצוע (accounting, carpenter, dentist…), בלי נכדים: בדיוק /build-website שלנו · דוגמה · מפת האתר |
| Lovable | 1,310 | מדריכים 294 · תבניות 251 · בלוג 174 · סרטונים של יוצרים ביוטיוב 182 · משרות 80 | /build: 15 דפים של "X builder" · דף לכל קהל (small-business, healthcare, agencies, marketers) · השוואות (bolt-vs-lovable) · מפת האתר |
#cp-field-ideas-head
רעיונות לתחומים
כל התחומים שבוני האתרים בנו להם דף, כמאגר לרעיונות ל-/build-website. תחום נכנס אצלנו רק אחרי מדידת נפח בעברית.
3d-printing-services · accounting · adventure-sports-equipment · adventure-tourism · alpaca-farm · antique-appraiser · antique-restoration · aquaponics-farm · architect · aromatherapy-products · art-gallery · art-therapy-services · automation · bagel-shop · bakery · ballroom-dance-lessons · bicycle-repair · bicycle-tours · bird-watching-tours · board-game-café · bookstore · brewery · carpenter · catering-service · childcare-service · chiropractic · church · cleaning-service · coffee-shop · consignment-store · construction-company · consulting · contractor · custom-furniture-design · dance-studio · daycare-center · dentist · diy-simple-editor · drone-photography · eco-friendly-products · electrician · escape-room-business · event-planning · exterminator · farmers-market · fitness-studio · florist · food-truck · glassblowing-studio · graphic-design-studio · green-energy-consultancy · hair · handmade-crafts-store · health-food-store · helicopter-tours · home-builder · home-staging-service · hvac · hydroponics-farm · indoor-playground · insurance · interior-design-consultancy · it-services · jewelry-store · knife-sharpening-service · landscaping · language-school · law-firm · life-coaching · local-craft-brewery · massage-therapy · mobile-app-development · mushroom-farming · music-school · non-profit-organization · online-retail-store · online-tutoring · organic-skincare-products · personal-training · personalization · pet-grooming · photography-studio · plastic-surgery · pottery-studio · pressure-washing · printing-shop · private-tutoring · property-management · real-estate · recording-studio · recycling-service · renewable-energy-solutions · restaurant · reviews · roofing · rv-park · salsa-dancing-classes · second-hand-store · security · skateboard-shop · smart-home-installation · social-media-management · software-development · spa · sports-equipment-store · sustainable-fashion · tailoring · tattoo-studio · taxidermy-service · tea-shop · tech-startup · thrift-shop · tourism · toy-store · tradie · translation-services · travel · tree-service · trucking · urban-farming · veterinary · video-production · vineyard · virtual-assistant-services · virtual-reality-arcade · voiceover-services · water-sports-equipment-rental · web-design-agency · wedding-planning · white-label · wildlife-photography-tours · woodworking-shop · yoga-studio · youth-mentoring-program
דף לדוגמה: beauty / makeup-artists
- beauty: hair-salons · jewelry-makers · makeup-artists · tattoos-piercings · nail-studios · barbershops
- professional-services: real-estate-agents · tech-it-services · marketing-agencies · legal-services · professional-coaches · consultants
- sports: sports-coaches · sporting-goods · fitness-centers · sports-camps · personal-trainers · yoga-studios
- personal: podcasts · creators · freelancers · weddings · portfolios · resumes-cvs
- home-services: home-decor · landscapers · cleaning-services · pet-care · auto-repair · contractors
- health: massage-therapists · acupuncturists · wellness-retreats · recovery-centers · nutritionists · medspas
- events: restaurants-bars · concerts-shows · festivals · activities · camps · travel-agencies
- education: vocational-training · language-schools · dance-schools · art-instruction · music-teachers · exam-prep-tutors
- creative-services: fashion-apparel · interior-designers · architects · artists · graphic-designers · photographers
- nonprofits: youth-education · arts-culture · environment-conservation · community-groups · philanthropy-advocacy · faith-communities
architects · artist · business · coaching · coupon · domain · fitness · free · freelance · hair-beauty · how-to-blog · how-to-create · lifestyle-blog · local-business · medical · music · online-store · personal-hobby · photography · portfolio · real-estate · restaurant · resume · teacher · travel-blog · vacation-rental · website-builder · wedding · writers-authors
#cp-atlassian-head
Case study: Atlassian, מרכזי ידע סביב המוצר
לא בונה אתרים, אותה שיטה. 6,365 דפים באנגלית (מפת האתר). חוץ מהבלוג, רוב העץ הוא לא המוצר אלא התחום שלו: מה זה Agile, איך מנהלים פרויקט, איך עובדים עם Git. מי שמחפש את השאלה מגיע ל-Atlassian, ומשם ל-Jira.
אבא, ילד, נכד לכל נושא. /agile הוא אבא, agile-at-scale ילד, lean-portfolio-management נכד. כל נושא הוא עץ שלם, לא מאמר אחד.
| ציר | דפים | איך נוצר |
|---|---|---|
| מרכזי ידע לפי נושא: /agile, /work-management, /itsm, /devops | ~600 | אבא לכל נושא → ילדים → נכדים. /agile → agile-at-scale → lean-portfolio-management · דוגמה |
| מדריכים טכניים: /git, /data | 191 | שאלה אחת, דף אחד ("איך יוצרים משתמש ב-psql") · דוגמה |
| תבניות של המוצרים (Confluence, Jira) | 294 | דף לכל תבנית · דוגמה |
| פלייבוק לצוותים (/team-playbook) | 88 | דף לכל תרגיל · דוגמה |
| השוואות (Jira מול Asana, ClickUp, GitHub…) | 11 | כתוב ביד · דוגמה |
| בלוג | 3,280 | כתוב ביד, לאורך שנים · דוגמה |
מה לוקחים: המדריך לבניית אתר (/guides/build-a-website, 27 דפים) הוא ה-/agile שלנו: מרכז ידע על התחום, שמוביל לשירות. אצל Atlassian כל פרק הוא אבא עם ילדים ונכדים. היום אין לו כמעט כניסות, אז הוא לא בעדיפות, אבל זו הצורה שהוא יכול לגדול אליה.
#cp-webflow-head
Case study: Webflow, 124,600 דפים שהמשתמשים ממלאים
הקהילה כותבת את העץ. כ-118 אלף מתוך 124,600 הדפים נוצרו בידי המשתמשים: אתר שפורסם, פרופיל, תגית. Webflow בנו תבנית אחת לכל סוג ונתנו לקהילה למלא. אף שחקן אחר לא מגיע לזה.
הקטלוג חתוך בכל ציר אפשרי. אותן 1,178 תבניות מופיעות בעץ של אבא, ילד ונכד (קטגוריה, תת-קטגוריה), בדפי חיפוש (1,424, דף לכל מילה), וברשימות "8 התבניות הטובות לרואה חשבון" (750). שלושה צירים על אותו מלאי, וכל ציר תופס חיפושים אחרים.
תוצאת חיפוש שהפכה לדף. /templates/search/3d-portfolio-template: חיפוש שמישהו עשה באתר הפך לדף עם כתובת קבועה. זה הדפוס הכי אגרסיבי פה.
החלק שנכתב ביד קטן: 18 פיצ׳רים, 23 השוואות, 17 פתרונות לפי קהל.
| ציר | דפים | איך נוצר |
|---|---|---|
| אתרים שמשתמשים פרסמו (Made in Webflow) | 95,110 | המשתמשים: כל אתר שמפורסם בקהילה הוא דף · דוגמה |
| פרופילים של משתמשים | 14,257 | המשתמשים: דף לכל מעצב או סוכנות · דוגמה |
| דפי תגית של האתרים | 8,761 | המשתמשים: כל תגית שמשתמש שם הופכת לדף שמרכז את האתרים שלה · דוגמה |
| תבניות: אבא /templates → 28 ילדים (קטגוריה) → 108 נכדים (תת-קטגוריה) → 1,178 תבניות | 1,314 | עץ בשלוש רמות מעל הקטלוג · דוגמה |
| דפי חיפוש בתבניות (/templates/search) | 1,424 | דף לכל מילת חיפוש (3d, a-b-testing…): תוצאת חיפוש שהפכה לדף · דוגמה |
| "8 התבניות הטובות ל-X" (/list) | 750 | אבא /list → 750 ילדים, אחד לכל סוג אתר: רשימה שנבנית מהקטלוג · דוגמה |
| אפליקציות ואינטגרציות | 528 | דף לכל חיבור · דוגמה |
| פיצ׳רים (/feature) | 18 | כתוב ביד: דף לכל פיצ׳ר (cms, seo, hosting, localize…) · דוגמה |
| השוואות (/vs) | 23 | כתוב ביד: מול Wix, WordPress, Framer, Vercel… · דוגמה |
| רשימת נגישות (/accessibility/checklist) | 39 | דף לכל משימה ברשימה · דוגמה |
מה לוקחים: מלאי אחד, הרבה צירים. אצלנו המלאי הוא 66 הדמואים, והיום הם חתוכים רק לפי תחום. אותו מלאי יכול להיחתך גם לפי סגנון (כהה, מינימליסטי), לפי אפקט (אנימציה בגלילה, סליידר) או לפי סוג עמוד (דף נחיתה, אתר תדמית). כל ציר כזה הוא עוד דפים בלי לבנות דמו אחד נוסף, רק אם יש להם נפח.
#cp-squarespace-head
Case study: Squarespace, עץ של 10 × 6
העץ הכי מסודר מכולם: אבא, ילד, נכד. האבא הוא /solutions, הילדים עשר קטגוריות (יופי, שירותים מקצועיים, ספורט, בריאות, חינוך, אירועים, שירותים לבית, יצירה, אישי, עמותות), והנכדים שישה תחומים תחת כל ילד. 70 דפים בשלוש רמות, ולא 134 ילדים שטוחים תחת אבא אחד כמו Duda. זה ה-TripAdvisor של בוני האתרים: ישראל ואז אילת.
אותו תחום בשני צירים. מאפרת מופיעה גם ב-/solutions (למה אתר) וגם ב-/website-templates (התבניות). הדף מסביר, אוסף התבניות מוכיח. אצלנו: /build-website והדמואים בתחום.
כלים קטנים שמביאים חיפוש. מחולל שמות לעסק, אחד לכל סוג עסק. כלי של עמוד אחד, שמי שמחפש "שם למסעדה" מוצא, ומשם כבר קרוב לאתר.
וגם זבל. 4,044 מתוך 6,365 הדפים הם קודי קופון, ועוד 1,052 כתבות עליהם. החלק שעובד הוא בערך 200 דפים.
| ציר | דפים | איך נוצר |
|---|---|---|
| תחום, בשתי רמות (/solutions): 10 קטגוריות, 6 תחומים בכל אחת | 70 | אבא /solutions, ילד לכל קטגוריה (beauty), נכד לכל תחום (makeup-artists) · דוגמה |
| תבניות לפי תחום (/website-templates) | 68 | אותם תחומים בציר שני: האוסף של התבניות שלהם · דוגמה |
| השוואות (/compare) | 24 | דף לכל מתחרה, כולל Lovable ו-Figma Sites · דוגמה |
| כלים חינמיים (/tools) | 15 | מחולל שמות לכל סוג עסק (מסעדה, נדל״ן, ניקיון): כלי קטן שמביא חיפוש · דוגמה |
| קודי הנחה של שותפים (/offers) | 4,044 | דף לכל קוד קופון: מספר גדול, ערך אפס · דוגמה |
מה לוקחים: כשהתחומים רבים, מוסיפים רמה: ילד לכל קטגוריה, והתחומים נכדים שלו. ב-/build-website יש היום אבא ו-12 ילדים, וזה מספיק. ב-30 תחומים זה העץ: אבא /build-website, ילדים כמו בריאות, יופי ומקצועות חופשיים, והתחומים נכדים. ומחולל קטן, כמו "שם לעסק", הוא רעיון זול לדף שמביא חיפוש.
#cp-duda-head
Case study: Duda, 134 תחומים מתבנית אחת
תבנית אחת, 134 דפים. דף רופאי השיניים הוא תבנית שמשבצת את שם המקצוע. רואים את זה בכותרת, "dentist Website Design" באות קטנה: השם נכנס מהנתונים כמו שהוא. בערך שלושה רבעים מהמלל זהים בכל הדפים (היתרונות שלהם, המלצה, שלבים כלליים), ורבע ספציפי: פתיחה, אילו עמודים צריך, איך מעצבים למקצוע (כחול ולבן, מטופלים וצוות), וארבע שאלות.
גוגל לא מעניש תבנית חוזרת. 134 דפים שרובם זהים, כולם במפת האתר וחיים. הם לא נראים כמו קניבליזציה, כי כל דף עונה על חיפוש אחר ("אתר לרופא שיניים", "אתר לחשמלאי"). עוד לא מדדנו איפה הם מדורגים, אבל חברה שמחזיקה אותם כך לאורך זמן כנראה רואה שזה עובד.
כל דף מוביל לתבנית מוכנה. "Preview Template" פותח אתר לדוגמה של המקצוע: הדף מסביר, הדמו מוכיח. אצלנו זה /build-website והדמואים.
הם כותבים לסוכנות, לא לבעל העסק ("Be the go-to expert for dentist clients"). אצלנו הפוך, וזה מתאים לסטודיו: הדף מדבר עם בעל העסק.
| ציר | דפים | איך נוצר |
|---|---|---|
| מקצוע הלקוח (/website-builder) | 134 | תבנית אחת, שם המקצוע מהנתונים · דוגמה |
| ענף, לפלטפורמות שמוכרות אתרים (/vsaas): מלונאות, נדל"ן, מוסכים | 7 | כתוב ביד · דוגמה |
| מי בונה (/solutions): סוכנויות, פלטפורמות, חברות אחסון, קופות | 5 | כתוב ביד · דוגמה |
| השוואות (/compare): מול Webflow, Lovable, WordPress | 3 | כתוב ביד · דוגמה |
| עדכוני מוצר ווובינרים | 801 | נוצר מהעבודה עצמה: כל פיצ׳ר וכל הרצאה · דוגמה |
מה לוקחים: ציר שחוזר על עצמו (מקצוע, עיר) הוא תבנית ונתונים, ויכול להגיע למאות. ציר של קהל או השוואה נכתב ביד, ונשאר קטן. /build-website כבר עובד בשיטה שלהם, 12 תחומים על תבנית אחת. מה שמגביל אותנו הוא נפח החיפוש בעברית, לא העבודה. היתרון שלנו: דמו אמיתי ומלל שנכתב לבעל העסק, ולא שם בתוך תבנית.
#cp-tiles
דוגמה חיה: קטגוריות כאריחי תמונה
אלמנט אחד חתוך בכל תמונה, והרקע בא מהאריח. אצלנו זה לא יגיע לכמויות של וולמארט, אבל העיקרון הוא אותו עיקרון: כשיש הרבה נכדים, מגיעים אליהם דרך קטגוריות ויזואליות, וכשיש מעט, ישר לבן.
גדול, בסליידר (חלק מהאריח הבא מוסתר)
גדול, בגריד
קטן (כמו שורת הקטגוריות של וולמארט מעל רשימה)
#cp-refs
רפרנסים מהאתרים הגדולים













