פונטים מצויירים
הערה: המדריך פורסם לראשונה במגזין "חיים ברשת" של נענע. הגירסה כאן כוללת קישורים מתוקנים ומעודכנים.
אחד הסודות השמורים של בוני אתרים ליצירת גרפיקה במהירות ובקלות נחשף כאן לכל דיכפין.
מאת: שוש פורבס 16:02 21/02/2000
למרות שבאופן מסורתי פונטים הם פשוט דרך גרפית מסויימת לייצר אותיות, בד בבד עם עליית הפופולאריות של אתרים פרטיים סוג חדש של פונטים נכנס לתרמילו של כל גרפיקאי מתחיל: dingbats, פונט המכיל ציורים במקום אותיות. הפונטים האלה שימושיים מאוד ליצירת גרפיקה לאתרים בצורה קלה ופשוטה: בגלל שמדובר בפונטים, ולא בסתם תמונות, אפשר לשנות בקלות את הגודל שלהם, מבלי לפגוע באיכות התמונה.
איך משתמשים בפונטים מצויירים?
אחרי שמורידים את הפונטים בהם אנו מעוניינים (קישורים לאתרים מומלצים תמצאו בצד ימין), מתקינים אותם בחלונות כמו שמתקינים כל פונט אחר: מעתיקים את קובץ הפונט (ttf) לספריית הפונטים של חלונות (בדרך כלל c:\windows\fonts)
עכשיו כל מה שנותר הוא להשתמש בתוכנה הגרפית האהובה עלינו, ולהכניס את התמונות לאובייקט הרצוי כמו כל טקסט רגיל. בכדי לראות איזה תמונות יש בכל פונט, ובשביל לדעת איזה מקש יביא לנו איזו תמונה, נשתמש במפת התווים של חלונות. התוכנית הקטנה והשימושית הזו נמצאת בהתחל - תוכניות - עזרים - כלי מערכת.
השימוש במפת התווים
מפת התווים מראה את כל התווים בפונט הנבחר. בשביל להגדיל את התמונה לתו מסויים, פשוט לוחצים עליו עם העכבר. כל עוד העכבר לחוץ, התמונה מופיעה בהגדלה. בפינה הימנית התחתונה נראה איזה מקש במקלדת תואם לתמונה. נשתמש במידע הזה אחר כך בשביל להכניס את התמונה לתוכנת הגרפיקה.
אם לא רוצים לזכור בעל-פה מהו התו במקלדת, צריכים לסמן את התמונה המתאימה, וללחוץ select. התמונה המוקטנת תופיע במלבן בצד ימין למעלה. משם נוכל לבחור copy, ולהעתיק לתוך תיבת הכנסת הטקסט בתוכנת הגרפיקה.
הכנסת התמונות לתוכנת הגרפיקה
אפשר להשתמש באיזו תוכנת גרפיקה שרוצים, כל עוד היא יכולה לשמור בפורמט GIF או JPG המתאים לדפי אינטרנט.
בתוכנת הגרפיקה, ניצור קובץ חדש, ונלחץ על כפתור הוספת הטקסט. ברוב התוכנות נקבל תיבת דיאלוג בתוכו צריך להקליד את הטקסט שרוצים. נבחר את פונט התמונה הרצוי, ונקליד את האות התואמת לתמונה (או נדביק את האות שהעתקנו ממפת התווים), נאשר, ויש לנו תמונה בעורך שנוכל להשתמש בה כרצוננו.
מה אפשר לעשות עם ה־Dingbats?
אחד השימושים הנפוצים הוא הכנת כפתורים: נכין מלבן קטן ונמלא אותו בצבע. נוסיף את התמונה מפונט התמונות בטכניקה שתוארה למעלה. ליד התמונה נוסיף טקסט, ונשמור את הקובץ בפורמט GIF.
נחזור על התהליך - יצירת מלבן צבעוני, הוספת תמונה, הוספת טקסט, ושמירה כGIF, כשכל פעם אנחנו מחליפים את הכיתוב.
יש גם פונטים עם צורות מוכנות לכפתורים. למשל Button Button המכיל צורות מוכנות של כפתורים, או Carr Arrows המכיל חיצים בצורות שונות, המעולים ככפתורי ניווט (הקודם, הבא וכו`).
קווים מפרידים
הקו המפריד שנוצר על ידי HTML מכוער למדי. למה שלא נחליף אותו במשהו יותר יפה שיצרנו במו עכברנו? הנה שתי דרכים קלות:
הדרך הראשונה והקלה ביותר היא להשתמש בפונט תמונות המיועד במיוחד ליצירת קווים מפרידים. לדוגמא, Dizzinz Dividers.
הדרך השנייה קלה אף היא: ניצור קובץ חדש ארוך וצר (למשל, 300 פיקסלים לרוחב על 10 פיקסלים לגובה) ונמלא בצבע. נבחר פונט תמונה בגודל קטן, ונכניס תמונה ליד הקצה השמאלי של הקובץ. נחזור על הפעולה שוב ושוב ברווחים קטנים עד שכל רוחב הקובץ מתמלא תמונות. נשמור כ־ GIF ונעלה לאתר.
רקעים
נפתח קובץ חדש בגודל 150 על 150 פיקסלים, ונמלא אותו בצבע. נקח תמונה קטנה מפונט תמונה, ונשים אותה קרוב לאחד הצדדים בקובץ שלנו. כדאי להקפיד שהצבע של התמונות שנשים יהיה דומה לצבע הרקע בו מילאנו את התמונה - כך נוכל להבטיח שיהיה קל לקרוא את הטקסט שנשים באתר. נשים עוד כמה תמונות בקובץ עד שימאס לנו, ונדאג לכך שאף תמונה לא תיגע בקצה של הקובץ. נשמור בתור GIF.
עכשיו, כדאי לבדוק איך הרקע יראה בדפדפן - ניצור דף HTML חדש, ונקבע את התמונה שהכנו כתמונת הרקע. נכתוב קצת טקסט בדף ה- HTML ונפתח אותו בדפדפן: האם הגבולות של הרקע בולטים לעין? האם קל לקרוא את הטקסט? אם יש בעייה, נחזור שוב לתוכנת הגרפיקה וננסה לתקן - אולי נזיז קצת את התמונות? אולי נחליף להן צבע? עם הזמן והנסיון יהיו הרבה פחות בעיות, והתהליך יהיה הרבה יותר מהיר.
אתרים להורדת פונטים מצויירים
2 הפניות
Listed below are links to blogs that reference this entry: פונטים מצויירים.
TrackBack URL for this entry: http://www.xslf.com/mt/xslf-tb.cgi/26
יובל דרור כותב שהגלוב שלו בן שנה. מה שמזכיר לי כל עוד אוגוסט- לבלוג כאן מלאו שלוש שנים החודש. בניגוד ליובל, לא רציתי שהבלוג יהפך לעול, ולכן לא... Read More
על השימושים אכתוב בהרחבה בפינה הבאה אבל הנה קישור[...] Read More
תזהרי לא למכור את כל הסודות המקצועיים, אני מכיר אחד שעשה זאת - סופו היה "לא מתוק".
hey Xslf- it looks like the forum manager at agam1.co.il is stealing your guides- no credit to you and no link, but he uses the images on your server.
Here are the links to the stolen guides:
http://www.agam1.co.il/modules.php?name=Forums&file=viewtopic&t=2520
http://www.agam1.co.il/modules.php?name=Forums&file=viewtopic&t=2519
http://www.agam1.co.il/modules.php?name=Forums&file=viewtopic&t=2523
לאנונימי: תודה על הדיווח. מייל בנושא נשלח לאחראים על האתר עם העתק לעמותת המקור.
נקווה שזה יעשה את העבודה.
הי שוש - אחרי שקראתי גם את הסערה שהתחוללה סביב הנושא הזה בווטסאפ, אני מרשה לעצמי להעלות הצעה, הרהור נלווה ושאלה (אני מקווה שזה בסדר מבחינתך. מכל מקום, זכות המחיקה עומדת לרשותך) -
ההצעה היא לא להסתפק בהודעה הכללית שבדף הראשי בענין זכויות היוצרים ותנאי השימוש במדריכים, אלא להצמיד הודעה בענין זה לכל מדריך שאת מפרסמת באתר, כדי שהיא לא תוכל לחמוק (בטעות או במכוון), מעיני המשתמש הפוטנציאלי (גם הודעה קצרה על כך שהשימוש במדריך כפוף לתנאים המפורטים במקום אחר באתר, עם קישור מתאים לאותו מקום, יכולה לעשות את העבודה). הייתי שמה הודעה כזאת על המדריך במקום אסטרטגי (כך שמי שיבחר להתעלם מההודעה, יצטרך לעשות אקט מודע לצורך העלמת המידע).
ההרהור הנלווה - הייתי שוקלת לצרף למקום שבו מפורטים התנאים, תקציר בלתי פורמאלי של עיקרי התנאים שהרשיון דורש מהמשתמש (סטייל המודל של קריאייטיב קומונס). זאת בנוסף על ההפניה לנוסח המחייב של הרשיון ולתרגומו הבלתי רשמי. זה יכול אמנם להיות קצת בעייתי כי עד כמה שאני מבינה זה לא נהוג ברשיונות הקוד הפתוח לסוגיהם (ויכולות להיות לכך השלכות שלא אכנס אליהן כאן), אבל מאידך זה יכול לעשות פלאים להבהרת הדרישות (אני למשל לא מכירה את הרשיון המסוים שאליו את מכפיפה את המדריכים, ועיון חטוף שעשיתי אתמול בתרגום הבלתי רשמי רק כדי לראות במה מדובר, לא ממש עזר. מובן מאליו שדרישת ההתעמקות ממי שרוצה להשתמש בחומרים האלה היא שונה, ועדיין). לדעתי שווה בדיקה ואולי אף התייעצות עם מי שבקי קצת בעולם המופלא של רשיונות מסוג זה... ולו רק מאחר שבסופו של דבר מבחינה מעשית מגיעים לרשימה מוגדרת של דרישות "עשה" כדי לאפשר את השימוש (כמו שהמקרה הזה מלמד).
והשאלה - ביחס לבעיה של גניבת רוחב פס על ידי הפניה ישירה לחומרים שעל השרת שלך: מבלי לגרוע מהערך המחנך והתועלת האפשרית של ההצעות שעלו, נדמה לי שהן לא פותרות את הבעיה המעשית מאוד. לא עדיף לבצע חסימה של האפשרות הזאת באמצעים טכנולוגיים? (כרגיל, אני לא מתמצאת בפרטים לגופם, אבל אני מבינה שיש אפשרויות כאלה במקרים מסויימים, ואפילו עם מרווח גמישות).
אהלן מיכל. יש לי מעט זמן כרגע, אז אענה בקצרה:
ההערות שלך מאוד במקום. כרגע אני בודקת אפשרויות, לראות מה ניתן לעשות, ומה כדאי לעשות מבחינה טכנית כדי שלא אשבור דברים בטעות.
:-)
אתם יכולים לתת לי אתרים עם פונטים למקינטוש???
תשלחו לי בבקשה לאי מייל תשובה
שני מקומות עם רשימות גופנים עבריים למק (osx):
http://mac.plonter.co.il/plonwiki/Fonts
http://www.redlers.com/downloadfont.html
(בקישור השני גלול למטה עד ל-Hebrew עבור גופנים עבריים)
שלום אנשים.... רציתי לשאול באילו אתרים בסגנון (בננה בום, טיפו) תודה מראש...