1
00:00:00,000 --> 00:00:00,127

2
00:00:00,127 --> 00:00:01,210
דוד י מלאן: בסדר.

3
00:00:01,210 --> 00:00:02,160
חזרנו.

4
00:00:02,160 --> 00:00:05,810
אז, המטרה של המפגש האחרון הזה
הוא להציג מושגים עוד כמה

5
00:00:05,810 --> 00:00:09,290
אלא גם לתת לכולם הזדמנות
סוג של למתוח את האצבעות

6
00:00:09,290 --> 00:00:11,270
ולמעשה לעשות משהו
על הידיים קצת.

7
00:00:11,270 --> 00:00:13,897
המטרה היא לא להפוך
כולנו לתוך מפתחי אינטרנט

8
00:00:13,897 --> 00:00:16,230
בכל אמצעים, אבל באמת רק
כדי לתת לכם טעימה של כמה

9
00:00:16,230 --> 00:00:21,750
של המבנים הבסיסיים של מה
נכנס תכנות אינטרנט וכיום האינטרנט

10
00:00:21,750 --> 00:00:23,980
פיתוח, כך
הצד סטטי של things--

11
00:00:23,980 --> 00:00:26,660
ללא היגיון, ללא תכנות
שפה, רק תוכן סטטי.

12
00:00:26,660 --> 00:00:29,660
וזה ייתן לנו הזדמנות
ממש לראות מה שרת אינטרנט הוא,

13
00:00:29,660 --> 00:00:34,140
ראה מהו קובץ HTML, לראות מה
זה HTTP למעשה מזללה.

14
00:00:34,140 --> 00:00:38,600
אבל לפני שאנחנו מתחילים בשאלות, כל רטרוספקטיבי
שאלות לגבי מיחשוב ענן

15
00:00:38,600 --> 00:00:43,922
או ביטחון או כל מה שביניהם?

16
00:00:43,922 --> 00:00:44,890
>> לא?

17
00:00:44,890 --> 00:00:47,181
בסדר, טוב, בואו
לשם כך, רק למקרה

18
00:00:47,181 --> 00:00:49,680
בתהליך של שנרשם
משהו לוקח כמה דקות.

19
00:00:49,680 --> 00:00:51,221
נצטרך לתת לו לעשות את זה ברקע.

20
00:00:51,221 --> 00:00:56,860
קדימה, אם זה היה אפשרי,
כדי c9.io. כאן-- אתר זו

21
00:00:56,860 --> 00:01:02,810
זהו צד שלישי service--
פלטפורמה כשירות, אם אתה will--

22
00:01:02,810 --> 00:01:05,190
כי הוא הולך להזמין אותך
כדי להירשם לקבלת חשבון,

23
00:01:05,190 --> 00:01:08,650
וזה הולך לתת לכל אחד מכם
חשבון בענן שנקרא

24
00:01:08,650 --> 00:01:11,330
על התשתית של מישהו אחר,
חברה בשם Cloud9.

25
00:01:11,330 --> 00:01:13,350
אבל מה שיפה
זו היא שהם נותנים לך

26
00:01:13,350 --> 00:01:15,990
קירוב של
פיתוח בעולם האמיתי בפועל

27
00:01:15,990 --> 00:01:18,530
הסביבה, אם כי ב
ענן בדפדפן אינטרנט,

28
00:01:18,530 --> 00:01:21,175
ואנחנו נשתמש במידע זה כדי למעשה
להתנסות קצת היום.

29
00:01:21,175 --> 00:01:27,116

30
00:01:27,116 --> 00:01:30,260
ואז קדימה ופשוט לניווט
הדרך אל תהליך ההרשמה

31
00:01:30,260 --> 00:01:32,630
אם אתה יכול.

32
00:01:32,630 --> 00:01:36,080
אז אנחנו לקרות להשתמש בזה בכיתה
אני מלמד על כל התלמידים שלנו,

33
00:01:36,080 --> 00:01:39,140
הן בקמפוס לסירוגין עכשיו,
זה החליף מה היסטורי

34
00:01:39,140 --> 00:01:41,390
היו אחרת תוכנות להורדה.

35
00:01:41,390 --> 00:01:44,620
אז מה היית לקבל גישה
הוא אחד מכונה ווירטואלי אלה,

36
00:01:44,620 --> 00:01:46,460
בעצם, שתיארתי קודם לכן.

37
00:01:46,460 --> 00:01:50,260
אז החברה הזו Cloud9 כנראה
דמי שכירות מתוך party-- שלישי אכן

38
00:01:50,260 --> 00:01:52,760
במקרה זה, Google-- כולה
חבורה של מכונות וירטואליות

39
00:01:52,760 --> 00:01:56,500
כי הם איכשהו גרזנים לתוך
האשליה של שרתים בודדים

40
00:01:56,500 --> 00:01:58,610
יש שכל אחד מאיתנו שליטה מלאה על.

41
00:01:58,610 --> 00:02:01,640
זה לא מדויק למדי, בלשון
כי הם מכונים וירטואליים,

42
00:02:01,640 --> 00:02:04,550
בכל זאת, כי מה
Cloud9 משתמשת בפועל

43
00:02:04,550 --> 00:02:07,570
היא טכנולוגיה חדשה יותר במקצת
קרא מכלה.

44
00:02:07,570 --> 00:02:13,150
ותנו לי לתפוס את התמונה הזאת
הנה לצייר את התמונה הזאת.

45
00:02:13,150 --> 00:02:16,540
>> מכל הוא, אם
אתה זוכר את התמונה

46
00:02:16,540 --> 00:02:19,900
מוקדם יותר, מעט בהיר
משקל מאשר מכונה וירטואלית.

47
00:02:19,900 --> 00:02:22,090
למעשה, בעוד האחרון
זמן דיברנו על שם

48
00:02:22,090 --> 00:02:25,170
להיות הפעלה
המערכת וכן hypervisor

49
00:02:25,170 --> 00:02:28,260
ולאחר מכן מערכת ההפעלה האורחת, אורח
מערכת הפעלה, הפעלת אורחות

50
00:02:28,260 --> 00:02:30,940
המערכת, על גבי שלך
חומרה פיזית,

51
00:02:30,940 --> 00:02:33,740
ההבדל עם חדשים זה
טכנולוגיה, מכלה,

52
00:02:33,740 --> 00:02:37,290
הוא שכל מה שהם איכשהו לשתף
אותה מערכת הפעלה.

53
00:02:37,290 --> 00:02:39,970
אבל הם עדיין ליצור
האשליה של כולם

54
00:02:39,970 --> 00:02:44,590
שיש שלו או שלה בלעדי
זכויות קבצים מינהליים

55
00:02:44,590 --> 00:02:45,400
בשרת.

56
00:02:45,400 --> 00:02:48,230
אבל יש פחות תוכנה
בינך לבין החומרה.

57
00:02:48,230 --> 00:02:52,260
התוצאה של אשר היא,
בתיאוריה, ביצועים גבוהים יותר,

58
00:02:52,260 --> 00:02:55,470
כי אתה משתמש או
מבזבז פחות משאבים

59
00:02:55,470 --> 00:02:57,360
על כי שכבת וירטואליזציה שנקרא.

60
00:02:57,360 --> 00:02:59,420
אז זה נקרא
מכלת מטבעו

61
00:02:59,420 --> 00:03:02,920
בדרך של טכנולוגיה המכונית דוקר,
אשר מאוד מגיע לשיא פריחתה.

62
00:03:02,920 --> 00:03:05,086
וזה משהו
מהנדסי חברת

63
00:03:05,086 --> 00:03:08,610
אולי מסוג מהסוג להתחיל לדבר
על בקרוב אם עדיין לא עשית זאת הם,

64
00:03:08,610 --> 00:03:11,590
אם כי יש בהחלט לא
סיבה לקפוץ על כל bandwagons.

65
00:03:11,590 --> 00:03:15,410
>> אז עם זה אמר, מה
אתה כנראה רואה עכשיו

66
00:03:15,410 --> 00:03:22,670
מסך זה נראה קצת כמו זה.

67
00:03:22,670 --> 00:03:23,170
בסדר.

68
00:03:23,170 --> 00:03:25,260
ובדיוק קוראים מעלי אם לא.

69
00:03:25,260 --> 00:03:27,440
ואם ולכן-- אני אבוא אם לא.

70
00:03:27,440 --> 00:03:30,244
קדימה, לחץ כל כך גדול
בתוספת כדי ליצור סביבת עבודה,

71
00:03:30,244 --> 00:03:31,660
ותראה מסך כזה.

72
00:03:31,660 --> 00:03:35,020
אתה יכול לקרוא את סביבת העבודה
שם כל מה שאתה רוצה עכשיו.

73
00:03:35,020 --> 00:03:38,660
ובדיוק למעשה לפשטות,
ללכת ו-- היטב, כמה מכם

74
00:03:38,660 --> 00:03:39,660
כבר יש סביבות עבודה.

75
00:03:39,660 --> 00:03:47,050
תקראו לזה מה שאתה want-- עסקים,
הרווארד, יום חמישי, מה שאתה רוצה.

76
00:03:47,050 --> 00:03:48,800
אתה לא צריך תיאור.

77
00:03:48,800 --> 00:03:52,380
אתה יכול להשאיר אותו פרטים, אלא אם כן אתה
כבר יש חבורה של סביבות עבודה.

78
00:03:52,380 --> 00:03:55,280
אם אתה נאלץ לעשות את זה לציבור,
זה בסדר למטרות של היום.

79
00:03:55,280 --> 00:03:56,750
גם כאן, הוא אחד upsells.

80
00:03:56,750 --> 00:03:59,939
אתה מקבל סביבת עבודה פרטית אחד על ידי
בְּרִירַת מֶחדָל. אבל אם אתה רוצה יותר,

81
00:03:59,939 --> 00:04:00,980
אתה צריך לשלם עבור יותר.

82
00:04:00,980 --> 00:04:02,870
אחרת, הם מכריחים אותך
לפרסם את העבודה שלך.

83
00:04:02,870 --> 00:04:05,600
אבל זה בסדר, כי הם גם
ביעד זה קהילות קוד פתוח

84
00:04:05,600 --> 00:04:07,700
כדי לעודד אנשים
למעשה פעולה.

85
00:04:07,700 --> 00:04:10,699
>> והדבר האחרון זה חשוב,
אם כי, היא, אחרי שאתה בוחר שם

86
00:04:10,699 --> 00:04:17,140
ואחרי שאתה בוחר פרטי או ציבורי,
לחץ HTML5, הסמל הכתום הגדול

87
00:04:17,140 --> 00:04:22,430
שני משמאל, ו
ולאחר מכן לחץ על צור סביבת עבודה.

88
00:04:22,430 --> 00:04:24,580
וזה יהיה כנראה
לקחת דקה או שתיים,

89
00:04:24,580 --> 00:04:26,540
אבל אז אתה תהיה לכם גישה אל
סביבה, ברגע שאתה

90
00:04:26,540 --> 00:04:30,544
לעשות את זה, זה נראה מזכיר
מה שיש לי על המסך כאן עכשיו.

91
00:04:30,544 --> 00:04:33,210
אבל, שוב, זה עלול לקחת דקה
או יותר כדי להגיע למסך זה

92
00:04:33,210 --> 00:04:34,770
אחרי שלחצת על יצירת סביבת עבודה.

93
00:04:34,770 --> 00:04:37,936
אבל רק דגל מעל אותי אם תרצה אותי
להעיף מבט על כל דבר או לייעץ.

94
00:04:37,936 --> 00:04:40,191

95
00:04:40,191 --> 00:04:40,690
בסדר.

96
00:04:40,690 --> 00:04:42,390
אז אני הולך רקע זה לעת עתה.

97
00:04:42,390 --> 00:04:44,260
התקשר מעלי אם אתה נראה
יש לבעיות טכניות.

98
00:04:44,260 --> 00:04:46,210
אבל, שוב, זה עלול לקחת
קצת בשביל זה לפתוח.

99
00:04:46,210 --> 00:04:49,570
ועכשיו בואו נלך קדימה ולדבר על מה
זה בעצם אומר לעשות דף אינטרנט,

100
00:04:49,570 --> 00:04:52,780
מה זה HTML, ואיך כל זה
עכשיו חיבורים כפי שאנו מתחילים

101
00:04:52,780 --> 00:04:54,730
למעשה להשתמש כמה הטכנולוגיה.

102
00:04:54,730 --> 00:04:58,310
אז מתברר שאני יכול
ללכת על Mac הקטנה שלי כאן,

103
00:04:58,310 --> 00:05:01,650
לפתוח תוכנית פשוט שנקרא
TextEdit, או על Windows שיכולתי

104
00:05:01,650 --> 00:05:04,480
משהו פתוח בשם Notepad.exe.

105
00:05:04,480 --> 00:05:08,260
ואני רק יכול לעשות פשוט משהו
כמו זה- "שלום, עולם".

106
00:05:08,260 --> 00:05:12,020
ואז אני יכול לשמור את זה כמו
hello.txt אז לא קסם שם.

107
00:05:12,020 --> 00:05:15,200
אין לזה שום קשר עם אינטרנט
תכנות, מה לעשות עם HTML.

108
00:05:15,200 --> 00:05:16,790
רק יצירת קובץ טקסט פשוט.

109
00:05:16,790 --> 00:05:20,600
אבל מתברר כי רשת
הדף הוא ממש בדיוק את זה.

110
00:05:20,600 --> 00:05:24,020
זהו טקסט המכיל קובץ טקסט פשוט
כי תוכל להקליד על המקלדת שלך,

111
00:05:24,020 --> 00:05:30,070
אבל זה בדרך כלל אבל לא תמיד
מסתיים לא .txt אבל .html או .htm.

112
00:05:30,070 --> 00:05:32,050
ואתה לא רק
להקליד מילים בקובץ.

113
00:05:32,050 --> 00:05:35,280
אתה באמת צריך להשתמש דברים בשם
תגיות או, באופן כללי יותר, משהו

114
00:05:35,280 --> 00:05:37,190
בשם שפת סימון.

115
00:05:37,190 --> 00:05:40,510
>> אז אני הולך מאוד להקליד במהירות
ולאחר מכן להסביר את הדברים הבאים.

116
00:05:40,510 --> 00:05:42,290
אני הולך ראשון
מסוג זה, אשר אומר,

117
00:05:42,290 --> 00:05:45,730
היי, דפדפן, הנה מגיע
דף האינטרנט כתוב ב- HTML.

118
00:05:45,730 --> 00:05:51,850
וזה שני הדברים האלה יחד לומר, היי,
הדפדפן, להלן אכן HTML.

119
00:05:51,850 --> 00:05:55,790
היי, דפדפן, הנה בא
הראש או החלק העליון של הדף שלי.

120
00:05:55,790 --> 00:05:59,900
היי, דפדפן, בתוך החלק העליון של
הדף שלי, לתת כותרת כלומר, "שלום,

121
00:05:59,900 --> 00:06:01,610
עוֹלָם."

122
00:06:01,610 --> 00:06:08,370
היי, דפדפן, לאחר שהראש שלי
דף, הנה מגיע הגוף של הדף שלי.

123
00:06:08,370 --> 00:06:12,170
ו, היי, דפדפן, הגוף של שלי
דף צריך גם לומר, "hello world".

124
00:06:12,170 --> 00:06:15,500
אז מה הם הפרטים הבולטים כאן?

125
00:06:15,500 --> 00:06:17,960
זה מה בדרך כלל
קרא הצהרה מסוג doc,

126
00:06:17,960 --> 00:06:20,190
ובכנות, זה קצת
קשה לשנן זה בהתחלה.

127
00:06:20,190 --> 00:06:21,481
אתה פשוט סוג של העתק הדבק אותו.

128
00:06:21,481 --> 00:06:23,760
זוהי הדרך הפורמלית
לומר, היי, דפדפן,

129
00:06:23,760 --> 00:06:28,030
אני משתמש בגרסת HTML 5 אשר
יצא מעט לאחרונה.

130
00:06:28,030 --> 00:06:31,380
זהו לחש קסום שחלק
בני אדם עם תחושה ירודה של עיצוב

131
00:06:31,380 --> 00:06:33,640
החלטתי לשים בבית
העליון של הקובץ.

132
00:06:33,640 --> 00:06:35,473
למרות שזה
מסתוריות קטנה, זה כל

133
00:06:35,473 --> 00:06:38,250
זה means-- היי, דפדפן, כאן
מגיע עם גרסה 5 של HTML.

134
00:06:38,250 --> 00:06:41,741
>> שאר זה כבר איתנו
כבר כמה זמן, באופן היסטורי,

135
00:06:41,741 --> 00:06:44,740
אבל זה היה מתפתח, וזה
כנראה היה מקבל קצת יותר פשוט.

136
00:06:44,740 --> 00:06:47,320
שימו לב כמה מאפיינים
מה הדגשתי.

137
00:06:47,320 --> 00:06:49,890
יש דברים אלה עם זווית
brackets-- סוגר שמאל

138
00:06:49,890 --> 00:06:51,040
ואת הסוגר התקין.

139
00:06:51,040 --> 00:06:52,490
ושימו לב לסימטריה כאן.

140
00:06:52,490 --> 00:06:57,340
ועל ידי סימטריה, זאת אומרת, בדיוק כמו שאני
יש התחלה תג זה כאן או תג פתוח

141
00:06:57,340 --> 00:07:01,560
אם תרצו, כאן למטה יש לי
תג סגירה או ותג סוגר זה

142
00:07:01,560 --> 00:07:06,460
שונה רק ככל שהיא יש זה
סלאש בתחילת המילה

143
00:07:06,460 --> 00:07:07,360
HTML.

144
00:07:07,360 --> 00:07:09,360
ואתה יכול לחשוב
זה כמו שהייתי כלאחר

145
00:07:09,360 --> 00:07:12,280
הצעה לפני, היי,
דפדפן, הנה מגיע חלק HTML.

146
00:07:12,280 --> 00:07:16,060
ומנגד, היי, דפדפן, זה
זה בשביל ההתחלה והסיום HTML--.

147
00:07:16,060 --> 00:07:18,440
>> בינתיים היי, דפדפן, כאן
יוצא ראש הדף שלי.

148
00:07:18,440 --> 00:07:20,140
היי, דפדפן, וזהה על הראש.

149
00:07:20,140 --> 00:07:22,240
היי, דפדפן, הנה
הגוף של הדף שלי.

150
00:07:22,240 --> 00:07:24,020
היי, דפדפן, וזהו לגוף.

151
00:07:24,020 --> 00:07:26,940
ובתוך זה הוא חלק
טקסט שרירותי לעת עתה.

152
00:07:26,940 --> 00:07:30,520
ובתוך הראש, בינתיים,
הוא קצת שרירותי אבל מתויג,

153
00:07:30,520 --> 00:07:34,410
כביכול, טקסט שאומר, הכותרת
בדף שלי יהיה "שלום, עולם".

154
00:07:34,410 --> 00:07:37,470
עכשיו, לעת עתה, אתה יכול
להניח כי הדפדפנים

155
00:07:37,470 --> 00:07:41,762
יש only-- או, ליתר דיוק, דפי אינטרנט יש
רק שני parts-- הראש לגוף.

156
00:07:41,762 --> 00:07:44,220
והראש הוא בדרך כלל רק
כמו שורת התפריטים, את החומר

157
00:07:44,220 --> 00:07:45,510
באמת רק בחלקו העליון.

158
00:07:45,510 --> 00:07:48,910
והגוף הוא האומץ של הדף,
הכל במלבן גדול

159
00:07:48,910 --> 00:07:50,239
הממלא את המסך.

160
00:07:50,239 --> 00:07:51,780
אז אני הולך קדימה, לעשות זאת.

161
00:07:51,780 --> 00:07:54,400
אני הולך קדימה,
לחץ על שמור, שמור קובץ.

162
00:07:54,400 --> 00:07:58,580
ואני הולך להציל
זה כמו hello.html,

163
00:07:58,580 --> 00:08:00,870
ואני בדיוק הולך
לשים אותו על שולחן העבודה שלי.

164
00:08:00,870 --> 00:08:03,520
ואני מתכוון ללכת
קדימה ולחץ על שמור.

165
00:08:03,520 --> 00:08:05,806
ו notice-- Mac שלי
לפחות הוא צועק עלי.

166
00:08:05,806 --> 00:08:07,180
האם אתה בטוח שאתה רוצה לעשות את זה?

167
00:08:07,180 --> 00:08:08,710
ואני הולך להגיד, כן, להשתמש ב- HTML.

168
00:08:08,710 --> 00:08:10,400
אני יודע טוב יותר במקרה זה.

169
00:08:10,400 --> 00:08:14,686
ועכשיו אני הולך אל שולחן העבודה שלי
איפה יש לי קובץ זה פתאום.

170
00:08:14,686 --> 00:08:16,060
ואני הולך ללחוץ פעמיים על זה.

171
00:08:16,060 --> 00:08:18,268
ואתה תבחין כי, על ידי
מחדל, Chrome נפתח.

172
00:08:18,268 --> 00:08:19,996
זה כי זה
דפדפן ברירת המחדל שלי.

173
00:08:19,996 --> 00:08:21,370
וזה רק אומר, "שלום, עולם".

174
00:08:21,370 --> 00:08:23,078
אבל זה אומר "שלום,
בעולם "בשני מקומות.

175
00:08:23,078 --> 00:08:23,979
שימו לב בצד ימין למעלה.

176
00:08:23,979 --> 00:08:25,020
די קשה לפספס את זה.

177
00:08:25,020 --> 00:08:26,180
זה גדול ונועז.

178
00:08:26,180 --> 00:08:30,690
ואיפה עוד האם זה נראה
לומר, "שלום, עולם"?

179
00:08:30,690 --> 00:08:31,470
>> קהל: הכרטיסייה.

180
00:08:31,470 --> 00:08:33,100
>> דוד י מלאן: כן, על הכרטיסייה עצמו.

181
00:08:33,100 --> 00:08:35,159
אז כשאמרתי הראש
הדף הוא הכל top--

182
00:08:35,159 --> 00:08:36,367
ואכן זה הוא הכותרת.

183
00:08:36,367 --> 00:08:37,710
זה פשוט בכרטיסייה כאן.

184
00:08:37,710 --> 00:08:40,320
ואני יכול למשוך כרטיסייה זו
מתוך כדי לא לבלבל.

185
00:08:40,320 --> 00:08:43,360
זוהי רק כרטיסיה אחת עכשיו,
ואכן אנו רואים "שלום, עולם"

186
00:08:43,360 --> 00:08:45,970
עד פה "שלום, עולם" כאן למטה.

187
00:08:45,970 --> 00:08:47,160
אז די פשוט.

188
00:08:47,160 --> 00:08:49,050
אבל זה גם פשוט למדי.

189
00:08:49,050 --> 00:08:50,440
וזה, בעצם, אני גודל.

190
00:08:50,440 --> 00:08:53,272
אני יכול לשנות את גודל הגופן רק
כדי להגדיל לנגישות.

191
00:08:53,272 --> 00:08:56,830
אבל בואו עכשיו לעשות משהו
קצת יותר מעניין.

192
00:08:56,830 --> 00:08:59,760
>> אני הולך go-- אופס, תן
לי לחזור לקובץ הטקסט שלי.

