כללי עיצוב אתר

  • פותח הנושא RE
  • פורסם בתאריך
  • הוסף לסימניות
  • #1
התבקשתי מלקוח לבנות לו אתר אך מאחר ואין לי חלקיק ידע בבנית אתרים חלקנו את ההתפקיד ל-2 עיצוב האתר ובניתו

אני בחלק של עיצוב האתר צריכה לבנות את מראה דף הבית ואת כל הכפתורים וכ'ו

באיזה תוכנה אני צריכה לעצב את דף הבית
ובכלל איך אני אמורה לשמור כל חלק בנפרד או כל שלם?
באיזה סיומת

תודה רבה
 
  • הוסף לסימניות
  • #2
פשוט ביותר-
את העיצוב את יכולה לעשות בכל תוכנה שאת מכירה- אילוסטרייטור, פוטושופ וכו'
שלם לגמרי, מי שבונה יחתוך לחלקים.

לגבי הסיומת של הקובץ תשאלי את מי שיבנה את האתר, אבל לא נראה לי שזה משנה

בהצלחה!!
 
  • הוסף לסימניות
  • #3
תכנון ממשק - בתוכנה ייעודית (כגון Blend) או בעפרון ונייר

עיצוב
- בפוטושופ בלבד

שמירה
- בקובץ PSD כשכל השכבות מחולקות לתקיות ומקוטלגות בצורה טובה

חיתוך העיצוב (slicing)
- מתבצע ע"י המעצב (אם הוא יודע לעשות זאת) או חותך slicer מקצועי או ע"י המתכנת
 
  • הוסף לסימניות
  • #4
ככה?
אני עיצבתי אתר באילוסטרייטור!
 
  • הוסף לסימניות
  • #5
את העיצוב הכי קל להכין באילוסטרייטור ולחתוך אחר כך ולשמור לווב, ככה זה ישמור את התמנה חלקים חלקים. אחר כך אפשר יהיה לבנות את האתר לפני החלקים.
הלקוח יודע שאת לא מבינה בבניית אתרים או עיצובם? גם לעצב צריך לדעת את החוקים הפשוטים והבסיסיים ביותר לא? כמו איך להתאים כך שהכפתורים יהיו כפתורים חיים ולא תמונה שאין לה ערך בגוגל ועוד.... מה גודל העיצוב המקובל וכולי.
 
  • הוסף לסימניות
  • #6
גינגית את צודקת
ולכן עיצה טובה:
לפני שאת מעצבת רציני תשלחי למתכנת סקיצה מלמעלה כדי לראות אם העיצוב מתאים לאינטרנט.
לפעמים יש מעצבים שלא מתמצאים בכללי העיצוב ואז המתכנת צריך לשבור את הראש כדי להתאים את העיצוב לאינטרנט, דבר שלפעמים הוא קשה ולפעמים ממש לא בר ביצוע

ועוד עיצה, תחפשי בגוגל אתרים בסגנון שאת הולכת לעצב, זה יעזור לך מאוד לקבל השראה ולהבין מי קהל היעד ואיך מדברים אליו.

לגבי התוכנה, זה לא כל כך משנה אילוס או פ"ש, בשתיהם יש אופצית שמירה לאינטרנט save for web ככה שתעבדי איך שנוח לך.

הרבה הצלחה!
 
  • הוסף לסימניות
  • #7
עצה טובה, עוד לפני שאת שולחת לבונה האתר סקיצה ראשונית - תדברי איתו כדי לקבל איזה שהוא מושג מה זה אומר לעצב אתר
 
  • הוסף לסימניות
  • #8
בדיוק!
כדאי לדבר איתו ולקבל ממנו הוראות מה בדיוק הוא צריך, לפני שתעבדי קשה לעצב ואחר כך תצטרכי לשנות.
 
  • הוסף לסימניות
  • #9
נכתב ע"י israel;431352:
תכנון ממשק - בתוכנה ייעודית (כגון Blend) או בעפרון ונייר

עיצוב
- בפוטושופ בלבד

שמירה
- בקובץ PSD כשכל השכבות מחולקות לתקיות ומקוטלגות בצורה טובה

חיתוך העיצוב (slicing)
- מתבצע ע"י המעצב (אם הוא יודע לעשות זאת) או חותך slicer מקצועי או ע"י המתכנת

למה רק בפוטושופ? מה רע באילוס?
יש דברים שיותר נוח וקל לעשות בתוכנה וקטורית
 
  • הוסף לסימניות
  • #10
לאחר שלמדנו קורס מקיף ויסודי ביותר של "עיצוב אתרים" ב"פרוג" וכן לאחר הרצאה מקיפה ששמעתי בנושא ב"מנטור", יש לי מספר הערות לנאמר לעיל:

