Data URI scheme שמירת תמונות בתוך HTML ללא שימוש בקבצים חיצוניים

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

1. אנחנו רוצים לייצר מסמך word מתוך html שמכיל תמונות
2. אנחנו רוצים לשלוח אימייל html
3. שימוש ב - extensions שונים
4. או סתם פשוט לייצר קובץ אחד גדול המכיל הכל

לשם כך קיים לנו Data URI scheme שמאפשר לנו לצרף (embed) מידע לתוך url בדף שלנו ובאותו אופן גם להחזיק תמונות.

דבר זה מתבצע באמצעות url שהוא בעצם המידע שלנו מקודד ב - 7Bit uuencode והוא נראה כך:

<img src="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGP
C/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IA
AAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1J
REFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jq
ch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0
vr4MkhoXe0rZigAAAABJRU5ErkJggg==" alt="Red dot" />

זו היא התמונה של נקודה קטנה אדומה, וכל האותיות והללו הן בעצם המידע של התמונה.

לקריאה נוספת:
http://en.wikipedia.org/wiki/Data:_URL

המרת תמונות ל - Data Url:
http://www.sveinbjorn.org/dataurlmaker

משחק זכרון עם תמונות שלכם או מהרשת

החזרתי לחיים את משחק הזכרון הממוחשב שכתבתי. המשחק על טהרת ה - JavaScript כמו שאני אוהב :)

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

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