193
00:08:59,760 --> 00:09:02,400
אני הולך בחזרה שלי
קובץ טקסט, ואני הולך

194
00:09:02,400 --> 00:09:06,320
כדי לשנות זאת ולומר
"שלום, דיסני וורלד."

195
00:09:06,320 --> 00:09:07,970
להציל.

196
00:09:07,970 --> 00:09:10,919
ולחזור שלי
דפדפן ולחץ רענן.

197
00:09:10,919 --> 00:09:12,710
ועכשיו, כמובן, זה
אומר "דיסני וורלד".

198
00:09:12,710 --> 00:09:15,500
ואני הולך כדי להגדיל באופן מלאכותי
רק אז זה יותר קל לראות.

199
00:09:15,500 --> 00:09:19,012
אז עכשיו, לצערי, אני די רוצה
עם-- למעשה, שמהווה מרכיב Mac.

200
00:09:19,012 --> 00:09:21,720
אני רוצה ללחוץ על דיסני וורלד
וללכת למקום כמו disney.com,

201
00:09:21,720 --> 00:09:23,290
אבל זה לא עובד.

202
00:09:23,290 --> 00:09:26,850
אז עיקרון בסיסי של האינטרנט הוא
קישורים, קישורים ללכת למקום אחר.

203
00:09:26,850 --> 00:09:28,390
אז איך אני עושה את זה?

204
00:09:28,390 --> 00:09:34,690
ובכן, אני יכול רק לומר,
"שלום, http://www.disney.com."

205
00:09:34,690 --> 00:09:36,110
שמור.

206
00:09:36,110 --> 00:09:37,620
לִטעוֹן מִחָדָשׁ.

207
00:09:37,620 --> 00:09:39,400
אבל זה גם לא ניתן ללחוץ.

208
00:09:39,400 --> 00:09:42,930
ומה נחמד כאן, למרות
זו אינה תפקודית עדיין,

209
00:09:42,930 --> 00:09:45,930
הוא נראה כי
דפדפן ממש רק עושה

210
00:09:45,930 --> 00:09:46,950
מה אני אומר את זה כדי לעשות.

211
00:09:46,950 --> 00:09:50,110
אז אם אני פשוט להקליד כתובת כמו זו,
זה פשוט הולך להראות לי את כתובת האתר.

212
00:09:50,110 --> 00:09:54,270
אני צריך להשתמש בתגיות או סימון
שפה בעצם אומרת

213
00:09:54,270 --> 00:09:55,621
הדפדפן לעשות אפילו יותר.

214
00:09:55,621 --> 00:09:57,870
אז אני הולך קדימה,
למחוק את זה לרגע.

215
00:09:57,870 --> 00:10:00,980
ואני הולך להגיד, היי,
דפדפן, להתחיל עוגנים כאן,

216
00:10:00,980 --> 00:10:02,650
קישור כביכול.

217
00:10:02,650 --> 00:10:07,500
ואת הפנית היתר, היעד
של עוגן, צריך להיות כתובת האתר הזו.

218
00:10:07,500 --> 00:10:08,750
ושים לב הציטוטים שלי.

219
00:10:08,750 --> 00:10:11,590
יכולתי להשתמש בגרשיים בודדים, מדי,
אבל אתה צריך להיות עקבי,

220
00:10:11,590 --> 00:10:14,270
והייתי בדרך כלל פשוט להשתמש
במרכאות כפולות כדי לשמור את זה פשוט.

221
00:10:14,270 --> 00:10:16,820
שים לב אני הולך לסגור את התג.

222
00:10:16,820 --> 00:10:21,160
ואז הנה, אני מתכוון
לומר, "דיסני וורלד".

223
00:10:21,160 --> 00:10:26,890
ועכשיו אני צריך קצת symmetry--
סוגר פתוח, / a, סגור סוגריים.

224
00:10:26,890 --> 00:10:28,090
>> אז מה יש הצגתי?

225
00:10:28,090 --> 00:10:30,100
היו לנו כמה תגים כבר.

226
00:10:30,100 --> 00:10:32,410
HTML, ראש, כותרת, גוף,
התגיות, אם אפשר לומר כך,

227
00:10:32,410 --> 00:10:34,280
עם עמיתיהם פתוחים וסגורים.

228
00:10:34,280 --> 00:10:36,530
אבל שימו לב, זה סוג
של שונה במהותו.

229
00:10:36,530 --> 00:10:39,140
זה מה שאנחנו נתקשר
ב- HTML תכונה.

230
00:10:39,140 --> 00:10:41,451
ומאפיין הוא
רק זוג מפתחות-ערך.

231
00:10:41,451 --> 00:10:43,950
זה דבר נפוץ
זוג מפתחות-ערך science-- המחשב.

232
00:10:43,950 --> 00:10:45,770
זוהי מעין כלי אומנותו של הסחר.

233
00:10:45,770 --> 00:10:47,040
מפתח וערך.

234
00:10:47,040 --> 00:10:49,390
מילה ועוד קצת
מילה או במילים אחרות.

235
00:10:49,390 --> 00:10:53,790
וגם במקרה זה, המפתח הוא href,
ואת הערך הוא כי כתובת אתר מלאה.

236
00:10:53,790 --> 00:10:57,890
ומה מאפיין עושה זה
משפיע על ההתנהגות של תג.

237
00:10:57,890 --> 00:11:01,010
וגם במקרה הזה, אנחנו צריכים להשפיע
ההתנהגות של תג העוגן,

238
00:11:01,010 --> 00:11:04,140
כי אנחנו צריכים לעגן
הקישור הזה למקום.

239
00:11:04,140 --> 00:11:06,960
ואיך אתה עושה את זה
בדרך של התכונה.

240
00:11:06,960 --> 00:11:08,970
>> אז אני הולך קדימה
ושמור את הקובץ עכשיו.

241
00:11:08,970 --> 00:11:11,300
חזור אל הדפדפן הרענן שלי.

242
00:11:11,300 --> 00:11:14,580
וגם, וזהו, עכשיו יש לנו את
ראשיתה של דף אינטרנט לגיטימי.

243
00:11:14,580 --> 00:11:18,420
סופר-פשוט, אבל אם אני לרחף מעל
הודעה זה- בפינה התחתונה השמאלית,

244
00:11:18,420 --> 00:11:19,830
זה סופר-קטן.

245
00:11:19,830 --> 00:11:21,730
אבל אתה רואה www.disney.com.

246
00:11:21,730 --> 00:11:27,076
ואם אני לוחץ עליו, ואכן זה
whisks אותי משם כדי disney.com.

247
00:11:27,076 --> 00:11:29,380
עכשיו, והדבר המעניין
כאן הוא שזה לא

248
00:11:29,380 --> 00:11:33,940
best-- את כתובת האתר הסחירה ביותר, אבל
זה בסדר, כי קובץ זה לא

249
00:11:33,940 --> 00:11:35,360
קיימים על World Wide Web.

250
00:11:35,360 --> 00:11:39,740
היא קיימת כקובץ מקומי ב כנראה
המשתמשים שלי directory-- / jharvard--

251
00:11:39,740 --> 00:11:41,890
לג'ון Harvard-- / שולחן העבודה.

252
00:11:41,890 --> 00:11:42,634
אבל יש לו כתובת אתר.

253
00:11:42,634 --> 00:11:43,800
זה קורה רק כדי להיות מקומי.

254
00:11:43,800 --> 00:11:47,050
למרבה הצער, אף אחד מכם יכול לבקר
זה, כי אם אתה מקליד כתובת אתר זו,

255
00:11:47,050 --> 00:11:49,980
היית אומר הדפדפן שלך,
לחפש hello.html קובץ בשם

256
00:11:49,980 --> 00:11:50,772
בכונן הקשיח.

257
00:11:50,772 --> 00:11:53,271
וגם, כמובן, אלא אם אתה בעל
כבר הבא יחד באופן ידני,

258
00:11:53,271 --> 00:11:54,530
זה לא הולך להתקיים שם.

259
00:11:54,530 --> 00:11:55,190
>> אז זה בסדר.

260
00:11:55,190 --> 00:11:57,815
אנחנו עדיין צריכים דרך, בסופו של דבר,
כדי לקבל את הקובץ הזה לתוך האינטרנט,

261
00:11:57,815 --> 00:12:01,180
אבל בואו ננסה להפריד כמה
שלכות אבטחה של מה שאנחנו פשוט

262
00:12:01,180 --> 00:12:04,850
ראה ולקשור אותו חזרה לפי המוקדם
דיון מהבוקר.

263
00:12:04,850 --> 00:12:08,200
מתברר כי, אם
הדפדפן פשוטו כמשמעו פשוט עושה

264
00:12:08,200 --> 00:12:12,560
מה שאני אומר זה לעשות, ונראה
כדי להיות במקרה זה תג העוגן הוא

265
00:12:12,560 --> 00:12:17,380
מושפעת ערך
תכונה בשם זה href

266
00:12:17,380 --> 00:12:20,810
אבל הוא מציג זו
טקסט, זה היה נראה

267
00:12:20,810 --> 00:12:26,520
לרמוז כי יכולתי לשים את ה- URL
בשני המקומות ולאחר מכן טענו

268
00:12:26,520 --> 00:12:29,100
ועכשיו לראות את כתובת ה- URL אנא לחץ על הקישור.

269
00:12:29,100 --> 00:12:32,680
שים לב, אם אני מרחף מעל-השמאלי התחתון,
ואני אכן הולך עדיין disney.com.

270
00:12:32,680 --> 00:12:38,340
>> אז אם היית אי פעם
phished-- P-H-I-S-H-E-D--

271
00:12:38,340 --> 00:12:42,820
עם אחד מאותם מיילים המזויפים
מ כמו הבנק שלך PayPal,

272
00:12:42,820 --> 00:12:46,470
אתה כנראה הפצתו קישורים בתוך
של הדוא"ל שאתה קורא כי

273
00:12:46,470 --> 00:12:49,970
אומר לך לחץ כאן כדי לעבור confirm
הסיסמה שלך או לאשר את תאריך הלידה שלך

274
00:12:49,970 --> 00:12:53,840
או חברתי או משהו חברתי
הנדסה לך לחשוף

275
00:12:53,840 --> 00:12:54,920
מֵידָע.

276
00:12:54,920 --> 00:12:57,625
ובכן, אני יכול סוג של לקחת
היתרון של זה, לא?

277
00:12:57,625 --> 00:13:01,240
יכולתי לומר משהו
כמו, www.paypal.com.

278
00:13:01,240 --> 00:13:11,340
ובמקום disney.com, אני
יכול ללכת, כמו, badguy.com.

279
00:13:11,340 --> 00:13:12,850
לִטעוֹן מִחָדָשׁ.

280
00:13:12,850 --> 00:13:16,620
ואיך זה קל להוליך שולל,
במיוחד לקורא שאינו טכני

281
00:13:16,620 --> 00:13:20,649
או לקרוא ברפרוף
הקורא מאשר ללחוץ

282
00:13:20,649 --> 00:13:23,940
קישור כזה, אשר אם אני לוחץ it--
אני ממש לא רוצה ללכת badguy.com.

283
00:13:23,940 --> 00:13:25,398
אני לא יודע מה שבאמת נמצא שם.

284
00:13:25,398 --> 00:13:30,080
אז paypal.com, הודעה מוקדמת, היא
מה זה אומר שזה הולך,

285
00:13:30,080 --> 00:13:33,210
אבל כמובן, אם אני מסתכל למטה
סופר-נמוך, שזה קצת מטושטש,

286
00:13:33,210 --> 00:13:34,230
אבל זה אומר badguy.com.

287
00:13:34,230 --> 00:13:38,644
זה אומר רק עכשיו
כי אני הולך למקום הלא נכון.

288
00:13:38,644 --> 00:13:41,560
וכשאני אמרתי מוקדם יותר כי בנקים
באמת לא צריך לעודד או לאמן

289
00:13:41,560 --> 00:13:44,510
משתמש לקישורי לחיצה, זה
הוא רק ביטוי אחד של זה.

290
00:13:44,510 --> 00:13:45,430
וזה כל כך פשוט.

291
00:13:45,430 --> 00:13:48,120
כעת אתה יריב אם
אתה עושה משהו כזה

292
00:13:48,120 --> 00:13:51,000
ולנסות לתמרן את המשתמש
אל הביקור באתר שלך.

293
00:13:51,000 --> 00:13:53,320
אבל לעת עתה, נשמור
דברים יפים ונקיים.

294
00:13:53,320 --> 00:13:55,640
אנחנו הולכים קדימה
אחורה שינויים אלה.

295
00:13:55,640 --> 00:13:56,530
טען מחדש את הדף.

296
00:13:56,530 --> 00:13:57,740
ואני לחזור disney.com.

297
00:13:57,740 --> 00:14:00,660
>> בוא נראה אם ​​אנחנו לא יכולים להקניט
מלבד זה קצת יותר.

298
00:14:00,660 --> 00:14:04,160
אז "שלום, דיסני וורלד."

299
00:14:04,160 --> 00:14:05,950
אני הולך לומר כאן למטה.

300
00:14:05,950 --> 00:14:08,220
אולי אני הולך לעשות קצת מקום.

301
00:14:08,220 --> 00:14:12,730
"אנו מקווים שאתה נהנה להישאר שלך!"

302
00:14:12,730 --> 00:14:13,830
להציל.

303
00:14:13,830 --> 00:14:15,850
לִטעוֹן מִחָדָשׁ.

304
00:14:15,850 --> 00:14:19,010
זה לא rea-- זה לא
מה שהתכוונתי, נכון?

305
00:14:19,010 --> 00:14:21,870
זאת אומרת, אם אני בטיפול הטקסט שלי
להגיש כמו מעבד תמלילים,

306
00:14:21,870 --> 00:14:24,894
מה אתה מקווה שקורה כאן?

307
00:14:24,894 --> 00:14:27,060
כן, אני מרגישה כאילו יש
צריך להיות מעבר שורה כאן,

308
00:14:27,060 --> 00:14:28,799
כך זה מרגיש מרכבה בדרך כלשהי.

309
00:14:28,799 --> 00:14:31,090
אבל זה בעצם מכוון,
כי בדיוק כמו קודם,

310
00:14:31,090 --> 00:14:33,381
את הדפדפן רק הולך
לעשות מה שאתה אומר את זה כדי לעשות.

311
00:14:33,381 --> 00:14:34,806
לא ספרתי את זה כדי לשבור קווים.

312
00:14:34,806 --> 00:14:37,930
אני כבר לא ספרתי לו לנוע למטה, אפילו
אם כי, באופן אינטואיטיבי, אני מרגיש כמו שאני עשיתי.

313
00:14:37,930 --> 00:14:39,805
אז מתברר שאנחנו צריכים
סימון קצת יותר,

314
00:14:39,805 --> 00:14:41,390
ואני הולך לתקן את זה כדלקמן.

315
00:14:41,390 --> 00:14:46,160
אני הולך בהקדמה זו הראשונה שלום
עם מה שנקרא תג פסקה.

316
00:14:46,160 --> 00:14:48,920
ואז אני הולך קדימה
ולעטוף את המשפט הזה אחר

317
00:14:48,920 --> 00:14:54,370
אחר תג פסקה, למרות
הם פסקאות סופר-קצר.

318
00:14:54,370 --> 00:14:55,930
עכשיו אני הולך להציל.

319
00:14:55,930 --> 00:14:57,160
לִטעוֹן מִחָדָשׁ.

320
00:14:57,160 --> 00:14:59,070
ועכשיו יש לנו כי
מרחב, ואנחנו פחות או יותר

321
00:14:59,070 --> 00:15:01,680
יש את הסמנטיקה של
כשתי פסקאות.

322
00:15:01,680 --> 00:15:05,290
>> זה כל טוב ויפה, אבל זה היה
יהיה נחמד להוסיף תמונה לדף זה,

323
00:15:05,290 --> 00:15:08,710
אז אני הולך ללכת לחפש
מיקי מאוס על תמונות Google.

324
00:15:08,710 --> 00:15:12,830
ובדיוק בשביל הכיף, אני
הולך לתפוס את התמונה.

325
00:15:12,830 --> 00:15:15,350
אני הולך קדימה עכשיו
לתפוס את כתובת האתר של התמונה,

326
00:15:15,350 --> 00:15:16,510
אף על פי שאין שונה
דרכים לעשות זאת.

327
00:15:16,510 --> 00:15:18,520
לעת עתה, אני רק הולך להעתיק את ה- URL.

328
00:15:18,520 --> 00:15:24,770
אני הולך לחזור לטקסט שלי
הקובץ, ואני הולך לומר כאן,

329
00:15:24,770 --> 00:15:31,160
img src = ציטוט סוף ציטוט
כתובת האתר, סופר-ארוך.

330
00:15:31,160 --> 00:15:34,580
ואז את הרעיון של
התמונה היא קצת שונה.

331
00:15:34,580 --> 00:15:38,640
באמת אין מושג של התחלה
תמונה וכלת תמונה,

332
00:15:38,640 --> 00:15:40,630
כמו התחלה לתייג ותג סוגר.

333
00:15:40,630 --> 00:15:43,840
אז זה מרגיש קצת מוזר
לי סמנטי כדי לעשות זאת,

334
00:15:43,840 --> 00:15:45,390
יש תג סגירת דימוי.

335
00:15:45,390 --> 00:15:46,780
זה לא שגוי.

336
00:15:46,780 --> 00:15:48,840
זה בהחלט נכון,
וזה מעודד,

337
00:15:48,840 --> 00:15:50,870
אבל יש סימון מקוצר.

338
00:15:50,870 --> 00:15:53,780
אני יכול סוג של זמנית
לפתוח ולסגור אותו התג,

339
00:15:53,780 --> 00:15:55,510
וזה יגרום לדפדפן שמח.

340
00:15:55,510 --> 00:15:56,950
אז זה רק קצת
תמציתי יותר לדברים

341
00:15:56,950 --> 00:15:59,408
כי מבחינה מושגית ממש לא
הגיוני התחלה וסיום.

342
00:15:59,408 --> 00:16:01,190
הם פשוט נמצאים שם, או שהם לא.

343
00:16:01,190 --> 00:16:06,020
>> אז אני הולך לחסוך זה ולחזור
ל "שלום, עולם" הדף רענן שלי.

344
00:16:06,020 --> 00:16:09,880
וזה קצת לצאת מכלל שליטה,
בגלל התמונה כי הוא למעשה

345
00:16:09,880 --> 00:16:12,210
קצת גדול, אבל זה בסדר.

346
00:16:12,210 --> 00:16:13,710
יכולתי לשנות את גודל בתכנית.

347
00:16:13,710 --> 00:16:14,900
או שאתה יודע מה.

348
00:16:14,900 --> 00:16:17,350
רק כדי להדגים, אני
הולך בעצם אומרים

349
00:16:17,350 --> 00:16:21,760
כי הרוחב של הדבר הזה צריך
רק להיות 200 פיקסלים, 200 נקודות.

350
00:16:21,760 --> 00:16:24,360
תן לי ללכת קדימה ולשמור
וטען מחדש, ועכשיו הדף

351
00:16:24,360 --> 00:16:25,690
נראה קצת יותר הגיוני.

352
00:16:25,690 --> 00:16:27,260
אבל שם לב לדפוס.

353
00:16:27,260 --> 00:16:30,030
ובכן, אני כבר סוג של לימד אותך את כל
של HTML במובן מסוים, לפחות

354
00:16:30,030 --> 00:16:33,531
מושגית, כי כל HTML הוא הוא
אלה tags-- תגים פתוחים, סגורי תגים,

355
00:16:33,531 --> 00:16:35,280
ותכונות
לשנות את התנהגותם.

356
00:16:35,280 --> 00:16:38,380
וזה, כנראה, כל
תג יכול להיות אפס או אחד

357
00:16:38,380 --> 00:16:43,005
או שתיים או יותר תכונות, כל אחד
אשר עושה משהו קצת שונה.

358
00:16:43,005 --> 00:16:44,380
עכשיו, איך אתה יודע מה קיים?

359
00:16:44,380 --> 00:16:46,800
אתה פשוט להקשיב למישהו
כמו לי לספר לכם מה קיים,

360
00:16:46,800 --> 00:16:50,860
או שאתה רק גוגל במקום במשך הדרכה
על HTML, וזה באמת פשוט הזאת.

361
00:16:50,860 --> 00:16:54,030
>> באמת, כשהייתי סטודנט שנה
לפני שנים ולמד HTML,

362
00:16:54,030 --> 00:16:56,530
אחד הוראת המתמטיקה שלי
עוזרים פשוט בילו

363
00:16:56,530 --> 00:16:59,600
קצת זמן להשכיל אותי
עבור כמו חצי שעה, שעה,

364
00:16:59,600 --> 00:17:00,660
ואז הייתי בדרכי.

365
00:17:00,660 --> 00:17:03,300
הייתי בדרכי לקראת קבלה
האתרים המחרידים ביותר אי פעם,

366
00:17:03,300 --> 00:17:05,549
אשר, ככל הנראה, אין לי
באמת התקדם מעבר.

367
00:17:05,549 --> 00:17:09,849
אבל הנקודה היא, ברגע שאתה
להבין ideas-- אלה פשוט

368
00:17:09,849 --> 00:17:13,450
אם מסתוריות text-- אבל אלה פשוט
רעיונות של החל מחשבה

369
00:17:13,450 --> 00:17:15,960
וסגירת מחשבה, שמירה
הכל מאוזנים יפה,

370
00:17:15,960 --> 00:17:19,150
מחפש משהו, שינוי
התנהגות של התג, זה באמת כל מה

371
00:17:19,150 --> 00:17:20,079
מה שיש לי להגיד.

372
00:17:20,079 --> 00:17:28,140
ואכן, אם אנחנו עכשיו ללכת
משהו כמו google.com-- למעשה,

373
00:17:28,140 --> 00:17:31,920
בואו נלך למקום קצת יותר
reasonable-- stanford.edu.

374
00:17:31,920 --> 00:17:37,800
ואני הולך לך לתצוגה,
Developer, צג מקור.

375
00:17:37,800 --> 00:17:41,400
זה מכוער, אבל notice--
ואני זום בהודעה

376
00:17:41,400 --> 00:17:43,432
כמה דברים זה כבר מכיר.

377
00:17:43,432 --> 00:17:45,140
יש את זה כאן,
אשר הוא דפדפן.

378
00:17:45,140 --> 00:17:46,800
הנה בא HTML5.

379
00:17:46,800 --> 00:17:47,634
יש HTML.

380
00:17:47,634 --> 00:17:49,550
ככל הנראה, קיים
מייחסים שעשיתי לא

381
00:17:49,550 --> 00:17:51,540
להשתמש המציין את
שפה של הדף,

382
00:17:51,540 --> 00:17:54,380
וזה יכול לעזור עם אוטומטי
תרגום ודברים כאלה.

383
00:17:54,380 --> 00:17:55,546
הנה ראש הדף.

384
00:17:55,546 --> 00:17:57,790
הנה הכותרת של הדף של סטנפורד.

385
00:17:57,790 --> 00:17:59,832
יש תג עשיתי לא
מדברים על תג yet-- Meta.

386
00:17:59,832 --> 00:18:01,540
זה פשוט סוג של
מידע רקע.

387
00:18:01,540 --> 00:18:04,210
זה עוזר עם קידום אתרים, או
אופטימיזציה למנועי חיפוש,