א. ניתן לעצב אתר הן בפוטושופ, הן באילוסטרייטור. חשוב לזכור להגדיר מראש את הגדרות המסמך לפי מידות האתר (בעיקר רוחב, לעיתים גם הגובה משמעותי, תלוי באופי האתר), ובעיקר - יחידות מידה - בפיקסלים ולא כל יחידה אחרת. באילוס' חשוב גם להגדיר תצוגה בפיקסלים, למרןת שהתוכנה וקטורית.

ב. באופן כללי, יש הרבה מאד כללים לעיצוב נכון של אתר, הן מבחינה שיווקית והן מבחינה פרקטית (כדי שבניית האתר תהיה היעילה והחסכונית ביותר שניתן) וזה עוד לפני הפן העיצובי-גרפי, כגון : סוג הפונטים, חלוקת המיקומים של האזורים השונים באתר, גדלים, מראה הכפתורים והתפריטים ועוד.

ג. (בעצם, א.) מלכתחילה, מומלץ מאד ללמוד את הנושא בצורה ממוסדת לפני שניגשים לבצע, כיון שעיצוב אתרים שונה מאד מעיצוב לפרינט.
אם עדיין לא נרשמת לקורס של "פרוג" ובכ"ז את מעוניינת לקפוץ לים - כדאי לך מאד לראות דוגמאות של אתרים דומים בנושא שלך, וללמוד מהם.
הרשת גם מלאה במאמרים בנושא, כגון זה, וזה.

ד. קודמי גם המליצו להראות את הסקיצה הראשונית למתכנת/בונה האתר, מלבד ללקוח, כדי לוודא את תקינות הבניה והחלוקה של האזורים. לדעתי, זה לא רק מומלץ, אלא הכרחי.

ה. עוד דבר חשוב: הסקיצה צריכה לכלול: דף הבית, דף תוכן ועוד עמודים מיוחדים, כגון: גלריה, "חנות" וכד'. צריך להיות אלמנט עיצובי מאחד בין כל הדפים, בדר"כ גם הלוגו וסרגל התפריטים הראשי נשארים במקומם לאורך כל הדרך.

בהצלחה!
 
  • הוסף לסימניות
  • #11
נכתב ע"י מירי10;431375:
לגבי התוכנה, זה לא כל כך משנה אילוס או פ"ש, בשתיהם יש אופצית שמירה לאינטרנט save for web ככה שתעבדי איך שנוח לך.

הרבה הצלחה!

זה כן משנה
לא אמרתי שבלתי אפשרי לעצב אתר באילוסטרייטור או בכל תוכנה אחרת כמו פלאש
הסטנדרט המקובל היום הוא לעצב בפוטושופ, ומשום מה בארץ הקודם החליטו בתי ספר מסויימים להיות חכמולוגים ולהכתיב סטנדרט חדש

95% ממעצבי האתרים בעולם עושים את העבודה בפוטושופ ומייצאים בקובץ PSD ולא בשום פורמט אחר.

וכן, בעיצוב אתר יש הרבה מעבר לאומנות או יופי


בהצלחה!
 
  • הוסף לסימניות
  • #12
אני מתחילה בפוטושופ, ומטעמי נוחות מעבירה אחר כך לאילוס. הגעתי למסקנה שגם באתר הכל יוצא הרבה יותר חד אלא אם כן יש הרבה שימוש בתמונות, שאז באילוס זה לא רלוונטי.
 
  • הוסף לסימניות
  • #14
נכתב ע"י israel;431596:
זה כן משנה
לא אמרתי שבלתי אפשרי לעצב אתר באילוסטרייטור או בכל תוכנה אחרת כמו פלאש
הסטנדרט המקובל היום הוא לעצב בפוטושופ, ומשום מה בארץ הקודם החליטו בתי ספר מסויימים להיות חכמולוגים ולהכתיב סטנדרט חדש

95% ממעצבי האתרים בעולם עושים את העבודה בפוטושופ ומייצאים בקובץ PSD ולא בשום פורמט אחר.

וכן, בעיצוב אתר יש הרבה מעבר לאומנות או יופי


בהצלחה!

שאלתי ברצינות
ואני עדיין כנראה לא מבינה
למה יש בעיה עם עיצוב אתר באילוס?
במיוחד שיש אפשרות לקחת כל חלק מהעיצוב ולהמיר אותו ל-PSD או JPG תוך רגע
 
  • הוסף לסימניות
  • #15
נכתב ע"י israel;431596:
זה כן משנה

95% ממעצבי האתרים בעולם עושים את העבודה בפוטושופ ומייצאים בקובץ PSD ולא בשום פורמט אחר.

זה ממש לא משנה, ה95% שמעצבים אתרים בפ"ש פשוט לא יודעים את אילוס'....

