קודם כל אני די חדש בעניינים.
עיצבתי דף בפוטושופ, הוא שמור באיכות המקורית והטובה כקובץ PSD רגיל עם כל השכבות וכו'.

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


אתם מבחינים בשתי תיבות. מה שאני רוצה זה להעביר את הדף לHTML עם תמונות, ושבשני השטחים באמצע הדף אני יוכל לכתוב עליהם.

אתה יודע HTML ו-CSS?
אם כן, אתה אמור לדעת איך לחתוך.

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

ד"א לעניות דעתי צבע תכלת (כמו שאצלך) לאתר זה ממש לא מומלץ...

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

חתכתי כדי שתידע איך לחתוך, אבל אני מציע לך לבחור עיצוב אחר כי זה דורש שימוש ביותר מידי תמונות באתר אינטרנט בשביל העיצוב - וזה לא טוב.



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

בנוסף, זה לא מוצג בתמונה למעלה, אבל הרקע האחורי דורש גם חיתוך של כולו, כי הוא gradient (מעבר צבעים). איפה שיש לך צבע אחיד - תוכל לקבוע background-color עם CSS וכך להשלים ביעילות את העיצוב.

אז איך אני אכתוב על זה?

תשים את זה בתור background-image לאלמנט ה-Wrapper (אלמנט ה-Wrapper הוא בדר"כ Div, או ה-Body אם אין לך DIV.).

תמונות לאו דווקא חייבות להיות נגישות למשתמש, אלא אפשר שיהיו בתור רקע ואפילו רצוי.