388
00:18:04,210 --> 00:18:06,320
או תוצאות החיפוש של Google או משהו דומה.

389
00:18:06,320 --> 00:18:09,029
אבל אם נשמור מחפש, לשמור
מחפש, הנה תג הגוף.

390
00:18:09,029 --> 00:18:11,570
ויש צרורות של אחרים
תגי שמנו לא דיברו על עדיין.

391
00:18:11,570 --> 00:18:13,750
אבל דיב הוא אחד עבור
חלוקת הדף.

392
00:18:13,750 --> 00:18:16,680
זה כמו מלבן בלתי נראה
אם אתה סוג של רוצה נפשי

393
00:18:16,680 --> 00:18:20,160
לחלק את הדף שלך לתוך
יחידות שונות באינטרנט.

394
00:18:20,160 --> 00:18:22,650
ולעומת זאת המון divs לי
לראות, משהו שנקרא ייצוגיות,

395
00:18:22,650 --> 00:18:24,440
אבל נחזור לזה.

396
00:18:24,440 --> 00:18:26,200
>> זהו טפסים interesting--.

397
00:18:26,200 --> 00:18:27,730
טפסים הם בכל רחבי האינטרנט.

398
00:18:27,730 --> 00:18:30,310
כל בתיבת החיפוש אתה
אי פעם נעשה שימוש הוא צורה.

399
00:18:30,310 --> 00:18:31,490
וגם, כן, בואו ממש לראות.

400
00:18:31,490 --> 00:18:32,790
טופס.

401
00:18:32,790 --> 00:18:33,910
פעולה.

402
00:18:33,910 --> 00:18:37,660
הפעולה של טופס זה, מכל
מסיבות היסטוריות, הוא כתובת האתר.

403
00:18:37,660 --> 00:18:38,840
שיטה היא "פוסט".

404
00:18:38,840 --> 00:18:44,060
מתברר כי בקשות HTTP יכול להשתמש
הפועל "לקבל", כמו שראינו קודם,

405
00:18:44,060 --> 00:18:45,070
או "פוסט".

406
00:18:45,070 --> 00:18:47,030
וגם תראה הבדל
זה בעוד רגע.

407
00:18:47,030 --> 00:18:48,363
בואו ממש לראות מה זה.

408
00:18:48,363 --> 00:18:49,830
תן לי לחזור לדף של סטנפורד.

409
00:18:49,830 --> 00:18:53,330
איזו צורה הם מדברים
על, מה אתה חושב?

410
00:18:53,330 --> 00:18:54,485
מה קופץ לך?

411
00:18:54,485 --> 00:18:54,970
>> קהל: תיבת חיפוש.

412
00:18:54,970 --> 00:18:55,845
>> דוד י מלאן: כן.

413
00:18:55,845 --> 00:18:58,410
אז עד בפינה הימנית העליונה
הנה תיבת חיפוש זו.

414
00:18:58,410 --> 00:19:02,441
וככה הם יישמו it--
תג זה ממש טופס פתוח תומך.

415
00:19:02,441 --> 00:19:03,940
ואז בואו לחפש משהו.

416
00:19:03,940 --> 00:19:09,220
בואו לחפש חבר
של "ניק Parlante." mine--

417
00:19:09,220 --> 00:19:11,380
להיכנס.

418
00:19:11,380 --> 00:19:13,750
וכמובן, זה הלך
כתובת שונה במקצת.

419
00:19:13,750 --> 00:19:15,140
תן לי לחזור לכאן.

420
00:19:15,140 --> 00:19:18,960
בואו לחפש "קורסים".

421
00:19:18,960 --> 00:19:19,460
לעזאזל.

422
00:19:19,460 --> 00:19:20,484
הלכתי לכתובת אתר אחר.

423
00:19:20,484 --> 00:19:23,400
אז, סטנפורד של הוספת כמה קסם
כי הם לא לוקחים אותי אל URL

424
00:19:23,400 --> 00:19:25,820
כי שראינו
פעולה מייחסים שם.

425
00:19:25,820 --> 00:19:32,480
אבל בטופס זה כאן מיושם גרידא
בדרך של סימון זה כאן, תגים אלה.

426
00:19:32,480 --> 00:19:35,710
למעשה, הנה קלט עבור
את סוג החיפוש הרצוי.

427
00:19:35,710 --> 00:19:38,940
הנה הקלט עבור
סוג אחר של חיפוש.

428
00:19:38,940 --> 00:19:41,960
הנה קלט עבור המחרוזת עצמה.

429
00:19:41,960 --> 00:19:45,394
וכך המטרה היא לא לעטוף
במוחנו סביב כל התגים האלה

430
00:19:45,394 --> 00:19:46,060
אבל רק כדי לראות.

431
00:19:46,060 --> 00:19:48,300
זה פשוט פותח וסוגר
תגים ודברים להרים.

432
00:19:48,300 --> 00:19:48,560
כֵּן?

433
00:19:48,560 --> 00:19:48,920
ויקטוריה?

434
00:19:48,920 --> 00:19:49,795
>> קהל: [לא ברור]

435
00:19:49,795 --> 00:19:51,925

436
00:19:51,925 --> 00:19:53,550
דוד י מלאן: זאת שאלה טובה.

437
00:19:53,550 --> 00:19:54,660
זה קצת יותר מסובך לראות.

438
00:19:54,660 --> 00:19:56,300
תן לי לחזור לזה
השאלה רק כמה דקות

439
00:19:56,300 --> 00:19:59,000
כשאנחנו מסתכלים על משהו שנקרא
CSS, או גיליונות סגנון מדורגים,

440
00:19:59,000 --> 00:20:02,500
ואנחנו יכולים לנסות להסיק
כמו הרבה מהעמוד בו.

441
00:20:02,500 --> 00:20:08,090
אז אם אנחנו עכשיו נסתכל google.com,
בואו לראות מה הדף שלהם נראה.

442
00:20:08,090 --> 00:20:09,840
היית they're-- זה חמוד היום.

443
00:20:09,840 --> 00:20:12,490

444
00:20:12,490 --> 00:20:12,990
בסדר.

445
00:20:12,990 --> 00:20:13,690
הכל גמור.

446
00:20:13,690 --> 00:20:15,260
בסדר, אז צג המקור.

447
00:20:15,260 --> 00:20:19,590
אפשר היה לחשוב לגוגל
קוד מקור ממש נחמד.

448
00:20:19,590 --> 00:20:24,970
אז, ככל הנראה, מה קורה כאן?

449
00:20:24,970 --> 00:20:27,880
ולמעשה, זה אפילו לא HTML.

450
00:20:27,880 --> 00:20:30,930
זהו משהו שנקרא JavaScript.

451
00:20:30,930 --> 00:20:32,344
ובואו להמשיך וללכת.

452
00:20:32,344 --> 00:20:34,010
אני אפילו לא יודע איפה הדף מתחיל.

453
00:20:34,010 --> 00:20:37,240
אני הולך להשתמש פיקוד
F, HTML הסוגר פתוח.

454
00:20:37,240 --> 00:20:38,200
בסדר, זה מה שיש.

455
00:20:38,200 --> 00:20:44,150
מצאתי את תחילת הדף ולאחר
יש כל כך הרבה דברים כאן.

456
00:20:44,150 --> 00:20:45,310
>> מה בעצם קורה פה?

457
00:20:45,310 --> 00:20:47,460
ובכן, אתה יודע מה,
אנחנו יכולים לנקות את זה.

458
00:20:47,460 --> 00:20:52,109
אם אני במקום ללכת זה בדוק
סרגל הכלים, כלי אבחון מיוחד זה,

459
00:20:52,109 --> 00:20:54,150
וללכת שלא הרשת,
ובהם אנחנו הולכים היום,

460
00:20:54,150 --> 00:20:56,420
אבל אם אני הולך אלמנטים,
מה באמת נחמד

461
00:20:56,420 --> 00:20:59,990
הוא שיש בו דפדפן הרבה
הרבה יותר טוב בעיני ממה שאני עושה.

462
00:20:59,990 --> 00:21:02,670
והדפדפן יכול לקרוא
הבלגן הזה של דף אינטרנט,

463
00:21:02,670 --> 00:21:04,700
שדואר HTML אנחנו פשוט
ביט, וזה יכול

464
00:21:04,700 --> 00:21:08,340
לנתח אותו או לקרוא
לנתחו לאתחל אותו

465
00:21:08,340 --> 00:21:09,910
באופן אנושי ידידותית נחמד.

466
00:21:09,910 --> 00:21:11,740
אז מה אני רואה עכשיו
במסך זה כאן

467
00:21:11,740 --> 00:21:15,470
תחת אלמנטים, אותו התוכן בדיוק,
אבל הם כבר מסוכסך הכל,

468
00:21:15,470 --> 00:21:18,140
הם כבר שנצבעו זה, אבל
זה הטקסט זהה

469
00:21:18,140 --> 00:21:19,620
כי הורדתי מהשרת.

470
00:21:19,620 --> 00:21:23,630
>> ומה נחמד כרגע הוא אני יכול לראות
בגוף, בהודעה instance--,

471
00:21:23,630 --> 00:21:26,480
הדף עדיין מורכב
של רק ראש וגוף,

472
00:21:26,480 --> 00:21:28,660
ואני יכול לצלול כאן בצורה היררכית.

473
00:21:28,660 --> 00:21:32,420
שימו לב כי גוגל נראה כי יש
כדי divs-- אחד זה ואחד זה.

474
00:21:32,420 --> 00:21:33,310
אני יכול להרחיב את זה.

475
00:21:33,310 --> 00:21:35,370
יש חבורה שלמה של divs האחר.

476
00:21:35,370 --> 00:21:36,900
אז זה מורכב מעט.

477
00:21:36,900 --> 00:21:37,400
אבל חכה.

478
00:21:37,400 --> 00:21:40,970
זה נראה כל כך הרבה יותר
קריא, באופן יחסי, מאשר זה.

479
00:21:40,970 --> 00:21:43,840
מדוע גוגל מביך
עצמו רק על ידי שליחת

480
00:21:43,840 --> 00:21:50,400
בלגן עצום זה של הקוד של כמה
מעין פשוט ליישם משהו

481
00:21:50,400 --> 00:21:53,640
זה נראה כל כך פשוט במבט ראשון?

482
00:21:53,640 --> 00:21:55,270
כאילו, למה הם לא להוסיף רווחים יותר?

483
00:21:55,270 --> 00:21:56,811
למה הם לא על Enter כמו שאני עשיתי?

484
00:21:56,811 --> 00:21:59,110
תראה כמה טוב הייתי
בכתיבת דף אינטרנט.

485
00:21:59,110 --> 00:22:00,680
אני מכה זן כך בחריצות.

486
00:22:00,680 --> 00:22:03,760
אני מסוכסך כך הכל
הוא כל כך יפה וקריא.

487
00:22:03,760 --> 00:22:08,463
מדוע גוגל לא לתרגל את אותו הדבר?

488
00:22:08,463 --> 00:22:11,409
>> קהל: [לא ברור]

489
00:22:11,409 --> 00:22:12,305

490
00:22:12,305 --> 00:22:13,180
דוד י מלאן: טוב.

491
00:22:13,180 --> 00:22:14,270
הוגן מאוד.

492
00:22:14,270 --> 00:22:16,650
אין להם חלק
אדם בגוגל באופן ידני

493
00:22:16,650 --> 00:22:18,160
עדכון בדף הבית יותר.

494
00:22:18,160 --> 00:22:20,010
זה לא 1999 יותר.

495
00:22:20,010 --> 00:22:21,140
אז יש להם תוכנה.

496
00:22:21,140 --> 00:22:25,397
יש להם כלים אחרים
ליצור באופן דינמי הוא HTML.

497
00:22:25,397 --> 00:22:27,480
כמובן, כי הקוד עצמו
נכתב על ידי בני אדם,

498
00:22:27,480 --> 00:22:30,220
אבל המציאות היא,
זה די הוגן לומר,

499
00:22:30,220 --> 00:22:33,340
הדפדפן בהחלט לא
אכפת לי כמה הוא הקוד מבולגן.

500
00:22:33,340 --> 00:22:35,940
אבל יש עוד יותר
סיבה טכנית משכנעת

501
00:22:35,940 --> 00:22:42,580
כי גוגל מפיצה HTML שלהם
קוד כזה מרושל, לכאורה

502
00:22:42,580 --> 00:22:48,350
כל דרך מכרעת צפופה
עם אגב-- מעט מאוד מאוד קטן

503
00:22:48,350 --> 00:22:51,274
בדרך של עיצוב כמו שאני עשיתי.

504
00:22:51,274 --> 00:22:52,570
>> קהל: [לא ברור]

505
00:22:52,570 --> 00:22:53,528
>> דוד י מלאן: מהר?

506
00:22:53,528 --> 00:22:54,040
למה?

507
00:22:54,040 --> 00:22:55,680
ומה אמרת, לידיה?

508
00:22:55,680 --> 00:22:56,240
מהיר יותר?

509
00:22:56,240 --> 00:22:57,281
מדוע מהר?

510
00:22:57,281 --> 00:22:58,156
קהל: [לא ברור]

511
00:22:58,156 --> 00:23:00,522

512
00:23:00,522 --> 00:23:02,230
דוד י מלאן: יש
אין מקום לקרוא.

513
00:23:02,230 --> 00:23:02,730
כֵּן.

514
00:23:02,730 --> 00:23:04,560
אז תחשוב על איזה מקום הוא.

515
00:23:04,560 --> 00:23:08,394
אז כל תו במקלדת לוקח
מידה מסוימת של מרחב לייצג,

516
00:23:08,394 --> 00:23:10,560
בין באופן פיזי, כמו זה
תופס כל כך הרבה שטח,

517
00:23:10,560 --> 00:23:13,250
או איכשהו מתחת
מכסה מנוע, הדורש זיכרון.

518
00:23:13,250 --> 00:23:15,740
ובתור aside-- ואנו
נדבר עוד על tomorrow-- זה

519
00:23:15,740 --> 00:23:19,930
כל תו במקלדת
בדרך כלל דורש 8 סיביות, או בית אחד.

520
00:23:19,930 --> 00:23:23,360
אז דפוס של 8 אפסים או
אלה, או סתם 1 byte, כפי שאנו

521
00:23:23,360 --> 00:23:24,720
בני אדם בדרך כלל היה אומר.

522
00:23:24,720 --> 00:23:27,690
אז זה קטן, אבל
זה עדיין אפס שאינם.

523
00:23:27,690 --> 00:23:29,940
זה עדיין מידה מסוימת של מרחב.

524
00:23:29,940 --> 00:23:36,082
אז אם מהנדס או בגוגל
על מקש הרווח פעם אחת בלבד, ונניח

525
00:23:36,082 --> 00:23:38,540
Google-- היא סופר-popular--
נניח ממיליארד בני אדם

526
00:23:38,540 --> 00:23:40,780
לבקר בדף הבית שלהם ביום,
או למספר אנשים

527
00:23:40,780 --> 00:23:43,290
בקר בדף הבית
מיליארדים פעמים ביום,

528
00:23:43,290 --> 00:23:48,890
כמה בתים נוספים יש כי
מהנדס תוכנה רק לעלות Google

529
00:23:48,890 --> 00:23:51,310
על ידי להכות הבר שלו או שטח אותה פעם?

530
00:23:51,310 --> 00:23:52,692
>> קהל: [לא ברור]

531
00:23:52,692 --> 00:23:54,150
דוד י מלאן: לא בדיוק כך רע.

532
00:23:54,150 --> 00:23:57,070
רק אחד פעמים בייט מיליארדים.

533
00:23:57,070 --> 00:23:57,871
אז לזה--

534
00:23:57,871 --> 00:23:59,120
הקהל: 8 מיליארד ג'יגה-בייט.

535
00:23:59,120 --> 00:24:00,370
דוד י מלאן: לא -8 מיליארד.

536
00:24:00,370 --> 00:24:01,240
8 מיליארד בייטים.

537
00:24:01,240 --> 00:24:02,410
אבל 1 ג'יגה.

538
00:24:02,410 --> 00:24:04,080
ג'יגה 1 יהיה יחידת המידה.

539
00:24:04,080 --> 00:24:08,240
אם הוא או היא עושה שני
מרחבים, 2 ג'יגה-בייט.

540
00:24:08,240 --> 00:24:09,030
שלושה גיגהבייט.

541
00:24:09,030 --> 00:24:09,530
ימין?

542
00:24:09,530 --> 00:24:11,860
לו קשקשים ביוקר.

543
00:24:11,860 --> 00:24:16,150
וכך במקרים כמו גוגל,
אשר, כמובן מאליו, הם במקרים קיצוניים,

544
00:24:16,150 --> 00:24:21,450
ישנם נושאים אחרים שעולים רק
על ידי קבלת החלטות סבירות מאוד

545
00:24:21,450 --> 00:24:25,744
או ביצוע פעולות אדם פשוט מאוד,
כי יש לו שפעה מוגדלת.

546
00:24:25,744 --> 00:24:27,660
אז אחת הסיבות
זה נראה כל כך דחוס

547
00:24:27,660 --> 00:24:30,660
בדיוק כמו ויקטוריה said-- זה היה
רק שנוצר על ידי מחשבים בכל מקרה.

548
00:24:30,660 --> 00:24:31,900
אז זה לא עניין גדול.

549
00:24:31,900 --> 00:24:33,309
תנו הדפדפן להבין את זה.

550
00:24:33,309 --> 00:24:35,350
אבל זה גם בכוונה
אין הרבה מקום,

551
00:24:35,350 --> 00:24:36,766
כי החלל אינו הכרחי.

552
00:24:36,766 --> 00:24:38,250
ואת השטח בעצם עולה כסף.

553
00:24:38,250 --> 00:24:40,670
>> גם זה עולה זמן,
כי רק לדחוף

554
00:24:40,670 --> 00:24:44,670
הרבה שיותר נתונים מתוך
המטה של ​​google.com רק

555
00:24:44,670 --> 00:24:47,710
חייב לקחת חלק מכמות
זמן, גם אם זה אלפיות

556
00:24:47,710 --> 00:24:51,190
או מיקרו, אבל זה מסתכם
על כך שמשתמשים רבים, או יותר נכון,

557
00:24:51,190 --> 00:24:52,270
זה כנראה עולה כסף.

558
00:24:52,270 --> 00:24:54,690
Google כנראה מתחבר
מישהו אחר בעולם, אחד

559
00:24:54,690 --> 00:24:56,398
מאותם מציץ
נקודות, ואם יש להם

560
00:24:56,398 --> 00:24:59,880
איזשהו קשר פיננסי
לפיה הנתונים שלהם עולים כסף,

561
00:24:59,880 --> 00:25:01,730
הם עלולים גם
למזער כמה נתונים

562
00:25:01,730 --> 00:25:04,530
הם יורקים על
חיבור האינטרנט שלהם.

563
00:25:04,530 --> 00:25:07,630
>> אז דבר המצחיק, אם כי, בסופו של דבר,
או אולי הדבר מרגיע,

564
00:25:07,630 --> 00:25:11,030
הוא שלמרות זה נראה נורא
מכריע, בסוף היום,

565
00:25:11,030 --> 00:25:16,750
זה עדיין אותם עקרונות בדיוק כמו
דף פשוט מאוד זה כאן של HTML

566
00:25:16,750 --> 00:25:17,390
עמוד.

567
00:25:17,390 --> 00:25:20,610
אז רק כדי לסכם כך שאתה
יש גרסת קנוניה אם לא היית

568
00:25:20,610 --> 00:25:25,900
הבא יחד מבחירה כאן, כאן
יכול להיות פשוט ביותר של דפי אינטרנט,

569
00:25:25,900 --> 00:25:28,240
כך משהו לשחק איתו אולי מאוחר יותר.

570
00:25:28,240 --> 00:25:30,790
>> ובכן, בואו להציג
כמה רעיונות אחרים עכשיו.

571
00:25:30,790 --> 00:25:33,420
אנחנו עומדים להציג
משהו שנקרא תג בסגנון.

572
00:25:33,420 --> 00:25:38,110
אנחנו יכולים לסגנן בדף זה
בדרכים מעניינות יותר.

573
00:25:38,110 --> 00:25:40,860
אז בעוד הדוא"ל HTML
הכל על מציין למעלה

574
00:25:40,860 --> 00:25:44,470
הנתונים, מעין ציון על
הדפדפן כיצד להבנות את הנתונים,

575
00:25:44,470 --> 00:25:48,110
איפה לשים את זה, CSS, או
גיליונות סגנון מדורג,

576
00:25:48,110 --> 00:25:52,640
היא שפה שנייה כי
בדרך כלל מקבל מעורבב עם HTML

577
00:25:52,640 --> 00:25:55,670
כפי שאנו שתראה-- אבל אנחנו יכולים לנקות
כי up in a moment-- שלוקח

578
00:25:55,670 --> 00:25:59,850
זה כשאת הקילומטר האחרון, וזה stylizes זה.

579
00:25:59,850 --> 00:26:02,460
הוא מקבל את הצבעים בדיוק כמו שצריך,
הגופן גדל בדיוק כמו שצריך,

580
00:26:02,460 --> 00:26:03,860
המיצוב בדיוק כמו שצריך.

581
00:26:03,860 --> 00:26:06,510
זה הכול עניין של אסתטיקה
או עיצוב, לא על

582
00:26:06,510 --> 00:26:08,330
עצמו את הנתונים הבסיסיים.

583
00:26:08,330 --> 00:26:11,390
והדרך הקלה ביותר כדי להראות
זה אולי על ידי דוגמא.

584
00:26:11,390 --> 00:26:15,320
אז אני הולך לעבור על
לקובץ הטקסט הפשוט שלי.

585
00:26:15,320 --> 00:26:17,970
ובכל רגע, אני יהיה
ללוות אותנו בתהליך

586
00:26:17,970 --> 00:26:19,360
לעשות זאת בעצמנו.

587
00:26:19,360 --> 00:26:23,310
>> אני הולך לחזור לקובץ שלי
כאן וטען מחדש את הדף רק

588
00:26:23,310 --> 00:26:25,800
כדי לאשר את מה שהוא נראה.

589
00:26:25,800 --> 00:26:27,190
זה המקום שבו אנחנו נמצאים עכשיו.

590
00:26:27,190 --> 00:26:31,170
אני מרגיש כמו ילדים ייהנו
שיש קצת צבע לדף אינטרנט זה.

591
00:26:31,170 --> 00:26:34,480
אז אני הולך לעלות כאן
אל ראש הדף.

592
00:26:34,480 --> 00:26:38,130
ואני הולך לעשות בסגנון, / סגנון.

593
00:26:38,130 --> 00:26:44,060
ואז בתוך זה, אני הולך
לספר הגוף של page-- שלי

594
00:26:44,060 --> 00:26:46,870
ועיצוב זו, במקרה
במבט ראשון, אולי קצת

595
00:26:46,870 --> 00:26:49,400
מוזר אך שגרתי.

596
00:26:49,400 --> 00:26:55,010
אני הולך לומר שהרקע
הצבעים של דף זה צריך להיות ירוק.

597
00:26:55,010 --> 00:26:57,960
וזה לצערי
מין לא את העיצוב הטוב ביותר.