ואני מתכוונת ברצינות, אותנו המורה שלימדה (בפרוג איך לא...) לדוג' את הפלאש גם הראתה לנו איך לעצב בפ"ש וכששאלנו אותה אם גם באילוס' זה אפשרי אז היא אמרה שבהחלט, פשוט היא לא ממש מתמצאת באילוס'... ומסתבר שיש עוד כמה מורים שמלמדים לעצב בפ"ש פשוט כי זאת התוכנה שהם מתמצאים בה טוב יותר.
זה הכל.
אבל כמובן שצריך להיות ידע בסיסי בעיצוב לאינטרנט.
הצלחות!
 
  • הוסף לסימניות
  • #16
תודה לכולם על העזרה:)

באמת שאלתי את הבונה האתר מה הוא דורש והוא בקש
את כל הקבצים בפורמט jpg 72dpi.
ואמר שלא צריך שכבה נפרדת. והוא מעונין לקבל קובץ משוטח.
 

פרוגבוט

תוכן שיווקי
פרסומת

הצטרפות לניוזלטר

איזה כיף שהצטרפתם לניוזלטר שלנו!

מעכשיו, תהיו הראשונים לקבל את כל העדכונים, החדשות, ההפתעות בלעדיות, והתכנים הכי חמים שלנו בפרוג!

לוח מודעות

הפרק היומי

הפרק היומי! כל ערב פרק תהילים חדש. הצטרפו אלינו לקריאת תהילים משותפת!


תהילים פרק כה

אלְדָוִד אֵלֶיךָ יי נַפְשִׁי אֶשָּׂא:באֱלֹהַי בְּךָ בָטַחְתִּי אַל אֵבוֹשָׁה אַל יַעַלְצוּ אֹיְבַי לִי:גגַּם כָּל קוֶֹיךָ לֹא יֵבֹשׁוּ יֵבֹשׁוּ הַבּוֹגְדִים רֵיקָם:דדְּרָכֶיךָ יי הוֹדִיעֵנִי אֹרְחוֹתֶיךָ לַמְּדֵנִי:ההַדְרִיכֵנִי בַאֲמִתֶּךָ וְלַמְּדֵנִי כִּי אַתָּה אֱלֹהֵי יִשְׁעִי אוֹתְךָ קִוִּיתִי כָּל הַיּוֹם:וזְכֹר רַחֲמֶיךָ יי וַחֲסָדֶיךָ כִּי מֵעוֹלָם הֵמָּה:זחַטֹּאות נְעוּרַי וּפְשָׁעַי אַל תִּזְכֹּר כְּחַסְדְּךָ זְכָר לִי אַתָּה לְמַעַן טוּבְךָ יי:חטוֹב וְיָשָׁר יי עַל כֵּן יוֹרֶה חַטָּאִים בַּדָּרֶךְ:טיַדְרֵךְ עֲנָוִים בַּמִּשְׁפָּט וִילַמֵּד עֲנָוִים דַּרְכּוֹ:יכָּל אָרְחוֹת יי חֶסֶד וֶאֱמֶת לְנֹצְרֵי בְרִיתוֹ וְעֵדֹתָיו:יאלְמַעַן שִׁמְךָ יי וְסָלַחְתָּ לַעֲוֹנִי כִּי רַב הוּא:יבמִי זֶה הָאִישׁ יְרֵא יי יוֹרֶנּוּ בְּדֶרֶךְ יִבְחָר:יגנַפְשׁוֹ בְּטוֹב תָּלִין וְזַרְעוֹ יִירַשׁ אָרֶץ:ידסוֹד יי לִירֵאָיו וּבְרִיתוֹ לְהוֹדִיעָם:טועֵינַי תָּמִיד אֶל יי כִּי הוּא יוֹצִיא מֵרֶשֶׁת רַגְלָי:טזפְּנֵה אֵלַי וְחָנֵּנִי כִּי יָחִיד וְעָנִי אָנִי:יזצָרוֹת לְבָבִי הִרְחִיבוּ מִמְּצוּקוֹתַי הוֹצִיאֵנִי:יחרְאֵה עָנְיִי וַעֲמָלִי וְשָׂא לְכָל חַטֹּאותָי:יטרְאֵה אוֹיְבַי כִּי רָבּוּ וְשִׂנְאַת חָמָס שְׂנֵאוּנִי:כשָׁמְרָה נַפְשִׁי וְהַצִּילֵנִי אַל אֵבוֹשׁ כִּי חָסִיתִי בָךְ:כאתֹּם וָיֹשֶׁר יִצְּרוּנִי כִּי קִוִּיתִיךָ:כבפְּדֵה אֱלֹהִים אֶת יִשְׂרָאֵל מִכֹּל צָרוֹתָיו:
נקרא  2  פעמים
למעלה