‫Htm - אחלה טיפים לבניית אתרים » סמנטיקה‬ http://www.htm.co.il ‫מדריכים ומאמרים בנושא בניית אתרים. כל יום משהו חדש ללמוד, וליישם.‬ Wed, 18 Jan 2012 09:32:13 +0000 http://wordpress.org/?v=2.9.2 il hourly 1 ‫שני מפגשים שלא כדאי לפספס בפברואר‬ http://www.htm.co.il/2010/01/19/%d7%a9%d7%a0%d7%99-%d7%9e%d7%a4%d7%92%d7%a9%d7%99%d7%9d-%d7%a9%d7%9c%d7%90-%d7%9b%d7%93%d7%90%d7%99-%d7%9c%d7%a4%d7%a1%d7%a4%d7%a1-%d7%91%d7%a4%d7%91%d7%a8%d7%95%d7%90%d7%a8/ http://www.htm.co.il/2010/01/19/%d7%a9%d7%a0%d7%99-%d7%9e%d7%a4%d7%92%d7%a9%d7%99%d7%9d-%d7%a9%d7%9c%d7%90-%d7%9b%d7%93%d7%90%d7%99-%d7%9c%d7%a4%d7%a1%d7%a4%d7%a1-%d7%91%d7%a4%d7%91%d7%a8%d7%95%d7%90%d7%a8/#comments Tue, 19 Jan 2010 08:44:56 +0000 ‫אורן רוט‬ http://www.htm.co.il/?p=1031

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

"פיתוח אתרים ואפליקציות מבוססות טכנולוגיות סמנטיות"

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

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

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

היום יפתח בשעה 16:30 וייחתם לאחר שלוש שעות, לפרטים נוספים והרשמה בקרו באתר W3C.השתתפות במפגש לחברי איגוד האינטרנט הישראלי, לא כרוכה בתשלום.

אני מאמין שיהיה מאוד מעניין וממליץ לכולם להגיע.

Web '10 – הכינוס ה-14 של איגוד האינטרנט הישראלי

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

היום הראשון-

  • 22/2 – הרצאות מליאה:
    • אראל מרגלית, שותף מייסד קרן הון סיכון JVP
      עולם האינטרנט בעשור הבא:
      המפגש בין טכנולוגיה, תוכן ויצירתיות
    • Dr. Marc A. Smith, Chief Social Scientist
      Connected Action Consulting Group
      Analyzing Internet social media: visualizing social networks in (mobile) computer networks
  • 22/2 – מושבים מקבילים בנושאים:
    • כסף יצירתי – מודלים עסקיים חדשים ויצירתיים באינטרנט ובסלולר
    • טכנולוגיות חדשניות שמניעות את האינטרנט
    • Over The Top ואומנות הצפייה בטלוויזיה
    • רשת האינטרנט העתידית
    • מתחברים לעולם נייד
    • רשת ביטחון וביטחון ברשת
    • רשתות חברתיות – מי גר שם?
    • לא חרדים לאינטרנט
    • ניטראליות הרשת או שימושים מנוהלים?

היום השני-

  • 23/2 – טוטוריאל בנושאים:
    • Marc Grabanski, Web Developer, "Jack of All Trades"
      UI Development with jQuery and HTML5
    • IPv6 – from Theory to Reality
    • עולמות וירטואליים: גם לירוק וגם למקצוען

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

למידע נוסף והרשמה בקרו באתר הייעודי לכינוס השנתי או בטוויטר: #ISOCIL10. עלות ההשתתפות בשני ימי ההרצאה הוא 300 ש"ח לחבר האיגוד.

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

עוד באותו נושא:

]]> http://www.htm.co.il/2010/01/19/%d7%a9%d7%a0%d7%99-%d7%9e%d7%a4%d7%92%d7%a9%d7%99%d7%9d-%d7%a9%d7%9c%d7%90-%d7%9b%d7%93%d7%90%d7%99-%d7%9c%d7%a4%d7%a1%d7%a4%d7%a1-%d7%91%d7%a4%d7%91%d7%a8%d7%95%d7%90%d7%a8/feed/ 0 ‫פורסמו ההקלטות והמצגות ממפגש ההעשרה של ISOC‬ http://www.htm.co.il/2009/10/27/%d7%a4%d7%95%d7%a8%d7%a1%d7%9e%d7%95-%d7%94%d7%94%d7%a7%d7%9c%d7%98%d7%95%d7%aa-%d7%95%d7%94%d7%9e%d7%a6%d7%92%d7%95%d7%aa-%d7%9e%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%a9/ http://www.htm.co.il/2009/10/27/%d7%a4%d7%95%d7%a8%d7%a1%d7%9e%d7%95-%d7%94%d7%94%d7%a7%d7%9c%d7%98%d7%95%d7%aa-%d7%95%d7%94%d7%9e%d7%a6%d7%92%d7%95%d7%aa-%d7%9e%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%a9/#comments Tue, 27 Oct 2009 10:50:12 +0000 ‫אורן רוט‬ http://www.htm.co.il/?p=816

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