598
00:26:57,960 --> 00:27:00,710
שימו לב כי בעבר
בעולם של HTML,

599
00:27:00,710 --> 00:27:03,190
אמרתי כי תכונות
הם זוגות מפתח-ערך אלה.

600
00:27:03,190 --> 00:27:05,760
משהו שווה ציטוט
סוף ציטוט "משהו."

601
00:27:05,760 --> 00:27:08,810
בעולם של CSS, שהיה
עוצב על ידי אנשים שונים כמה,

602
00:27:08,810 --> 00:27:11,020
הם החליטו כי שלהם
בעולם, זוגות מפתח-ערך

603
00:27:11,020 --> 00:27:13,920
יהיה משהו מעי גס מילה.

604
00:27:13,920 --> 00:27:15,220
אז זה אותו רעיון, אם כי.

605
00:27:15,220 --> 00:27:18,620
זה שיוך ערך
באחד מפתחות שאיכשהו

606
00:27:18,620 --> 00:27:20,330
משפיע על ההתנהגות של דף זה.

607
00:27:20,330 --> 00:27:21,901
>> ואתה יכול לנחש.

608
00:27:21,901 --> 00:27:24,150
מה זה כנראה הולך
אפילו לעשות אם אף פעם לא

609
00:27:24,150 --> 00:27:27,867
HTML או CSS ראיתי לפני?

610
00:27:27,867 --> 00:27:29,450
קהל: לשנות את צבע הרקע.

611
00:27:29,450 --> 00:27:30,560
דוד י מלאן: כן,
לשנות את צבע הרקע.

612
00:27:30,560 --> 00:27:33,280
ובמיוחד
צבע הרקע של הגוף.

613
00:27:33,280 --> 00:27:36,290
אבל ככל
גוף לעת עתה הוא האינטרנט

614
00:27:36,290 --> 00:27:38,870
page-- זה הדבר היחיד
מתחת באמת-- בשורת הכותרת

615
00:27:38,870 --> 00:27:40,870
זה כנראה הולך
להשפיע על אותו הדבר.

616
00:27:40,870 --> 00:27:41,430
אז בואו נראה.

617
00:27:41,430 --> 00:27:42,490
בואו נשמור את זה.

618
00:27:42,490 --> 00:27:44,310
עבור כאן וטען מחדש.

619
00:27:44,310 --> 00:27:46,140
זה די מחריד.

620
00:27:46,140 --> 00:27:48,070
ומה קורה
כאן היא תופעת לוואי.

621
00:27:48,070 --> 00:27:49,850
אני פשוט בוחר את התמונה באופן אקראי.

622
00:27:49,850 --> 00:27:53,305
למה הוא ירוק לא
מחלחל מאחורי מיקי?

623
00:27:53,305 --> 00:27:54,180
קהל: [לא ברור]

624
00:27:54,180 --> 00:27:56,880

625
00:27:56,880 --> 00:27:57,880
דוד י מלאן: בדיוק.

626
00:27:57,880 --> 00:28:01,750
מתברר תמונות, די
הרבה כל התמונות שבהן אנחנו יכולים להשתמש,

627
00:28:01,750 --> 00:28:03,670
הם כל rectangles-- של מלבנים.

628
00:28:03,670 --> 00:28:07,710
גם אם מיקי יש כמה עיקולים
לעצמו ויש לו רקע,

629
00:28:07,710 --> 00:28:09,330
הרקע חייב להיות משהו.

630
00:28:09,330 --> 00:28:10,280
זה חייב להיות לבן.

631
00:28:10,280 --> 00:28:11,910
זה חייב להיות שחור או משהו אחר.

632
00:28:11,910 --> 00:28:13,650
זה יכול להיות שקוף.

633
00:28:13,650 --> 00:28:16,100
ואכן, שיכולתי
לפתוח מיקי מאוס כאן

634
00:28:16,100 --> 00:28:18,590
ב תוכנית בשם Photoshop
או משהו דומה

635
00:28:18,590 --> 00:28:21,176
ולשנות את כל זה לבן
רקע שקוף,

636
00:28:21,176 --> 00:28:22,550
כך ירוק ישתקף מבעד.

637
00:28:22,550 --> 00:28:25,980
אבל זה משהו שהייתי צריך
לשאול את עצמי או גרפיקאי

638
00:28:25,980 --> 00:28:28,130
או מעצב שלי
חברה, למשל,

639
00:28:28,130 --> 00:28:31,490
לעשות, במיוחד מאז אני רק
לווה אחד זה מהאינטרנט.

640
00:28:31,490 --> 00:28:33,030
אבל זאת הסיבה שזה קורה.

641
00:28:33,030 --> 00:28:34,980
>> אז מה עוד יכול שאנחנו רוצים לעשות?

642
00:28:34,980 --> 00:28:41,040
ובכן, אולי נרצה לומר שאנחנו
באמת מקווה שאתה נהנה שהותכם.

643
00:28:41,040 --> 00:28:44,150
ובשביל דגש, אני רוצה
כדי להפוך את זה חזק

644
00:28:44,150 --> 00:28:48,310
ולכן אני אגיד פתוח חזק
לסגור חזק ולאחר מכן לטעון מחדש.

645
00:28:48,310 --> 00:28:50,320
וזה קצת קשה
לראות על המקרן

646
00:28:50,320 --> 00:28:53,250
אבל אולי באמת עכשיו
קופץ לך קצת יותר.

647
00:28:53,250 --> 00:28:56,180
אז אתה יכול להוסיף הדגשה זו
אגב, וציפוי מודגש בדרך זו.

648
00:28:56,180 --> 00:28:57,500
אנחנו יכולים לשנות את הצבעים.

649
00:28:57,500 --> 00:29:01,610
למעשה, סתם בשביל הכיף, אני
הולך קדימה, לעשות זאת.

650
00:29:01,610 --> 00:29:05,120
אני לא ממש אוהב איך שלי
פסקאות קרובות זה לזה,

651
00:29:05,120 --> 00:29:06,870
אז אני יכול לעשות משהו כזה.

652
00:29:06,870 --> 00:29:13,310
אני הולך לומר לדפדפן,
לשנות כל תג פסקה יש,

653
00:29:13,310 --> 00:29:16,952
בואו say-- בעצם, אתם יודעים מה,
בואו ליישר אותו יישור טקסט, מרכז.

654
00:29:16,952 --> 00:29:19,410
ושוב, אני יודע את זה רק
כי מישהו לימד אותו אליי

655
00:29:19,410 --> 00:29:21,118
או הסתכלתי בו את התינוק
התייחסות באינטרנט.

656
00:29:21,118 --> 00:29:22,450
אז תנו לי לחסוך זה.

657
00:29:22,450 --> 00:29:25,070
וגם, אה, עכשיו יש לי
מרוכז התמונה שם.

658
00:29:25,070 --> 00:29:28,490
ולמעשה, אתה יודע מה, אם
אני מזיז את דמותי לתוך פסקה

659
00:29:28,490 --> 00:29:34,510
tag-- כך פסק שלישי,
למרות שזה לא טקסט.

660
00:29:34,510 --> 00:29:36,917
בואו להציל את וטענו מחדש.

661
00:29:36,917 --> 00:29:40,000
עכשיו בו מתחיל להיראות סוג
זה-- אני מתכוון, זה עדיין מכוער למדי,

662
00:29:40,000 --> 00:29:43,180
אבל לפחות זה נראה כמו ביליתי
שתי דקות במקום דקה אחת

663
00:29:43,180 --> 00:29:43,950
עושה את זה.

664
00:29:43,950 --> 00:29:47,200
>> וכך, בהדרגה, אנחנו יכולים לעשות את
אלה שינויים אסתטיים עכשיו לדף?

665
00:29:47,200 --> 00:29:50,860
אני כבר לא ממש שיניתי את הנתונים
דף פרט להוספת המילה באמת.

666
00:29:50,860 --> 00:29:52,650
הוספתי מטה, אם תרצה.

667
00:29:52,650 --> 00:29:54,830
היי, דפדפן, להפיק את
המילה "באמת" מודגש.

668
00:29:54,830 --> 00:29:56,940
אבל הנתונים אינם חזק.

669
00:29:56,940 --> 00:29:57,830
זה מטה.

670
00:29:57,830 --> 00:29:59,410
הנתונים "באמת."

671
00:29:59,410 --> 00:30:02,200
אז עדיין יש לנו כמה
באותו מושגים כמו קודם.

672
00:30:02,200 --> 00:30:05,990
עכשיו, כמובן, זה לא באינטרנט,
אז אני הולך לעשות צעד אחד סופי כאן.

673
00:30:05,990 --> 00:30:10,300
>> אני הולך ללכת hello.html
ופשוט לסמן ולהעתיק זה.

674
00:30:10,300 --> 00:30:12,285
ועכשיו אני הולך
להיכנס Cloud9, אשר

675
00:30:12,285 --> 00:30:13,910
אני אלווה אותך דרך בעוד רגע.

676
00:30:13,910 --> 00:30:17,080
ואת רוב הסיכויים הם שבקרוב תהיה, אם
כבר לא, בכל מסך כזה.

677
00:30:17,080 --> 00:30:21,080
ותן לי רק לתת לך מהיר
סיור מה Cloud9 באמת.

678
00:30:21,080 --> 00:30:26,590
אז שוב ענן 9 הוא
שירות מבוסס ענן זה

679
00:30:26,590 --> 00:30:30,580
זה נותן לך ולי את האשליה
שיש מכונה וירטואלית שלנו

680
00:30:30,580 --> 00:30:33,090
בענן, טכני
מיכל בענן,

681
00:30:33,090 --> 00:30:35,160
כי יש לנו מלא
הרשאות ניהול.

682
00:30:35,160 --> 00:30:37,130
אז בתיאוריה, אף אחד
יש אחר בעולם

683
00:30:37,130 --> 00:30:39,152
גישה למסך אני
מסתכל עכשיו,

684
00:30:39,152 --> 00:30:40,860
למעט אולי העם
מי מנהל את האתר,

685
00:30:40,860 --> 00:30:43,470
כי מבחינה טכנית יש להם
גישה פיזית וכן הלאה.

686
00:30:43,470 --> 00:30:44,740
>> אז מה אנחנו רואים בסביבה זו?

687
00:30:44,740 --> 00:30:46,230
אני הולך כדי להתרחק,
כי זה קצת קטן.

688
00:30:46,230 --> 00:30:48,104
ותנו לי להצביע על
כאן רק לרגע.

689
00:30:48,104 --> 00:30:53,210
בצד שמאל של שלי שלך
המסך, יש דפדפן קבצים בצד שמאל.

690
00:30:53,210 --> 00:30:55,362
אז דומות ברוחן
ל- Mac OS ו- Windows.

691
00:30:55,362 --> 00:30:57,070
כל אלה הם של
קבצים בחשבון שלי.

692
00:30:57,070 --> 00:30:59,250
ו כברירת מחדל, אם שלך
החשבון הוא כמו שלי,

693
00:30:59,250 --> 00:31:05,090
תראה או לראות בקרוב
helloworld.html ו readme.md.

694
00:31:05,090 --> 00:31:07,950
כאן מימין, זהו
איפה קבצי הטקסט שלי הולכים ללכת.

695
00:31:07,950 --> 00:31:11,620
אם השתמשת אי פעם מיקרוסופט
Word או פנקס רשימות או TextEdit,

696
00:31:11,620 --> 00:31:14,100
זוהי מילת העריכה שלי
של קבצים הוא הולך.

697
00:31:14,100 --> 00:31:16,540
ואז המסתוריות ביותר
תכונה של סביבה זו

698
00:31:16,540 --> 00:31:20,100
כי אנחנו באמת לא צריכים להשתמש הוא
כאן למטה שנקרא חלון Terminal.

699
00:31:20,100 --> 00:31:23,390
אם השתמשת DOS מהכתובת
פעם, זהו לינוקס

700
00:31:23,390 --> 00:31:25,450
או שווה ערך לינוקס של DOS.

701
00:31:25,450 --> 00:31:28,190
זהו interface-- מבוסס טקסט
אין לחיצות עכבר, לא גרירה.

702
00:31:28,190 --> 00:31:30,770
כל מה שאתה יכול לעשות הוא להקליד
פקודות, אבל פקודות אלה

703
00:31:30,770 --> 00:31:34,400
ניתן ליצור קבצים, להעביר קבצים, פתוח
ספריות, ספריות קרובות,

704
00:31:34,400 --> 00:31:35,740
לעשות כל מיני דברים.

705
00:31:35,740 --> 00:31:38,060
אבל לעת עתה, אנחנו פשוט
מבלים את זמננו כאן.

706
00:31:38,060 --> 00:31:39,050
>> וכך בוא נעשה את זה.

707
00:31:39,050 --> 00:31:41,008
אם אתם במצב הזה
סביבה, שבו אתה צריך

708
00:31:41,008 --> 00:31:45,900
להיות אם יצרת סביבת עבודה
כבר, אתם מוזמנים רק לעלות

709
00:31:45,900 --> 00:31:48,690
אל קובץ, ניו לרגע.

710
00:31:48,690 --> 00:31:51,740
וזה ייתן לך חדש
כרטיסייה ממש כאן באמצע.

711
00:31:51,740 --> 00:31:54,250
ואני פשוט- ובא
אתם מוזמנים לעשות זאת.

712
00:31:54,250 --> 00:31:59,910
בואו נלך קדימה ועכשיו ניתן להגיש, שמור
וללכת קדימה קוראים לזה hello.html,

713
00:31:59,910 --> 00:32:02,740
לא להתבלבל עם
helloworld.html, אשר

714
00:32:02,740 --> 00:32:06,910
בא עם חשבון חינם החדש שלך,
וזה רק קובץ לדוגמה.

715
00:32:06,910 --> 00:32:11,020
תוכלו לראות אותו מופיע פתאום,
סביר להניח בצד השמאלי,

716
00:32:11,020 --> 00:32:12,810
ואת הכרטיסייה עדיין תהיה בתוקף.

717
00:32:12,810 --> 00:32:21,300
ותנו לי לעודד אותך עכשיו לשחזר
קובץ זה או כמה גרסאות שלה.

718
00:32:21,300 --> 00:32:24,607
ואם אתה לא ממש יכול לראות את זה על
מסך, זה זהה השקופיות

719
00:32:24,607 --> 00:32:26,190
כי יש לך כנראה בלשונית אחרת.

720
00:32:26,190 --> 00:32:29,296
>> אז בקיצור, להפוך את דף האינטרנט הראשון שלך,
לשמור אותו, ולאחר מכן בעוד רגע,

721
00:32:29,296 --> 00:32:31,170
אני אראה לך איך אתה
באמת יכול להציג את זה.

722
00:32:31,170 --> 00:32:32,970
אבל לשנות לפחות דבר אחד.

723
00:32:32,970 --> 00:32:35,400
שנת HelloWorld כדי
משהו של הבחירה שלכם,

724
00:32:35,400 --> 00:32:39,821
כך אתה משוכנע שזה שלך
להגיש ולא אחת אני פשוט נוצרתי.

725
00:32:39,821 --> 00:32:40,320
בסדר.

726
00:32:40,320 --> 00:32:43,804
וכאשר אתה ready-- לא
rush-- כשתהיה מוכן,

727
00:32:43,804 --> 00:32:46,220
קדימה, לשמור את הקובץ
פעם שתבצע שינויים אלה.

728
00:32:46,220 --> 00:32:49,540
ואם אתה לוחץ על
העליון לכפתר לרוץ, זה

729
00:32:49,540 --> 00:32:53,610
צריך לפתוח כרטיסייה חדשה כי תגיד
לך מה כתובת האתר שאתה יכול לבקר את הקובץ ב,

730
00:32:53,610 --> 00:32:56,380
אבל זה עלול לקחת רגע כדי
במירכאות, "להתחיל Apache," אשר

731
00:32:56,380 --> 00:32:58,820
השם הוא של שרת האינטרנט.

732
00:32:58,820 --> 00:33:02,430
אז להיזהר לעשות בדיוק
מה בקובץ בסופו של דבר.

733
00:33:02,430 --> 00:33:04,610
אז עכשיו, אני להתקרב.

734
00:33:04,610 --> 00:33:07,780
אם אני אתחיל הקלדה
פתוח סוגרת HTML, הודעה

735
00:33:07,780 --> 00:33:09,650
זה מה שגרם לי לסיים המחשבה שלי.

736
00:33:09,650 --> 00:33:13,750
ואם אני סיימתי את המחשבה שלי, זה
באופן אוטומטי נותן לי את תג הסגירה.

737
00:33:13,750 --> 00:33:17,190
אבל הציפייה היא אז אני אכה
זן ולאחר מכן זז בפנים

738
00:33:17,190 --> 00:33:21,180
ואל הראש פנימה
אז אני עושה את הגוף מבפנים.

739
00:33:21,180 --> 00:33:24,430
וזה קצת מוזר בהתחלה,
כי זה עושה את העבודה בשבילך,

740
00:33:24,430 --> 00:33:27,110
אבל מבין כי בסופו של דבר
זה חוסך לך הקשות.

741
00:33:27,110 --> 00:33:30,500
ואכן, מאפיין נפוץ מאוד של
תכנות סביבות בימים אלה

742
00:33:30,500 --> 00:33:33,260
הן בפיתוח אינטרנט כמו
זה ותכנות בפועל,

743
00:33:33,260 --> 00:33:36,960
אשר נדברנו על מחר,
הוא תכונות ההשלמה האוטומטית אלה,

744
00:33:36,960 --> 00:33:39,710
דברים פשוט לאפשר
מתכנת או מעצב

745
00:33:39,710 --> 00:33:42,010
להקליד פחות קשה
להשיג את אותו הדבר.

746
00:33:42,010 --> 00:33:43,176
לפעמים זה טוב, אם כי.

747
00:33:43,176 --> 00:33:44,560
לפעמים זה פשוט מעצבן.

748
00:33:44,560 --> 00:33:49,290

749
00:33:49,290 --> 00:33:54,010
וגם, שוב, ברגע שאתה כבר עבדת
השקופית או ואריאציה שלה,

750
00:33:54,010 --> 00:33:57,360
אתה יכול ללחוץ על כפתור ההפעלה למעלה.

751
00:33:57,360 --> 00:33:59,910
ואז בתחתית
חלון, אתה תהיה הודעת

752
00:33:59,910 --> 00:34:04,290
ובאיזה URL אתה יכול לבקר בדף האינטרנט שלך.

753
00:34:04,290 --> 00:34:08,790
שלי, למשל, הוא
business-daharvard.c9users.io

754
00:34:08,790 --> 00:34:11,480
וכן הלאה.

755
00:34:11,480 --> 00:34:14,580
בסדר, אז, בואו לי-- שאלות?

756
00:34:14,580 --> 00:34:19,460
עוד שאלות על פשוט מקבל
זה עובד לפני שאנחנו להוסיף תכונות?

757
00:34:19,460 --> 00:34:21,692
ותנו לי להציע, רק
להשיג אנשים comfortable--

758
00:34:21,692 --> 00:34:24,400
כי זה דבר אחד פשוט
קופי-פייסט בעיוורון מה שעשיתי.

759
00:34:24,400 --> 00:34:27,177
אבל רק כך אנשים להתאבק
עם לפחות אחת המטלות,

760
00:34:27,177 --> 00:34:28,510
אני הולך להפעיל קצת מוסיקה.

761
00:34:28,510 --> 00:34:32,630
אני הולך להציע רשימה של
דברים שאתה יכול להוסיף פוטנציאל.

762
00:34:32,630 --> 00:34:34,086
ואתה בהחלט יכול להשתמש ב- Google.

763
00:34:34,086 --> 00:34:36,210
ולמה אנחנו לא פשוט
מציע שתנסה לפתור

764
00:34:36,210 --> 00:34:38,710
לפחות בעיה אחת מסוימת כאן.

765
00:34:38,710 --> 00:34:45,090
אז מבחינת תגים,
תן לי לעשות שימוש חוזר זה כאן.

766
00:34:45,090 --> 00:34:48,280
>> למעשה, אני אנסח
אותה בצורה טקסטואלית.

767
00:34:48,280 --> 00:35:02,380
נניח כי בין התגים נוכל
להשתמש הנה כמה תגים לכאן.

768
00:35:02,380 --> 00:35:06,090
ראינו את תג פסקה.

769
00:35:06,090 --> 00:35:07,850
עכשיו זה הולך השלמה אוטומטית.

770
00:35:07,850 --> 00:35:12,220
תג פסקה, תג העוגן.

771
00:35:12,220 --> 00:35:15,250
נניח שאתה רוצה
לעשות משהו גדול יותר,

772
00:35:15,250 --> 00:35:19,480
לכן ייתכן בהדגשה כמו
שתג span יכול לעזור.

773
00:35:19,480 --> 00:35:23,010
ובכן, ייתכן שיהיה עליך קצת עזרה
בשביל זה בדיוק רגע.

774
00:35:23,010 --> 00:35:24,830
ראינו div.

775
00:35:24,830 --> 00:35:26,170
תראה יש שולחן.

776
00:35:26,170 --> 00:35:27,928
יש משהו שנקרא tr, td.

777
00:35:27,928 --> 00:35:30,736

778
00:35:30,736 --> 00:35:32,860
Th, td.

779
00:35:32,860 --> 00:35:34,770
אחזור לזה בעוד רגע.

780
00:35:34,770 --> 00:35:36,590
מה עוד יכול להיות שימושי?

781
00:35:36,590 --> 00:35:38,310
יש חזק.

782
00:35:38,310 --> 00:35:43,640
יש דגש, או ליתר דיוק em.

783
00:35:43,640 --> 00:35:50,110
שיש-- מה עוד
אולי מתחשק לכם כאן?

784
00:35:50,110 --> 00:35:51,930
ובכן, ניקח
תראו מה זה יחד.

785
00:35:51,930 --> 00:35:53,230
טופס, אשר שראינו.

786
00:35:53,230 --> 00:35:54,130
יש טופס.

787
00:35:54,130 --> 00:35:56,500
יש קלט ועוד כמה אנשים.

788
00:35:56,500 --> 00:35:58,924

789
00:35:58,924 --> 00:36:00,090
בסדר, אז בואו נעשה את זה.

790
00:36:00,090 --> 00:36:02,330
למען ויקטוריה
שאלה, תן לי קודם

791
00:36:02,330 --> 00:36:05,020
רק לוודא שכולם
מסוגל לקבל עבודת השלום שלהם.

792
00:36:05,020 --> 00:36:06,900
אז הרשה לי להציג את
כמה רעיונות אחרים.

793
00:36:06,900 --> 00:36:09,209
ואז נודיע אנשים לפתור
קצת בעיה בכוחות עצמם.

794
00:36:09,209 --> 00:36:11,500
אז אנחנו ממש רואים נחזור
לזה רעיון של צורה,

795
00:36:11,500 --> 00:36:14,950
ו אנחנו בעצם מחדש ליישם
יחד ממשק החזיתי,

796
00:36:14,950 --> 00:36:16,450
כביכול, עבור גוגל עצמה.

797
00:36:16,450 --> 00:36:19,700
נשתמש Google כמו סוף חזרה ולתת
אותם לעשות את העבודה הקשה, את החיפוש,

798
00:36:19,700 --> 00:36:22,760
אבל נצטרך לשחזר את הקצה הקדמי
של Google ואת טופס חיפוש

