Wenn wir einen Inhalt ins Web stellen möchten, besteht eines der großen Probleme darin, dass die Vorschläge, die ich erhalte, niemals als zufriedenstellend ins Web integriert angesehen werden. Im Allgemeinen besteht das Problem darin, dass das Design und das Layout ohne eine angemessene Struktur normalerweise nicht gut aussehen, was zu einem unbefriedigenden Ergebnis führt.
Deshalb werde ich einige sehr grundlegende Erklärungen geben, wie ein Layout von Inhalten unter Bedingungen zu betrachten ist, um die Arbeit maximal zu vereinfachen und das Ergebnis zu optimieren.
Das Ziel dieses Leitfadens ist, dass jeder ohne Programmier- oder Webentwicklungskenntnisse ein qualitativ hochwertiges Layout erstellen kann und ich nicht zu viel Zeit aufwenden muss, um die Idee durch mehrere Konversationen zu extrahieren, bis ich zu einem Ergebnis komme.
Schritt 1: Die Vorlage
Um eine Vorlage zum „Zeichnen“ unseres Vorschlags zu haben, nehmen wir ein A4-Blatt und falten es der Länge nach um EIN DRITTEL.
Schritt 2: Die Inhaltsblöcke
Stellen wir uns vor, wir haben verschiedene Arten von Inhalten: Video, Bild, Text. Jeder Inhalt ist ein rechteckiger oder quadratischer Block. Wir müssen die Blöcke von oben nach unten in die Vorlage einpassen. Wir werden drei Arten von Inhalten veranschaulichen.
Videoblock
Wir gehen davon aus, dass es sich bei dem Video in der Regel um ein YouTube-Video handelt. Wir stellen es in der Vorlage folgendermaßen dar:
Bildblock
Es kommt darauf an, ob das Bild im Quer- oder Hochformat ist, da wir uns einig sind.
Textblock
Dasselbe wie der Bildblock, je nachdem, wie wir den Text wollen, werden wir den einen oder anderen Block setzen. Wir stellen es mit parallelen Linien dar.
Textblöcke können Textblöcke mit eingeschlossenen Absätzen und sogar sein Listen von Textelementen
Ich werde zwei Beispiele anführen: einen Textblock neben einem Landschaftsbild und einen weiteren neben einem Porträtbild:
Schriftfeld
Titel in separaten Blöcken sind längliche Blöcke, die im Allgemeinen die gesamte Zeile einnehmen.
Tastenblock
Wenn wir eine Schaltfläche zum Klicken und Weiterleiten an eine andere Stelle im Web festlegen möchten, wird nur ein Fenster mit einigen Informationen (oder ein Formular) angezeigt
Andere Blöcke
Die Idee ist ähnlich. Wenn wir verstanden haben, wie die Blöcke funktionieren, können wir einen anderen Blocktyp verwenden, der ähnlich wie die vorherigen quadratisch oder rechteckig ist. Zum Beispiel, wenn wir ein Formular in den Inhalt einbinden wollen. Obwohl dies in der Regel am seltensten vorkommt, ist es besser, vor der Verwendung neuer Blöcke, die nicht zu den oben genannten Typen gehören, nachzufragen. Ich werde versuchen, diese Liste zu aktualisieren, sobald neue Blockideen herauskommen, die für jeden von Interesse sein könnten.
Schließlich ist hier ein Beispiel für eine Vorlage mit allen oben genannten Blocktypen:
Die Blöcke erweitern
Wenn wir mehr Platz benötigen, müssen wir dem Blockdesign unten einfach mehr Seiten hinzufügen. Es ist nicht notwendig, alles auszufüllen, aber es ist wichtig, zwischen den einzelnen Blöcken keine Lücken von oben nach unten zu lassen. Auf diese Weise können wir die Seite erweitern:
Schritt 3: Erstellen des Inhalts
Nachdem wir nun den Inhalt nach Blöcken und Blocktypen gegliedert haben, ist es notwendig, den Inhalt zu erstellen, der in diesen Blöcken enthalten sein wird. Der 3-Schritt ist mit dem 2-Schritt austauschbar. Mit anderen Worten, wir können den Inhalt vorher erstellen und dann das Layout so gestalten, dass wir wissen, wie viel Inhalt wir einbeziehen möchten. Es ist undeutlich, dies auf die eine oder andere Weise zu tun, aber wir müssen uns bewusst sein, dass der Inhalt genau in unser Layout passen muss
Wir werden dem vorherigen Beispiel folgen. Im 4-Image sehen wir die folgenden Blöcke:
- 2-Schriftfelder
- 4-Textblöcke
- 1-Videoblock
- 2-Bildblöcke
- 1-Tastenblock
- Gesamt: 10-Blöcke
Deshalb müssen wir unseren Inhalt so anpassen, dass er perfekt in diese Blöcke passt, ohne ihn zu verlassen, und dass die Schriftgröße bei allen exakt gleich ist. Dafür möglich es lohnt sich erst den inhalt erstellen und dann blockieren. Es kommt schon sehr auf die Person an.
Schritt 4: Anpassen des Inhalts mit den Blöcken
Nehmen wir an, wir haben das Design bereits auf dem Papier gezeichnet und alle Inhaltsblöcke erstellt. Jetzt ist der letzte Schritt, es zu kombinieren. Dazu werden wir verschiedene Tools verwenden, um alles und zu kombinieren senden Sie es an den Webdesigner.
Videoblöcke
Videos können auf zwei Arten weitergegeben werden:
- Im MP4-Videoformat über ein Tool wie WeTransfer-Seite.
- BEVORZUGTE OPTION: Laden Sie sie auf den YouTube-März-Kanal hoch und leiten Sie den YouTube-Link zum Video weiter.
Falls sich nur ein Video im Layout befindet, gibt es kein Problem. Wenn es jedoch mehrere Videos gibt, müssen wir sie in irgendeiner Weise mit dem Layout in Verbindung bringen, das wir auf Papier erstellt haben.
Zum Beispiel. Stellen Sie sich vor, es gibt drei Videos. Im Layout werden wir im ersten Video eine 1-Nummer, im zweiten Video eine 2-Nummer und im dritten Video eine 3-Nummer zeichnen. Und dann, wenn wir die gesamte Dokumentation senden, werden wir so etwas einfügen:
- Video 1: Video, das sich mit den Phrasen der Gewaltlosigkeit beschäftigt, mit dem Titel: „Die wichtigsten Phrasen der Gewaltlosigkeit“
- Video 2: Video, das sich mit den Farben der Flagge beschäftigt, mit Titel: „Die Flagge der Gewaltlosigkeit“
- Video 3: Video, das sich mit der Gruppe befasst, die in Argentinien marschieren wird, mit dem Titel: „Das Basisteam von Argentinien“
Auf diese Weise können Sie leicht erkennen, welches Video den einzelnen Abschnitten entspricht.
Bildblöcke
In diesem Fall müssen alle Bilder auf die IMGUR-Plattform hochgeladen werden: https://imgur.com/upload
Und geben Sie dann die Links zu diesen Bildern weiter. Idealerweise platzieren Sie die Bilder genauso wie die Videos und markieren sie mit einer 1, einer 2, einer 3 usw. Stellen wir uns zum Beispiel vor, dass wir in Südafrika vier Bilder im laufenden Betrieb haben. Alle vier haben den gleichen Namen: „sudafrica.jpg“. Nun, wir geben ihnen aufeinanderfolgende Namen an der Stelle, an der sie im Layout sein werden, und malen die Nummer auf das Papier, der sie entsprechen. Beispiel:
- sudafrica-1.jpg
- sudafrica-2.jpg
- sudafrica-3.jpg
- sudafrica-4.jpg
Schaltflächen-, Titel- und Textblöcke
Schließlich sollten diese Blöcke vorzugsweise in ein Word-Dokument oder in ein Google Docs geschrieben werden.
Das Format ist sehr einfach: Im Word-Dokument wird der Typ des Blocks (Titel, Schaltfläche oder Text) gefolgt von der Nummer angegeben, der er im Layout entspricht.
Beispiele:
- Titel 1:….
- Titel 2:…
- Text 1:…
- Text 2:…
- Taste 1:…
- Taste 2:…
Dann habe ich ein Beispieldokument mit völlig zufälligen Texten eingefügt, damit ersichtlich wird, wie dies nach dem Beispiel des 4-Bildes strukturiert wäre:
So sollte das Layout aussehen, wenn wir die Nummern eingegeben haben, die den einzelnen Abschnitten entsprechen:
4-Schritt: Alle senden
Sobald wir alles erledigt haben, müssen Sie es einfach an die Person senden, die für das Layout verantwortlich ist
Es würde einfach dauern
- Skizzen auf Papier mit dem Layout
- Der Inhalt
- Videolinks zu YouTube oder WeTransfer
- IMGUR Links der Bilder
- Der Link zum Dokument in Google Text & Tabellen oder der Word-Datei
Notar Wichtiges Finale
Das Ideal wäre schließlich, ein herausragendes Bild einzuschließen, das dem Titel-1-Header der Seite beiliegt. Deshalb sollte Titel 1 immer am Anfang stehen.
Das Header-Bild muss eine Größe von 960 x 540 Pixeln haben. Dieses Bild kann wie die übrigen Bilder von IMGUR gesendet werden
Resultado Finale
Und schließlich würde mit all diesen Informationen die Seite eingerichtet. Wenn Sie diesem Beispiel folgen und abschließen, wird die Seite mit dem Endergebnis nach allen Parametern, die wir zuvor angehoben haben, folgendermaßen aussehen:
Letzte Seite