Cum se fac prezentări HTML cu diapozitive web

Într-o lume în care arată-ne ideile pe internet A devenit din ce în ce mai necesar și acolo unde diversitatea instrumentelor ne-a determinat să creăm prezentări uimitoare, care în multe cazuri ajung să fie incompatibile cu unele medii, fără îndoială, Prezentări HTML vor continua să fie alternativa universală în acest domeniu.

Dar nu este un secret pentru nimeni că crearea de prezentări HTML frumoase poate dura mult timp și necesită cunoștințe oarecum avansate de HTML, CSS și, în unele cazuri, JavaScript. Din aceste probleme, reiese un instrument excelent numit diapozitive web.

Ce este diapozitivele web?

Este să-l numim cumva un „cadru” open source, realizat de Jose Luis Antunez, asta ne permite creați prezentări HTML repede și ușor. Instrumentul are elementele esențiale pentru a vă face propriile prezentări, la fel, puteți lua una dintre prezentările demo și o puteți personaliza după bunul plac în câteva minute.

Prezentările HTML pe care le-am făcut cu acest instrument vor avea o estetică impresionantă. Este demn de remarcat faptul că acest instrument necesită cunoștințe de bază despre HTML și CSS, deci este ideal pentru toate tipurile de utilizatori, care ar trebui să se concentreze doar pe conținut și foarte puțin pe modul în care pregătesc prezentarea.

Cum se descarcă diapozitive web?

Pentru a descărca diapozitive web, pur și simplu efectuați următoarea comandă din directorul dvs. preferat:

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

De asemenea, puteți clona depozitul oficial cu

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

În folderul proiectului veți obține js, css și demonstrațiile necesare pentru a începe să creați cu ușurință propriile dvs. prezentări HTML.

Cum se utilizează diapozitive web?

Cel mai mare avantaj al diapozitivelor web este ușurința de utilizare, acest instrument facilitează cu adevărat crearea de prezentări cu diferite obiective, iar seria sa de demonstrații accelerează procesul de creare a prezentărilor cu un procent foarte mare.

Ce obținem atunci când descărcăm diapozitive web?

Când descărcăm diapozitive web, accesăm diferite foldere, care includ demonstrații și imagini (dispozitive și sigle).

  • Dosarul CSS va stoca stilurile prezentărilor noastre
  • Javascripturile necesare vor fi stocate în folderul js, inclusiv webslide.js fundamental, unde se face cea mai mare parte a magiei.
  • Imaginile și fișierele html ale demonstrațiilor vor fi salvate în folderele de imagini și respectiv demonstrații.
webslides/
├── index.html
├── css/
│   ├── base.css
│   └── colors.css
│   └── svg-icons.css (optional)
├── js/
│   ├── webslides.js
│   └── svg-icons.js (optional)
└── demos/
└── images/

Crearea de prezentări HTML cu diapozitive web

Există 2 avantaje fundamentale atunci când utilizați diapozitive web, pe care le menționăm mai jos:

  • Codul este curat și scalabil. De asemenea, include un markup intuitiv cu utilizarea celor mai populare nomenclaturi. Nu este nevoie să folosiți clase sau să nu folosiți excesiv cuibărirea.
  • Fiecare <section> în #webslides reprezintă un slide. Deci paginarea este extrem de simplă.
Slide 1  Slide 1

În același mod putem realiza diapozitive verticale, adăugând un stil vertical


Clase care alcătuiesc CSS-urile web

  • Tipografie: .text-landing, .text-data, .text-intro ...
  • Culori de fundal: .bg-primar, .bg-măr, .bg-albastru ...
  • Imagini de fundal:. Fundal,. Fundal-centru-jos ...
  • Carduri: .card-50, .card-40 ...
  • Blocuri flexibile: .flexblock.clients, .flexblock.metrics ...

Se extinde la diapozitive web

weblides ne permite să adăugăm noi stiluri și funcționalități, pentru aceasta, de exemplu, putem adăuga unele dintre următoarele resurse:

Demo-uri de prezentare HTML realizate cu diapozitive web

Puteți vedea o serie de demonstrații de prezentări HTML realizate cu diapozitive web aici. În mod similar, atunci când descărcați cadrul, puteți accesa codificarea fiecăruia dintre aceste demonstrații.

Prezentați prezentări HTML

Portofolii Demos 2 Acesta este un instrument care ne va permite să creăm prezentări HTML rapid și cu finisaje excelente, dar ne va ajuta, de asemenea, să ne concentrăm asupra conținutului și să obținem rezultate pe care nu ni le imaginam înainte.


Conținutul articolului respectă principiile noastre de etică editorială. Pentru a raporta o eroare, faceți clic pe aici.

3 comentarii, lasă-le pe ale tale

Lasă comentariul tău

Adresa ta de email nu va fi publicată.

*

*

  1. Responsabil pentru date: Miguel Ángel Gatón
  2. Scopul datelor: Control SPAM, gestionarea comentariilor.
  3. Legitimare: consimțământul dvs.
  4. Comunicarea datelor: datele nu vor fi comunicate terților decât prin obligație legală.
  5. Stocarea datelor: bază de date găzduită de Occentus Networks (UE)
  6. Drepturi: în orice moment vă puteți limita, recupera și șterge informațiile.

  1.   Alan Fuentes el a spus

    Foarte bine, mi se pare instrumentul destul de interesant, deși după gustul meu revel.js este destul de ușor de utilizat, deoarece este un instrument bazat pe tehnologii web precum HTML, CSS și JS, având cunoștințe de bază despre aceste tehnologii, puteți face prezentarea dvs. fii mult mai interesant.

    Salutări.

  2.   Anonymus el a spus
    1.    şopârlă el a spus

      Ascunderea într-un profil anonim este foarte ușor să critici și să spui ce vrei, dar din păcate este de înțeles că coeficientul tău nu se oprește pentru a privi dincolo de unde îți pot vedea ochii, acest articol a fost scris în întregime de mine pe baza documentației oficiale și în recenzia pe care am făcut-o asupra instrumentului. Pe care să-ți fac o idee, am aflat-o datorită faptului că este cea mai votată aplicație din ultimele zile pe github https://github.com/jlantunez/webslides… Cu toate acestea, este foarte important pentru noi să vă luați timp să căutați un alt site în care să scrie și ei la fel ca noi, așa că puteți aplica la postul vacant de recenzie, care cred că ar rămâne un solicitant doar pentru că îndoială că aveți criteriul pentru a decide ceva potrivit.