…עיצוב אתר וורדפרס עם מעצב/ת: איך עושים את זה נכון?
בפוסט זה שעוסק ב-עיצוב אתר וורדפרס באמצעות פניה למעצב/ת, אציע מניסיון איך ניתן (אולי) להימנע מטעויות בתהליך זה כתוצאה מהיעדר ניסיון (ועד לצבירה של ניסיון). הפוסט רלוונטי גם אם אתם מומחים ל-תחזוקת אתר וורדפרס, אך רוצים במסגרת התחזוקה – לשדרג את עיצוב האתר אותו אתם מתחזקים…
פוסט זה מכיל צילומי מסך עם טקסט, אך כיוון שהטקסט לפניהן אומר מה בדיוק יש לעשות, ניתן מבחינת נגישות להסתדר בלעדיהן ולעשות בהצלחה מלאה את המדריך גם בלעדיהם. הם מה שנקרא Nice to have בלבד.
המדריך להלן כתוב בלשון נקבה אך מיועד לכל המגדרים…
בבואכן לבנות אתר עם מעצבת חשוב דעת מה לבקש ולהגדיר לה, כדי להימנע מהצורך לשלם על עבודה רבה אולי, מבלי שתקבלו את התוצאה להן קיוויתן…
- איך אמצא אשת מקצוע טובה?
האם ישנו ידע שהמעצבת צריכה שיהיה לה? או שכל מעצבת אפילו שהתמחתה בפרינט מתאימה (כי "אתר זה כמו פרינט אבל על גבי מסך")?
אני ממליץ לנסות לשכור את שירותיה של מעצבת שלא רק מנוסה בבניית אתרים, אלא אפילו בבניית אתרי וורדפרס עם אלמנטור…
הסיבות:
א. מעצבות פרינט הרבה פעמים לא מתמחות בענייני רזולוציות, גודל ופורמטים של תמונות מבחינת ההיבטים שמעניינים אותנו לבניית אתר וכו'
ב. כמו כן, עיצובים שקל לעשות על נייר, לעיתים קשה לעשותם באלמנטור או אפילו יצריכו קוד עיצובי (CSS)…
ג. ולסיום: מעצבת שלא מבינה באתרים עשויה לא להבין את הצרכים הבבסיסיים של רוב האתרים ומה זה אומר גרפית, למשל מה זה הדר, מה הוא מכיל בדרך כלל, איך כדאי לעצב בו את התפריט, מה הוא בדרך כלל כולל, וכו'..
- התנהלות העבודה עצמה
אני ממליץ שתחפשו עיצוב שמתאים לכן באתר בתחום דומה לאתר שאתן רוצות, ואז לבקש "דומה לו" מהמעצבת. לא זהה כי זאת העתקה ועבירה על חוקי זכויות יוצרים – ואנחנו לא רוצים את זה. זה לא תמיד בעייתי אם האתר שאתן מבקשות לעשות משהו דומה אך שונה ממנו – איננו בוורדפרס, אך ברור שאם אתן בוחרות כמקור השראה עיצוב אתר וורדפרס קיים – וביחוד אתר שעוצב באלמנטור – הדבר כנראה יכול אולי להקל עליכן בידיעה שניתן לעצב כמו שאתן רוצות באתר וורדפרס עם אלמנטור.
3. השירות שאני רוצה הוא של בניית אתר וורדפרס עם אלמנטור, מה לבקש?
יש לבקש את הדברים הבאים מהמעצבת:
א. לרוב נרצה גודל תמונת מסך של 1280 פיקסלים ברוחב, ובערך 850 פיקסלים בגובה, ברזולוציה של 300 פיקסלים לאינץ' (ppi).
ב. שרוב התמונות יהיו בגדלים בהתאמה: תמונה על שליש מסך תהיה ברוחב שליש ממה שציינתי לעיל וכו'.
ג. וידאואים אם יהיו שירוצו רצוי בשירות חיצוני כמו יוטיוב או וימאו ושלא יהיה "גדולים" בנפחם. המטרה: שלא יהיו איטיים ולא יאיטו גם את האתר.
ד. שכל הפונטים שהיא משתמשת בהם יהיו חוקיים עם אישור להשתמש בהם ללא תשלום למשל, ולהקפיד שלא קיבלת "הורדה בחינם" של פונטים ולא ממש מה שצריך שזה "שימוש בחינם".
ה. שאם בשורה מסויימת הגדירה פונט מסויים וצבע מסויים שלו וכו' – שתנסה לא לשנות בתוך אותה השורה דברים אלו – שכן בןןרדפרס אלמנטור צריך לרוב קוד CSS לטיפול והגדרה של זה והרבה מאוד בוני אתרים לא מומחים לקוד כזה.
ו. שאם היא מעדכנת את האתר עיצובית – שזה יהיה בוורדפרס עם אלמנטור עליו וחשוב: דרך האלמנטור, ולא באמצעות שום תוסף.
ז. נסו חוץ מהאלמנטור להתאים לו תבנית שלא מגדירה בתוכה הרבה דברים: תבניות ידועות שאני מכיר שתומכות גם בעברית: הלו אלמנטור (איתה אני בוחר לעבוד כי מאפשרת לעשות הכל באלמנטור), אושיין WP, ו-ASTRA. אחרות נפוצות כוללות וודמארט ואחרות ישנן באנגלית שנפוצות.
מבחינתי ככל שהתבנית עושה פחות דברים – זה מאפשר לי לעצב את הכל דרך האלמנטור…
ח. משהו שחשוב מבחינת דרישות עיצוב: שלא יתחילו להגיד לכם דברים ב"רמת הפיקסל", משמע ממש : שהמסך יחולק לאלמנט ברוחב 322 פיקסל ולידו תמונה ברוחב 552 פיקסל וכו וכו – גם אם ישנה מעצבת שיש לה "חזון" עיצובי מדוייק מאוד – ממילא ישנם מאות אם לא יותר גדלי מסכים שונים שמתנהגים אחרת והאתר שלכם אף פעם כמעט לא יוצג בדיוק אותו דבר על כל גדלי המכשירים וכו' – ולכן אין טעם וזה רק מאוד מאוד מקשה את בניית האתר כשהעיצוב שניתן לכן איננו כללי אלא פרטני ב"רמת הפיקסל".
ט. מבחינת פורמט התמונה: PNG משמש בעיקר כשרוצים שקיפות בחלקו או בקולו המשתלבת עם צבע הרקע. אבל הוא יוצר קבצים דיי גדולים כשהתמונה הינה מורכבת ולא פשוטה.
JPG, מעולה, אבל אין לו אפשרות אם אתן צריכות רקע שקוף. אני בכל אופן – כיום מרבה להשתמש בו (אולי מהרגל)…
WEBP הוא הפורמט החדש והחסכוני שוורדפרס מעדיפה והתחילה לעבוד איתו השנה…
אני רק אציין כהערה "על הדרך" שכאשר אתם מבצעים תחזוקת אתר וורדפרס, ונתקלים באיטיות – שווה קודם כל אולי – לבדוק את פורמט התמונות – שלא נגרמת האיטיות עקב פורמט תמונות "בזבזני"…
י. שוב, מבחינת הפונטים יש לשים לב שאם המעצבת שלכם בחוץ לארץ ועיצבה לכם בפונט אנגלי מסויים – לא בטוח שהביטוי שלו בעברית יהיה בכלל דומה למראה שלו באנגלית וכו'. הפונט שאני דיי אוהב בעברית ואני חושב שהשימוש בו הוא חינמי הוא : Assistant
יא. חשוב ולהדגיש למעצבת: שתשתמש בתמונות שהן PUBLIC DOMAIN, משמע שניתן להשתמש בהן חופשי, או כאלו שנרכשו או הורדו בחינם מאתרי תמונות מתאימים, אליהם לכן או לה יש מנוי ואתן יודעות שאתן רשאיות חוקית להשתמש בתמונות האלו באתר שלכן.
זהו, אלו כל העצות שיש לי הפעם (ואני מייעץ לכן: כי מי שלא יודע לעשות – מייעץ!)
לכל שאלה או עצה, שלחו לי בכיף בבקשה וואטסאפ, למספר: 052-7497628
גיא שקד © 2024
