11 אתרי עזרים וכלים מצטיינים לשימוש ב-HTML5

HTML5 הינה שפה יחסית חדשה שעדיין לא נכנסה לעבודה השוטפת של רובנו בארץ אבל בחו"ל כבר תוכלו לראות המון אתרים שמבוססים על הטכנולוגיה הזו, לאלו מכם שלא ראו את הפוסט המכיל אוסף של 75 אתרים נבחרים ב-XHTML/CSS לחודש יולי – השראה אתם מוזמנים להיכנס ולהתרשם ממגוון אתרים מבוססי HTML5.

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

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


כלי אונליין ליצירת סקיצות ב-3D


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

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


כלי אונליין לשליטה בתמונות


לכל מי שרצה להציג חלק מתמונה גדולה שהוא טוען או לשנות תמונה במעבר עכבר, וכל מיני משחקים עם תמונות שבשנים האחרונות נהיה דבר נורא נפוץ יכול באמצעות הכלי הבא פשוט לטעון תמונה או אפילו לתת לינק לתמונה שיושבת ברשת, ולהתחיל להגדיר איזה חלק מהתמונה הוא מעוניין לטעון/להציג/מיקום ועוד. ללחוץ על הכפתור הירוק "create CSS" ולהטמיע את הקוד בקובץ CSS בקלות, הכלי הזה גם מועיל למהירות הטעינה של האתר בכך שאתם משתמשים בפחות תמונות, הכלי פותח באמצעות jQuery, CSS3 ו HTML5.


כלי אונליין לשליטה בתמונות נוסף


כלי נוסף שמאפשר אותו דבר זה בשם sprite cow רק שהוא מכיל מספר אפשרויות נוספות כמו בחירת רקע, וכד'.

 


כלי לבדיקת פונטים אונליין


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


כלי ליצירת סקיצות במהירות


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


כלי ליצירת שבלונות אונליין


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


כלי XRay אונליין


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


כלי אונליין ליצירת אנימציות Automatoon (animation)


הכלי הבא מאפשר לכם ליצור אנימציות טהורות באמצעות HTML5, בדומה לכלי של adobe edge שסוקר בבלוג כאשר הוא יצא. באמצעות שימוש בכלי הבא תוכלו לתמוך גם באייפונים, אייפדים ומכשירי אנדרואיד ואפילו בדפדפנים נפוצים.


כלי לעריכת קבצי מוזיקה אונליין!


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


כלי אונליין להמערכת SVG ל HTML5 באמצעות קנבס


מרבית האלמנטים הגרפים הווקטורים )אילוסטריטור,inkscape וכד') ניתנים לייצוא כ svg (Scalable Vector Graphics) , הכלי הנהדר הבא מאפשר לכם לבצע את ההמרה של קבצי SVG לתוך HTML קנבס, מגניב נכון!?


תוסף Ajax לבכרום ליצירת אנימציות


כפי שהבנתם כבר מהשם של התוסף הזה, הוא מאפשר לכם ליצור אנימציות באמצעות AJAX, המבוססות על HTML5, הכלי הזה ניתן לשימוש אונליין ואוף ליין, בשביל להשתמש בכלי הזה חובה דפדפן כרום מותקן על המחשב שלכם.מומלץ לפני שמתחילים להתנסות בכלי לראות את הסרטון get started שיעזור לכם להבין את העניינים. כלי נהדר לכל האנשים שמתחילים לבצע אנימציות מבוססות HTML5.

אודות הכותב:

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

פוסטים נוספים - אתר אישי

אנשים שקראו כתבה זו התעניינו גם ב:



הגב

שוחחו איתי אונליין

יוני 2017
א ב ג ד ה ו ש
« אוגוסט    
 123
45678910
11121314151617
18192021222324
252627282930