HTML 5 – ישע סיון

תקן תקן תרדוף – אייל סלע

היופי שבסמנטיקה – פיתוח צד לקוח בסביבה מרובת דפדפנים – יובל רז

אתם מוזמנים כמובן לבקר באתר של ISOC ולראות את המצגות וההקלטות של ההרצאות.

עוד באותו נושא:

]]> http://www.htm.co.il/2009/10/27/%d7%a4%d7%95%d7%a8%d7%a1%d7%9e%d7%95-%d7%94%d7%94%d7%a7%d7%9c%d7%98%d7%95%d7%aa-%d7%95%d7%94%d7%9e%d7%a6%d7%92%d7%95%d7%aa-%d7%9e%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%a9/feed/ 0 ‫מפגש העשרה בנושא עתיד ה-Web – חלק שלישי ואחרון‬ http://www.htm.co.il/2009/10/01/%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%91%d7%a0%d7%95%d7%a9%d7%90-%d7%a2%d7%aa%d7%99%d7%93-%d7%94-web-%d7%97%d7%9c%d7%a7-%d7%a9%d7%9c%d7%99%d7%a9%d7%99-%d7%95%d7%90%d7%97%d7%a8/ http://www.htm.co.il/2009/10/01/%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%91%d7%a0%d7%95%d7%a9%d7%90-%d7%a2%d7%aa%d7%99%d7%93-%d7%94-web-%d7%97%d7%9c%d7%a7-%d7%a9%d7%9c%d7%99%d7%a9%d7%99-%d7%95%d7%90%d7%97%d7%a8/#comments Thu, 01 Oct 2009 15:37:58 +0000 ‫אורן רוט‬ http://www.htm.co.il/?p=656

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

היופי בסמנטיקה מפי יובל רז

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

  • תיוג מושכל (P לפסקה, H1 לכותרת)
  • זרימת מסמך קריאה (H1, אח"כ H2 וכ"ו…)
  • הפרדת עיצוב מתוכן (ומפעולה)

לגביי הנקודה הראשונה, בגלל לימוד לא מסודר/נכון, הרבה מאוד בוני אתרים משתמשים בתגיות HTML באופן שרירותי. ב-HTML ישנם הרבה מאוד תגיות שרבים מבוני האתרים לא מכירים כלל (כולל אני עד לפני ההרצאה). תגיות כמו: acronym, address ו- ins כולם תגיות שמתאימות ליצוג של תוכן וכולן נותנות ערך סמנטי (משמעות) לתוכן שהן תוחמות. לכן כדאי מאוד ללמוד את כל התגיות שיש ב-HTML ולהשתמש בהן באופן מושכל, תגית P לפסקה ו-H1 לכותרת.

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

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

יובל סיכם את החלק הזה במשפט הכל-כך נכון:

תעתיקו, תדפיסו, תתלו מעל המחשב. זה אחלה מוטו.

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

  • ואלידציה של קוד כתנאי לקידום
  • CSS Positioning
  • Divitis, ספנת (span) וחשיבה טבלאית

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

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

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

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

סטנדרטים של פיתוח

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

אלה הם הסטנדרטים לפיתוח לפי יובל רז:

  • גישה לפרוייקט:
    • לא להתחיל בגרפיקה – להתחיל בתכנון, בניה של wireframe (מוסבר בהמשך) והלבשת הגרפיקה בסוף על המבנה הקיים.
    • לערב איש צד-לקוח מתחילת הפרוייקט – לאיש צד-לקוח יש הרבה מאוד ידע על אופן בו ימומשו הדברים בפרוייקט. הוא יכול לחסוך הרבה זמן.
  • תכנון עיצוב וגרפיקה:
    • לבנות קודם wireframe – תבנית או מבנה לאתר. ישנם כלים ברחבי הרשת שעוזרים בבנית wireframe ואפשר גם כמובן לבנות לבד באמצעות CSS ו-HTML.
    • איפוס גליונות הסגנון – לפני שמתחילים לכתוב CSS רצוי מאוד לאפס את ההגדרות ברירת המחדל של כל סוגי הדפדפנים. אתם פשוט יכולים להוריד קובץ איפוס.
    • תאימות בין דפדפנים - דאגו לתאימות של העיצוב שלכם, לכל הדפדפנים.
    • JS לא פולשני – כפי הוסבר קודם לכן.
  • היה נכון (ומעודכן)

למי שנשאר לאחר ההרצאה יובל נתן המלצות נוספות לקריאה נוספת:

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

עוד באותו נושא:

]]> http://www.htm.co.il/2009/10/01/%d7%9e%d7%a4%d7%92%d7%a9-%d7%94%d7%a2%d7%a9%d7%a8%d7%94-%d7%91%d7%a0%d7%95%d7%a9%d7%90-%d7%a2%d7%aa%d7%99%d7%93-%d7%94-web-%d7%97%d7%9c%d7%a7-%d7%a9%d7%9c%d7%99%d7%a9%d7%99-%d7%95%d7%90%d7%97%d7%a8/feed/ 9