מדריך פשוט שלב אחר שלב Dreamweaver – 2020

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


אם מעולם לא שמעת על Dreamweaver לפני שזה יישום של Adobe המאפשר לך לעצב, לבנות ולפרוס אתרים.

גם אם מעולם לא נגעת בקוד כלשהו בחייך אתה יכול לגרום ל- Dreamweaver לעבוד בשבילך באמצעות הממשק החזותי האינטואיטיבי שלו.

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

מה זה Dreamweaver

Dreamweaver היא תוכנה לבניית אתרים שקיימת כבר למעלה מ 20 שנה. זה פותח לראשונה על ידי Macromedia ואז נרכש על ידי Adobe בשנת 2005. התוכנה עברה איטרציות מרובות וכיום היא חלק מחבילת Adobe Creative Cloud. פירוש הדבר שתצטרך לרכוש מנוי חודשי כדי להשתמש בתוכנה.

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

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

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

אירוח אתרים מומלץ

Cloudways או Bluehost הם ההימור הטוב ביותר שלך בכל הקשור לאירוח אתרים לאתרים מובנים ב- HTML.

או קרא את סקירת Cloudways המפורטת שלנו >>

התכונות העיקריות של Dreamweaver

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

להלן התכונות העיקריות שגורמות לכלי זה להתבלט:

1. ממשק חזותי קל לשימוש

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

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

2. עורך קוד מובנה

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

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

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

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

3. חלק מסוויטת ה- Cloud Cloud

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

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

היתרונות והחסרונות של Adobe Dreamweaver

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

Pros Dreamweaver

Dreamweaver הוא כלי אינטואיטיבי וגמיש שעושה הרבה דברים נכון. הנה כמה מהיתרונות הגדולים ביותר שתוכנה זו יכולה להציע לך:

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

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

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

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

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

חסרונות של Dreamweaver

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

עקומת למידה תלולה

ישנם פתרונות אחרים של בוני אתרים כמו Squarespace, Wix ו- WordPress, שמקלים מאוד על בניית האתר הראשון שלך. יצירת אתר בסיסי וקבלת האתר ברשת עם Dreamweaver זה לא קשה מדי, אבל יצירת אתר שיכול לעשות בדיוק מה שאתה רוצה ייקח קצת זמן.

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

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

האתר שלך טוב כמו הכישורים שלך

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

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

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

דמי מנוי חוזרים (על גבי אירוח)

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

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

כיצד להשתמש ב- Dreamweaver כדי לבנות אתר מגרד

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

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

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

1. בחר בתוכנית שלך והתקן

הדבר הראשון שתצטרך לעשות הוא לרכוש ולהתקין את תוכנת Dreamweaver. אז, עבור אל אתר Adobe ובחר את התוכנית שמתאימה לך.

בחר את תוכנית חלומותיך

רק האפליקציה היחידה תעלה לכם כרגע 20.99 דולר לחודש. אם, אם אתה רוצה גישה לכל חבילת Creative Cloud, תשלם $ 52.99 לחודש. ישנם גם הנחות לעסקים, למורים ולתלמידים הזמינים מדי.

לאחר שבחרת את המנוי שלך הורד את Dreamweaver ופעל לפי ההוראות המופיעות. זהו תהליך פשוט שייקח כמה קליקים בלבד.

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

אם כבר מותקנת Creative Cloud במחשב שלך, פתח אותו, בחר ‘Apps’ ובחר Dreamweaver CC מהרשימה. תהיה לך אפשרות לניסיון חינם או לרכוש את התוכנה מייד.

2. הגדרה ראשונית ודרך

לאחר התקנת Dreamweaver התוכנה תיפתח אוטומטית ותראה מסך שנראה כמו זה שלמטה.

מסך מבוא

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

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

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

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

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

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

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

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

3. צור אתר חדש

כדי להתחיל לבנות את האתר החדש שלך מאפס נווט אל אתר>אתר חדש. זה אמור להיראות כמו המסך למטה:

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