799
00:36:22,760 --> 00:36:24,520
כי יש להם בדף הבית שלהם.

800
00:36:24,520 --> 00:36:27,050
וכך נבוא חזרה
תגים אלה בעוד רגע.

801
00:36:27,050 --> 00:36:30,270
>> אז זה מה שאני
הציע רק לפני רגע.

802
00:36:30,270 --> 00:36:33,940
אנחנו יכולים להוסיף את הסגנון על
בעמוד הפנימי של תג בסגנון הזה,

803
00:36:33,940 --> 00:36:36,950
ואנחנו יכולים לסגנן ברקע
צבע, יישור הטקסט,

804
00:36:36,950 --> 00:36:39,000
בין אם זה במרכז או שמאלה או ימינה.

805
00:36:39,000 --> 00:36:41,630
אבל מהר מאוד שהיית
למצוא או מעצב אינטרנט

806
00:36:41,630 --> 00:36:44,060
תמצא כי זה
הופך להיות קצת מסורבל,

807
00:36:44,060 --> 00:36:48,330
בגלל שאתה עושה את הדבר
קרא תוכן ערבוב

808
00:36:48,330 --> 00:36:50,120
עם הצגתם, לפי סעיף.

809
00:36:50,120 --> 00:36:53,756
אתה מבלבל את הנתונים שלך
ואת האסתטיקה שלה.

810
00:36:53,756 --> 00:36:56,380
ואכן, אם אתה מחשיב
מה הולך לקרות על הבאה--

811
00:36:56,380 --> 00:36:58,350
זה קטן מאוד
דף האינטרנט, כמובן.

812
00:36:58,350 --> 00:37:01,590
אבל אם אני מוסיף תוכן בדף זה
ואני מוסיף סגנון בדף זה,

813
00:37:01,590 --> 00:37:04,650
בו מהר מאוד מקבל
עוד ועוד וארוכים יותר.

814
00:37:04,650 --> 00:37:07,510
ונניח שאני רוצה
יש דף אינטרנט שני

815
00:37:07,510 --> 00:37:09,010
כמה מניות של תכונות אלה.

816
00:37:09,010 --> 00:37:12,350
תניח דף האינטרנט השני שלי שלי
site-- גם, אני רוצה מרכז הכל,

817
00:37:12,350 --> 00:37:14,960
ואני גם רוצה הכל
עם רקע ירוק.

818
00:37:14,960 --> 00:37:17,940
אני פחות או יותר הולך צריך
להעתיק ולהדביק כמה שורות אלה

819
00:37:17,940 --> 00:37:20,730
לתוך קובץ שני, אשר מרגיש בסדר.

820
00:37:20,730 --> 00:37:22,030
זה יפתור את הבעיה.

821
00:37:22,030 --> 00:37:26,060
>> אבל מה אם אני רוצה דף שלישי
או דף 30 או דף ה -40?

822
00:37:26,060 --> 00:37:28,730
עכשיו אני הולך להיות העתקה
הדבקה הרבה קוד כפול

823
00:37:28,730 --> 00:37:30,430
מספר קבצים.

824
00:37:30,430 --> 00:37:32,600
וכך מניח כי
אני מחליט או כך נאמר לי,

825
00:37:32,600 --> 00:37:34,780
היי, אנחנו לא באמצעות
רקע ירוק יותר.

826
00:37:34,780 --> 00:37:36,380
אנחנו הולכים להתחיל להשתמש כתום.

827
00:37:36,380 --> 00:37:38,690
מה אתה צריך לשנות?

828
00:37:38,690 --> 00:37:42,900
ובכן, אתה צריך לשנות את זה בסגנון
מירוק לכתום במקומות כמה?

829
00:37:42,900 --> 00:37:44,920
כמו 30 או 40 מקומות.

830
00:37:44,920 --> 00:37:45,900
זה מייגע.

831
00:37:45,900 --> 00:37:47,039
זה מועד לטעות.

832
00:37:47,039 --> 00:37:49,580
יש מספר סיבות
איפה אתה לא תרצה לגרום

833
00:37:49,580 --> 00:37:51,840
סוג זה של כאב בעצמך.

834
00:37:51,840 --> 00:37:54,760
וכך לא יהיה נחמד
אם נוכל לקחת את מה שאני רק

835
00:37:54,760 --> 00:37:58,240
לשים בין שני אלה צהובים
תגים, תגים בסגנון אלה,

836
00:37:58,240 --> 00:38:04,050
גורם את זה, ולשים את כל שלי
סגנון לתוך קובץ מרכזי אחד

837
00:38:04,050 --> 00:38:08,470
כי כל 30 או 40 של קבצים האחרים שלי
ללוות או איכשהו אסמכתא,

838
00:38:08,470 --> 00:38:11,640
לא בניגוד ברשת
דיאגרמות אנחנו עושים קודם?

839
00:38:11,640 --> 00:38:15,030
>> אז אם אני נכנסתי כאן, אני
הולך בעצם מציעים

840
00:38:15,030 --> 00:38:17,880
כי אנו מחליפים את
תג בסגנון עם משהו

841
00:38:17,880 --> 00:38:21,620
נקרא תג הקישור, אשר
נקרא להחריד, להחריד,

842
00:38:21,620 --> 00:38:24,370
כי אתה לא להשתמש
תג קישור כדי ליצור את מה

843
00:38:24,370 --> 00:38:26,380
בני אדם שאנו מכירים כחוליה דף אינטרנט.

844
00:38:26,380 --> 00:38:29,750
בשביל זה, אתה משתמש בו תג?

845
00:38:29,750 --> 00:38:31,464
איך אתה יוצר קישור בדף אינטרנט?

846
00:38:31,464 --> 00:38:32,130
קהל: א.

847
00:38:32,130 --> 00:38:34,870
דוד י מלאן: א, או עוגן
תג, כי הלך דיסני לפני.

848
00:38:34,870 --> 00:38:39,090
תג הקישור כאן הוא אומר
זה- קישור לקובץ שנקרא

849
00:38:39,090 --> 00:38:44,350
styles.css, הקשר שאליו
הולך להיות שזה stylesheet שלי.

850
00:38:44,350 --> 00:38:48,290
אז זהו אחד S של ב
גיליונות סגנון מדורגים CSS--.

851
00:38:48,290 --> 00:38:50,490
סגנון sheet-- שני של S של ב- CSS.

852
00:38:50,490 --> 00:38:52,550
מדורג גיליון סגנונות.

853
00:38:52,550 --> 00:38:58,640
זה רק אומר, היי, דפדפן, ללכת
למצוא styles.css בשרת המקומי

854
00:38:58,640 --> 00:39:01,870
ולהשתמש בו בתור הסגנונות,
כלומר בתוך של אותו קובץ

855
00:39:01,870 --> 00:39:05,310
הולך להיות כל
stylizations כי רק שעשינו.

856
00:39:05,310 --> 00:39:07,396
אז מה זה קובץ
עשוי להיראות היא זו.

857
00:39:07,396 --> 00:39:10,020
ואני פשוט אעשה את זה הוא מהיר
למשל, כי אנחנו לא צריכים

858
00:39:10,020 --> 00:39:12,000
מדי כדי לקבל הרבה לתוך העשבים כאן.

859
00:39:12,000 --> 00:39:17,840
אבל אם אני מעתיק זה, מה שאני מציע
הוא מתכנת ליצור קובץ חדש,

860
00:39:17,840 --> 00:39:24,450
להדביק באותם lines--
whoops-- להדביק את השורות הללו,

861
00:39:24,450 --> 00:39:32,270
ולשמור אותו בתור styles.css, ולאחר מכן,
לקובץ השני, למחוק את כל זה

862
00:39:32,270 --> 00:39:35,450
ולהחליף אותו במקום
עם תג הקישור הזה.

863
00:39:35,450 --> 00:39:43,090
אז אם אקשר href = "styles.css",
הקשר יהיה "stylesheet"

864
00:39:43,090 --> 00:39:44,170
תג סגירה.

865
00:39:44,170 --> 00:39:45,250
שמור את זה.

866
00:39:45,250 --> 00:39:47,000
אחזור HelloWorld שלי.

867
00:39:47,000 --> 00:39:48,690
לִטעוֹן מִחָדָשׁ.

868
00:39:48,690 --> 00:39:51,290
>> פשוטו כמשמעו דבר לא קרה.

869
00:39:51,290 --> 00:39:54,710
זה דבר טוב, כי זה
כלומר, זה בעצם כל העבודה.

870
00:39:54,710 --> 00:39:58,860
כדי להוכיח זאת, נניח אני עושה
טעות דפוס, ואני קורא לזה "styles.css"

871
00:39:58,860 --> 00:40:03,080
עם S גדול, שהוא
לא נכון, ולאחר מכן לטעון מחדש.

872
00:40:03,080 --> 00:40:05,470
עכשיו אתה יכול לראות את זה פשוט לא עובד.

873
00:40:05,470 --> 00:40:06,362
עכשיו, למה?

874
00:40:06,362 --> 00:40:08,070
ובכן, בואו להשתמש
טכניקה מוקדם יותר.

875
00:40:08,070 --> 00:40:10,153
תן לי ללכת קדימה, ב
הדפדפן שלי, ב- Chrome, אני

876
00:40:10,153 --> 00:40:12,900
הולך להיפתח כי מיוחד
כרטיסיית רשת כמו קודם,

877
00:40:12,900 --> 00:40:15,560
ותן לי מחדש את הדף.

878
00:40:15,560 --> 00:40:19,341
מה אתה לא מופתע לראות עכשיו?

879
00:40:19,341 --> 00:40:20,840
או אולי אתה מופתע לראות אותו.

880
00:40:20,840 --> 00:40:23,225
כך או כך, מה אתה רואה עכשיו?

881
00:40:23,225 --> 00:40:24,100
קהל: [לא ברור]

882
00:40:24,100 --> 00:40:24,770
דוד י מלאן: הוא לא נמצא.

883
00:40:24,770 --> 00:40:25,680
למה זה לא נמצא?

884
00:40:25,680 --> 00:40:28,480
ובכן, הון Styles.css--
S-- אינו קיים.

885
00:40:28,480 --> 00:40:29,230
אני misnamed זה.

886
00:40:29,230 --> 00:40:30,430
טעות דפוס פשוטה.

887
00:40:30,430 --> 00:40:33,816
אבל אני די מובן עכשיו
404, מכיוון שהשרת אומר, היי,

888
00:40:33,816 --> 00:40:34,440
הוא לא נמצא.

889
00:40:34,440 --> 00:40:36,300
פשוטו כמשמעו, אני לא יודע
איפה זה קובץ.

890
00:40:36,300 --> 00:40:38,880
אז כתוצאה מכך, הדפדפן
מראה לך את מה שהיא יכולה,

891
00:40:38,880 --> 00:40:42,860
תוכן הגלם של הדף,
אשר היה 200, HTML,

892
00:40:42,860 --> 00:40:45,390
אבל המסוגנן לא יכול
יתווספו לאחריו.

893
00:40:45,390 --> 00:40:47,120
וזה מה פירוש מדורג.

894
00:40:47,120 --> 00:40:49,070
אתה יכול מעין להוסיפו
לאחר, וזה סוג של

895
00:40:49,070 --> 00:40:50,874
משכלל את האסתטיקה של דף האינטרנט.

896
00:40:50,874 --> 00:40:53,790
ואתה יכול אפילו לעקוף אותם
סגנונות עם קבצים stylesheet אחרים עדיין

897
00:40:53,790 --> 00:40:54,700
אם אתה רוצה.

898
00:40:54,700 --> 00:40:57,780
הוא לא נמצא, אם כי, במקרה זה,
כי כמובן, אני misnamed זה.

899
00:40:57,780 --> 00:41:00,330
אז הייתי צריך לתקן את זה קודם.

900
00:41:00,330 --> 00:41:04,667
>> אז בואו נלך קדימה
להציע את הדברים הבאים.

901
00:41:04,667 --> 00:41:07,410

902
00:41:07,410 --> 00:41:11,140
בואו נלך קדימה ולעשות את זה.

903
00:41:11,140 --> 00:41:14,220
החל אולי
קובץ HelloWorld שלך,

904
00:41:14,220 --> 00:41:17,740
תן לי רק להזמין זוג
של תכונת הצעות.

905
00:41:17,740 --> 00:41:20,400
אז, ויקטוריה, רצית
לעשות יותר טקסט כלשהו, ​​נכון?

906
00:41:20,400 --> 00:41:24,555
בסדר, אז אנחנו יכולים
ניתן להפוך את הטקסט גדול.

907
00:41:24,555 --> 00:41:26,860
ואנחנו כל יהיה לתלוש
רק בעיה אחת לפתור.

908
00:41:26,860 --> 00:41:30,867
הפיכת טקסט גדול.

909
00:41:30,867 --> 00:41:32,700
אני לא הולך להטריד
כותב את זה כשאנחנו

910
00:41:32,700 --> 00:41:35,600
יש טכנולוגית כדור ממש כאן.

911
00:41:35,600 --> 00:41:39,970
אז כמה בעיות.

912
00:41:39,970 --> 00:41:44,670
אז אנחנו הולכים לנסות
כדי להפוך טקסט גדול יותר.

913
00:41:44,670 --> 00:41:45,170
בסדר.

914
00:41:45,170 --> 00:41:48,360
מה עוד מישהו היה מציע?

915
00:41:48,360 --> 00:41:50,332
מה עוד יכל רוצים
לעשות דף אינטרנט?

916
00:41:50,332 --> 00:41:52,040
בואו לבוא עם
רשימה קצרה של דברים

917
00:41:52,040 --> 00:41:55,366
ואז לאצול
הקבוצה להבין את זה.

918
00:41:55,366 --> 00:41:56,270
>> קהל: [לא ברור]

919
00:41:56,270 --> 00:42:02,251
>> דוד י מלאן: אישור, טקסט עמדה
על צדדים שונים של הדף?

920
00:42:02,251 --> 00:42:02,750
בסדר.

921
00:42:02,750 --> 00:42:04,620
משהו אחר.

922
00:42:04,620 --> 00:42:05,784
>> קהל: [לא ברור]

923
00:42:05,784 --> 00:42:06,700
דוד י מלאן: זהו.

924
00:42:06,700 --> 00:42:08,720
אז gif הוא רק
בתבנית קובץ שונה.

925
00:42:08,720 --> 00:42:12,830
אנחנו פשוט להשתמש, מה,
png או jpg כנראה?

926
00:42:12,830 --> 00:42:14,480
השתמשנו jpg.

927
00:42:14,480 --> 00:42:16,780
אם אתה סקרן, גידול מופרז
התשובה לשאלתך

928
00:42:16,780 --> 00:42:19,404
הוא jpg משמש בדרך כלל עבור
צילומים, משום שהוא תומך

929
00:42:19,404 --> 00:42:21,500
מיליוני צבעים או צבע של 24 סיביות.

930
00:42:21,500 --> 00:42:26,930
קובץ GIF משמש בדרך כלל עבור, כמו,
תופעת אינטרנט אנימציות days-- אלה,

931
00:42:26,930 --> 00:42:28,810
אנימציות GIF כמו.

932
00:42:28,810 --> 00:42:32,320
אבל זה קורה להשתמש בצבע קטן
לוח, רק 256 צבעים אפשריים,

933
00:42:32,320 --> 00:42:35,230
אבל הוא תומך
שקיפות ואנימציה.

934
00:42:35,230 --> 00:42:40,330
ואז יש png, התומך
שקיפות וצבעים יותר

935
00:42:40,330 --> 00:42:41,300
אבל לא אנימציה.

936
00:42:41,300 --> 00:42:42,133
אז זה trade-off.

937
00:42:42,133 --> 00:42:44,144

938
00:42:44,144 --> 00:42:46,060
אז הוספת gif, לעומת זאת,
יהיה פונקציונלי

939
00:42:46,060 --> 00:42:48,396
שווה הוספת png או jpg.

940
00:42:48,396 --> 00:42:49,110
כֵּן.

941
00:42:49,110 --> 00:42:50,550
מקור תמונה שווה.

942
00:42:50,550 --> 00:42:51,590
אז משהו אחר.

943
00:42:51,590 --> 00:42:57,288
בואו לבוא עם משהו
ששלחנו ויקטוריה לעשות כאן.

944
00:42:57,288 --> 00:42:59,209
>> קהל: הוסף לחצנים עבור צורה.

945
00:42:59,209 --> 00:43:00,000
דוד י מלאן: אישור.

946
00:43:00,000 --> 00:43:02,179
אז להוסיף לחצנים עבור צורה.

947
00:43:02,179 --> 00:43:03,470
ואנו נעשים ביחד כי אחד.

948
00:43:03,470 --> 00:43:07,220
אז זה הולך להיות לשמור על רצף מושלם
מיד אחרי האתגר הזה.

949
00:43:07,220 --> 00:43:10,357
עוד משהו?

950
00:43:10,357 --> 00:43:11,440
מה היית רוצה לעשות?

951
00:43:11,440 --> 00:43:14,040

952
00:43:14,040 --> 00:43:16,516
האינטרנט מרגיש מאוד משעמם
אם זה כל מה שאנחנו יכולים לעשות.

953
00:43:16,516 --> 00:43:18,140
קהל: שנה את הצבע של הטקסט.

954
00:43:18,140 --> 00:43:19,500
דוד י מלאן: שנו את מה?

955
00:43:19,500 --> 00:43:20,666
קהל: צבע של הטקסט.

956
00:43:20,666 --> 00:43:22,311
דוד י מלאן: שינוי צבע של טקסט.

957
00:43:22,311 --> 00:43:22,810
בסדר.

958
00:43:22,810 --> 00:43:23,790
אז, בוא נעשה את זה.

959
00:43:23,790 --> 00:43:27,209
רק שוב, כך שאתה לא, פשוט
על ידי שינון, עושה בדיוק את מה שאני עושה,

960
00:43:27,209 --> 00:43:29,500
אני הולך להפעיל מוסיקה
אולי חמש דקות כאן.

961
00:43:29,500 --> 00:43:30,450
אתם מוזמנים להשתמש ב- Google.

962
00:43:30,450 --> 00:43:33,130
אתם מוזמנים לשאול אותי,
מאלחש רמז באוזן שלך.

963
00:43:33,130 --> 00:43:35,171
אתם מוזמנים להסתכל
על על כתפי אחרים.

964
00:43:35,171 --> 00:43:37,340
אבל לפתור רק אחת מבעיות אלה.

965
00:43:37,340 --> 00:43:40,190
אבל אנחנו נעשה את אחד האחרון,
טפסים אחד, אם היינו יכולים, יחד.

966
00:43:40,190 --> 00:43:42,790
אז חמש דקות כדי לפתור
באחת או יותר מהבעיות הבאות

967
00:43:42,790 --> 00:43:46,780
באמצעות Google, אינטואיציה, או כל
אמצעים אחרים העומדים לרשותך.

968
00:43:46,780 --> 00:43:48,630
>> [מוסיקה מתנגנת]

969
00:43:48,630 --> 00:43:49,130
בסדר.

970
00:43:49,130 --> 00:43:50,838
אל דאגה, אם אתה רוצה
לשמור התעסקות,

971
00:43:50,838 --> 00:43:53,880
אבל אני אקלקל זוג
תשובות אלה.

972
00:43:53,880 --> 00:43:57,986
אז את ההצעה הראשונה
ויקטוריה הייתה כדי להפוך טקסט גדול יותר.

973
00:43:57,986 --> 00:43:59,360
אז יש כמה דרכים לעשות זאת.

974
00:43:59,360 --> 00:44:01,530
אני כבר שוחזר כרגע
המסך שלי לגודל זה,

975
00:44:01,530 --> 00:44:04,310
למרות שאני כבר הגדלה
באופן מלאכותי רק כדי לראות את הדברים.

976
00:44:04,310 --> 00:44:07,470
ובואו לעשות זאת.

977
00:44:07,470 --> 00:44:11,380
תן לי ללכת קדימה לתפוס
טקסט גנרי לטיני

978
00:44:11,380 --> 00:44:19,540
רק אז יש לנו משהו לעבוד איתו.

979
00:44:19,540 --> 00:44:20,715
אז תן לי רק רגע אחד.

980
00:44:20,715 --> 00:44:21,840
אני אכין שלוש פסקאות.

981
00:44:21,840 --> 00:44:53,430

982
00:44:53,430 --> 00:44:53,930
בסדר.

983
00:44:53,930 --> 00:44:55,560
זו תהיה דוגמה טובה יותר.

984
00:44:55,560 --> 00:44:57,840
אז עבור הסקרנים, ב
hello.html שלי, אני פשוט

985
00:44:57,840 --> 00:45:01,645
הודבק שלוש שטותיים
פסקאות הלטינית

986
00:45:01,645 --> 00:45:03,270
רק כך יש לנו כמה טקסט לעבוד עם.

987
00:45:03,270 --> 00:45:06,720
והמטרה של ויקטוריה הייתה
להפוך חלק מהטקסט הגדול.

988
00:45:06,720 --> 00:45:09,879
אז יכולתי, כמו קודם, ללכת כאן.

989
00:45:09,879 --> 00:45:11,170
ותן לי לעשות את זה בדרך הנכונה.

990
00:45:11,170 --> 00:45:13,253
אני הולך לקבל קישור
תג המצביע על קובץ

991
00:45:13,253 --> 00:45:20,560
בשם "styles.css," היחסים
אחד מהם הוא שוב "stylesheet".

992
00:45:20,560 --> 00:45:25,221
ואז אני הולך להציל את
ולפתוח "styles.css." זה

993
00:45:25,221 --> 00:45:28,940
>> אז, כמו קודם, יש לי את
היכולת בקובץ CSS זה

994
00:45:28,940 --> 00:45:31,569
למעשה לעקוף את ברירת המחדל
אסתטיקה של דף אינטרנט,

995
00:45:31,569 --> 00:45:33,860
ואת האסתטיקה מחדל,
כמובן, הם די משעממים.

996
00:45:33,860 --> 00:45:36,943
זוהי מעין גודל גופן רגיל, שחור
טקסט, רקע לבן, וכן הלאה.

997
00:45:36,943 --> 00:45:39,440
אז נניח שאני רוצה לעשות
כל הטקסט הזה גדול.

998
00:45:39,440 --> 00:45:40,460
יכולתי לעשות כמה דברים.

999
00:45:40,460 --> 00:45:43,750
בקובץ styles.css שלי, אני
אפשר לומר, אתה יודע מה,

1000
00:45:43,750 --> 00:45:46,950
להחיל את הפעולות הבאות כדי
הגוף של הדף שלי.

1001
00:45:46,950 --> 00:45:51,390
קדימה ולהפוך את
גודל גופן 24 נקודות,

1002
00:45:51,390 --> 00:45:54,130
שהוא מספר אני עלול
להשתמש ב- Microsoft Word.

1003
00:45:54,130 --> 00:45:57,620
תן לי לחזור האינטרנט שלי
דף כאן וטען מחדש,

1004
00:45:57,620 --> 00:45:59,640
ואתה יכול לראות את זה
זה כבר הרבה יותר גדול.

1005
00:45:59,640 --> 00:46:02,223
ואנחנו יכולים לקבל קצת משוגעים,
בדיוק כמו שאנחנו יכולים על desktop--

