גלה כיצד Dreamweaver תומך בשפות קידוד שונות המשמשות לבניית אתרי אינטרנט.
שפות התכנות הפופולריות ביותר לעיצוב ולפיתוח של אתרי אינטרנט בעלי פונקציונליות מלאה הן HTML, HTML5 ו-CSS בחזית ו-PHP, JavaScript, Java ו-jQuery בקצה העורפי.
באפשרותך לעצב את המראה של אתר אינטרנט (כגון גופנים וצבעים לדוגמה) בכל רחבי האתר באמצעות CSS. לאחר מכן, תוכל להשתמש ב-HTML כדי להוסיף תמונות, טקסט, סרטוני וידאו, טפסים ופיסות תוכן אחרות יחדיו כדי ליצור דף אינטרנט אחיד.
באמצעות CSS ו-HTML יחד, ניתן לבנות אתר סטטי. עם זאת, ברוב אתרי האינטרנט נדרשת אינטראקציה כלשהי (למשל לבקש מלקוחות למלא טופס, או לבצע תשלום) ומסד נתונים לאחסון כל הנתונים באתר האינטרנט.
כדי ליצור ערוצי תקשורת עורפיים אלה, אתה זקוק לשפת תכנות (כגון PHP) בצד השרת אשר יוצרת תקשורת עם מסד הנתונים.
שפות תכנות הנתמכות ב-Dreamweaver
בנוסף ליכולות עריכת טקסט, Adobe Dreamweaver מספק תכונות שונות, כמו רמזי קוד, כדי לעזור לכם לכתוב קוד בשפות הבאות:
- HTML
- PHP
- CSS
- JavaScript
שפות אחרות, כמו Perl, אינן נתמכות בתכונות הקידוד הספציפיות לשפה ב-Dreamweaver; לדוגמה, אתם יכולים ליצור ולערוך קבצי Perl, אך רמזים לקוד לא חלים על אותה שפה.
שינוי קוד אוטומטי
אתם יכולים להגדיר אפשרויות שמורות ל-Dreamweaver לנקות באופן אוטומטי את הקוד שכתבתם ידנית בהתאם לקריטריונים שאתם מציינים.עם זאת, הקוד שלכם לא נכתב מחדש לעולם אלא אם כן אפשרויות כתיבת הקוד מחדש מופעלות או שאתם מבצעים פעולה שמשנה את הקוד.לדוגמה, Dreamweaver לא משנה את הרווחים הלבנים שלכם או משנה את האותיות הגדולות של מאפיינים אלא אם כן אתם משתמשים בפקודת Apply Source Formatting.
ישנן מספר אפשרויות לשכתוב קוד הפעילות כברירת מחדל.
יכולות ה-Roundtrip HTML ב-Dreamweaver מאפשרות לכם להעביר את המסמכים שלכם הלוך ושוב בין עורך HTML מבוסס-טקסט ל-Dreamweaver עם השפעה מועטה או ללא השפעה על התוכן והמבנה של קוד המקור ה-HTML המקורי של המסמך.בין תכונות אלה:
שימוש בעורך טקסט של צד שלישי לעריכת המסמך הנוכחי.
כברירת מחדל, Dreamweaver לא מבצע שינויים בקוד שנוצר או נערך בעורכי HTML אחרים, גם אם הקוד לא תקין, אלא אם כן אתם מפעילים אפשרויות כתיבת קוד מחדש.
Dreamweaver לא משנה תגיות שהוא לא מזהה—כולל תגיות XML—מכיוון שאין לו קריטריונים שבאמצעותם ניתן לשפוט אותן.אם תגית לא מוכרת חופפת לתגית אחרת (לדוגמה, <MyNewTag><em>text</MyNewTag></em>), Dreamweaver מסמן אותה כשגיאה אך לא כותב את הקוד מחדש.
באופן אופציונלי, אתם יכולים להגדיר ל-Dreamweaver להדגיש קוד לא תקין בתצוגת Code (בצהוב).כשאתם בוחרים קטע מודגש, ה-Property inspector מציג מידע כיצד לתקן את השגיאה.
קוד XHTML
Dreamweaver יוצר קוד XHTML חדש ומנקה קוד XHTML קיים בצורה שעונה על רוב דרישות ה-XHTML.הכלים שאתם צריכים כדי לעמוד בדרישות ה-XHTML הבודדות שנותרו מסופקים גם כן.
חלק מהדרישות גם נדרשות בגרסאות שונות של HTML.
הטבלה הבאה מתארת את דרישות XHTML ש-Dreamweaver עונה עליהן באופן אוטומטי:
דרישת XHTML |
פעולות ש-Dreamweaver מבצע |
|---|---|
חייבת להיות הצהרת DOCTYPE במסמך לפני רכיב השורש, וההצהרה חייבת להפנות לאחד משלושת קבצי Document Type Definition (DTD) עבור XHTML (strict, transitional, או frameset). |
מוסיף XHTML DOCTYPE למסמך XHTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> או, אם למסמך ה-XHTML יש frameset: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> |
רכיב השורש של המסמך חייב להיות html, ורכיב ה-html חייב לציין את מרחב השמות של XHTML. |
מוסיף את מאפיין ה-namespace לרכיב ה-html, כדלקמן: <html xmlns="http://www.w3.org/1999/xhtml"> |
מסמך סטנדרטי חייב להכיל את רכיבי המבנה head, title, ו-body.מסמך frameset חייב להכיל את רכיבי המבנה head, title, ו-frameset. |
במסמך סטנדרטי נכללים הרכיבים head, title ו-body.במסמך frameset, נכללים הרכיבים head, title, ו-frameset. |
כל הרכיבים במסמך חייבים לקנן כראוי: <p>זוהי דוגמה <i>רעה.</p></i> <p>זוהי דוגמה <i>טובה.</i></p> |
יוצר קוד מקונן כהלכה וכאשר מנקה XHTML, מתקן קינון בקוד שלא נוצר על ידי Dreamweaver. |
כל שמות האלמנטים והמאפיינים חייבים להיות באותיות קטנות. |
מאלץ את שמות אלמנטי HTML ושמות המאפיינים להיות באותיות קטנות בקוד XHTML שהוא יוצר וכאשר מנקה XHTML, ללא קשר להעדפות הרישיות של התגיות והמאפיינים שלכם. |
כל אלמנט חייב לכלול תגית סיום, אלא אם כן הוא מוצהר ב-DTD כ-EMPTY. |
מכניס תגיות סיום בקוד שהוא יוצר, וכאשר מנקה XHTML. |
אלמנטים ריקים חייבים לכלול תגית סיום, או שתגית הפתיחה חייבת להסתיים ב-/>. לדוגמה, <br> אינו תקף; הצורה הנכונה היא <br></br> או <br/>. להלן האלמנטים הריקים: area, base, basefont, br, col, frame, hr, img, input, isindex, link, meta, ו-param. ולתאימות לאחור עם דפדפנים שאינם תומכים ב-XML, חייב להיות רווח לפני ה-/> (לדוגמה, <br />, לא <br/>). |
מכניס אלמנטים ריקים עם רווח לפני הלוכסן הסוגר בתגיות ריקות בקוד שהוא יוצר, ו כאשר מנקה XHTML. |
לא ניתן לקצר מאפיינים; לדוגמה, <td nowrap> אינו תקף; הצורה הנכונה היא <td nowrap="nowrap">. זה משפיע על המאפיינים הבאים: checked, compact, declare, defer, disabled, ismap, multiple, noresize, noshade, nowrap, readonly, ו-selected. |
מכניס צמדי מאפיין-ערך מלאים בקוד שהוא יוצר, וכאשר מנקה XHTML. הערה: אם דפדפן HTML אינו תומך ב-HTML 4, הוא עלול להיכשל בפרשנות מאפייני בוליאן אלה כאשר הם מופיעים בצורה המלאה שלהם. |
כל ערכי המאפיינים חייבים להיות מוקפים במרכאות. |
מציב מרכאות סביב ערכי מאפיינים בקוד שהוא יוצר, וכאשר מנקה XHTML. |
האלמנטים הבאים חייבים לכלול מאפיין id וכן מאפיין name: a, applet, form, frame, iframe, img, ו-map. לדוגמה, <a name="intro">Introduction</a> אינו תקף; הצורה הנכונה היא <a id="intro">Introduction</a> או <a id="section1" name="intro"> Introduction</a>. |
מגדיר את המאפיינים name ו-id לאותו ערך, בכל פעם שהמאפיין name נקבע על ידי ה-Property inspector, בקוד ש-Dreamweaver יוצר, וכאשר מנקה XHTML. |
עבור מאפיינים עם ערכים מסוג מנויה (enumerated), הערכים חייבים להיות באותיות קטנות. ערך מסוג מנויה הוא ערך מרשימה מוגדרת של ערכים מותרים; לדוגמה, למאפיין align יש הערכים המותרים הבאים: center, justify, left, ו-right. |
מאלץ ערכים מסוג מנויה להיות באותיות קטנות בקוד שהוא יוצר, וכאשר מנקה XHTML. |
כל אלמנטי script ו-style חייבים לכלול מאפיין type. (התכונה type של האלמנט script נדרשת החל מ-HTML 4, כאשר התכונה language הוצאה משימוש.) |
קובע את התכונות type ו-language באלמנטים script, ואת התכונה type באלמנטים style, בקוד שהוא יוצר ובעת ניקוי XHTML. |
כל האלמנטים img ו-area חייבים להיות עם התכונה alt. |
קובע תכונות אלה בקוד שהוא יוצר וכאשר מנקה XHTML, מדווח על תכונות alt חסרות. |
ביטויים רגולריים
ביטויים רגולריים הם תבניות שמתארות שילובי תווים בטקסט.השתמשו בהם בחיפושי הקוד שלכם כדי לעזור לתאר מושגים כמו שורות שמתחילות ב-"var" וערכי תכונות שמכילים מספר.
הטבלה הבאה מפרטת את התווים המיוחדים בביטויים רגולריים, המשמעויות שלהם ודוגמאות לשימוש.כדי לחפש טקסט שמכיל אחד מהתווים המיוחדים בטבלה, הוסיפו לוכסן הפוך לפני התו המיוחד.לדוגמה, כדי לחפש את הכוכבית בביטוי some conditions apply*, תבנית החיפוש שלכם עשויה להיראות כך: apply\*.אם לא תבצעו escape לכוכבית, תמצאו את כל המופעים של "apply" (כמו גם "appl", "applyy", ו-"applyyy"), ולא רק את אלה שמגיעים אחרי כוכבית.
תו |
התאמות |
דוגמה: |
|---|---|---|
^ |
תחילת הקלט או תחילת השורה |
^T מתאים ל-"T" ב-"This good earth" אבל לא ב-"Uncle Tom's Cabin" |
$ |
סוף הקלט או סוף השורה |
h$ מתאים ל-"h" ב-"teach" אבל לא ב-"teacher" |
* |
התו המקדים אפס פעמים או יותר |
um* מתאים ל-"um" ב-"rum", "umm" ב-"yummy", ו-"u" ב-"huge" |
+ |
התו המקדים פעם אחת או יותר |
um+ מתאים ל-"um" ב-"rum" ו-"umm" ב-"yummy" אבל לא לכלום ב-"huge" |
? |
התו הקודם לכל היותר פעם אחת (כלומר, מציין שהתו הקודם הוא אופציונלי). |
st?on מתאים ל-"son" ב-"Johnson" ו-"ston" ב-"Johnston" אבל לא לכלום ב-"Appleton" או "tension" |
. |
כל תו בודד פרט לשורה חדשה |
.an מתאים ל-"ran" ו-"can" בביטוי "bran muffins can be tasty" |
x|y |
x או y. |
FF0000|0000FF מתאים ל-"FF0000" ב-bgcolor="#FF0000" ו-"0000FF'" ב-font color="#0000FF" |
{n} |
בדיוק n מופעים של התו המקדים |
o{2} מתאים ל-"oo" ב-"loom" ולשני ה-o הראשונים ב-"mooooo" אבל לא לכלום ב-"money" |
{n,m} |
לפחות n, ולכל היותר m, מופעים של התו הקודם. |
F{2,4} מתאים ל-"FF" ב-"#FF0000" ולארבעת ה-F הראשונים ב-#FFFFFF |
[abc] |
כל אחד מהתווים הכלולים בסוגריים המרובעים.ציינו טווח של תווים עם מקף (לדוגמה, [a-f] שווה ל-[abcdef]). |
[e-g] תואם ל־"e" ב־"bed", "f" ב־"folly", ו־"g" ב־"guard" |
[^abc] |
כל תו שלא נמצא בסוגריים המרובעים ציינו טווח של תווים עם מקף (לדוגמה, [^a-f] שווה ל-[^abcdef]). |
[^aeiou] תואם בהתחלה "r" ב-"orange", "b" ב-"book", ו-"k" ב-"eek!" |
\b |
גבול של מילה (למשל רווח או מעבר שורה) |
\bb תואם "b" ב-"book" אבל כלום ב-"goober" או "snob" |
\B |
הכל פרט לגבול של מילה |
\Bb תואם "b" ב-"goober" אבל כלום ב-"book" |
\d |
תו של ספרה כלשהי שווה ערך ל-[0-9]. |
\d תואם "3" ב-"C3PO" ו-"2" ב-"apartment 2G" |
\D |
כל תו פרט לספרה שווה ערך ל-[^0-9]. |
\D תואם "S" ב-"900S" ו-"Q" ב-"Q45" |
\f |
הזנת דף |
|
\n |
מעבר שורה |
|
\r |
מעבר שורה |
|
\s |
כל תו רווח יחיד, כולל רווח, טאב, הזנת עמוד או הזנת שורה. |
\sbook תואם "book" ב- "blue book" אבל כלום ב-"notebook" |
\S |
כל תו שאינו כולל רווח לבן |
\Sbook תואם "book" ב-"notebook" אבל לא ב-"blue book" |
\t |
תו טאב |
|
\w |
כל תו אלפא-נומרי, כולל מקף תחתון זהה ל-[A-Za-z0-9_]. |
b\w* תואם "barking" ב-"the barking dog" וגם "big" וגם "black" ב-"the big black dog" |
\W |
כל תו שאינו אלפא-נומרי שווה ערך ל-[^A-Za-z0-9_]. |
\W תואם "&" ב-"Jake&Mattie" ו-"%" ב-"100%" |
Control+Enter או Shift+Enter (Windows), או Control+ Return או Shift+Return או Command+ Return (Macintosh) |
התו Return ודאו שאתם מבטלים את הבחירה של האפשרות התעלמות מהבדלי רווחים בעת חיפוש אחר זה, אם לא משתמשים בביטויים רגולריים.שימו לב שזה תואם תו מסוים, ולא את הרעיון הכללי של מעבר שורה; לדוגמה, זה לא תואם תגית <br> או תגית <p>. בתצוגת Design, תווי Return מופיעים כרווחים ולא כמעברי שורה. |
השתמשו בסוגריים כדי להפריד קבוצות בתוך הביטוי הרגולרי שאליהן ניתן יהיה להתייחס מאוחר יותר.לאחר מכן השתמשו ב-$1, $2, $3, וכן הלאה בשדה החלפה כדי להתייחס לקיבוצים הראשונים, השניים, השלישיים ומאוחרים יותר שבסוגריים.
בתיבת 'חיפוש', כדי להתייחס לקיבוץ בסוגריים מוקדם יותר בביטוי הרגולרי, השתמשו ב-\1, \2, \3, וכן הלאה במקום $1, $2, $3.
לדוגמה, חיפוש אחר (\d+)\/(\d+)\/(\d+) והחלפה ב-$2/$1/$3 מחליף בין היום והחודש בתאריך המופרד בלוכסנים, ובכך ממיר בין תאריכים בסגנון אמריקאי לתאריכים בסגנון אירופאי.
קוד התנהגות שרת
כשאתם מפתחים עמוד דינמי ובוחרים התנהגות שרת מלוח התנהגויות השרת, Dreamweaver מכניס בלוק קוד אחד או יותר לעמוד שלכם כדי לגרום להתנהגות השרת לפעול.
אם אתם משנים ידנית את הקוד בתוך בלוק קוד, אתם כבר לא יכולים להשתמש בלוחות כמו לוח הקישורים ולוח התנהגויות השרת כדי לערוך את התנהגות השרת.Dreamweaver מחפש דפוסים ספציפיים בקוד העמוד כדי לזהות התנהגויות שרת ולהציג אותן בלוח התנהגויות השרת.אם אתם משנים את הקוד של בלוק קוד בכל דרך, Dreamweaver כבר לא יכול לזהות את התנהגות השרת ולהציג אותה בלוח התנהגויות השרת.עם זאת, התנהגות השרת עדיין קיימת בעמוד, ואתם יכולים לערוך אותה בסביבת הקידוד ב-Dreamweaver.
בניית אתרי אינטרנט יפהפיים ב-Dreamweaver
עיצוב כתיבת קוד וניהול אתרי אינטרנט דינמיים בכלי רב עוצמה כולל.