די דריי לייַערס פון וועב דיזיין

פארוואס אַלע וועבסיטעס זענען געבויט מיט אַ קאָמבינאַציע פון ​​סטרוקטור, סטיל, און ביכייוויערז

א פּראָסט אַנאַלאַדזשי אַז איז געניצט צו באַשרייַבן פראָנט-סוף וועבזייַטל אַנטוויקלונג איז אַז עס איז ווי אַ 3-טערקיש בענקל. די 3 פיס, וואָס זענען אויך באקאנט ווי די 3 לייַערס פון וועב אַנטוויקלונג, זענען סטראַקטשער, סטייל, און בעהאַוויאָורס.

די דריי לייַערס פון וועב אַנטוויקלונג

• סטרוקטור אָדער צופרידן שיכטע
  • די סטרוקטור אָדער צופרידן שיכטע פון ​​אַ וועב בלאַט איז די אַנדערלייינג HTML קאָד פון דעם בלאַט. ווי אַ הויז 'ס ראַם קריייץ אַ שטאַרק יסוד אויף וואָס די מנוחה פון די הויז איז געבויט, אַזוי אַ האַרט יסוד פון HTML שאַפֿן אַ פּלאַטפאָרמע וואָס קענען זיין באשאפן אַ וועבזייַטל. HTML ביניען קענען זיין צונויפשטעלנ פון טעקסט אָדער בילדער און עס כולל די כייפּערלינגקס וואָס וויזאַטערז וועט נוצן צו נאַוויגירן אַרום אַז וועב פּלאַץ.
• סטייל אָדער פּרעזענטירונג שיכטע
  • דער נוסח אָדער פּרעזענטירונג שיכטע דיקטייץ ווי אַ סטראַקטשערד HTML דאָקומענט וועט קוקן צו אַ פּלאַץ ס וויזאַטערז. דעם שיכטע איז דיפיינד דורך קסס (קאַסקאַדינג סטייל שיץ). די טעקעס אַנטהאַלטן סטיילז אַז אָנווייַזן ווי די דאָקומענט זאָל זיין געוויזן אין אַ וועב בלעטערער. אויף הייַנט ס וועב, די נוסח שיכטע קענען אויך אַרייַננעמען מעדיע קוועריעס וואָס קענען טוישן די וועבזייטל באזירט אויף פאַרשידענע פאַרשטעלן סיזעס און דעוויסעס .
• קאָנפיריער
  • די אָפּלייג שיכטע איז די שיכטע פון ​​אַ וועב בלאַט אַז קענען רעספּאָנד צו פאַרשידענע באַניצער אַקשאַנז אָדער מאַכן ענדערונגען צו אַ בלאַט באזירט אויף אַ גאַנג פון באדינגונגען. פֿאַר רובֿ וועב זייַטלעך, די אָפּפירונג מדרגה וואָלט זיין די דזשאַוואַסקריפּט ינטעראַקשאַנז אויף דעם בלאַט.

פארוואס זאָל איר באַזונדער די לייַערס?

ווען איר שאַפֿן אַ וועב בלאַט, עס איז דיזייראַבאַל צו האַלטן די לייַערס ווי אפגעשיידט ווי מעגלעך. ביניען זאָל זיין קאַנפאַדיד צו דיין HTML, וויזשאַוואַל סטיילז צו די קסס, און ביכייוויערז צו קיין סקריפּס וואָס די פּלאַץ ניצט.

עטלעכע פון ​​די בענעפיץ פון סעפּערייטינג די לייַערס זענען:

• שערד רעסורסן
  • ווען איר שרייַבן אַ פונדרויסנדיק CSS טעקע אָדער דזשאַוואַסקריפּט טעקע, איר קענען נוצן דעם טעקע דורך קיין בלאַט אויף דיין וועבזייטל. אויב איר דאַרפֿן צו מאַכן אַ ענדערונג צו דעם טעקע, טאָמער צו דערהייַנטיקן עטלעכע טיפּאָגראַפיק סטיילז אויף דעם וועבזייַטל, יעדער בלאַט וואָס ניצט דעם סטיילזשע וועט באַקומען די ענדערונג. עס איז ניט דאַרפֿן צו רעדאַגירן יעדער בלאַט פון די וועבזייַטל ינדיווידזשאַלי, וואָס פֿאַר גרעסערע פּלאַץ קען זיין אַ גרוילינג אונטערנעמונג.
• פאַסטער דאַונלאָודז
  • אַמאָל דעם שריפט אָדער סטילעשעעט איז דאַונלאָודיד דורך דיין קונה דער ערשטער צייַט, עס איז קאַשט דורך זייער וועב בלעטערער. ווייַל די שערד רעסורסן זענען איצט קאַנטיינד אין קאַש, אנדערע זייַטלעך וואָס זענען פארלאנגט אין די בלעטערער לאָוד מער געשווינד, וואָס פֿאַרבעסערן קוילעלדיק בלאַט גיכקייַט און פאָרשטעלונג.