בשלב הבא, תרצה ליצור תיקיית תמונות שבה כל התמונות באתר שלך יועברו. תיקיית תמונה זו צריכה להיות ממוקמת בתוך תיקיית האתר שלך.

לחץ על ‘הגדרות מתקדמות’, וברשימה הנפתחת של האפשרויות בחר ‘מידע מקומי’. כאן בחר בתיקיית התמונות שיצרת לפני רגע. לאחר מכן לחץ על ‘שמור’ ואתה מוכן להתחיל לבנות את האתר שלך.

4. צור את הדף הראשון שלך

העמוד הראשון שאנו ניצור יהיה דף הבית שלך.

לשם כך בחר קובץ>חדש, בחר HTML מהרשימה ‘סוג מסמך’. לאחר מכן, שם את קובץ ה- index.html. זה יעזור להקנות לאתר שלך מבנה תקין.

כעת צריך שיהיה לך חלון ריק כמו בתמונה למטה. כך נראה האתר שלך כרגע! תראה גם ש- Dreamweaver יצר HTML כלשהו גם כן.

5. צור את כותרת האתר שלך

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

לשם כך לחץ על החלק העליון של הדף (תראה גם את האלמנט המודגש בחלק הקוד בתחתית).

לאחר מכן לחץ על ‘הכנס’ בפינה השמאלית העליונה ובחר באפשרות ‘כותרת’. יתכן שתצטרך לגלול מעט למטה כדי למצוא את האפשרות. כל האפשרויות כאן הן רכיבי HTML שונים שתוכל להוסיף לאתר שלך.

פעולה זו תכניס חסימת כותרת לדף שלך, כך שתוכל להתאים אותה לפי רצונך.

בשלב הבא, אנו נוסיף תג H1 לאלמנט הכותרת הזה. זה חשוב למטרות SEO ולאפשר למנועי החיפוש לדעת על מה האתר שלך.

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

6. עצב את כותרת הדף שלך

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

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

הדבר הראשון שנעשה עם קובץ ה- CSS שלך הוא לשנות את מראה הכותרת שלך. אך ראשית, עלינו ליצור קובץ CSS.

לשם כך לחץ על הכותרת ותראה את קטע הכותרת המודגש בכחול. לחץ על הסמל ‘+’ והקלד #header בתיבה (זה ייתן לכותרת שלך מזהה שיאפשר לך להתאים אישית את המראה שלו).

לאחר מכן בחר באפשרות ‘צור קובץ CSS חדש’. בתיבה שמופיעה בחר ‘עיון’, בחר את התיקיה שיצרת קודם לכן שם כל קבצי האתר שלך מאוחסנים ואז שם את הקובץ ‘style.css’ ולחץ על ‘אישור’..

קובץ זה הוא המקום בו תוכלו לבצע את כל שינויי העיצוב שלכם.

כעת עם יצירת קובץ ה- CSS ניצור בורר. זה יאפשר לך לבצע שינויים בטקסט הכותרת מבלי לשנות את כל הכותרת שלך.

לשם כך נווט לעורך DOM (בפינה השמאלית התחתונה) ובחר בתג H1 שיצרת. ואז בחר ‘מעצב CSS’ בפינה השמאלית העליונה.

בשלב הבא, לחץ על האפשרות ‘סלקטורים’ ויש למלא את התיבה באופן אוטומטי עם ‘#header h1’. לחץ על ‘Enter’ ואתה מוכן.

עכשיו הגיע הזמן לשנות את הגופן. אם אתה עדיין לא נמצא בתפריט מעצבי CSS, לחץ שוב על הכרטיסייה ובחר באפשרות ‘#header h1’ שיצרת זה עתה. ואז יש קופסה קטנה שאומרת ‘הצג סט’. בטל את הסימון של תיבה זו ותבטל את הנעילה של כמה אפשרויות התאמה אישית מגניבות.

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

ברגע שאתה מרוצה מאיך שנראה הכותרת שלך עובר לשלב הבא.

אתה יכול גם ללחוץ על הקובץ ‘style.css’ בראש המסך כדי לראות כיצד נראה הקוד.