1006
00:46:02,223 --> 00:46:03,670
לעשות את זה 96 נקודות.

1007
00:46:03,670 --> 00:46:04,950
לִטעוֹן מִחָדָשׁ.

1008
00:46:04,950 --> 00:46:07,610
וזה מתחיל קצת
מסורבל בנקודה זו.

1009
00:46:07,610 --> 00:46:09,500
>> אבל אני יכול להיות קצת יותר מדויק.

1010
00:46:09,500 --> 00:46:14,530
במקום להחיל זו
stylesheet לגוף בדף שלי,

1011
00:46:14,530 --> 00:46:21,740
מה עוד יכול אני להחיל אליו במקום,
מה תג אחר שעשויים עדיין

1012
00:46:21,740 --> 00:46:25,445
פונקציה באותו אופן?

1013
00:46:25,445 --> 00:46:26,444
>> קהל: תג p?

1014
00:46:26,444 --> 00:46:27,360
דוד י מלאן: תג P.

1015
00:46:27,360 --> 00:46:29,350
אז הראש לא יהיה
נכון, כי הראש,

1016
00:46:29,350 --> 00:46:31,300
אתה לא ממש יכול
לשלוט על האסתטיקה של.

1017
00:46:31,300 --> 00:46:32,700
יש גם טקסט שם או לא.

1018
00:46:32,700 --> 00:46:36,760
אבל p tag-- אני יכול לצלול קצת
עמוק, אם אפשר לומר כך, על ההפסקה

1019
00:46:36,760 --> 00:46:37,350
תגיות.

1020
00:46:37,350 --> 00:46:41,600
ואף על פי שיש שלוש,
וזה בסדר גמור, כי ב- CSS,

1021
00:46:41,600 --> 00:46:44,900
כשאני רק להגיד "עמ '," זה
פירושו להחיל את הבאים

1022
00:46:44,900 --> 00:46:48,300
לכל תג תואם זה
בורר, בורר רק

1023
00:46:48,300 --> 00:46:49,430
להיות השם של התג.

1024
00:46:49,430 --> 00:46:52,350
אז בכל פעם שאתה רואה
"P" להחיל את גודל הגופן,

1025
00:46:52,350 --> 00:46:55,222
ובואו לעשות את זה יותר
נקודה סבירה 24 again--.

1026
00:46:55,222 --> 00:46:56,930
ואתם יודעים מה,
רק למען הסדר הטוב,

1027
00:46:56,930 --> 00:46:59,810
בוא נעשה את הצבע
רק אדום לרגע.

1028
00:46:59,810 --> 00:47:03,740
ועכשיו אם אני מחדש, ועכשיו אנחנו
לראות שלוש פסקאות מכוערת.

1029
00:47:03,740 --> 00:47:07,180
>> אבל עכשיו, נניח כי אני די
זה-- אני רוצה בפסקה הראשון

1030
00:47:07,180 --> 00:47:08,210
כדי לקפוץ החוצה המשתמש.

1031
00:47:08,210 --> 00:47:11,150
אני לא רוצה רק להגדיל
את גודל הגופן של הכל.

1032
00:47:11,150 --> 00:47:16,105
וכך אני בעצם רוצה לזהות או
להבחין בין פסקאות אלה.

1033
00:47:16,105 --> 00:47:18,730
אז בואו להיפטר האדום,
כי זה פשוט סוג של דביק,

1034
00:47:18,730 --> 00:47:23,885
ובואו קדימה ולעשות את
גודל גופן 12 נקודות כברירת מחדל,

1035
00:47:23,885 --> 00:47:26,260
כך חזרנו לנקודת משהו
קצת יותר סביר.

1036
00:47:26,260 --> 00:47:29,190
ועכשיו אני רק רוצה להגדיל את
גודל הגופן של הפיסקה הראשונה.

1037
00:47:29,190 --> 00:47:31,440
אני יכול לעשות את זה בעוד כמה
דרכים, אבל דרך אחת זה

1038
00:47:31,440 --> 00:47:37,180
אולי ההוראה ביותר בבית
כרגע הוא לבצע את הפעולות הבאות.

1039
00:47:37,180 --> 00:47:43,280
תן לי באים ואומרים, זה
יש סעיף מזהה ייחודי של "הראשון."

1040
00:47:43,280 --> 00:47:45,000
יכולתי לקרוא דבר זה שאני רוצה.

1041
00:47:45,000 --> 00:47:46,874
יכולתי לקרוא לזה "foo"
או כל מילה אחרת,

1042
00:47:46,874 --> 00:47:49,290
אבל אני הולך לתת לזה קצת
שם בעל משמעות סמנטית

1043
00:47:49,290 --> 00:47:50,320
כמו "הראשון."

1044
00:47:50,320 --> 00:47:54,790
זהו מזהה ייחודי,
מזהה עבור הפיסקה הראשונה שלי.

1045
00:47:54,790 --> 00:47:59,360
>> מה אני יכול לעשות עכשיו ב- stylesheet שלי
הוא להיות קצת יותר מדויק.

1046
00:47:59,360 --> 00:48:02,330
במקום לומר, להחיל
הבאים אל תג p,

1047
00:48:02,330 --> 00:48:04,890
אני יכול לומר following--
להחיל את הבאה,

1048
00:48:04,890 --> 00:48:11,000
או בחר, אלמנט HTML
כי יש מזהה ייחודי של "הראשון."

1049
00:48:11,000 --> 00:48:12,350
מה אני רוצה להחיל על זה?

1050
00:48:12,350 --> 00:48:15,250
גודל גופן של 24 נקודות.

1051
00:48:15,250 --> 00:48:16,640
אז יש לי שני בוררים עכשיו.

1052
00:48:16,640 --> 00:48:19,690
אחת עושה את כל
סעיפי נקודות 12.

1053
00:48:19,690 --> 00:48:24,960
אבל זה אחד, בעיקר משום שהוא מגיע
שהדבר-- מדובר האחרון file--

1054
00:48:24,960 --> 00:48:27,090
יש לכך השפעה מדורגת.

1055
00:48:27,090 --> 00:48:30,200
אני פשוט עושה את כל שלי
תגי פסקה נקודות 12,

1056
00:48:30,200 --> 00:48:34,350
אבל עכשיו זה מפלים
עוקף את כל אלמנטים

1057
00:48:34,350 --> 00:48:38,800
בדף, כל תג בדף אשר
מזהה ייחודי הוא סוף ציטוט ציטוט "הראשון."

1058
00:48:38,800 --> 00:48:41,720
ואת hashtag בהקשר זה
רק אומר "מזהה ייחודי."

1059
00:48:41,720 --> 00:48:43,750
אני לא לשים את זה בקובץ HTML.

1060
00:48:43,750 --> 00:48:46,880
אני, כאן, רק אומר
ציטוט סוף ציטוט "הראשון."

1061
00:48:46,880 --> 00:48:48,470
>> אז תנו לי מחדש.

1062
00:48:48,470 --> 00:48:49,919
ועכשיו אני רואה, אה, אוקיי.

1063
00:48:49,919 --> 00:48:51,710
אני מתכוון, זה לא כל כך
יפה, אבל זה סוג

1064
00:48:51,710 --> 00:48:53,600
של כמו בהקדמה
ספר או משהו כזה,

1065
00:48:53,600 --> 00:48:55,100
שם בפסקה הראשון הוא גדול.

1066
00:48:55,100 --> 00:48:57,933
יכול להיות אפילו יותר מדויק עם
רק את האותיות הראשונות, אבל לפחות

1067
00:48:57,933 --> 00:48:59,110
אני כבר ממשתי יותר שליטה.

1068
00:48:59,110 --> 00:49:04,760
עכשיו maybe-- אולי אני רוצה לעשות את זה
מדי פעם מסיבה כלשהי,

1069
00:49:04,760 --> 00:49:09,010
ולכן אני לא רוצה את זה כדי
חלות רק תג HTML אחד.

1070
00:49:09,010 --> 00:49:15,110
במקום זאת, בואו say-- בואו
גם לבצע את הפעולות הבאות.

1071
00:49:15,110 --> 00:49:18,810
Class = "יבוא."

1072
00:49:18,810 --> 00:49:23,970
בעוד מזהה משמש באופן ייחודי
לזהות דבר אחד, תג אחד,

1073
00:49:23,970 --> 00:49:30,190
בדף האינטרנט שלך, נועדה בכיתה להיות
בשימוש על כל מספר של אלמנטים או תגים

1074
00:49:30,190 --> 00:49:30,950
בדף האינטרנט שלך.

1075
00:49:30,950 --> 00:49:31,710
אז זה לשימוש חוזר.

1076
00:49:31,710 --> 00:49:33,090
מזהה אינו לשימוש חוזר.

1077
00:49:33,090 --> 00:49:34,450
כיתה היא לשימוש חוזרת.

1078
00:49:34,450 --> 00:49:37,830
>> ואתם יודעים מה, מסיבה
reasons-- פילוסופים

1079
00:49:37,830 --> 00:49:40,180
לא סיימתי את שלי
thought-- אני הולך להגיד

1080
00:49:40,180 --> 00:49:44,300
כי הפיסקה הראשונה ואת
בפסק השנייה חשובה.

1081
00:49:44,300 --> 00:49:48,600
אז אני הולך ליישם את המעמד שנקרא
"חשוב", כי, אם אני שומר קובץ שלי

1082
00:49:48,600 --> 00:49:51,510
וטען מחדש, אין
השפעה תפקודית עדיין.

1083
00:49:51,510 --> 00:49:53,780
אבל הוספתי קצת
metadata לקובץ,

1084
00:49:53,780 --> 00:49:56,610
פרוש משהו נפרד
מנתוני הליבה של הקובץ,

1085
00:49:56,610 --> 00:50:02,300
כך שכעת בגיליון הסגנונות שלי, אם אני
במקום לומר ".important" - אתה יודע,

1086
00:50:02,300 --> 00:50:07,110
דבר זה חשוב, אני
יהפכו את צבע הגופן, red--

1087
00:50:07,110 --> 00:50:09,930
או ליתר דיוק לא font-צבע, רק צבע.

1088
00:50:09,930 --> 00:50:12,930
יש חוסר עקביות
לצערי ב- CSS.

1089
00:50:12,930 --> 00:50:14,120
וטען מחדש.

1090
00:50:14,120 --> 00:50:17,640
עכשיו שם לב הראשון
שתי פסקאות אדומות

1091
00:50:17,640 --> 00:50:20,880
אבל לא את השלישי, כי אני רק
להחיל את המעמד של "חשוב"

1092
00:50:20,880 --> 00:50:25,020
אל שני הדברים האלה הראשונים.

1093
00:50:25,020 --> 00:50:28,030
>> אז בתעודת הזהות, יש לך את היכולת
כדי לציין בדיוק רב.

1094
00:50:28,030 --> 00:50:30,110
עם שיעורים, יש לך שימוש חוזר.

1095
00:50:30,110 --> 00:50:33,800
אבל בשני המקרים, לב
מעין עיקרון-עיצוב טוב

1096
00:50:33,800 --> 00:50:39,072
איפה אני בחשבון את כל
אסתטיקה לקובץ styles.css שלי.

1097
00:50:39,072 --> 00:50:40,280
אז אין לכלוכים כאן.

1098
00:50:40,280 --> 00:50:44,490
אין אזכור של אדום או
פונה מודגש או גודל גופן בקובץ זה.

1099
00:50:44,490 --> 00:50:49,430
במקום זאת יש לי סמנטי,
משמעות לאפיין את הנתונים שלי,

1100
00:50:49,430 --> 00:50:51,240
הנה כמה נתונים חשובים.

1101
00:50:51,240 --> 00:50:52,800
הנה כמה נתונים חשובים יותר.

1102
00:50:52,800 --> 00:50:56,500
יתר על כן, הנה
"ראשון" של הנתונים החשובים שלי.

1103
00:50:56,500 --> 00:51:01,050
אז HTML הוא על כל סוג
של תיוג, פשוטו כמשמעו, מילים

1104
00:51:01,050 --> 00:51:05,270
ופסקאות ובונה ב שלך
דף עם רמזים קטנים אלה, אם אתה

1105
00:51:05,270 --> 00:51:07,640
יהיה, כי אתה יכול
איכשהו למנף באמצעות

1106
00:51:07,640 --> 00:51:10,880
טכניקות אחרות כמו CSS בדרך זו.

1107
00:51:10,880 --> 00:51:14,760
>> אז בתשובה לשאלה של ויקטוריה,
אנחנו יכולים להפוך את הטקסט גדול יותר ככה.

1108
00:51:14,760 --> 00:51:18,380
יש כל כך הרבה דרכים אחרות, אבל
הגופן tag-- סוגר פתוח "גופן" -

1109
00:51:18,380 --> 00:51:19,770
הוא בעצם ישן כמה שנים.

1110
00:51:19,770 --> 00:51:21,410
וזו בעיה,
גם עם להסתמך רק

1111
00:51:21,410 --> 00:51:23,485
על resources-- באינטרנט
הם נוטים להיות מיושנים.

1112
00:51:23,485 --> 00:51:26,110
ואכן, שהוצא משימוש,
משום שהעולם הבין,

1113
00:51:26,110 --> 00:51:28,970
מה המשמעות של "font-size = 7" אומר?

1114
00:51:28,970 --> 00:51:29,670
זה לא.

1115
00:51:29,670 --> 00:51:32,770
וכך במשך שנים רבות וכדי
זה day-- אחד של הצד

1116
00:51:32,770 --> 00:51:36,060
מציין כאן הוא שזה בעצם
מאוד כואב עדיין לפעמים

1117
00:51:36,060 --> 00:51:38,900
לפתח אתרים עבור
אינטרנט, כי מיקרוסופט

1118
00:51:38,900 --> 00:51:44,220
ו- Google ו- Mozilla ו
אחרים לעתים קרובות אינם מסכימים באשר לאופן

1119
00:51:44,220 --> 00:51:47,480
לפרש מפרט כמו HTML.

1120
00:51:47,480 --> 00:51:52,490
>> יש ספר חוקים עבור ה- HTML
בדרך כלל אומר מה כל תג אומר.

1121
00:51:52,490 --> 00:51:55,690
אבל לפעמים זה מה שנשאר אל
שיקול דעתו של היישום,

1122
00:51:55,690 --> 00:51:57,290
השיקול ו- Google של מיקרוסופט.

1123
00:51:57,290 --> 00:52:00,000
וכך תמצאו לעתים קרובות מאוד
ראו על משהו באתר

1124
00:52:00,000 --> 00:52:04,954
נראה אחר במחשב
מאשר במקינטוש,

1125
00:52:04,954 --> 00:52:06,995
וזה באמת בגלל,
בסופו של היום,

1126
00:52:06,995 --> 00:52:08,891
הם לא לבדוק את זה
גם על שתי הפלטפורמות.

1127
00:52:08,891 --> 00:52:11,390
אבל זה גם בגלל סביר,
אנשים חכמים לא יסכימו

1128
00:52:11,390 --> 00:52:14,970
וחברות לא יסכימו, וכן הלאה
אחד האתגרים של תכנות

1129
00:52:14,970 --> 00:52:16,980
עבור האינטרנט או בעיצוב
דברים עבור האינטרנט

1130
00:52:16,980 --> 00:52:21,700
כותב באתר שלך בצורה
שעובד על כל דפדפן אינטרנט.

1131
00:52:21,700 --> 00:52:23,410
אבל אפילו זה לא הגיוני, נכון?

1132
00:52:23,410 --> 00:52:27,807
יש כל כך הרבה גרסאות של כל כך הרבה
דפדפנים בחוץ כי, בשלב כלשהו,

1133
00:52:27,807 --> 00:52:30,890
יש לך גם לבצע שיחת שיפוט
ואתה צריך להחליט כחברה,

1134
00:52:30,890 --> 00:52:33,082
במיוחד עבור מסחר אלקטרוני בסגנון
אתרים שבהם אתה

1135
00:52:33,082 --> 00:52:36,290
מנסה להשתמש חדיש וטוב ביותר
טכנולוגיות לתת משתמש ממש טוב

1136
00:52:36,290 --> 00:52:37,110
ניסיון.

1137
00:52:37,110 --> 00:52:41,019
אבל כמה אחוז המשתמשים שלך אולי
עדיין להיות משתמש ב- Internet Explorer 6 או 7

1138
00:52:41,019 --> 00:52:43,810
או 8, במיוחד תלוי
מדינה שהם מגיעים.

1139
00:52:43,810 --> 00:52:46,760
>> וכך מאוד נפוץ
התייעץ משהו

1140
00:52:46,760 --> 00:52:50,920
כמו "סטטיסטיקת דפדפן האינטרנט."

1141
00:52:50,920 --> 00:52:56,560
ואם נלך עם-- בוא נראה ויקיפדיה
ולראות איך עַדכָּנִי תרשים זה

1142
00:52:56,560 --> 00:52:59,320
אם יש אחד.

1143
00:52:59,320 --> 00:53:02,420
אז הנה אתה יכול לראות
שם דפדפנים למעשה

1144
00:53:02,420 --> 00:53:06,160
הם, על פי עד דצמבר 2015,
על פי ממשלת ארה"ב.

1145
00:53:06,160 --> 00:53:11,170
Chrome הוא עם נתח שוק של 42%, ואחריו
על ידי IE בעיקר בהגדרות חברות

1146
00:53:11,170 --> 00:53:14,490
או הגדרות במחשב, כמובן,
ואחריו Firefox,

1147
00:53:14,490 --> 00:53:17,440
אז Safari ולאחר מכן האופרה לא
להפוך את המפה כאן מסיבה כלשהי,

1148
00:53:17,440 --> 00:53:18,210
ואז אחרים.

1149
00:53:18,210 --> 00:53:19,500
אולי זה תחת אחרים.

1150
00:53:19,500 --> 00:53:27,700
אבל יותר בעייתי מזה הוא--
בוא נראה אם ​​ויקיפדיה יש גם

1151
00:53:27,700 --> 00:53:35,194
הגירסאות של הדפדפנים version--

1152
00:53:35,194 --> 00:53:36,160

1153
00:53:36,160 --> 00:53:39,190
>> בואו נלך סטטיסטיקת דפדפן.

1154
00:53:39,190 --> 00:53:40,680
כְּלוֹמַר.

1155
00:53:40,680 --> 00:53:42,030
גם זה לא מספיק.

1156
00:53:42,030 --> 00:53:44,854
סטטיסטיקה דפדפנים.

1157
00:53:44,854 --> 00:53:45,353
הגירסה שלי.

1158
00:53:45,353 --> 00:53:48,980

1159
00:53:48,980 --> 00:53:50,540
זה לא הולך להיות צודק.

1160
00:53:50,540 --> 00:53:53,414
בואו לראות גרסאות.

1161
00:53:53,414 --> 00:53:54,830
נתח השוק של הדפדפן.

1162
00:53:54,830 --> 00:53:57,110
בוא נראה אם ​​זה עולה.

1163
00:53:57,110 --> 00:53:57,610
בסדר.

1164
00:53:57,610 --> 00:54:00,010
עכשיו זה הוא מקבל
קצת יותר שימושי.

1165
00:54:00,010 --> 00:54:04,870
אז הנה, שם לב כי יש לנו את כל
גרסאות של דפדפנים שונים.

1166
00:54:04,870 --> 00:54:09,887
וגם, אלוהים, אם אתה תראה-- Chrome
48, 47 Chrome, 31 Chrome, Chrome 45.

1167
00:54:09,887 --> 00:54:12,970
אני מתכוון, דפדפנים מעודכנים יותר ויותר,
ולפעמים כמה מאותם שינויים

1168
00:54:12,970 --> 00:54:16,430
הם משמעותיים
מבחינה פונקציונלית.

1169
00:54:16,430 --> 00:54:20,630
וכך בשלב מסוים, את
מנהלי מוצר או מהנדסים

1170
00:54:20,630 --> 00:54:23,620
צריך לעשות decision-- לך
יודע מה, רק 1% של העולם

1171
00:54:23,620 --> 00:54:24,740
עדיין משתמש ב- IE 7.

1172
00:54:24,740 --> 00:54:25,490
לעזאזל איתם.

1173
00:54:25,490 --> 00:54:27,470
אנחנו פשוט לא הולכים
תומך בדפדפן זה.

1174
00:54:27,470 --> 00:54:28,740
ומה זה אומר שלא לתמוך?

1175
00:54:28,740 --> 00:54:31,170
אולי זה אומר כפתורים
לא עובד על דף האינטרנט שלך,

1176
00:54:31,170 --> 00:54:33,050
או שהוא עשוי מתכוון
עיצוב הוא לגמרי.

1177
00:54:33,050 --> 00:54:35,091
או שאולי יש לך לעשות
באותה שיחה שיפוט

1178
00:54:35,091 --> 00:54:39,089
בימים אלה ניידים, שם, אנחנו
לא הולך לתמוך IOS 5 יותר.

1179
00:54:39,089 --> 00:54:40,380
אז אנשים פשוט צריכים לשדרג.

1180
00:54:40,380 --> 00:54:45,850
או שאנחנו לא הולכים לתמוך Cupcake
על מערכת ההפעלה אנדרואיד עבור מכשירי אנדרואיד,

1181
00:54:45,850 --> 00:54:48,629
כי כמו בעולם-- כמו
עולם טק רוצה להתקדם,

1182
00:54:48,629 --> 00:54:51,170
זה סוג של רוצה לגרור את
בעולם עם זה, כך שהם לא

1183
00:54:51,170 --> 00:54:53,295
צריך להמשיך להיות
תואם לאחור כדי שהם

1184
00:54:53,295 --> 00:54:54,920
יכול להציע תכונות חדשות טובות.

1185
00:54:54,920 --> 00:54:57,878
זוהי אכן אחת הסיבות
למה כל כך הרבה חברות מושקות

1186
00:54:57,878 --> 00:55:01,440
עדכונים אוטומטיים ולמיין לאלץ
הגרסאות של התוכנה העדכנית ביותר עלינו.

1187
00:55:01,440 --> 00:55:04,010
ואפילו חברות
כמו אפל ימיין של

1188
00:55:04,010 --> 00:55:07,280
להכריח אותך כמעט או להכריח
אתה במונחים של כוחות השוק

1189
00:55:07,280 --> 00:55:11,164
לקנות טלפון חדש כי הם פשוט
לא עדכן הטלפון הישן שלך יותר.

1190
00:55:11,164 --> 00:55:13,330
אז אתה להחמיץ את
חדשני ותכונות גדולות,

1191
00:55:13,330 --> 00:55:17,520
כי זה יקר להם בתור
החברה לשמור על מבוגרים, שיש הטוענים

1192
00:55:17,520 --> 00:55:19,330
גרסאות של תוכנה נחותה.

1193
00:55:19,330 --> 00:55:23,660
אבל והתוצאה הסופית היא כי
אנחנו גם בכך נוכינו.

1194
00:55:23,660 --> 00:55:26,550
>> אז בואו נסתכל רק
כמה דברים סופיים כאן.

1195
00:55:26,550 --> 00:55:29,740
בואו לדפוק ממש מהר חלק
אלה כדורים אחרים, אם סקרן.

1196
00:55:29,740 --> 00:55:33,440
אז אם היית מנסה,
למשל, עמדה

1197
00:55:33,440 --> 00:55:36,420
הטקסט על צדדים שונים של
דף, אני הולך לעשות דרך אחת מהירה,

