כיצד לבצע מצגות HTML עם שקפים

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

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

מה זה שקופיות?

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

למצגות ה- HTML שערכתי בכלי זה תהיה אסתטיקה מרשימה. ראוי לציין כי כלי זה דורש ידע בסיסי מאוד ב- HTML וב- CSS, ולכן הוא אידיאלי לכל סוגי המשתמשים, אשר צריכים להתמקד רק בתוכן ומעט מאוד כיצד להכין את המצגת.

איך מורידים שקפים?

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

wget https://github.com/jlantunez/webslides/archive/master.zip

אתה יכול גם לשכפל עם המאגר הרשמי

git clone https://github.com/jlantunez/webslides.git

בתוך תיקיית הפרויקט תקבלו את ה- js, css והדגמות הדרושים בכדי להתחיל ליצור מצגות HTML משלכם בקלות.

כיצד להשתמש במגלשות אינטרנט?

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

מה נקבל כשאנחנו מורידים שקפים?

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

  • תיקיית css תאחסן את סגנונות המצגות שלנו
  • כתבי ה- javas הנדרשים יאוחסנו בתיקיית js, כולל webslide.js הבסיסי בו נעשה רוב הקסם.
  • התמונות וקבצי ה- HTML של ההדגמות יישמרו בתיקיות התמונות וההדגמות בהתאמה.
webslides/
├── index.html
├── css/
│   ├── base.css
│   └── colors.css
│   └── svg-icons.css (optional)
├── js/
│   ├── webslides.js
│   └── svg-icons.js (optional)
└── demos/
└── images/

יצירת מצגות HTML עם שקופיות אינטרנט

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

  • הקוד נקי ומדרג. זה כולל גם סימון אינטואיטיבי עם השימוש במינוח הפופולרי ביותר. אין צורך להשתמש בשיעורים, או בשימוש יתר בקינון.
  • כל <section> ב- # webides זה מייצג שקף. כך שהעימוד פשוט ביותר.
שקופית 1  שקופית 1

באותו אופן אנו יכולים לעשות שקופיות אנכיות, להוסיף סגנון אנכי


כיתות המרכיבות את CSS של דפי האינטרנט

  • טיפוגרפיה: .טקסט נחיתה,. טקסט-נתונים,. טקסט-מבוא ...
  • צבעי רקע: .bg-primary, .bg-apple, .bg-blue ...
  • תמונות רקע: .background, .background-center-bottom ...
  • כרטיסים: .card-50, .card-40 ...
  • חסימות גמישות: .flexblock.clients, .flexblock.metrics ...

הרחבה לשקופיות

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

הדגמות להצגת HTML שנעשו בעזרת שקפים

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

הדגמות של מצגות HTML

תיקי הדגמות 2

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


השאירו את התגובה שלכם

כתובת הדוא"ל שלך לא תפורסם. שדות חובה מסומנים *

*

*

  1. אחראי לנתונים: מיגל אנחל גטון
  2. מטרת הנתונים: בקרת ספאם, ניהול תגובות.
  3. לגיטימציה: הסכמתך
  4. מסירת הנתונים: הנתונים לא יועברו לצדדים שלישיים אלא בהתחייבות חוקית.
  5. אחסון נתונים: מסד נתונים המתארח על ידי Occentus Networks (EU)
  6. זכויות: בכל עת תוכל להגביל, לשחזר ולמחוק את המידע שלך.

  1.   אלן פואנטס דיג'ו

    טוב מאוד, אני מוצא את הכלי מעניין למדי אם כי לטעמי reveal.js הוא די קל יותר לשימוש מכיוון שהוא כלי המבוסס על טכנולוגיות אינטרנט כגון HTML, CSS ו- JS, עם ידע בסיסי בטכנולוגיות אלה תוכלו לגרום למצגת שלכם להיראות כמו הרבה יותר מעניין.

    ברכות.

    1.    לְטָאָה דיג'ו

      קל מאוד לבקר ולהסתיר את מה שאתה רוצה להסתיר בפרופיל אנונימי, אך למרבה הצער ניתן להבין כי המקדם שלך אינו נראה מעבר למקום בו עיניך יכולות לראות, מאמר זה נכתב על ידי כולי על סמך התיעוד הרשמי ו בסקירה שערכתי על הכלי. איזה מהם ייתן לך רעיון, הכרתי אותו בזכות העובדה שזו היישום שהצביע ביותר בימים האחרונים ב- github https://github.com/jlantunez/webslides... עם זאת, חשוב לנו מאוד שתקדיש את הזמן לחפש אתר אחר שבו הם גם כותבים על אותו דבר כמונו, כדי שתוכל להגיש מועמדות למשרה הפנויה של הבודק, שלדעתי רק תישאר מבקש כי אני בספק שיש לך את קריטריון להחלטה על משהו מתאים.