7. הוסף עוד תוכן

רוב הסיכויים שאתה רוצה שהאתר שלך יהיה הרבה יותר מסתם כותרת ענקית. כך תוכלו להוסיף ולעצב אלמנטים של טקסט שונים בדף הבית שלכם.

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

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

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

    לבסוף, אנו הולכים להוסיף כותרת לראש הדף, ממש מתחת לכותרת העליונה.

    לשם כך מצא את קטע הקוד המסתיים, לחץ על Enter וצור רווח. לאחר מכן בחר ‘כותרת’ מהתפריט הימני העליון ובחר H2 מהתיבה הנפתחת.

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

    8. הוסף תמונה

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

    אתה יכול להשתמש בספריית התמונות המובנית במלאי על ידי לחיצה על הכרטיסייה ‘ספריות CC’ וחיפוש תמונה. לחלופין, אתה יכול למצוא תמונות משלך ולהעלות אותן.

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

    כאן תוכל לאתר את התמונה במחשב שלך ולחץ על ‘פתח’.

    כעת התוכנה תכניס אוטומטית את התמונה לדף שלך ותוסיף את הקוד הראוי.

    9. תצוגה מקדימה של האתר שלך

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

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

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

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

    הקפד לבדוק גם את הגרסאות הסטנדרטיות וגם את הגרסאות הניידות של האתר שלך לפני שתחליט לפרסם באינטרנט.

    לאחר שאתה מרוצה מאיך שהאתר שלך נראה, המשך לצעד הסופי.

    10. פרסם את האתר שלך באופן מקוון

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

    אנו ממליצים על Bluehost או Cloudways.

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

    עם הטיפול הזה אתה יכול לעבור לשלב הבא של העלאת האתר שלך לשרת שלך.

    לשם כך נווט לאתר>ניהול אתרים. בחלון שעולה בחר את האתר שלך, לחץ על סמל העיפרון בפינה השמאלית התחתונה.

    לאחר מכן בחר באפשרות ‘שרתים’ בצד שמאל ולחץ על סמל ‘+’, שיאפשר לך להוסיף את פרטי השרת שלך..

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

    לאחר שתגדיר את פרטי השרת שלך לחץ על ‘שמור’, ואז לחץ על ‘שמור’ שוב.

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

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

    זהו זה! יצרת והעלית בהצלחה את אתר Dreamweaver הראשון שלך.

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

    כיצד להשתמש בתבנית Dreamweaver לבניית אתר האינטרנט שלך

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

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

    לשם כך בחר קובץ>חדש ואז ‘תבניות מתחילים’, ‘פריסות בסיסיות’, ולבסוף בחר את סגנון האתר שאתה רוצה לבנות. הנה התחלנו עם הפריסה ‘בסיסי – רב עמודה’.

    תראה שהתבנית הזו נותנת לך הרבה לעבוד איתם ישר מהשער.

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

    לשינוי הגופן בחר

    קטע של הקוד שלך. ואז בצד ימין לחץ על הכפתור ‘+’ לצד ‘מאפיינים’. כאן תוכל לשנות את הגופן שלך על ידי בחירת אפשרות הטקסט שנראית כמו ‘T’ גדולה..

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

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

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

    לשם כך שימו לב למחלקה div עבור אלמנט זה, שהוא “ראשוני_העדר”. לאחר מכן לחץ על הקובץ ‘multiColumnTemplate.css’ בראש הדף.

    כאן נוכל לשנות את צבע רקע הכותרת ברגע שנמצא את האלמנט “.primary_header”.

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

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

    בסגירה

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

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

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

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

    עכשיו לך. האם השתמשת ב- Dreamweaver לבניית אתר האינטרנט שלך? יש לך טיפים או פריצות מגניבות שאתה יכול להוסיף? אנא שתפו אותנו בתגובות שלהלן.

    בדוק גם את קיצורי המקשים של Dreamweaver כדי להאיץ את משימות בניית האינטרנט שלך.

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
      Adblock
      detector