1198
00:55:36,420 --> 00:55:38,360
אבל יש שונה
דרכים לעשות זאת.

1199
00:55:38,360 --> 00:55:42,610
תן לי ללכת קדימה eliminate--
לפשט את זה כדלקמן.

1200
00:55:42,610 --> 00:55:45,330
תן לי רק לחזור שלי
פשוט, פסקאות פשוטות.

1201
00:55:45,330 --> 00:55:47,760
תן לי לחזור styles.css שלי.

1202
00:55:47,760 --> 00:55:51,040
ואני בדיוק הולך להשתמש פשוט--
שבו אתה יכול לראות ב- Google

1203
00:55:51,040 --> 00:55:54,430
או זוכר מן earlier--
טקסט ליישור מימין.

1204
00:55:54,430 --> 00:55:56,220
וטען מחדש דף זה.

1205
00:55:56,220 --> 00:55:58,470
עכשיו הכל נראה
להיות מיושר לימין,

1206
00:55:58,470 --> 00:56:00,770
כפי שאתה עשוי לראות על תקורה כאן.

1207
00:56:00,770 --> 00:56:04,470
>> אנחנו יכולים לגרום לזה להיראות קצת יותר
להזמין דמוי, ואנחנו יכולים לומר "להצדיק"

1208
00:56:04,470 --> 00:56:05,640
וטען מחדש.

1209
00:56:05,640 --> 00:56:09,870
עכשיו זה נחמד ומרובע משני
צדדים, וזה די נחמד.

1210
00:56:09,870 --> 00:56:12,220
יעד נוסף שהיה לנו כאן
צבע טקסט שינוי היה.

1211
00:56:12,220 --> 00:56:13,650
אז ראינו כי עם הטקסט האדום שלי.

1212
00:56:13,650 --> 00:56:15,630
ועכשיו להוסיף לחצנים עבור צורה.

1213
00:56:15,630 --> 00:56:19,390
אז למה שלא ננסה לעשות בדיוק את זה?

1214
00:56:19,390 --> 00:56:23,656
אבל קודם תן לי ללכת לאתר כי
רובנו משתמשים מדי day-- Google.

1215
00:56:23,656 --> 00:56:25,780
ובואו נסתכל
איך גוגל באמת עובדת.

1216
00:56:25,780 --> 00:56:26,821
אבל אני הולך לעשות את זה.

1217
00:56:26,821 --> 00:56:31,930
ראשית הרשו לי לעשות את זה ב-- כן,
תן לי ללכת לגוגל הראשונה.

1218
00:56:31,930 --> 00:56:34,530
אני הולך צריך ללכת
לגוגל הגדרות,

1219
00:56:34,530 --> 00:56:40,660
כי אני רוצה להשבית
משהו שנקרא תוצאות מיידיות.

1220
00:56:40,660 --> 00:56:43,580
>> אז אתה יכול להבחין בו
Google אלה days-- תנו לי לחזור

1221
00:56:43,580 --> 00:56:44,850
ולהדליק זה.

1222
00:56:44,850 --> 00:56:47,900
אז אם אני מתחיל לחפש
עבור "חתולים" כמו זה,

1223
00:56:47,900 --> 00:56:50,120
להבחין כי לא רק לעשות
אני מקבל השלמה אוטומטית עד

1224
00:56:50,120 --> 00:56:54,520
העליון, פתאום, הדף עצמו
נראה שינוי די מהר גם כן,

1225
00:56:54,520 --> 00:56:58,750
וזה Google באמצעות שפה
קרא JavaScript מנסה להועיל.

1226
00:56:58,750 --> 00:57:01,540
אבל למרבה הצער, זה סוג
של יקלקל את דיוננו

1227
00:57:01,540 --> 00:57:04,010
של מה בעצם קורה
מתחת למכסה המנוע כאן.

1228
00:57:04,010 --> 00:57:09,070
אז אני פשוט סוג של מהר
לכבות תוצאות מיידיות.

1229
00:57:09,070 --> 00:57:11,510
ואני הולך ללחוץ על שמור.

1230
00:57:11,510 --> 00:57:13,930
ועכשיו אני הולך לפתוח
כי כלים לאבחון שאני

1231
00:57:13,930 --> 00:57:16,150
לשמור פתיחה תחת כרטיסיית הרשת.

1232
00:57:16,150 --> 00:57:17,720
אז בוא נעשה את זה.

1233
00:57:17,720 --> 00:57:21,960
בואו לי-- whoops--
לגלול למטה זה קצת.

1234
00:57:21,960 --> 00:57:24,410
ותן לי לחפש "חתולים".

1235
00:57:24,410 --> 00:57:26,790
>> ועכשיו notice-- למעשה,
זוהי הזדמנות טובה

1236
00:57:26,790 --> 00:57:28,840
לדון לרגע.

1237
00:57:28,840 --> 00:57:32,460
שימו לב שברגע שאני type-- לעצור את זה.

1238
00:57:32,460 --> 00:57:35,250
תפסיק.

1239
00:57:35,250 --> 00:57:35,790
בסדר.

1240
00:57:35,790 --> 00:57:40,870
שימו לב שברגע שאני להקליד את האות
C, לצפות את החלק התחתון של המסך.

1241
00:57:40,870 --> 00:57:48,600
A- טי ס מה עושה התחתון
של מסך זה, כרטיסיית הרשת שלי,

1242
00:57:48,600 --> 00:57:53,320
מציע קורה כל
פעם שאני להקליד אות?

1243
00:57:53,320 --> 00:57:57,700
למרבה הצער, את הצפרדע מאוד
היום להסיח או תלתן

1244
00:57:57,700 --> 00:58:00,339
או מי שזה לא יהיה.

1245
00:58:00,339 --> 00:58:01,880
מה קורה בכל פעם הקלדתי?

1246
00:58:01,880 --> 00:58:04,230
ותנו לי לנקות את
חיץ להקליד אותה שוב.

1247
00:58:04,230 --> 00:58:06,580
אופס ולכן--.

1248
00:58:06,580 --> 00:58:13,280
בכל פעם שאני להקליד אות, C- A- T--
כך שורה חדשה ללא ספק שומרת להופיע.

1249
00:58:13,280 --> 00:58:16,530
מה כל אחת משורות אלה מייצגים,
על סמך מה שראינו ודנו

1250
00:58:16,530 --> 00:58:17,339
עַד כֹּה?

1251
00:58:17,339 --> 00:58:18,130
קהל: חיפוש?

1252
00:58:18,130 --> 00:58:21,770
דוד י מלאן: חיפוש, או
באופן כללי יותר, בקשת HTTP

1253
00:58:21,770 --> 00:58:23,125
מהדפדפן שלי לשרת.

1254
00:58:23,125 --> 00:58:29,090
ובכן, למה הוא הדפדפן שלי ביצוע HTTP
לבקש בכל פעם שאני להקליד אות?

1255
00:58:29,090 --> 00:58:30,502
>> קהל: [לא ברור]

1256
00:58:30,502 --> 00:58:33,210
דוד י מלאן: כן, זה נותן
לי תוצאות השלמה אוטומטית אלה.

1257
00:58:33,210 --> 00:58:35,190
כאילו, איפה אלה
תוצאות החיפוש מגיעות?

1258
00:58:35,190 --> 00:58:38,120
ובכן, בכל פעם שאני מקליד
מכתב, Google שולח יותר

1259
00:58:38,120 --> 00:58:40,460
ועוד ועוד
המילה שאני מקליד.

1260
00:58:40,460 --> 00:58:41,040
למה?

1261
00:58:41,040 --> 00:58:44,540
כי הם רוצים לתת לי
יותר ויותר טוב, הצעה טובה יותר,

1262
00:58:44,540 --> 00:58:48,880
רשימה של הצעות עבור מה מילה
אני מנסה באמת שלם.

1263
00:58:48,880 --> 00:58:53,030
אז זהו לומר פשוטו כמשמעו, כל
תו שתקליד אל Google

1264
00:58:53,030 --> 00:58:56,900
נשלח, בסופו של דבר
בתפזורת, אבל גם לפעמים אחד

1265
00:58:56,900 --> 00:59:00,620
בכל פעם על מנת ליישם
תכונות ההשלמה האוטומטית אלה כאשר

1266
00:59:00,620 --> 00:59:03,000
הנתונים, כמובן, באינטרנט.

1267
00:59:03,000 --> 00:59:08,780
>> עכשיו, בואו נסתכל מה בעצם
יקרה אם אלחץ על Google חיפוש.

1268
00:59:08,780 --> 00:59:10,420
ואז נצטרך למנף זאת לעצמנו.

1269
00:59:10,420 --> 00:59:15,320
אז אם אני לגלול למטה עכשיו אל מאוד
הבקשה הראשונה זה פשוט קרה.

1270
00:59:15,320 --> 00:59:17,130
שים לב הבא.

1271
00:59:17,130 --> 00:59:25,550
הוא נשלח ארוך למדי URL--
https://www.google.com/search?

1272
00:59:25,550 --> 00:59:27,100
ואז כל מיני דברים כולו.

1273
00:59:27,100 --> 00:59:29,620
בואו לראות את זה ממש עכשיו
בלשונית הדפדפן עצמו.

1274
00:59:29,620 --> 00:59:31,310
בואו להיפטר הכלים כאן.

1275
00:59:31,310 --> 00:59:33,140
הנה הדף של תוצאות החיפוש.

1276
00:59:33,140 --> 00:59:34,790
והודעה הנה את כתובת האתר.

1277
00:59:34,790 --> 00:59:37,430
עכשיו, אתה יכול כנראה לנחש
מה קורה כאן בחלקה.

1278
00:59:37,430 --> 00:59:39,090
אז קודם כל, הגדרה.

1279
00:59:39,090 --> 00:59:42,570
זה כנראה הוא היעד
שם שהטופס נשלח.

1280
00:59:42,570 --> 00:59:44,910
לכן, כאשר הקלדתי את
המילים "חתולים" והקש Enter,

1281
00:59:44,910 --> 00:59:48,460
כנראה ש- Google שלחה
קלט הטקסט שלי אל כתובת האתר הזו

1282
00:59:48,460 --> 00:59:50,770
כי הדגשתי
שם, לוכסן החיפוש.

1283
00:59:50,770 --> 00:59:56,530
מסתבר, ב- URL, כל דבר
קורה אחרי סימן שאלה הוא,

1284
00:59:56,530 --> 01:00:01,270
כפי שאנו חוזרים ואומרים, זוג מפתחות-ערך
שהוקלד לתוך טופס או איכשהו

1285
01:00:01,270 --> 01:00:04,500
המועבר מן
דפדפן לשרת.

1286
01:00:04,500 --> 01:00:07,180
>> אז כל פעם שאתה מקליד קלט
לצורה באינטרנט

1287
01:00:07,180 --> 01:00:10,000
וזה נשלח כפי שכבר
דן, באמצעות גט,

1288
01:00:10,000 --> 01:00:12,400
אחד מאלה וירטואליים
מעטפות, את התוכן

1289
01:00:12,400 --> 01:00:15,510
זה envelope-- כן, לשמור
מקבל ממולאים פיסיים

1290
01:00:15,510 --> 01:00:19,010
למעטפה בכיתה
היום, אבל מבחינה טכנולוגית

1291
01:00:19,010 --> 01:00:21,110
זה בעצם להכניס את כתובת האתר.

1292
01:00:21,110 --> 01:00:22,940
אז למעשה, תן לי לנפות זה.

1293
01:00:22,940 --> 01:00:25,010
איפה אתה רואה את קלט משתמש?

1294
01:00:25,010 --> 01:00:27,490
איפה אתה רואה משהו
שאני עצמי הדפסתי כאן?

1295
01:00:27,490 --> 01:00:32,100

1296
01:00:32,100 --> 01:00:33,491
כן, אז "חתולים".

1297
01:00:33,491 --> 01:00:33,990
ימין?

1298
01:00:33,990 --> 01:00:36,380
אז תנו לי לזקק זה
למשהו פשוט יותר.

1299
01:00:36,380 --> 01:00:39,917
אני הולך למחוק כל מה שקשור
כתובת האתר הזה כי אני לא מבין,

1300
01:00:39,917 --> 01:00:42,250
ואני רק הולך לעזוב
זה כמו זה- / לחפש? q = חתולים.

1301
01:00:42,250 --> 01:00:45,640

1302
01:00:45,640 --> 01:00:47,890
נצטרך לראות כאשר q
מגיע רגע,

1303
01:00:47,890 --> 01:00:51,220
אבל זה מרגיש כמו מינימום
כמות המידע שסיפקתי.

1304
01:00:51,220 --> 01:00:53,050
ועכשיו אני הולך על Enter.

1305
01:00:53,050 --> 01:00:55,520
ושימו לב זה עדיין עובד.

1306
01:00:55,520 --> 01:00:57,950
אנחנו עדיין מקבלים בחזרה חבורה של חתולים כולו.

1307
01:00:57,950 --> 01:01:00,340
אז גוגל הוא להשתכלל
מזה בימים אלה.

1308
01:01:00,340 --> 01:01:01,934
זה 2016, לא 1999.

1309
01:01:01,934 --> 01:01:04,600
אז יש דברים אחרים, כי שלי
הדפדפן שולח לשרת.

1310
01:01:04,600 --> 01:01:07,100
אבל זו היא מינימלית
כל מה שנחוץ.

1311
01:01:07,100 --> 01:01:08,380
>> אז מה קורה?

1312
01:01:08,380 --> 01:01:14,320
ובכן, קודם תן לי להמשיך וללכת
חזרה Cloud9 ותן לי ללכת קדימה

1313
01:01:14,320 --> 01:01:15,620
ולסגור הכרטיסיות שלי קודם לכן.

1314
01:01:15,620 --> 01:01:18,230
ואני אעשה את זה על שלי
הבעלים רק לרגע.

1315
01:01:18,230 --> 01:01:20,730
אני הולך קדימה
וליצור קובץ חדש.

1316
01:01:20,730 --> 01:01:23,739
ואני הולך לשמור אותו כ google.html.

1317
01:01:23,739 --> 01:01:26,280
ואני הולך מאוד quickly--
אני הולך לגנוב, למעשה,

1318
01:01:26,280 --> 01:01:28,510
שטקסטים זה רק כדי לחסוך זמן.

1319
01:01:28,510 --> 01:01:30,610
אני הולך להדביק את זה לכאן.

1320
01:01:30,610 --> 01:01:33,850
אני לא הולך לטרוח
כל סגנון הפעם.

1321
01:01:33,850 --> 01:01:38,340
אנחנו הולכים לקרוא לזה "Google שלי."

1322
01:01:38,340 --> 01:01:41,230
ואני הולך להיפטר
של כל הגוף.

1323
01:01:41,230 --> 01:01:42,740
ואני הולך לעשות את הדברים הבאים.

1324
01:01:42,740 --> 01:01:45,690
הרשו לי להתקרב.

1325
01:01:45,690 --> 01:01:50,620
טופס action-- ובעודי בקצרה שהוזכרו
earlier-- whoops-- כפי שאני בקצרה

1326
01:01:50,620 --> 01:01:54,130
שהוזכר קודם לכן, הפעולה של
טופס שבו אתה שולח את הנתונים.

1327
01:01:54,130 --> 01:01:56,620
אז google.com/search.

1328
01:01:56,620 --> 01:01:59,390
והשיטה אני רוצה להשתמש
יכול להיות אחד משני דברים.

1329
01:01:59,390 --> 01:02:02,870
זה יכול להיות או "לקבל", כפי שאנו לשמור
דן, או שזה יכול להיות "פוסט".

1330
01:02:02,870 --> 01:02:05,340
לעת עתה, את היסוד
ההבדל הוא, אם אתה משתמש "לקבל"

1331
01:02:05,340 --> 01:02:09,590
כל המידע כי
משתמש מספק נשלח ב- URL.

1332
01:02:09,590 --> 01:02:13,530
>> זה נהדר עבור דברים כמו חיפוש
מנועים וכמה יישומים אחרים,

1333
01:02:13,530 --> 01:02:17,080
אבל באילו נסיבות היו
אתה לא רוצה למלא טופס

1334
01:02:17,080 --> 01:02:21,620
ויש לי את המידע בסופו של דבר את
כתובת האתר, כמו בשורת הכתובת של הדפדפן?

1335
01:02:21,620 --> 01:02:25,470

1336
01:02:25,470 --> 01:02:26,605
איזה סוג של צורות לעשות שאתם--

1337
01:02:26,605 --> 01:02:27,480
קהל: [לא ברור]

1338
01:02:27,480 --> 01:02:28,450
דוד י מלאן: כן, כמו מה?

1339
01:02:28,450 --> 01:02:29,270
הקהל: סיסמאות.

1340
01:02:29,270 --> 01:02:31,936
דוד י מלאן: כן, אז אתה נכנסת
לפייסבוק או אתר כלשהו.

1341
01:02:31,936 --> 01:02:34,395
זה קלט מהמשתמש
צורה, תיבת טקסט,

1342
01:02:34,395 --> 01:02:37,020
אבל אתה בטח לא רוצה שזה
להופיע ב- URL של הדפדפן.

1343
01:02:37,020 --> 01:02:38,121
למה?

1344
01:02:38,121 --> 01:02:40,870
זאת אומרת, אולי יש כמה
השלכות ביטחוניות ברשת,

1345
01:02:40,870 --> 01:02:44,830
אבל יותר-- אוהב, יותר פשוט, מה אם
השותפה שלך, אחרים משמעותיים שלך,

1346
01:02:44,830 --> 01:02:47,710
הילדים שלך, בן הזוג שלך נראה
לאורך ההיסטוריה בדפדפן שלך?

1347
01:02:47,710 --> 01:02:50,762
יש נכון הסיסמה שלך
יש בהיסטוריה של הדפדפן.

1348
01:02:50,762 --> 01:02:52,220
זה לא מרגיש כמו עיצוב טוב.

1349
01:02:52,220 --> 01:02:54,500
או אפילו יותר מבחינה טכנית,
נניח שאתה מנסה

1350
01:02:54,500 --> 01:02:59,180
כדי להעלות תמונה Flickr
או פייסבוק או wherever--

1351
01:02:59,180 --> 01:03:03,010
כי הוא קלט משתמש, למרות
זה קצת יותר interesting-- איך

1352
01:03:03,010 --> 01:03:05,530
אני לדחוס תמונה בשורת כתובת האתר?

1353
01:03:05,530 --> 01:03:06,730
אתה סוג של מעין לא יכול.

1354
01:03:06,730 --> 01:03:07,396
אתה סוג של יכול.

1355
01:03:07,396 --> 01:03:10,210
אבל, באמת, אני מתקשה
כדי לדמיין את עצמי עושה את זה.

1356
01:03:10,210 --> 01:03:13,470
אז אני צריך שיטה אחרת
העלאת תמונות לאתר אינטרנט,

1357
01:03:13,470 --> 01:03:15,657
וכי שיטה אחרת נקראת "פוסט".

1358
01:03:15,657 --> 01:03:18,740
אבל לעת עתה, אנחנו רק נדבר על
"לקבל", המהווה את פשוט של השניים.

1359
01:03:18,740 --> 01:03:21,100
זה פשוט מעביר את כל
משתמש קלט לתוך URL.

1360
01:03:21,100 --> 01:03:22,830
>> אז הנה הטופס אני יוצר.

1361
01:03:22,830 --> 01:03:24,070
אני רוצה קלט.

1362
01:03:24,070 --> 01:03:24,820
ואתם יודעים מה?

1363
01:03:24,820 --> 01:03:26,111
אני הולך לקחת מניח כאן.

1364
01:03:26,111 --> 01:03:31,600
אני הולך להיזכר שלי
קלט "q" עבור "שאילתה."

1365
01:03:31,600 --> 01:03:34,970
ואני חושב שזה אחד
עיצובים מקוריים, אולי, מ -1999.

1366
01:03:34,970 --> 01:03:39,560
ואז את סוג קלט זה
רק הולך להיות "טקסט".

1367
01:03:39,560 --> 01:03:43,040
ואז אני הולך יש קלט אחר
כי לא צריך שם, כפי שנראה בקרוב

1368
01:03:43,040 --> 01:03:45,120
לראות, את הסוג שהוא "שלח".

1369
01:03:45,120 --> 01:03:47,070
וזה הולך
תן לי כפתור מיוחד.

1370
01:03:47,070 --> 01:03:48,320
וזה הכל.

1371
01:03:48,320 --> 01:03:50,790
>> אז תנו לי להמשיך לשמור קובץ זה.

1372
01:03:50,790 --> 01:03:54,910
אני הולך לחזור שלי
הדפדפן ועבור אל google.html.

1373
01:03:54,910 --> 01:03:56,140
להיכנס.

1374
01:03:56,140 --> 01:03:59,680
וזה סוג של דלילה
בלשון המעטה.

1375
01:03:59,680 --> 01:04:03,110
אבל תן לי ללכת קדימה
ולחפש "חתולים".

1376
01:04:03,110 --> 01:04:06,510
ושימו לב אני כרגע
בכתובת Cloud9 זה.

1377
01:04:06,510 --> 01:04:09,240
אבל ברגע שאני אלחץ זה,
איפה אתה מקווה שאוכל בסופו של דבר?

1378
01:04:09,240 --> 01:04:10,160
>> קהל: Google.

1379
01:04:10,160 --> 01:04:11,118
>> דוד י מלאן: Google.

1380
01:04:11,118 --> 01:04:12,740
אז בואו לוחץ על שלח.

1381
01:04:12,740 --> 01:04:15,200
ואכן ביצעתי מחדש מיושם Google.

1382
01:04:15,200 --> 01:04:15,700
ימין?

1383
01:04:15,700 --> 01:04:16,480
זה יותר פשוט.

1384
01:04:16,480 --> 01:04:17,120
זה קל יותר.

1385
01:04:17,120 --> 01:04:20,350
אני מתכוון, הקוד שלי הוא ברור יותר מאשר
שלהם, מן הבלגן שראינו קודם.

1386
01:04:20,350 --> 01:04:21,100
ואתם יודעים מה?

1387
01:04:21,100 --> 01:04:22,610
אני הולך כדי לתבל את זה קצת.

1388
01:04:22,610 --> 01:04:23,860
לא הזכרתי את זה קודם.

1389
01:04:23,860 --> 01:04:27,860
ישנם תגים כמו H1, עבור כותרת 1,
הכותרת החשובה ביותר בדף.

1390
01:04:27,860 --> 01:04:30,570
"Google שלי," אני אתקשר זה.

1391
01:04:30,570 --> 01:04:31,940
הרשו לי לטעון מחדש.

1392
01:04:31,940 --> 01:04:33,772
זה נראה קצת יותר טוב כבר.

1393
01:04:33,772 --> 01:04:34,980
וזה, בעצם, אתה יודע מה?

1394
01:04:34,980 --> 01:04:36,430
לי already-- שיקרתי.

1395
01:04:36,430 --> 01:04:40,200
אמרתי שאני לא הולך הסגנון הזה,
אבל אני הולך הסגנון הזה כמו לפני.

1396
01:04:40,200 --> 01:04:46,860
והגוף שלי הולך להיות,
נניח, מרכז יישור טקסט.

1397
01:04:46,860 --> 01:04:48,800
זה נראה יותר כמו גוגל כבר.