• מולטי-מענטש טימז
  • אויב איר האָבן מער ווי איין מענטש ארבעטן אויף אַ וועבזייטל, איר קענען נוצן סיסטעמס וואָס פֿאַר "טשעק אין" און "טשעק אויס" פון טעקעס צו ענשור אַז אַלעמען אויף די מאַנשאַפֿט איז ארבעטן מיט די לעצט ווערסיעס פון די טעקעס. דאָס איז פיל האַרדער צו טאָן אויב סטיילז און ביכייוויערז זענען ינטערסטריינד מיט סטרוקטור דאָקומענטן.

• SEO
  • א פּלאַץ וואָס האט אַ קלאָר צעשיידונג פון סטיל און סטרוקטור איז מסתּמא צו דורכפירן בעסער פֿאַר זוכן ענדזשאַנז זינט די זייטלעך קענען מער יפעקטיוולי קריכן דעם אינהאַלט און פֿאַרשטיין די בלאַט אָן געטינג באַאָגד אַראָפּ מיט וויזשאַוואַל נוסח אָדער אָפּפירונג אינפֿאָרמאַציע.
• Accessibility
  • עקסטערנאַל נוסח שיץ און שריפט טעקעס זענען מער צוטריטלעך צו מענטשן און צו בראַוזערז. ווייַל עס איז אַז סעפּאַראַטיאָן פון סטיל און סטרוקטור, ווייכווארג ווי פאַרשטעלן לייענער קענען לייכט פּראָצעס צופרידן פון די סטרוקטור שיכטע אָן געטינג באָגגעד אַראָפּ דורך סטיילז אַז זיי קענען נישט נוצן סייַ ווי סייַ.
• Backwards compatibility
  • ווען איר האָבן אַ פּלאַץ וואָס איז דיזיינד מיט די אַנטוויקלונג לייַערס, עס וועט זיין מער באַקדראַפּ קאַמפּאַטאַבאַל ווייַל בראַוזערז אָדער מיטל וואָס קענען נישט נוצן זיכער קסס סטיילז אָדער וואָס קען האָבן דזשאַוואַסקריפּט פאַרקריפּלט קענען נאָך זען דעם HTML. דיין וועבזייטל קענען זיין פּראַגרעסיוולי ענכאַנסט מיט פֿעיִקייטן פֿאַר די בראַוזערז וואָס שטיצן זיי.

HTML - די סטרוקטור לייַער

די סטרוקטור שיכטע איז ווו איר קראָם אַלע די אינהאַלט וואָס דיין קאַסטאַמערז ווילן לייענען אָדער קוק. דעם וועט זיין קאָדעד אין סטאַנדאַרדס קאָנסידערד הטמל 5 און עס קענען אַרייַננעמען טעקסט און בילדער ווי געזונט ווי מולטימעדיאַ (ווידעא, אַודיאָ, אאז"ו ו). עס איז וויכטיק צו מאַכן זיכער אַז יעדער אַספּעקט פון דיין פּלאַץ ס צופרידן איז רעפּריזענטיד אין די סטרוקטור שיכטע. דאָס אַלאַוז קיין קאַסטאַמערז וואָס האָבן דזשאַוואַסקריפּט פארקערט אַוועק אָדער וואס קענען נישט זען CSS צו נאָך האָבן צוטריט צו די גאנצע וועב פּלאַץ, אויב ניט אַלע די פאַנגקשאַנאַליטי פון דעם פּלאַץ.

CSS - די סטיילז שיכטע

איר וועט מאַכן אַלע דיין וויזשאַוואַל סטיילז פֿאַר דיין וועבזייטל אין אַ פונדרויסנדיק סטיל בלאַט. איר קענען נוצן קייפל סטיילז, אָבער געדענקען אַז יעדער באַזונדער קסס טעקע ריקווייערז אַ הטטפּ בעטן צו ברענגען, אַפעקטינג פּלאַץ פאָרשטעלונג.

דזשאַוואַסקריפּט - די בעהאַוויאָר לייַער

דזשאַוואַסקריפּט איז די מערסט קאַמאַנלי געניצט שפּראַך פֿאַר דער נאַטור שיכטע, אָבער ווי איך דערמאנט פריער, קגי און פפּ קענען אויך דזשענערייט וועב בלאַט ביכייוויערז. אַז איז, ווען רובֿ דעוועלאָפּערס אָפּשיקן צו די נאַטור שיכטע, זיי מיינען אַז די שיכטע וואָס איז אַקטיווייטיד גלייַך אין די וועב בלעטער - אַזוי דזשאַוואַסקריפּט איז קימאַט שטענדיק די שפּראַך פון ברירה. איר נוצן דעם שיכטע צו ינטעראַקט גלייַך מיט די DOM אָדער דאָקומענט אָבדזשעקט מאָדעל. שרייבן גילטיק HTML אין די אינהאַלט שיכטע איז אויך וויכטיק פֿאַר דאָו ינטעראַקטיאָנס אין די נאַטור שיכטע.

ווען איר בויען אין די נאַטור שיכטע, איר זאָל נוצן פונדרויסנדיק שריפט טעקעס פּונקט ווי מיט קסס. איר באַקומען אַלע די זעלבע אַדוואַנידזשיז פון ניצן אַ פונדרויסנדיק סטיל בלאַט.