1398
01:04:48,800 --> 01:04:51,090
>> אני צריך הפסקת קו, אם כי,
בשביל זה כפתור שלח.

1399
01:04:51,090 --> 01:04:52,798
ומתברר, אתה
יכול להשתמש פסקאות,

1400
01:04:52,798 --> 01:04:57,320
או שאתה יכול יותר, פשוטו כמשמעו, רק לומר,
לתת לי קו הפסקת כאן-- תג br.

1401
01:04:57,320 --> 01:04:59,319
ואם אני רענן, עכשיו זה הולך שם.

1402
01:04:59,319 --> 01:05:01,610
זה קצת מכוער, אז אני
יכול לעשות מעברי שורה מרובים,

1403
01:05:01,610 --> 01:05:03,310
אבל בואו לא מקבל חמדן מדי כאן.

1404
01:05:03,310 --> 01:05:06,430
אז עכשיו בוא נראה אם ​​זה עובד "כלבים".

1405
01:05:06,430 --> 01:05:08,640
נראה שזה עובד עבור "כלבים", גם כן.

1406
01:05:08,640 --> 01:05:10,780
אז מה takeaway משכנעת כאן?

1407
01:05:10,780 --> 01:05:13,600
One-- לא היתה קפיצה ענקית
להציג כמה תגים יותר,

1408
01:05:13,600 --> 01:05:15,370
כמו תג הטופס בתג הקלט.

1409
01:05:15,370 --> 01:05:17,120
אבל יותר מן היסוד
הוא, כל מה שאנחנו עושים

1410
01:05:17,120 --> 01:05:20,610
ממנף את הבנתנו
של HTTP והעובדה

1411
01:05:20,610 --> 01:05:24,900
שצורות בסופו של דבר לשנות
מה יש את ה- URL של הדפדפן,

1412
01:05:24,900 --> 01:05:28,540
וכך, אם כן, אנחנו יכולים
לספק קלט מכאני לשרת

1413
01:05:28,540 --> 01:05:33,600
על ידי ביצוע טופס HTML ולדעת
שהשרת מבין HTTP,

1414
01:05:33,600 --> 01:05:36,890
בדיוק כמו הגוף שלנו מבין, כמו,
לוחץ לי את היד, פרוטוקול אותה,

1415
01:05:36,890 --> 01:05:40,920
וכך אנחנו מקבלים בחזרה את התגובה
כי אנחנו בסופו של דבר לצפות.

1416
01:05:40,920 --> 01:05:44,050
>> אז בואו ננסה לעשות אחת
הדבר האחרון עכשיו עם הנייד,

1417
01:05:44,050 --> 01:05:47,052
ואני make-- אוסיף
הקוד הזה על השקופיות.

1418
01:05:47,052 --> 01:05:49,760
אז אם אתה רוצה להתעסק, אתה
בהחלט יכול לקחת אותו משם.

1419
01:05:49,760 --> 01:05:51,551
אבל אני הולך ללכת
מוזמנים לעשות דבר אחד.

1420
01:05:51,551 --> 01:05:54,120
אני הולך קדימה,
להיפתח page-- המורה שלי

1421
01:05:54,120 --> 01:05:59,030
דף השלום שלי כמו קודם, אשר
יש הרבה טקסט faux-לטיני זו,

1422
01:05:59,030 --> 01:06:05,470
או טקסט לטיני משמעות, has--
זה נראה כך בגודל הגופן הזה.

1423
01:06:05,470 --> 01:06:07,850
אבל תן לי ללכת ולעשות את זה.

1424
01:06:07,850 --> 01:06:09,300
אני הולך להיכנס Cloud9.

1425
01:06:09,300 --> 01:06:10,380
ואתה לא צריך לעשות את הצעד הזה.

1426
01:06:10,380 --> 01:06:11,420
אני פשוט אעשה את זה בעצמי.

1427
01:06:11,420 --> 01:06:12,890
אני הולך לחץ על שתף.

1428
01:06:12,890 --> 01:06:15,170
וזו תכונה
רק של Cloud9, לפיה

1429
01:06:15,170 --> 01:06:17,710
אני יכול להפוך את הסביבה שלי ציבורית.

1430
01:06:17,710 --> 01:06:20,240
>> ובדיוק למען
הפגנה, הרשו לי לעשות זאת.

1431
01:06:20,240 --> 01:06:22,870
אני הולך לפרסם את הבקשה שלי.

1432
01:06:22,870 --> 01:06:25,230
שימי לב שזו מזהירה אותי, אני
אני בטוח שאני רוצה לעשות את זה,

1433
01:06:25,230 --> 01:06:28,438
בגלל זה הוא הולך לעשות את כולם
בעולם, בין אם הם נמצאים כאן עכשיו

1434
01:06:28,438 --> 01:06:33,560
או צפייה בסרטון מאוחר יותר על
האינטרנט מסוגל לראות את מה שאני רואה.

1435
01:06:33,560 --> 01:06:34,440
אבל זה בסדר.

1436
01:06:34,440 --> 01:06:37,870
אני הולך להגיד "סיום".

1437
01:06:37,870 --> 01:06:42,080
ותנו לי לעודד אותך, אם עשיתי
זה correctly-- תן לי לבדוק את זה קודם.

1438
01:06:42,080 --> 01:06:45,590
קדימה, אם אתה לא mind--
בדפדפן במחשב שלך,

1439
01:06:45,590 --> 01:06:49,900
ללכת URL זה, ואנו מקווים
תראה הטקסט הלטיני שלי.

1440
01:06:49,900 --> 01:06:52,820
וכדי להיות ברור, זה
פועל לא על המחשב הנייד שלי.

1441
01:06:52,820 --> 01:06:53,610
זה נמצא בענן.

1442
01:06:53,610 --> 01:06:58,120
זה על Cloud9, פשוטו כמשמעו, אבל
בצעתי ציבור סביבת העבודה שלי

1443
01:06:58,120 --> 01:07:03,450
כך לכל גולש באינטרנט
יכול לגשת לדף הבית הלטיני שלי.

1444
01:07:03,450 --> 01:07:07,209
>> הולכים לאותו URL על
הטלפון שלך, אם אתה יכול.

1445
01:07:07,209 --> 01:07:09,750
אם זה יעלה לך, אבל אתה
יכול רק להסתכל מעבר לכתף.

1446
01:07:09,750 --> 01:07:40,688

1447
01:07:40,688 --> 01:07:42,467
קהל: [לא ברור]

1448
01:07:42,467 --> 01:07:43,550
דוד י מלאן: אני מצטער?

1449
01:07:43,550 --> 01:07:45,390
קהל: [לא ברור]

1450
01:07:45,390 --> 01:07:47,710
דוד י מלאן: רק מילים בלטינית.

1451
01:07:47,710 --> 01:07:48,210
זה הכל.

1452
01:07:48,210 --> 01:07:49,250
אבל זה מה שאתה צריך לראות.

1453
01:07:49,250 --> 01:07:49,875
>> קהל: כן.

1454
01:07:49,875 --> 01:07:50,790
דוד י מלאן: כן.

1455
01:07:50,790 --> 01:07:51,300
כֵּן.

1456
01:07:51,300 --> 01:07:51,540
בסדר.

1457
01:07:51,540 --> 01:07:53,530
אז אני יכול להחזיק עד שלך
טלפון לרגע?

1458
01:07:53,530 --> 01:07:57,504
אז, אני מקווה, אם אתה מנסה להיכנס
זה, זה צריך להיראות כמעט בלתי קריא.

1459
01:07:57,504 --> 01:07:59,920
זה עדיין-- אני מתכוון, זה
קריא בגלל הלטינית.

1460
01:07:59,920 --> 01:08:01,920
אבל זה גם קריא
מסיבה מה אחרת?

1461
01:08:01,920 --> 01:08:03,775
כאילו, מה למורת רוחם לך על זה?

1462
01:08:03,775 --> 01:08:04,650
קהל: הוא קטן.

1463
01:08:04,650 --> 01:08:06,420
דוד י מלאן: זה סופר, סופר קטן.

1464
01:08:06,420 --> 01:08:07,920
אז איך אפשר לתקן את זה?

1465
01:08:07,920 --> 01:08:09,730
זה סופר, סופר קטן
בטלפון של ויקטוריה

1466
01:08:09,730 --> 01:08:11,400
ו, אם אתה כבר משכת
אותו בעצמך, כנראה

1467
01:08:11,400 --> 01:08:14,660
קטן בטלפון וכן, אלא אם כן אתה
יש הגדרות נגישות מופעלות.

1468
01:08:14,660 --> 01:08:15,530
מה זה?

1469
01:08:15,530 --> 01:08:18,497
אתה יכול פשוט לצבוט
הזום, הוא עביד,

1470
01:08:18,497 --> 01:08:20,330
אבל אז אתה רואה רק
כמה מילים בכל פעם.

1471
01:08:20,330 --> 01:08:20,859
אז חכו רגע.

1472
01:08:20,859 --> 01:08:21,720
אני יודע איך לתקן את זה.

1473
01:08:21,720 --> 01:08:22,219
ימין?

1474
01:08:22,219 --> 01:08:26,130
יכולתי להשתמש ב- CSS, ויכולתי לשנות את
גודל גופן נקודות 12 עד 24 נקודות.

1475
01:08:26,130 --> 01:08:29,020
אבל תופעת הלוואי של זה,
כמובן, הולך להיות עכשיו,

1476
01:08:29,020 --> 01:08:32,630
על שולחני או מחשב נייד,
עכשיו את הטקסט גדול פי שניים.

1477
01:08:32,630 --> 01:08:35,810
וכך זה היה סוג של להיות נחמד
להבחין בין התקנים,

1478
01:08:35,810 --> 01:08:37,840
ומתברר שיש
דרכים לעשות את זה.

1479
01:08:37,840 --> 01:08:39,590
יש כמה
בדרכים שונות, למעשה,

1480
01:08:39,590 --> 01:08:44,189
לפיה באמצעות CSS ותכונות להשתכלל
כי אנחנו לא ניכנס בפירוט רב,

1481
01:08:44,189 --> 01:08:46,960
למעשה אתה יכול לבצע שאילתה
הדפדפן ולומר,

1482
01:08:46,960 --> 01:08:51,550
אם המסך הוא קטן יותר מאשר זה
פיקסלים רבים, השתמשו בגודל גופן זה.

1483
01:08:51,550 --> 01:08:55,180
אם המסך שלך הוא גדול יותר מאשר זה
פיקסלים רבים, השתמשו בגודל גופן אחר זה.

1484
01:08:55,180 --> 01:08:57,080
>> אתה יכול להיות אפילו להשתכלל עדיין.

1485
01:08:57,080 --> 01:09:00,140
אם אי פעם ביקר
דף אינטרנט, על שולחן עבודה,

1486
01:09:00,140 --> 01:09:04,404
יש תפריט גדול אולי מחוץ ל
בצד, ולאחר מכן את כל התוכן

1487
01:09:04,404 --> 01:09:07,029
היא בצד של זה menu--
זה סוג של פרדיגמה נפוצה.

1488
01:09:07,029 --> 01:09:09,670
תפריט מצד שמאל, תוכן
בצד ימין, או להיפך.

1489
01:09:09,670 --> 01:09:13,569
לא ממש עובד על הנייד כאשר שלך
המסך הוא רק פיקסלים רבים זה רחב.

1490
01:09:13,569 --> 01:09:16,233
אז נפוץ יותר על הנייד הוא,
התפריט שלך יהיה פתאום לקבל

1491
01:09:16,233 --> 01:09:18,399
קרוס, ואתה צריך
לחץ על כפתור כדי לראות את זה,

1492
01:09:18,399 --> 01:09:22,404
או באתר יהיה לשים את התפריט
מעליו וקבע התוכן מתחתיה.

1493
01:09:22,404 --> 01:09:24,779
ואתה יכול ליישם אלה
דברים בדרכים שונות, מדי.

1494
01:09:24,779 --> 01:09:28,340
אתה יכול לשאול מתכנתים שלך,
היי, צוות, בכל עת

1495
01:09:28,340 --> 01:09:34,450
אתה רואה בקשת HTTP באמצעות Android
המכשיר, מכשיר מיקרוסופט, גוגל

1496
01:09:34,450 --> 01:09:39,930
המכשיר, מכשיר אפל, השתמש זה
גודל גופן ולהשתמש פריסת התפריט הזה,

1497
01:09:39,930 --> 01:09:42,670
או אחר להשתמש מחדל זה פריסה גדולה.

1498
01:09:42,670 --> 01:09:45,410
>> עכשיו, באמצעות מה
היום טכניקה בסיסית

1499
01:09:45,410 --> 01:09:48,529
הצליחו המהנדסים להשתמש
לדעת אם זה

1500
01:09:48,529 --> 01:09:53,660
iPhone, טלפון אנדרואיד, מחשב נייד,
מחשב שולחני ביקור השרתים של החברה?

1501
01:09:53,660 --> 01:09:55,310
שבו הם מקבלים את המידע הזה?

1502
01:09:55,310 --> 01:09:56,080
>> קהל: לתחתית עמוד

1503
01:09:56,080 --> 01:09:57,740
>> דוד י מלאן: כן, כותרת HTTP.

1504
01:09:57,740 --> 01:10:01,714
אז כל בקשת HTTP המגיעה
שלהם ללקוחות השרתים שלהם

1505
01:10:01,714 --> 01:10:03,880
כוללים, בתוך וירטואלי
מעטפה, חבורה שלמה

1506
01:10:03,880 --> 01:10:08,260
של כותרות HTTP, שאחד מהם הוא
הדפדפן ומערכת ההפעלה

1507
01:10:08,260 --> 01:10:10,290
אפילו, אם אכפת לך
רמה כזו של פירוט.

1508
01:10:10,290 --> 01:10:13,790
עכשיו, זה מחרוזת נסתרת למראה, אבל
קיימת תוכנה אשר רק

1509
01:10:13,790 --> 01:10:18,530
לפשט את זה, ואתה יכול פשוט לבקש
בתכנות code-- PHP, Java, C ++,

1510
01:10:18,530 --> 01:10:23,650
whatever-- מה הטלפון זה--
באיזה מכשיר הוא משתמש זה משתמש?

1511
01:10:23,650 --> 01:10:27,501
ואז אתה יכול להגיד, להראות להם את זה
גרסה של האתר, אם זה טלפון.

1512
01:10:27,501 --> 01:10:30,250
הראה להם בגירסה זו של
אתר אם זה מחשב נייד או שולחני.

1513
01:10:30,250 --> 01:10:32,316
אבל אתה אפילו לא צריך
מורכבות בצד השרת.

1514
01:10:32,316 --> 01:10:33,940
אתה יכול לעשות אפילו את הדברים הפשוטים ביותר.

1515
01:10:33,940 --> 01:10:34,815
>> אני הולך לעשות את זה.

1516
01:10:34,815 --> 01:10:38,995
אני הולך קדימה לתוך
סביבת Cloud9 שלי,

1517
01:10:38,995 --> 01:10:41,370
ואני הולך להוסיף תג
שראית ב- Google לפני.

1518
01:10:41,370 --> 01:10:42,770
זה נקרא מטא תג.

1519
01:10:42,770 --> 01:10:45,520
ואני אף פעם לא זוכר את המכתב הזה, כך
אני הולך לתמלל אותו כאן.

1520
01:10:45,520 --> 01:10:50,552
meta name = "של נקודת מבט" ולאחר מכן
content = "width = רוחב מכשיר, intital

1521
01:10:50,552 --> 01:11:02,060
סולם = 1 "וזהו.

1522
01:11:02,060 --> 01:11:06,230
>> אז זה עשוי גם להיות
כמו לחש קסום.

1523
01:11:06,230 --> 01:11:11,300
זה לא כל כך ברור, אבל יש זה
משהו לעשות עם נקודת המבט,

1524
01:11:11,300 --> 01:11:15,070
ואת נקודת המבט היא רק הגוף של
דף אינטרנט, באזור מהלבן

1525
01:11:15,070 --> 01:11:16,690
המגדיר ביותר של הדף.

1526
01:11:16,690 --> 01:11:19,060
וזה רק אומר
הדפדפן, אתה יודע מה?

1527
01:11:19,060 --> 01:11:22,589
הפוך את רוחב הדף הזה
ביעילות שווה לרוחב המכשיר.

1528
01:11:22,589 --> 01:11:25,380
במילים אחרות, אין להניח כי
יש לך סוג של שטח בלתי מוגבל.

1529
01:11:25,380 --> 01:11:29,920
נניח שיש לך רק את מה
שטח כמו המכשיר עצמו הוא גדול.

1530
01:11:29,920 --> 01:11:34,454
אז עכשיו, אם אני רענן
בדפדפן שלי, אני לא רואה שום שינוי.

1531
01:11:34,454 --> 01:11:37,370
אבל אם עשיתי correctly-- זה
תן לי לעבור באצבעות שלי אם כל מה שאתה

1532
01:11:37,370 --> 01:11:42,920
לטעון טלפונים שלך, אתה
רואה שינוי משכנע?

1533
01:11:42,920 --> 01:11:43,620
כן, הוא ש--

1534
01:11:43,620 --> 01:11:45,067
>> קהל: [לא ברור]

1535
01:11:45,067 --> 01:11:45,900
דוד י מלאן: כן.

1536
01:11:45,900 --> 01:11:46,400
בסדר.

1537
01:11:46,400 --> 01:11:47,850
אז לטעון יותר קריא עכשיו?

1538
01:11:47,850 --> 01:11:53,070
עדיין קטן, כדי להיות הוגן, אבל לא
כך זעיר כמו להיות נשלט.

1539
01:11:53,070 --> 01:11:56,920
ואני בהחלט יכול לשנות זאת
נוסף עם CSS או בצד השרת,

1540
01:11:56,920 --> 01:12:00,120
אבל יותר ויותר מה אתה
לראות זה עוד ועוד תכונות

1541
01:12:00,120 --> 01:12:02,900
להתווסף
בצד הלקוח environments--

1542
01:12:02,900 --> 01:12:06,530
JavaScript, כמו נדונו
מחר, CSS, ו HTML-- כך

1543
01:12:06,530 --> 01:12:09,190
שכל שאילתות אלו
ניתן לעשות זאת על הלקוח

1544
01:12:09,190 --> 01:12:11,910
כדי להטריד את
שרת הרבה פחות ולא

1545
01:12:11,910 --> 01:12:14,530
צריך לשמור על קשר עם, עבור
למשל, המתקפה המתמדת

1546
01:12:14,530 --> 01:12:17,210
של מערכת ההפעלה החדשה
גרסאות, גרסאות דפדפן חדש.

1547
01:12:17,210 --> 01:12:20,190
אתה פשוט יכול לאפשר לדפדפן
לשאול את המכשיר, כמה אתה גדול,

1548
01:12:20,190 --> 01:12:22,890
ולאחר מכן לבצע מעט הגיוני
החלטות על בסיס זה.

1549
01:12:22,890 --> 01:12:25,140
אבל נראים יותר הזדמנויות
להחלטות הגיוניות

1550
01:12:25,140 --> 01:12:27,223
מחר בהקשר
של שפת תכנות.

1551
01:12:27,223 --> 01:12:29,800

1552
01:12:29,800 --> 01:12:32,760
>> לכן, כל שאלות, אם כן,
על התפתחות האינטרנט?

1553
01:12:32,760 --> 01:12:36,130
היום הוא לא תכנות אינטרנט, לכל
בתור שכזה, שהרי רוב מה שעשינו

1554
01:12:36,130 --> 01:12:38,370
היה מאוד אסתטי, אם תרצה.

1555
01:12:38,370 --> 01:12:41,750
אין קבלת החלטות
הקוד שכתבנו,

1556
01:12:41,750 --> 01:12:44,990
וכך זה למה HTML הוא סימון
שפה, לא שפת תכנות.

1557
01:12:44,990 --> 01:12:47,140
אבל מחר ניקח
מבט מהיר, בסופו של דבר,

1558
01:12:47,140 --> 01:12:49,340
ב JavaScript, שהיא
תכנות בפועל

1559
01:12:49,340 --> 01:12:54,220
שפה המאפשרת לנו לעשות קצת יותר.

1560
01:12:54,220 --> 01:12:56,800
>> יש שאלות?

1561
01:12:56,800 --> 01:13:00,480
ובכן, הרשו לי להציע שני
הזדמנויות אופציונליות עבור שיעורי בית.

1562
01:13:00,480 --> 01:13:02,900
אחת אז-- אלה Cloud9
חשבונות לא יפוגו.

1563
01:13:02,900 --> 01:13:04,669
אתם מוזמנים להשתמש
אותם להתעסק עם.

1564
01:13:04,669 --> 01:13:05,960
זה ברמה ללא שירות.

1565
01:13:05,960 --> 01:13:08,754
בן כי, אם בעת יצירה
סביבת העבודה שלך, אתה עשית את זה לציבור,

1566
01:13:08,754 --> 01:13:11,670
זה אומר שמישהו כי על
האינטרנט יכול לראות מה שאתה מקליד.

1567
01:13:11,670 --> 01:13:15,104
אז אולי רק לשקול
לא להביך את עצמך

1568
01:13:15,104 --> 01:13:18,020
אם אתם מחברים האינטרנט הראשון שלך
דף בחוץ בפומבי בטעות,

1569
01:13:18,020 --> 01:13:20,134
אבל אף אחד לא הולך
יודע לחפש שם בכל מקרה.

1570
01:13:20,134 --> 01:13:23,760
>> ו two-- בואו נהפוך
עד URL זו, כמו גם,

1571
01:13:23,760 --> 01:13:28,250
במיוחד אם אתה בא היום
קצת פחות נוח יותר מאחרים,

1572
01:13:28,250 --> 01:13:30,430
לא בטוח מה כל הדברים האלה אומרים.

1573
01:13:30,430 --> 01:13:36,780
הבן כי הרבה יותר של וידאו זה,
שהוא גם דרך טובה להירדם

1574
01:13:36,780 --> 01:13:39,380
וגם לצחוק תוך
בעשותו כן, יש גם

1575
01:13:39,380 --> 01:13:44,300
הרבה societally מעניין
ודיוני אבטחה רלוונטית

1576
01:13:44,300 --> 01:13:47,370
בה מג'ון אוליבר,
אמנם קומיקאי.

1577
01:13:47,370 --> 01:13:55,456
>> אבל אם אין שאלות נוספות,
וזה מביא אותנו אל הקבלה.

1578
01:13:55,456 --> 01:13:56,830
אז למה אני לא מפעיל את המוזיקה.

1579
01:13:56,830 --> 01:13:58,610
לא צריך להיות משקאות
וחטיפים בחוץ.

1580
01:13:58,610 --> 01:14:00,220
אני שמח להתערבב כל
עוד אנשים רוצים,

1581
01:14:00,220 --> 01:14:01,600
לענות על שאלות יותר אחד על אחד.

1582
01:14:01,600 --> 01:14:03,330
אבל, אחרת, אתה מוזמן
להמריא בכל נקודה,

1583
01:14:03,330 --> 01:14:05,740
ואנחנו נתראה שוב
מחר בבוקר קצת יותר.

1584
01:14:05,740 --> 01:14:07,290
הכל בסדר תודה.

1585
01:14:07,290 --> 01:14:10,428