Grundlagen des Canva-Website-Designs | Media Made Fun | Skillshare

Playback-Geschwindigkeit


1.0x


  • 0.5x
  • 0.75x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Grundlagen des Canva-Website-Designs

teacher avatar Media Made Fun, Let's Make Learning Media Fun!

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Willkommen zu diesem Canva-Website-Design-Kurs

      0:36

    • 2.

      Vorteile einer Website

      4:02

    • 3.

      Wichtige Dinge, die du für die Gestaltung einer guten Website wissen solltest

      5:08

    • 4.

      Schlüsselelemente einer Website, die Sie kennen sollten

      10:34

    • 5.

      Wir erstellen eine Homepage in Canva

      9:00

    • 6.

      Gestalten der nächsten Seite der Website

      10:42

    • 7.

      Aufbau eines Projektbereichs

      7:29

    • 8.

      Gestalte den Abschnitt Über mich

      3:50

    • 9.

      Fußzeile und Links

      5:23

    • 10.

      Deine Website in Canva veröffentlichen und eine benutzerdefinierte Domain verknüpfen

      4:53

    • 11.

      Erstelle eine Mailchimp-Anmeldeseite und verlinke sie mit deiner Canva-Website

      7:26

    • 12.

      Vielen Dank und auf Wiedersehen + Kursprojekt

      0:21

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

58

Teilnehmer:innen

--

Projekt

Über diesen Kurs

Design einer atemberaubenden Website in Canva – kein Programmieren erforderlich!

In diesem einstündigen Kurs lernst du, wie du mit Canva eine Website entwirfst, auch wenn du ein absoluter Anfänger bist.

Wir beginnen mit den wichtigsten Konzepten und Best Practices für das Website-Design, einschließlich wesentlicher Designelemente, die du vor Beginn berücksichtigen solltest. Dann lernst du, wie du mithilfe von Vorlagen eine Website in Canva erstellen und sie an deine Marke und deinen Stil anpassen kannst.

Als Nächstes erfährst du, wie du deine Website veröffentlichst, mit einer benutzerdefinierten Domain verbindest und sie mit Mailchimp für das E-Mail-Marketing integrierst.

Wichtiger Hinweis: Canva eignet sich perfekt für einfache und stilvolle Websites, wie z. B. persönliche Marken, Portfolios und Seiten für kleine Unternehmen. Wenn du jedoch eine sehr technische oder komplexe Website benötigst, ist Canva möglicherweise nicht die beste Wahl.

Wenn du bereit bist, eine schöne und funktionale Website mit Leichtigkeit zu entwerfen, lass uns loslegen und mit der Erstellung beginnen!

Triff deine:n Kursleiter:in

Teacher Profile Image

Media Made Fun

Let's Make Learning Media Fun!

Kursleiter:in
Level: All Levels

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Willkommen zu diesem Canva-Website-Design-Kurs: Hallo und willkommen zu diesem Kurs, in dem du lernst, wie man eine Website in Canva gestaltet In diesem Kurs werde ich dich durch die grundlegenden Elemente der Erstellung einer einfachen Website führen . Außerdem werde ich verschiedene Designs untersuchen, indem wir andere Websites analysieren, um uns inspirieren zu lassen Ich zeige Ihnen, wie Sie Ihre Website mit Ihrem eigenen benutzerdefinierten Domainnamen verbinden und ihr so einen professionellen Touch verleihen. Dieser Kurs ist perfekt für alle , die eine einfache Website in Canva erstellen möchten, sei es für ein Portfolio oder eine persönliche Marke Wenn du eine komplexe, hochtechnische Website erstellen möchtest, ist Canva möglicherweise nicht die beste Wahl für Wenn du jedoch eine Website entwerfen möchtest, die schnell, einfach und kostenlos ist und ein stylistisches Layout hat, dann ist dieser Kurs genau das Richtige für Nehmen Sie also an diesem Kurs teil und lassen Sie uns noch heute mit der Erstellung Ihrer Website beginnen 2. Vorteile einer Website: Hallo, und willkommen in diesem Bereich, in dem Sie die Vorteile einer Website entdecken. Okay, also lass uns anfangen. Erstens lässt eine Website Ihre Marke professioneller und vertrauenswürdiger erscheinen. Eine Website bietet Professionalität und Glaubwürdigkeit mit einem benutzerfreundlichen Design, einheitlichem Branding, SSL-Sicherheit, klaren Botschaften, Testimonials und zugänglichen Kontaktinformationen Liebe zum Detail zeugt Zuverlässigkeit und Qualitätsbewusstsein Schauen wir uns den zweiten Punkt an Projekte als Portfolios vor Viele Personen präsentieren ihre Arbeit als Online-Portfolios, was von unschätzbarem Wert ist, wenn sie sich für Stellen wie Grafikdesigner bewerben für Stellen wie Grafikdesigner Okay, schauen wir uns jetzt ein Beispiel für eine Portfolio-Website an Beispiel für eine Portfolio-Website Sie können hier sehen, dass ich diese Website erstellt habe. Ich gehe jetzt einfach schnell zu verschiedenen Seiten. Die erste Seite hier hat also einen Namen der Person und die Links zu ihrer Arbeit und einen Link, um sie zu kontaktieren. Als Nächstes haben wir einige Informationen darüber, warum sie eingestellt werden könnten, und ein Foto. Für Ihr Portfolio halte ich es für wichtig, ein professionell aussehendes Foto zu haben. Dann haben wir einen Bereich bei mir , der mehr Informationen über die Fähigkeiten und Kenntnisse der Person enthält . Ich habe hier auch ein Bild hinzugefügt, das für die Rolle eines Grafikdesigners relevant ist. Dann haben wir eine Seite, auf ihre verschiedenen kreativen Arbeiten vorgestellt Dies können alles auch Links sein, die auf andere Seiten verweisen können , auf denen die Arbeit detaillierter dargestellt Dann gehen wir runter und haben eine Seite über Berufserfahrung. Wenn Sie also eine Portfolio-Website erstellen möchten, ist es wichtig, frühere Berufserfahrungen anzuzeigen. Wenn Sie Bilder von früheren Arbeitsplätzen haben, können Sie diese auch hier ablegen Und dann haben wir eine Seite über Dienstleistungen. Hier geht es also um die verschiedenen Fähigkeiten und Dienstleistungen, die Sie anbieten können. Dann haben wir eine Seite über Fähigkeiten. Sie können hier also sehen, dass wir diese Symbole für verschiedene Software haben , die das Design etwas interessanter machen. Wenn es nur Text wäre, würde es vielleicht nicht so lustig und kreativ aussehen wie die Icons hier zu haben. Und dann haben wir einen Bereich für Hobbys und Interessen. Dies verleiht der Website ein wenig Persönlichkeit und kann die Person freundlich und zugänglich aussehen lassen die Person freundlich und zugänglich aussehen Und dann haben wir ein Angebot. Ich dachte, das würde die Website nur ein bisschen interessanter aussehen lassen und die Person mit diesem Zitat auch professionell und fleißig aussehen mit diesem Zitat auch professionell und fleißig Dann haben wir unten den Kontaktbereich. Hier können sie also auf Kontakt klicken, und dies wird zu einem E-Mail-Formular weitergeleitet, und wir haben auch die Telefonnummer, Website, E-Mail und Adresse. Ich habe hier auch diese Icons hinzugefügt , um das Design etwas interessanter zu gestalten. Und unten habe ich einige Social-Media-Symbole hinzugefügt einige Social-Media-Symbole , die auf ihre Social-Media-Konten verweisen können. Wenn Sie also Ihre Portfolio-Website haben, ist es wichtig, Ihre Kreativität in Ihre Website einzubringen, sie so zu gestalten, wie Sie es möchten, und Ihren eigenen Geschmack und Stil hinzuzufügen. Die dritte, die Ihnen hilft, Kunden-E-Mails zu sammeln. Eine Website hilft beim Online-Geschäft, indem sie Kunden-E-Mails sammelt , um Werbeaktionen zu versenden und den Produktverkauf zu steigern. Der vierte Punkt: E-Commerce-Websites helfen bei Online-Zahlungen. Eine E-Commerce-Website erleichtert Online-Zahlungen, sodass Kunden jederzeit und überall Produkte kaufen können. Zum Beispiel bietet es mehrere Zahlungsoptionen wie Nachnahme, Kredit- und Debitkarten sowie digitale Geldbörsen Ein weiterer Vorteil einer Website ist Vermeidung hoher Kosten für die Anmietung von Geschäften Vermeiden Sie kostspielige Ladenmieten, indem Sie Produkte auf Ihrer Website präsentieren und verkaufen und Produkte auf Ihrer Website präsentieren und verkaufen so effizient Geld sparen Darüber hinaus reduziert eine Website den Bedarf an zusätzlichem Personal, ermöglicht es Ihnen, Aufgaben selbst zu erledigen, reduziert den Bedarf an zusätzlichem Personal und spart Arbeitslosenkosten Als Nächstes können Websites auf andere Plattformen verlinken. Die Website kann auf andere Plattformen oder Websites verweisen, einschließlich Social-Media-Plattformen wie Facebook, Instagram, X, YouTube und Diensten wie Google Maps. Dieses Foto zeigt beispielsweise das Foto einer Website mit allen Kontaktinformationen. Der nächste Vorteil ist, dass Sie mit Ihrer eigenen E-Commerce-Website vollständig bezahlt werden. Mit Ihrer eigenen E-Commerce-Website behalten Sie den vollen Verkaufspreis, wie auf Plattformen von Drittanbietern denen Sie einen Prozentsatz Ihrer Einnahmen teilen müssen. Das Bild auf der linken Seite stammt beispielsweise von einer Kaffee-Website, auf der ihre eigene Plattform vorgestellt wird, oder das Bild auf der rechten Seite zeigt Amazon-Verkäufergebühren, einschließlich Verkaufsgebühren, Abschlussgebühren und Verwaltungsgebühren für Rückerstattungen Okay, das ist das Ende dieses Videos, in dem wir uns die Vorteile einer Website angesehen haben Ich hoffe, Sie fanden dieses Video nützlich. Danke fürs Zuschauen, und ich werde es im nächsten sehen. 3. Wichtige Dinge, die du für die Gestaltung einer guten Website wissen solltest: Okay, lassen Sie uns nun einen Blick auf wichtige Dinge werfen, die Sie für die Gestaltung einer guten Website wissen sollten. Zuallererst empfehle ich, UX und UI zu verstehen. UX, was für Benutzererfahrung steht, bezieht sich auf die Benutzererfahrung, die bei der Interaktion mit einem Produkt oder einer Website entsteht, wobei der Schwerpunkt auf Benutzerfreundlichkeit, Zufriedenheit und Barrierefreiheit liegt. UI, was für Benutzeroberfläche steht, bezieht sich auf das Design und interaktiven Elemente wie Schaltflächen, Farben und Layouts, die die Benutzeroberfläche optisch ansprechend und benutzerfreundlich machen . Die kombinierten Anstrengungen von UI und UX sorgen für ein reibungsloses und ansprechendes Benutzererlebnis. Ein wichtiger Aspekt bei der Gestaltung einer guten Website ist, dass sie responsiv sein sollte. Kunden bevorzugen heute aufgrund von Verhaltensänderungen Informationen in Echtzeit . Denken Sie zum Beispiel an Geräte wie Smartphones und Tablets. Eine gute Website sollte das Nutzererlebnis verbessern indem Inhalte in der richtigen Größe auf allen Geräten angezeigt werden. Der zweite Punkt: Gestalten die Website so, dass sie sauber und leicht verständlich ist. Vermeiden Sie es, zu viele Farben zu verwenden, und halten Sie sich auf der gesamten Website an einen einheitlichen Ton. Wählen Sie Farben, die die Essenz Ihres Unternehmens widerspiegeln. Wenn es sich bei Ihrem Unternehmen beispielsweise um einen Pflanzenladen handelt und Grün Ihre Markenfarbe ist, stellen Sie sicher, dass die Website Grün enthält. Auf dieser Website werden zum Beispiel Dunkelgrün, Hellgrün, Dunkelgrau, Weiß und Creme verwendet . Diese Farben ergänzen sich gut und unterstreichen die Einbeziehung von Grüntönen den Fokus des Unternehmens auf Pflanzen Okay, schauen wir uns diese Website an, nämlich patch plants.com Sie können hier also sehen, dass diese Website oben diese grüne Farbe verwendet Wir haben auch diese weiße und cremefarbene Farbe und wir haben auch das Firmenlogo hier oben links. nach unten gehen, können wir sehen, dass es viele Bilder der verschiedenen Pflanzen gibt , die auf dieser Website angeboten werden. Und Sie können auch sehen, dass es hier diese Pfeiltaste gibt, die dieselbe grüne Farbe hat. Wenn ich runtergehe, gibt es mehr Fotos von Pflanzen. Und wieder haben die Knöpfe dieselbe grüne Farbe. dann nach unten gehen, können wir sehen, dass diese Schaltflächen hier die dunkelgraue Farbe haben. Und dann unten haben wir es heißer. Dieses Foto verwendet die dunkelgraue Farbe. Es gibt auch diese grüne Anmeldeunterseite. Dann gibt es hier einen Abschnitt, der Links zu verschiedenen Teilen der Website enthält , die diese weiße Farbe hier verwenden, sodass sie sich auf dem dunkelgrauen Hintergrund abhebt Dann haben wir die Links zu den sozialen Medien hier unten. Schauen wir uns das nächste Beispiel an. Das ist twinings.code.uk. Diese Marke hat sich zum Ziel gesetzt, Luxus zu vermitteln Weiß, Gold und das Die Website zeichnet sich durch Weiß- und Cremetöne mit goldenen Akzenten auf den Schaltflächen aus. Schauen wir uns das nächste Beispiel an, nämlich walkers shortbread.com Die Marke möchte den traditionellen Stil Schottlands zur Geltung bringen, weshalb sie Schwarz und Rot verwendet , um an den ikonischen Kilt zu erinnern Sie können hier sehen , dass dieser Button auch eine dunkelgelbe Farbe verwendet dann nach unten gehen, können Sie mehr von diesem Schottenmuster sehen, bei dem schwarze und rote Farben verwendet werden, was ein sehr traditionelles schottisches Muster ist Und wir können das gleiche Muster hier auf diesen Knöpfen sehen. dann nach unten gehen, können wir mehr von diesen Shortbred-Bildern sehen von diesen Shortbred-Bildern sehen dann hinuntergehen, können Sie sehen, dass wir diese Fotosammlung haben Dadurch wirkt die Marke sehr alt und traditionell. Dann haben wir hier dieses Bild, das einen Shortbred beinhaltet Ganz unten auf der Website haben wir auch dieses Tartan-Design Okay, lass uns jetzt weitermachen. Verwenden Sie Schriften, die leicht zu lesen sind. Wenn Ihre Website beispielsweise für ältere Kunden bestimmt ist, stellen Sie sicher, dass die Schriftgröße nicht zu klein ist. Die Schrift für Produktnamen auf der Website sollte fett gedruckt sein, um Aufmerksamkeit zu erregen. Denken Sie daran, zu überprüfen, wie Ihre Schriften auf Desktop-, Telefon- und Tablet-Ansichten angezeigt werden, um sicherzustellen, dass sie korrekt angezeigt werden. Verwenden Sie Symbole, um die Website ansprechender zu gestalten , da sie ansprechender sind als die bloße Verwendung von Text. Verwenden Sie beispielsweise ein Haussymbol, um zur Startseite zu navigieren, ein Telefonsymbol, um Telefonnummerninformationen anzuzeigen, ein Umschlagsymbol, um E-Mail-Informationen darzustellen, und ein Stecknadelsymbol, um Standort- oder Adressdetails anzuzeigen. Verwenden Sie als Nächstes hochwertige Fotos auf der Website und achten Sie darauf, dass die Dateien nicht zu groß sind. Denken Sie auch an urheberrechtliche Fragen. Beispielsweise ist das Hintergrundfoto auf der linken Seite ein qualitativ hochwertiges Bild, und das Foto auf der rechten Seite ist ebenfalls ein qualitativ hochwertiges Bild, wodurch die Website professioneller und vertrauenswürdiger erscheint professioneller und vertrauenswürdiger Jedes Thema sollte alle relevanten Informationen und Kategorien enthalten , sodass Sie leicht finden, wonach Sie suchen. Das Foto auf der linken Seite stammt beispielsweise von der Sony-Website, die Kategorien wie Kopfhörer, Kameras, Objektive, Fernseher, Soundbars und Mobiltelefone enthält . Wenn Sie auf Objektive klicken, wird eine Seite wie das Bild auf der rechten Seite angezeigt, auf der alle verfügbaren Objektive Darüber hinaus gibt es auf der linken Seite eine Seitenleiste , über die Benutzer weitere Optionen erkunden Dieses Design hilft dabei, die Website sauber und benutzerfreundlich zu halten . Als Nächstes sind die wichtigsten Elemente aufgeführt, die Sie vor der Erstellung einer Website kennen sollten. Die Kenntnis der wichtigsten Elemente einer Website ist wichtig, um sicherzustellen, dass sie benutzerfreundlich, funktionell und konsistent ist. Dies verbessert die Navigation, verbessert die Benutzererfahrung und gewährleistet die Barrierefreiheit, was zum Gesamterfolg der Website beiträgt. Das Erstellen einer Website auf Canva ist einfach, aber es fehlen erweiterte Funktionen wie Zahlungsabwicklung oder Drop-down-Menüs , die mit anderen Seiten verknüpft sind Okay, das ist also das Ende dieses Videos. Wir haben uns wichtige Dinge angesehen, die Sie für die Gestaltung einer guten Website wissen sollten. Als Nächstes schauen wir uns die wichtigsten Elemente einer Website an, die Sie kennen sollten . Diese werden wir im nächsten Video behandeln. Danke fürs Zuschauen und wir sehen uns dort. 4. Schlüsselelemente einer Website, die Sie kennen sollten: Okay, schauen wir uns nun die Schlüsselelemente einer Website an. Du solltest es wissen. Also lass uns anfangen. Lassen Sie uns nun die wesentlichen Komponenten des Website-Designs besprechen, beginnend mit dem Header. Die Kopfzeile befindet sich normalerweise oben auf einer Webseite und enthält wichtige Elemente wie Ihr Logo, Ihr Branding, Anmelde- oder Anmeldeschaltflächen, Suchleiste und manchmal Navigationslinks. Hier sind zum Beispiel drei verschiedene Designs. Im ersten Beispiel haben wir ein Logo, gefolgt von Schaltflächen für die Homepage, Über uns, Blog und Galerie sowie eine Suchleiste. Das zweite Beispiel ist sehr ähnlich, verwendet jedoch Symbolschaltflächen, die das Design optisch ansprechender machen können. Zum Beispiel wird ein menschliches Symbol zum Einsperren verwendet, ein Einkaufswagensymbol steht für einen Einkaufswagen und ein Lupensymbol wird für die Suche verwendet Im dritten Beispiel gibt es drei Zeilen auf der rechten Seite, die auf die mobile Ansicht einer responsiven Website hinweisen Dieses Design berücksichtigt die begrenzte Bildschirmfläche eines Telefons gewährleistet so ein benutzerfreundliches Layout Schauen wir uns als Nächstes die Navigationsleiste an. Eine Navigationsleiste oder Navbar ist ein Menü auf der Website, Benutzer über Schaltflächen oder Links einfach auf verschiedene Abschnitte oder Seiten zugreifen können über Schaltflächen oder Links einfach auf verschiedene Abschnitte oder Seiten Das Bild auf der linken Seite zeigt beispielsweise eine Telefonansicht einer Navbar, die für mobile Geräte konzipiert ist, während das Bild auf der rechten Seite eine Navbar zeigt , wie sie auf einem Desktop aussieht Dieses Bild stammt aus dem Clove and Store***.com. Hier sehen wir einen Unterkategorie-Indikator für die Navbar. Mit dieser Funktion können Benutzer leicht sehen, wo sie sich auf der Website befinden , und bei Bedarf zu breiteren Abschnitten zurückkehren Verbessern Sie das Benutzererlebnis, indem Sie Verwirrung vermeiden und die Navigation vereinfachen In diesem Fall haben wir beispielsweise auf Home geklickt dann die Kategorie Damen ausgewählt, gefolgt von Gesicht und Schönheit und schließlich Make-up Der Indikator für die Unterkategorie zeigt den Pfad an, den Sie durch die Kategorien der Website gegangen sind Als Nächstes haben wir FUTA. Ein FUTA befindet sich am Ende einer Webseite und bietet Links und zusätzliche Informationen wie Kontaktdaten, wichtige Links, Konten in sozialen Netzwerken, Newsletter-Abonnements und Urheberrechtshinweise Schauen wir uns diese Beispiele an. Für das erste Beispiel haben wir die Website FUTA der Pizza Company Er kann ihre Kontaktinformationen sehen, einschließlich Links zur Facebook-Leitung und ihrer Telefonnummer. Es enthält auch herunterladbare Links für ihre App, den Copyright-Hinweis und Einzelheiten zu den von ihnen akzeptierten digitalen Zahlungsmethoden wie Visa, Mastercard und Kreditkarten. Das zweite Beispiel bezieht sich auf die Fußzeile des SF-Kinos. Er kann Links zu ihren Social-Media-Seiten wie Facebook, Twitter oder X, Instagram, YouTube und Line sowie deren Telefonnummer sehen Social-Media-Seiten wie Facebook, Twitter oder X, Instagram, YouTube und Line sowie deren Telefonnummer Dazu gehört auch die Registrierung von DBD, was darauf hinweist, dass das Unternehmen offiziell beim Department of Business Development registriert ist beim Department of Business Development registriert Darüber hinaus enthält die Fußzeile einen Copyright-Hinweis. Sie können auch Logos von SFW, SFX und SFC erkennen, die für die verschiedenen Arten von Kinos stehen, die das Unten befinden sich anklickbare Links, die zu verschiedenen Seiten der Website führen Das dritte Beispiel ist die zentrale Website. Hier finden Sie Links zu sozialen Medien, darunter Facebook, Twitter oder X, Instagram, YouTube und Line. Es gibt auch ein E-Mail-Erfassungsfeld, in das Sie Ihre E-Mail-Adresse eingeben können , um die neuesten Angebote und Trends zu abonnieren . Wie bei den anderen Beispielen gibt es anklickbare Links, die Sie zu anderen Seiten der Website weiterleiten Darüber hinaus enthält das Futter den Copyright-Hinweis, die Adresse, Telefonnummer und E-Mail-Adresse des Unternehmens Es gibt auch herunterladbare Links, die Sie zum Apple App Store und Google Play Store führen. Wir können ihre App herunterladen. Als nächstes haben wir das Drop-down-Menü. Ein Dropdownmenü ist eine Art Menü, das zusätzliche Optionen anzeigt, wenn es angeklickt oder mit der zusätzliche Optionen anzeigt, wenn es angeklickt oder Es hilft, die Website aufgeräumt zu halten, indem unnötige Optionen ausgeblendet werden , bis sie benötigt Als Nächstes haben wir die Seitenleiste. Eine Seitenleiste ist ein vertikaler Abschnitt einer Website, der normalerweise links oder rechts positioniert ist. Das nimmt keinen Platz im Hauptinhaltsbereich ein. Es kann zusätzliche Informationen oder Navigationslinks enthalten . den verschiedenen Arten von Seitenleisten gehören eine statische Seitenleiste, eine dicke Seitenleiste, eine zusammenklappbare Seitenleiste und eine verschiebbare Seitenleiste Die statische Seitenleiste ist eine Registerkarte, die auf der linken oder rechten Seite fixiert bleibt Wenn der Benutzer nach oben oder unten scrollt, bewegt sich der Tab zusammen mit dem Inhalt Die feste Seitenleiste ist eine Registerkarte , die an einer festen Position bleibt, auch wenn der Benutzer nach oben oder unten scrollt Die Registerkarte bleibt stationär und bewegt sich nicht. Collapsb-Seitenleiste ist eine Registerkarte, die auf der linken oder rechten Seite angezeigt wird und erweitern oder reduzieren lässt, wenn Diese Funktion trägt dazu bei, die Website sauber und organisiert zu halten. Die verschiebbare Seitenleiste ist eine Registerkarte, die angezeigt wird, wenn Sie mit der Maus darüber fahren oder darauf klicken Diese Funktion hilft dabei, die Website sauber und organisiert zu halten. Schauen wir uns diese Beispiele an. Die erste Seitenleiste wird häufig auf Shopping-Websites verwendet, da sie Benutzern hilft, einfach über Kategorien nach Artikeln zu suchen . Wenn Sie beispielsweise auf Augen klicken, wird es erweitert und es werden verwandte I-Make-up-Artikel wie Eyeliner, Mascara und Lidschatten angezeigt I-Make-up-Artikel wie Eyeliner, Mascara und Diese Art von Registerkarte wird als zusammenklappbare Seitenleiste bezeichnet . Auf einigen Websites, wenn Sie auf eine Kategorie klicken, werden andere automatisch zusammengeklappt Auf anderen Websites bleiben die Kategorien jedoch geöffnet und werden nicht zusammengeklappt, wenn Sie eine andere auswählen. Das zweite Bild stammt von Google Drive. Diese Seitenleiste erscheint auf der linken Seite der Website und ist eine feste Seitenleiste, was bedeutet, dass sie auch dann an derselben Stelle bleibt , wenn Sie nach unten scrollen Wenn Sie auf Meine Ablage klicken, wird sie erweitert, um weitere Ordner anzuzeigen Wenn diese Ordner Unterordner enthalten, werden in der Seitenleiste nach Bedarf zusätzliche Ebenen angezeigt Es ist auch eine zusammenklappbare Seitenleiste, aber im Gegensatz zum anderen Beispiel wird der vorherige Abschnitt nicht reduziert, wird der vorherige Abschnitt nicht wenn Sie auf mehrere Elemente klicken Das letzte Bild stammt ebenfalls von Google Drive, aber diesmal befindet sich die Seitenleiste auf der rechten Anfänglich werden in der Seitenleiste nur Symbole angezeigt. Wenn Sie den Mauszeiger über ein Symbol bewegen, der Text angezeigt, und Sie ihn auswählen, werden weitere Informationen Darüber hinaus enthält diese Seitenleiste unten rechts einen versteckten Seitenbereich, der als verschiebbare Seitenleiste bezeichnet Schauen wir uns als Nächstes die Schaltflächen an. Schaltflächen sind interaktive Elemente, auf die Benutzer klicken oder tippen können, um bestimmte Aufgaben auszuführen. Sie sind unverzichtbar für Aktionen wie das Einreichen von Formularen, Navigation und andere Funktionen. Dieses Bild zeigt Beispiele für verschiedene Arten von Schaltflächen, einschließlich solcher mit unterschiedlichen Farben oder nur Text, die alle anklickbar sind und Sie zu einem Link weiterleiten Als nächstes haben wir Akkordeons. Akkordeons sind UI-Elemente , die den auf einer Website angezeigten Inhalt steuern, indem sie verschiedene Bereiche ein - und ausblenden Sie sind nützlich, um große Mengen verwandter Informationen wie Anleitungen oder häufig gestellte Fragen zu organisieren verwandter Informationen wie Anleitungen oder In der Regel kann jeweils nur ein Abschnitt erweitert werden, wobei der zuvor erweiterte Abschnitt zusammengeklappt wird, wenn ein neuer geöffnet wird Als Nächstes haben wir ein Eingabefeld. Ein Eingabefeld ist ein einzeiliges Textfeld , in das Benutzer Text eingeben können. Es wird häufig in Formularen für Eingabe und Informationen wie Namen, E-Mail-Adressen und Suchbegriffe verwendet. Dann haben wir einen Textbereich. Ein Textbereich ist ein mehrzeiliges Eingabefeld , in das Benutzer längere Texte wie Notizen, Kommentare oder detaillierte Informationen eingeben können. Es wird häufig in Formularen verwendet, in denen umfangreichere Eingaben erforderlich sind. Als Nächstes haben wir Custom Select. Custom Select ist ein Eingabefeld mit einem Drop-down-Menü, das zusätzliche Funktionen wie durchsuchbare Optionen und Funktionen zur Mehrfachauswahl bietet zusätzliche Funktionen wie durchsuchbare Optionen und Funktionen zur Mehrfachauswahl Es ist ein Stil, der zum Gesamtdesign der Website passt . Dann ist da noch die Chatbox. Eine Chatbox ist ein kleines quadratisches Feld, auf das Benutzer klicken können , um eine Option in einem Formular oder einer Webseite auszuwählen oder abzuwählen eine Option in einem Formular oder einer Webseite Es ermöglicht eine Mehrfachauswahl, wobei ein Chat-Zeichen erscheint, wenn eine Option Als nächstes kommen Radios. Optionsfelder sind kleine kreisförmige Schaltflächen , mit denen Benutzer eine Option aus einer Liste auf einem Formular oder einer Webseite kann jeweils nur ein Optionsfeld ausgewählt werden Pro Gruppe kann jeweils nur ein Optionsfeld ausgewählt werden. Dann gibt es Schalter. Schalter sind Umschalttasten auf Websites und Anwendungen, die wie Lichtschalter funktionieren und es Benutzern ermöglichen, Funktionen ein- oder auszuschalten Sie werden häufig für Einstellungen oder Präferenzen verwendet und bieten eine klare visuelle Anzeige des aktuellen Status Dann gibt es noch die Eingabe benutzerdefinierter Dateien. Eine benutzerdefinierte Dateieingabe ist ein gestaltetes Datei-Upload-Feld, mit dem Benutzer Dateien von ihrem Gerät auswählen Das erste Bild zeigt verschiedene Arten von benutzerdefinierten Dateieingaben Wenn Sie auf Datei auswählen klicken, ein Fenster angezeigt, in dem Sie eine Datei von Ihrem Gerät auswählen können, wie im Bild auf der rechten Seite angezeigt. Lassen Sie uns als Nächstes über die Validierung sprechen. der Validierung wird sichergestellt, dass Benutzereingaben den erforderlichen Spezifikationen entsprechen. Dabei wird geprüft richtigen Formate, Pflichtfelder und akzeptable Werte vorliegen, die alle zur Datensicherheit und -qualität beitragen. Der nächste Punkt sind Indikatoren. Mithilfe von Indikatoren können Benutzer direkt zu einer bestimmten Folie navigieren. Dieses Beispiel ist ein Bild von der DJI-Website, das Indikatoren verwendet , um Design der Website ansprechender zu gestalten Als nächstes kommen modale Komponenten. Ein Modell ist ein Popup-Fenster oder Dialogfeld, das über dem Hauptinhalt einer Website angezeigt wird. Oft wird der Hintergrund abgedunkelt , um die Aufmerksamkeit auf das Modal zu lenken, sodass eine Benutzerinteraktion erforderlich ist, um fortzufahren Das Modal besteht aus drei Hauptabschnitten. Modaler Titel, der Abschnitt , der die Überschrift oder den Titel enthält. Modaler Textkörper, der Abschnitt, in dem die Hauptinhalte wie Texte, Formulare und Bilder angezeigt werden. Modales Futter: Der Abschnitt für Aktionen wie die Schaltflächen „Speichern“ oder „Beratung Sie können den modalen Titel beispielsweise als Datei löschen angeben, wobei die Stimmung oder der Haupttext Möchten Sie diese Datei wirklich löschen Das modale Futter würde zwei Schaltflächen enthalten , von denen die erste mit Ja und die zweite mit Nein beschriftet wäre. Als Nächstes haben wir ein Album. Ein Album ist eine Sammlung von Bildern oder Fotos, die zusammen angezeigt werden, oft auf organisierte und visuell ansprechende Weise. Benutzer können verwandte Fotosammlungen wie Bilder von Veranstaltungen, Produktpräsentationen und Erinnerungen durchsuchen wie Bilder von Veranstaltungen, Produktpräsentationen und Erinnerungen Als Nächstes folgt die Seitennummerierung. Die Paginierung ist eine Methode zur Organisation von Inhalten auf mehreren Seiten in einem Webdesign Es hilft Benutzern, einfacher zu navigieren und verbessert die Leistung der Website. Als nächstes folgt die Warnung. Eine Warnung ist ein Meldungsfeld , das auf einer Website angezeigt wird, um den Benutzer auf wichtige Informationen, Warnungen oder Bestätigungen aufmerksam zu machen den Benutzer auf wichtige Informationen, Warnungen oder Bestätigungen aufmerksam zu Warnungen oder Bestätigungen Benachrichtigungen können für verschiedene Zwecke verwendet werden, z. B. für Erfolgsmeldungen, Fehlerbenachrichtigungen oder wichtige Updates Schauen wir uns diese Beispiele an. Das erste Bild zeigt eine Warnung, die angezeigt wird, wenn ein eingegebenes Passwort die erforderlichen Kriterien nicht erfüllt. Die Warnmeldung lautet: Bitte geben Sie ein Passwort mit mindestens acht Zeichen ein, einschließlich Groß - und Kleinbuchstaben Das zweite Beispiel für eine Warnung wird angezeigt, wenn die Registrierung abgeschlossen ist Eine grüne Farbe weist darauf hin, dass der Vorgang erfolgreich war dritte Beispiel für eine Warnung besagt, dass Sie Ihre E-Mail-Adresse bestätigen müssen. Diese Warnung soll den Benutzern ein Gefühl der Dringlichkeit vermitteln und sicherstellen, dass Sie sie nicht vergessen Außerdem sollte eine gute Website schnell geladen werden und schnell reagieren Eine schnell reagierende Website ist unerlässlich, um Nutzer zu binden, Suchranking zu verbessern, die Konversionen zu steigern und ein positives Erlebnis auf allen Geräten zu gewährleisten. Dies erhöht die Nutzerzufriedenheit und trägt zum Wachstum und Erfolg Ihrer Online-Präsenz bei. Okay, das ist das Ende dieses Videos. Wir haben uns die wichtigsten Elemente einer Website angesehen , die Sie kennen sollten. Ich hoffe, Sie fanden dieses Video hilfreich, und ich werde es im nächsten sehen. 5. Wir bauen eine Website in Canva – Teil 1: Okay, in dieser Lektion werden wir untersuchen, wie man mit Canva eine Website erstellt Es gibt viele Möglichkeiten , eine Website zu erstellen. Ein fortgeschrittenerer Ansatz besteht beispielsweise darin, die Website selbst zu codieren. Sie können auch kostenpflichtige Website-Builder verwenden, die eine Vielzahl von Funktionen bieten. Es gibt auch kostenlose Optionen wie Google Sites oder Canva, mit denen Sie die Website kostenlos gestalten Denken Sie daran, dass das Entwerfen einer Website mit Canva relativ einfach ist und nur begrenzte Funktionen bietet Es ist jedoch ein ausgezeichneter Ausgangspunkt für Anfänger. Lassen Sie uns nun eintauchen und eine Beispiel-Website für Media Made Fun erstellen . Okay, lass uns anfangen. Okay, jetzt führe ich eine Demonstration durch , um dir zu zeigen, wie man eine Website erstellt. Für dieses Beispiel werde ich diese Website erstellen, die Spaß macht, mit Medien gemacht. Schauen wir uns das jetzt kurz an. Sobald wir unser Design erstellt haben, können wir rübergehen und diese Vorschau-Schaltfläche hier drücken , um eine Vorschau unserer Website anzuzeigen. Ich möchte mir das auch auf dem Handy ansehen, aber ich werde einfach die Option „Größe auf Mobilgeräten ändern“ deaktivieren, sodass wir das gleiche Design-Layout wie auf dem Desktop haben Okay, schauen wir uns jetzt noch einmal die Desktop-Ansicht an und wir können nach unten scrollen, um uns die verschiedenen Seiten anzusehen Okay, das werden wir in den nächsten Videos entwerfen. Ich habe auch Links zur Website hinzugefügt. Wenn ich zum Beispiel hier auf diesen Link klicke, auf dem steht, gehe zu unserem YouTube-Kanal, werde ich auf den YouTube-Kanal verlinken, der Spaß macht. Okay, lassen Sie uns jetzt diese Website erstellen. Also habe ich in Canva unter Vorlagen die Website-Vorlage eingegeben Sie können hier also sehen, dass wir viele verschiedene Website-Vorlagen haben viele verschiedene Website-Vorlagen Wenn Sie mit der Maus über einige dieser Vorlagen fahren, können wir mit der Maus oder dem Trackpad darüber scrollen , um die verschiedenen Seiten anzuzeigen Okay, mir gefällt das Design dieser Vorlage sehr gut, also lasst uns darauf klicken und wir können nach unten scrollen, um die verschiedenen Seiten zu sehen Klicken wir auf Diese Vorlage anpassen Dadurch wird diese Vorlage in einem neuen Tab geöffnet. Wir können nach unten scrollen, um die verschiedenen Seiten anzuzeigen, und natürlich können wir die verschiedenen Elemente in diesem Design anpassen, wenn wir dies wünschen. Okay, hier ist eine weitere Vorlage , die ich zuvor gefunden habe. Ich denke, das könnte auch für unsere Website funktionieren. Mir gefällt das Layout der Bilder für dieses Design. Und hier ist auch noch einer. Dafür gefallen mir auch das Layout und die Farben. Ich empfehle daher, viele dieser verschiedenen Vorlagen durchzugehen , um Sie zu Ideen für die Erstellung Ihrer eigenen Website zu inspirieren . Schauen wir uns diese Vorlage hier an. Dieser ist eigentlich anders. Aber wir können hier unten klicken, um die verschiedenen Seiten anzusehen , anstatt zu scrollen Klicken wir nun auf Diese Vorlage anpassen. Wenn wir diese Vorlage öffnen, fehlt uns die Vorschau-Schaltfläche. Wir haben nur die Schaltfläche Teilen. Das ist vielleicht nicht die bequemste, aber wir können sie trotzdem verwenden, um einige Designideen zu sammeln. Gehen wir hier zu dieser Vorlage und Sie können sehen, dass wir die Vorschau-Schaltfläche haben. Die Vorschau-Schaltfläche kann sehr nützlich sein, damit Sie sehen können, wie Ihre Website aussehen wird. Klicken wir zum Beispiel darauf und scrollen wir nach unten, um die Website anzuzeigen. Okay, schauen wir uns einfach kurz ein paar weitere Vorlagen an. Eine Sache, die ich empfehle, ist, alle Texte für Ihre Website in einem Dokument zu haben. Das könnte zum Beispiel ein Word-Dokument oder ein Google Doc sein. Hier habe ich also ein Google-Dokument, das alle Texte enthält, die ich der Website hinzufügen möchte. Okay, fangen wir an, die Website zu erstellen. Fangen wir damit an, diesen Titel zu kopieren. Also werde ich dieses Website-Design verwenden und das hier einfügen. Lass uns einfach die Größe ändern. Und jetzt fügen wir den Untertitel Also werde ich das kopieren und in das Textfeld unten einfügen in das Textfeld Ich möchte auch eine Schaltfläche mit Text haben, aber im Moment ist dieser gruppiert, also müssen wir die Gruppierung aufheben, um diesen Text und dieses Feld anzupassen Okay, jetzt ziehen wir diesen Text über das Feld. Und jetzt kopieren wir den Text und fügen ihn aus meinem Google-Dokument ein. Später werde ich dies zu einer anklickbaren Schaltfläche machen. Okay, lass uns einfach die Farbe dafür ändern. Ich möchte eher eine gelbe Farbe verwenden. Also lass uns diesen versuchen. Es ist ziemlich schwierig, den Text hier zu sehen, also ändern wir die Farbe des Textes in Schwarz. Jetzt kannst du das ganz einfach lesen. Okay, jetzt möchte ich eine Zeile hinzufügen. Lassen Sie uns also in den Elementen und der Form eine Linie wählen. Jetzt klicken wir hier oben auf die Schaltfläche Linienstil Ich möchte die Linie etwas dünner machen, also werde ich die Linienstärke verringern. Ziehen wir das nun nach unten, sodass es den Untertitel unterstreicht. Lassen Sie uns einfach die Größe ändern und das in die Mitte stellen. Und lassen Sie uns jetzt den Untertiteltext etwas größer machen. Okay, lassen Sie uns einfach die Größe der Zeile ändern. Und ich werde jetzt die Linienstärke erhöhen , da wir den Untertiteltext vergrößert haben Erhöhen wir einfach den Text für diese Schaltfläche, da wir etwas mehr Platz haben, und ändern wir einfach die Größe und passen den Haupttitel Okay, lassen Sie uns das Bild jetzt tatsächlich ändern. Löschen wir also dieses Bild, das wir hier haben , indem wir darauf klicken und auf Löschen klicken. Jetzt füge ich mein eigenes Bild hinzu. Klicken wir also auf Uploads und dann auf Hochladen und Bild oder Video Ich habe alle Bilder, die ich für diese Website verwenden möchte, dem Ordner auf meinem Desktop Lassen Sie uns das jetzt suchen, und das ist das Bild, das ich für den Homepage-Hintergrund verwenden möchte . Also lass uns das auswählen und das hinzufügen. Okay, lassen Sie uns die Größe einfach so ändern, dass es die Seite ausfüllt. Lassen Sie uns nun die Ebene ändern, da ich sie hinter dem Text und am unteren Rand haben möchte sie hinter dem Text und am unteren Rand haben Klicken wir also mit der rechten Maustaste auf das Bild und gehen wir zur Ebene und dann zur hinteren Mitte. Jetzt können wir die Form der Schaltfläche sehen. Okay, ich werde diese Zeile ein wenig nach oben verschieben dann klicken und die Maus über die Textzeile oder Schaltfläche ziehen , und dann ziehen wir sie nach unten. Der Grund dafür ist, dass ich das Medium Made Fun-Logo oben hier hinzufügen möchte . Also lass uns auf Uploads klicken und ein Bild oder Video hochladen. Jetzt füge ich dem Ordner auf meinem Desktop das Medium Made Fun-Logo hinzu Okay, lass uns klicken, um das hinzuzufügen. Und ich möchte den Hintergrund entfernen. Das Tool zum Entfernen von Hintergründen ist nur auf Canva Premium verfügbar Wenn Sie also eine kostenlose Version von Canva verwenden , können Sie diese nicht In diesem Kurs zeige ich Ihnen jedoch eine kostenlose Alternative dazu, falls Sie Canva Premium nicht verwenden Okay, also entferne jetzt den Hintergrund. Lassen Sie uns die Größe ändern und das neu positionieren. Ich möchte eigentlich eine Form hinter diesem Logo hinzufügen, damit das Logo ein bisschen besser hervorsticht Lass uns auf Elemente und unter Formen klicken. Ich werde einen Kreis wählen. Lassen Sie uns das neu positionieren und die Farbe ändern. Ich möchte dieselbe gelbe Farbe wie für die Schaltfläche „ Kurs anzeigen“ verwenden für die Schaltfläche „ Kurs anzeigen Okay, lassen Sie uns einfach die Größe ändern und mit der rechten Maustaste darauf klicken und zur Ebene gehen und dann auf Rückwärts senden klicken, und dann auf Rückwärts senden klicken da ich das hinter dem Logo haben möchte Lassen Sie uns das jetzt neu positionieren. Und Sie stellen fest, dass wir die gelbe Farbe des Logos nicht so gut erkennen können , da sie der gelben Farbe des Kreises sehr ähnlich ist Lassen Sie uns also tatsächlich eine dunklere gelbe Farbe wählen damit wir das Gelb des Logos etwas besser erkennen können. wir also unter Volltonfarben Wählen wir also unter Volltonfarben diese dunklere gelbe Farbe aus. Um die Konsistenz zu wahren, verwenden wir dieselbe Farbe auch für die Schaltfläche „Kurs anzeigen“. Allerdings bin ich mit genau dieser Farbe nicht allzu zufrieden. Lassen Sie uns also tatsächlich auf diese Schaltfläche zum Hinzufügen einer neuen Farbe klicken, damit ich die Farbe etwas weiter anpassen kann. Okay, lass uns einfach diese gelbe Farbe ändern. Und lass es uns hier haben. Und Sie können sehen, dass wir den Farbcode hier haben. Diese neue Farbe sollte im Bereich für die Dokumentfarben angezeigt werden . Wenn dies nicht der Fall ist, können Sie diesen Farbcode jederzeit kopieren und einfügen. Okay, lassen Sie uns dieselbe Farbe für diesen Kreis verwenden. Okay, jetzt möchte ich die Helligkeit und den Kontrast für dieses Hintergrundbild anpassen. Klicken wir also auf dieses Bild und dann auf Bearbeiten. Und jetzt klicken Sie auf Anpassen. Hier können wir also die Helligkeit und den Kontrast einstellen. Lassen Sie uns das etwas dunkler machen, also verringern wir die Helligkeit und versuchen wir es mit mehr Kontrast. dieses Bild anpassen, hebt sich der Text von der Masse ab, aber jetzt fügen wir dem Text einige Effekte hinzu, damit er besser zur Geltung kommt und etwas interessanter aussieht. Klicken wir also auf den Text und dann auf Effekte. Und jetzt klicken wir auf den Schattenstil. Lassen Sie uns den Schatten in Schwarz ändern. Und dafür passen wir den Offset und die Richtung an. Und lassen Sie uns die Transparenz auf 100 erhöhen , damit wir das klarer sehen können. Okay, jetzt ist unsere Homepage fertig. In diesem Video haben wir uns also Website-Vorlagen angesehen und unsere Homepage erstellt. Im nächsten Video setzen wir den Aufbau dieser Website fort. Also danke fürs Zuschauen und wir sehen uns dort. 6. Wir bauen eine Website in Canva – Teil 2: Okay, lassen Sie uns jetzt mit dem Aufbau dieser Website fortfahren. Zuvor haben wir die Homepage hinzugefügt, und jetzt werden wir eine weitere Seite hinzufügen. Auf der Vorlage, die wir verwenden, haben wir diese Seite hier. Ich möchte dieses Bild offensichtlich nicht verwenden , also löschen wir es. Dafür möchte ich nur einen kleinen Bereich mit etwas Text haben , also lassen Sie uns die Größe dieser Seite tatsächlich ändern Lassen Sie uns nun die Größe dieses Textfeldes ändern und es neu positionieren. Lassen Sie uns das noch kleiner machen, also ziehen wir es von unten und gehen wir jetzt zurück zu unseren Dokumenten und kopieren und fügen den Eines sollte noch erwähnt werden: Ich empfehle, Ihrem Design einen Namen zu geben , nur um die Dinge zu organisieren. Klicken wir also hier oben, um das umzubenennen. Okay, lassen Sie uns die Größe dieses Textfeldes einfach noch einmal ändern. Und lassen Sie uns die Fettschrift entfernen und diese Histaik so gestalten , dass sie hervorsticht und ein bisschen interessanter aussieht Lassen Sie uns das etwas kleiner machen und die Schriftart tatsächlich ändern Die Schrift, die ich im Sinn habe, heißt Inter. Also lass uns das wählen. Also im Moment die gesamte Schrift groß geschrieben. Klicken wir also hier auf diese Schaltfläche , damit nicht alles in Großbuchstaben geschrieben ist Es ist also wie das, was ich in meinem Dokument hatte. In diesem Feld unten werde ich also einen Text aus meinem Dokument kopieren und einfügen. Wie Sie sehen können, gibt es viel weniger Text, also werde ich ihn viel größer machen. Schauen wir uns an, wie der Text aussieht , wenn er in der Mitte ausgerichtet ist. Klicken wir also hier auf diese Schaltfläche, sodass sich der Text in der Mitte der Box befindet. Lassen Sie uns das neu positionieren. Ich denke, dieser Text sieht jetzt viel ausgewogener Ich möchte diesen Untertitel in zwei Zeilen haben. Also werde ich danach die Eingabetaste drücken , also ist es in zwei Zeilen Auch dafür möchte ich den Interfont verwenden. Wählen wir also alles aus, indem wir Command A auf dem Mac oder Control A unter Windows drücken Command A auf dem Mac oder Control A unter Windows und dann hier oben auf Font klicken Wählen Sie dann erneut die Eingabetaste. Das sieht jetzt viel konsistenter aus, da dieselbe Schriftart verwendet wird. Erhöhen wir einfach diese Schriftgröße und machen wir sie auch kursiv. Ich werde die Schriftart für den Titel anpassen und diese Seite nach oben ziehen, sodass sie noch kleiner ist, sodass wir einen kleineren Bereich für den Text haben. Ich möchte dafür keine ganze Seite haben, aber ich möchte diesen Titel und Untertitel anzeigen Und stellen wir sicher, dass das ausgewogen und in der Mitte ist. Jetzt haben wir unsere Homepage und diesen Bereich, den wir zwischen der nächsten Seite erstellt haben. Also lasst uns jetzt an der nächsten Seite arbeiten. Also das wird dieser Bereich hier sein. Für die nächste Seite werde ich mich von dieser anderen Vorlage inspirieren lassen. Ich möchte etwas Ähnliches haben. Also möchte ich ein Bild und etwas Text haben. Auch ähnlich wie diese Vorlage. Und schauen wir uns einige der anderen Vorlagen an. Aber ich denke, dieser hier war der beste. Lassen Sie uns also etwas Ähnliches erstellen. Dafür möchte ich Textfelder und Bilder haben. Für die Website-Vorlage, an der wir gerade arbeiten, werde ich dieses Hintergrundbild und auch diesen Text hier löschen . Und für den Hintergrund werde ich eine Volltonfarbe hinzufügen. Verwenden wir diese gelbe Farbe , die wir zuvor verwendet haben. Ich werde das alles auch hier löschen. Klicken wir also darauf und ziehen es mit der Maus darüber und drücken auf Löschen. Deshalb möchte ich ein Layout erstellen, das unseren Kurs und auch unseren YouTube-Kanal anzeigt. Also habe ich hier ein Bild über unseren Kurs. Also lass uns das vom Desktop aus hinzufügen. Bevor ich das mache, füge ich ein Quadrat hinzu, und das wird mir helfen, die Seite in vier Teile zu teilen. Klicken wir also darauf und ändern die Größe, sodass es ein Viertel der Seitengröße Klicken wir nun auf das Duplikat unten, und ich werde es unten links platzieren Lassen Sie uns die Größe dieser Quadrate noch einmal so dass sie genau ein Viertel der Seitengröße Okay, diese Seite hat also zwei schwarze Rechtecke und zwei gelbe Rechtecke und zwei gelbe Ich werde dieses Textfeld einfach kopieren und einfügen, und wir werden es für eines der Quadrate verwenden Lassen Sie uns das einfach in der Größe ändern und neu positionieren. Und dafür klicken wir hier auf die kursive Schaltfläche, da ich diese Kursivschrift nicht haben möchte Es unterscheidet sich also von dem obigen Text. Gehen wir nun zurück zu unserem Dokument und kopieren unseren nächsten Text und fügen ihn ein. In dieser Tux-Box geht es also um unseren Kurs. Lassen Sie uns nun unseren nächsten Text kopieren und einfügen , der weitere Informationen über den Kurs enthält Lassen Sie uns einfach die Größe dieses Textfeldes ändern und es neu positionieren. Ich werde den Titel fett formatieren, damit er ein bisschen besser zur Geltung kommt Nochmals, lassen Sie uns einfach die Größe ändern. Ich werde nur die Farbe ändern, damit sie sich vom obigen Text abhebt Dafür verwende ich diese weiße Farbe, aber ich könnte auch eine andere Farbe verwenden, damit sie ein bisschen besser zur Geltung kommt. Aber lassen Sie uns vorerst einfach diese weiße Farbe verwenden. Wählen wir auf der Startseite die Schaltfläche und den Text aus und duplizieren wir dies. Lassen Sie uns nun darauf klicken und es auf unsere neue Seite ziehen Lassen Sie uns nun die Farbe der Schaltfläche ändern. Ändern wir es einfach in diese graue Farbe. Und lassen Sie uns auch die Textfarbe auf Weiß ändern , damit wir sie etwas einfacher lesen können. Ich werde nur die Größe dieses grauen rechteckigen Felds da ich den Text länger hinzufügen werde Lassen Sie uns einfach die Größe dieses Textfeldes und es hierher ziehen und die Größe ändern, und lassen Sie uns auch die Größe dieses grauen Rechtecks ändern Es deckt also den gesamten Text ab. Lassen Sie uns nun diesen Text und das graue Feld auswählen und gruppieren. Also können wir das verschieben und beide bewegen sich zusammen. Halten wir einfach die Umschalttaste gedrückt und wählen beide aus. Und jetzt ändern wir die Größe, damit es dieses gelbe Rechteck ein bisschen mehr ausfüllt Ich werde die Gruppierung dieses Textfeldes hier oben einfach aufheben und den Untertitel etwas näher rücken Lassen Sie uns jetzt die Umschalttaste gedrückt halten und auf den Titel oben klicken und dann beide nach unten ziehen Ziehen wir nun auch den Text und die Schaltfläche nach oben, damit das Design etwas ausgewogener aussieht. Okay, lassen Sie uns jetzt ein Bild in dieses schwarze Quadrat einfügen. Denken Sie daran, dass wir dieses Design zuvor hochgeladen haben. Also lass uns einfach die Größe ändern und es zu diesem Quadrat hinzufügen. Ich möchte jedoch, dass es etwas interessanter aussieht, also werde ich dieses Design tatsächlich zu einem Modell hinzufügen Gehen wir also links zu Apps und geben wir das Modell ein Und klicken Sie auf Mockups. Hier haben wir also viele verschiedene Modelle, sodass dies dazu beitragen kann, dass unser Design etwas interessanter aussieht Dafür möchte ich es aber auf einem Laptop haben. also neben der Kategorie Computer Klicken wir also neben der Kategorie Computer auf CEO. Ich wähle einen dieser Laptops aus. Ich finde, dieser hier sieht ziemlich interessant aus. Also lass uns darauf klicken. Und jetzt können Sie sehen , dass unser Design auf diesem Laptop erschienen ist. Lassen Sie uns nun klicken und ziehen, um es neu zu positionieren und die Größe zu ändern. Es hat jedoch nicht ganz die richtige Größe. Aber eine Sache, die wir tun können, ist , diese rechteckige Form tatsächlich zu duplizieren und sie dann darüber zu ziehen. Das schwarze Rechteck bedeckt also das Design. Lassen Sie uns nun dieses Modell neu positionieren. Also klicke ich mit der rechten Maustaste auf dieses Mockup-Design und gehe dann zur Ebene und dann zur hinteren Mitte Also werde ich dieses schwarze Rechteck löschen da wir es nicht mehr benötigen Lassen Sie uns dieses schwarze Rechteck einfach in die gelbe Farbe ändern , die wir in unserem Design verwenden. Und ich werde dieses Modell einfach in der Größe ändern und neu positionieren, damit es in die Mitte kommt Okay, ich finde, das sieht ziemlich gut aus. Jetzt werde ich diese Blackbox in eine der Farben aus unserem Mockup-Design ändern eine der Farben aus unserem Mockup-Design Ich finde, diese graue Farbe hier sieht ziemlich gut aus. Und jetzt klicken wir auf Elemente und geben YouTube ein. Deshalb möchte ich über unseren YouTube-Kurs sprechen. Also werde ich ein Foto über YouTube finden. Ich denke, dieser hier ist geeignet. Also werde ich die Größe ändern und es über das untere linke Rechteck legen über das untere linke Rechteck Lass uns das einfach zurückschneiden, damit es die richtige Größe hat. Lassen Sie uns jetzt klicken und die Umschalttaste gedrückt halten und alle Textfelder und die Form auswählen. Und jetzt kopieren wir diese, fügen sie ein und ziehen sie in das untere rechte Rechteck. Jetzt kopiere ich die nächsten Texte aus unserem Dokument und füge sie ein. Lassen Sie uns vor dem Einfügen einfach die Gruppierung aufheben. Und jetzt fügen wir unseren Titel ein. Ich möchte das in zwei Zeilen haben da es nicht wirklich in eine Zeile passt. wir also die Eingabetaste in diesem Textfeld , um es in zwei Zeilen zu platzieren Okay, lassen Sie uns einfach die Größe ändern und das neu positionieren. Und jetzt ändern wir die Farbe dieses Textfeldes, damit wir es sehen können Wir haben hier also einige kontrastierende Farben. Im unteren rechten Rechteck haben wir den grauen Hintergrund mit dem gelben Textfeld und im oberen linken Rechteck haben wir den gelben Hintergrund mit dem grauen Textfeld Das erhöht den Kontrast, gleicht aber auch das Design aus Lassen Sie uns auch die Farbe der Schrift auf Schwarz ändern, damit Sie sie auf diesem gelben Hintergrund etwas besser lesen können . Lassen Sie uns nun den Text aus dem Dokument kopieren und in das nächste Textfeld Ich möchte zwei Zeilen von WhetSaysGraphic Design haben, und lassen Sie uns hier die Eingabetaste drücken, sodass es Lassen Sie uns das einfach in der Größe ändern und neu positionieren. Und jetzt positionieren wir auch das Textfeld und die Form darunter neu Textfeld und die Form darunter Lassen Sie uns nun den Text in der Box ändern. Gehen wir also zurück zu unserem Dokument und kopieren den nächsten Textsatz. Und jetzt fügen wir das in das Textfeld in der Form ein. Außerdem werden wir später Links zu diesen Feldern hinzufügen. Okay, das ist die nächste Seite dieser Website und das ist das Ende dieses Videos. Beim nächsten Video werden wir diese Website weiter aufbauen, danke fürs Zuschauen, und wir sehen uns dort. 7. Wir bauen eine Website in Canva – Teil 3: Okay, lassen Sie uns jetzt mit dem Aufbau dieser Website fortfahren. In einer Vorlage hier haben wir diese Seite. Schauen wir uns eine weitere dieser Vorlagen an. Schauen wir uns das hier an. Also möchte ich etwas Ähnliches haben. Für diese Seite möchte ich also ein Portfolio zeigen, also möchte ich einige der verschiedenen Dinge zeigen, die wir tun und die Medien lustig gemacht haben. Deshalb möchte ich hier einige Bilder haben , die diesem Design ähneln. Schauen wir uns diese Vorlage an. Also möchte ich auch so etwas erstellen. Okay, gehen wir zurück zu der Seite, an der wir gerade arbeiten, und ändern wir die Farbe für den Hintergrund dieser Seite. Klicken wir also auf diese Seite und gehen wir dann zu Farbe. Und lassen Sie uns einige der Farben von diesen Fotos ausprobieren. Wir können auf CA klicken, um alle Farben auf diesen Fotos zu sehen. Lassen Sie uns also einige davon ausprobieren. Aber dafür wählen wir tatsächlich unsere eigene Farbe. Klicken wir also hier auf Neue Farbe hinzufügen und wählen wir unsere eigene Farbe aus. Okay, ich finde das hier gut. Jetzt haben wir einen kleinen Kontrast zu der anderen grauen Farbe. Passen wir einfach die Größe dieses Textfeldes und platzieren wir den Text in der Mitte Und jetzt kopieren wir den Text aus unserem Dokument, fügen ihn ein und fügen ihn als Titel ein Lassen Sie uns die Farbe auf Weiß ändern, damit dies auf der Seite deutlich hervorsticht. Und lassen Sie uns jetzt auf all das klicken und ziehen und es löschen. Schauen wir uns unsere andere Vorlage an. Also möchte ich ein ähnliches Bild verwenden. Aber schauen wir uns die anderen Vorlagen an, und ich möchte eine ähnliche haben. Also lasst uns das kopieren und auf unsere Seite einfügen. Natürlich werde ich das Bild ändern, ich möchte ein Bild haben, das eine ähnliche Größe wie dieses hat. Lassen Sie uns das einfach zuschneiden und die Größe ändern, da ich acht davon auf diese Seite passen möchte Lassen Sie uns dieses Design kopieren und einfügen und ein weiteres hinzufügen. Und denk dran, ich möchte acht hinzufügen. Also lass uns das weitermachen. Lassen Sie uns nun auf diese klicken und sie ziehen und sie in die Mitte verschieben Lassen Sie uns die Größe ändern und sie neu positionieren Denken Sie daran, dass ich acht davon hinzufügen möchte. Lassen Sie uns hier also etwas mehr Platz für mehr schaffen. Und lassen Sie uns auf all diese klicken und mit der Maus darüber ziehen. Und jetzt drücken wir die Taste zum Duplizieren. Und jetzt können Sie sehen, dass wir acht davon haben. Lassen Sie uns diese einfach neu positionieren , sodass sie gleichmäßig verteilt sind. Und lassen Sie uns sie einfach leicht nach oben verschieben. Und auch der Titel. Lassen Sie uns etwas mehr Platz schaffen, also ziehen wir hier nach unten. Und lassen Sie uns diese Bilder einfach ein wenig nach unten verschieben. Und jetzt möchte ich unten einige Schaltflächen hinzufügen. Kopieren wir also diese Schaltfläche und fügen sie hier ein und ändern wir die Größe, sodass wir für jedes dieser Bilder eine Schaltfläche haben für jedes dieser Bilder eine Schaltfläche Okay, lassen Sie uns dieser Schaltfläche etwas Text hinzufügen. Gehen wir also zurück zu unserem Dokument und fügen den nächsten Text hinzu. Lassen Sie uns das jetzt kopieren und einfügen. Und lassen Sie uns das nächste Textfeld umbenennen. Lassen Sie mich das zuerst neu positionieren. Lassen Sie uns zu unserem Dokument zurückkehren und den nächsten Text kopieren und einfügen Lassen Sie uns nun dieses Feld kopieren und einfügen. Wenn Sie möchten, können wir auch eine Schaltfläche zum Duplizieren können wir auch eine Schaltfläche zum Duplizieren verwenden, anstatt Kopieren und Einfügen zu verwenden. Wir können auch klicken und die Umschalttaste gedrückt halten und dann auf Mehr klicken, um mehrere Elemente auszuwählen. Jetzt können Sie diese Schaltfläche zum Duplizieren drücken, wodurch diese vier Felder dupliziert werden Ziehen wir das nun unter die nächsten vier Bilder. Okay, lassen Sie uns den nächsten Text hinzufügen, also kopieren wir ihn und fügen ihn aus unserem und dem nächsten Dokument ein. Und wieder für die fünfte Box. Dann für die Sechs-Box. Dann siebte Kiste. Und achte Kiste. Ich glaube, es ist wichtig, dass Sie alle Ihre Texte fertig haben , bevor Sie mit dem Aufbau Ihrer Website beginnen. Okay, lassen Sie uns jetzt unsere eigenen Bilder hinzufügen und dann auf Bild oder Video hochladen klicken. Hier auf dem Desktop habe ich mein nächstes Bild, das ich hier hinzufügen möchte. Lass uns das jetzt anklicken und über das Bild ziehen. Klicken wir erneut auf Bild oder Video hochladen und wählen wir das nächste Bild aus. Ziehen wir das jetzt auf das zweite Bild. Lassen Sie uns das einfach neu positionieren und jetzt auf Bild oder Video hochladen klicken und das dritte Bild hinzufügen Lassen Sie uns das erneut anklicken und ziehen , um es neu zu positionieren Machen wir jetzt dasselbe für das vierte Bild. Lassen Sie uns einfach die Größe ändern und es neu positionieren , weil wir wollen, dass diese Bilder ausgewogen Und lassen Sie uns das jetzt für das fünfte Bild machen. Lassen Sie uns einfach die Größe ändern, damit wir ein bisschen mehr von diesem Buch sehen können Lassen Sie uns das etwas drehen, da ich denke, das wird ein bisschen besser aussehen Okay, machen wir dasselbe für die sechs Bilder. Ich kann hier nicht den gesamten Laptop sehen, also werde ich die Größe ändern damit wir mehr vom Laptop sehen können Und für dieses Beispiel werde ich dieses Bild tatsächlich etwas breiter machen , da es immer noch vom Laptop abgeschnitten wird Lassen Sie uns das Bild oben auch breiter machen , damit es ausgewogen ist Ich mache das mit allen Bildern, damit sie alle die gleiche Größe haben, weil es ein bisschen seltsam aussehen könnte , wenn es nur zwei Bilder gibt , die größer sind als die anderen. Eines der großartigen Dinge an Canva ist, dass dir, wenn du die Größe eines Bilds änderst, die genaue Größe angezeigt wird Du musst also nicht raten, um sicherzugehen , dass es dieselbe Größe hat Sie können anhand dieser Zahlen erkennen , dass es dieselbe Größe hat. Lassen Sie uns das Gleiche auch für diese Textfelder unten tun. Lassen Sie uns sie etwas breiter machen, damit sie der Größe der obigen Bilder entsprechen. wir außerdem sicher , dass sich der Text in der Mitte des Felds befindet , damit er ausgewogen aussieht. A Lassen Sie uns diesen Text und das Feld einfach gruppieren diesen Text und das Feld , weil es sich an der richtigen Position befindet. Und wenn wir es gruppieren, wird es uns davon abhalten, Dinge nach Umfang zu verschieben. Ich habe derzeit also keine Bilder für das Webdesign oder die Gestaltung von Lebensläufen, aber das werden sie in Zukunft hinzufügen. Im Moment ist diese Website noch in Arbeit. Und denk dran: Wenn du eine Seite oder Website in Canva erstellst, kannst du später jederzeit darauf zurückkommen Du musst nicht alles auf einmal erledigen. Okay, das ist also der Bereich für kreative Arbeit oder Portfolio der Website. Wenn Sie Links zu verschiedenen Websites haben, können Sie diese Schaltflächen jederzeit hier verlinken. Ich werde Ihnen später zeigen, wie Sie Links hinzufügen können. Okay, damit ist dieses Video beendet. Als Nächstes werden wir mit dem Aufbau dieser Website fortfahren. Also danke fürs Zuschauen und wir sehen uns dort. 8. Wir bauen eine Website in Canva – Teil 4: Okay, lassen Sie uns jetzt weiter an dieser Website arbeiten. Als Nächstes möchte ich eine Seite „Über uns“ erstellen. Schauen wir uns einige der anderen Vorlagen an. Ich bin an keiner von diesen interessiert für das, was ich gerade will. Schauen wir uns die andere Vorlage an. Das Gleiche gilt für dieses. Es gibt hier wirklich nichts, was ich will. Und schauen wir uns die andere Vorlage an. So etwas ist ziemlich gut, aber ich möchte ein Bild haben , um es ein bisschen persönlicher zu machen. Wie gesagt, ich möchte, dass dies eine Seite über uns ist. Also werde ich all diese Kontaktdaten anklicken und ziehen und löschen, und lassen Sie uns dieses Hintergrundbild tatsächlich löschen. Klicken wir hier auf Farbe und ändern wir die Farbe des Hintergrunds. Wählen wir dafür einen weißen Hintergrund. Lassen Sie uns jetzt eine weitere Seite hinzufügen, und ich werde diese letzte Seite viel kürzer machen, da dies das Material sein wird , das ich später hinzufügen werde. Ändern wir die Fotofarbe in diese graue Farbe und erstellen wir nun die Seite „Bei uns“. Dafür möchte ich ein Textfeld haben, dieses Textfeld kopieren und hier einfügen Kopieren wir also dieses Textfeld und fügen es auf unserer Seite ein. Lassen Sie uns die Farbe ändern , da die Farbe des Textes weiß ist und wir ihn derzeit nicht sehen können Also lass es uns auf Schwarz ändern. Ich möchte nicht, dass dieser Text zentriert ist. Klicken wir hier oben auf diese Schaltfläche, und jetzt befindet sich der Text links neben dem Feld. Okay, lassen Sie uns jetzt zu unserem Dokument zurückkehren und den nächsten Text kopieren und einfügen. Das wird also unser Titel für diese Seite sein. Also lass uns das kopieren und hier einfügen. Denken Sie daran, dass Sie mit Control C unter Windows oder Command C und Mac kopieren und mit Control V unter Windows oder Command V auf Mac einfügen können Control C unter Windows oder Command C und Mac kopieren und mit Control V . Ich möchte das auch in zwei Zeilen haben . Also werde ich vor diesem Wort hier die Eingabetaste drücken. Lassen Sie uns das einfach neu positionieren und seine Größe ändern. Und jetzt fügen wir ein Bild hinzu. Klicken wir also auf Uploads und laden dann ein Bild oder Video Jetzt werden wir ein Foto von mir hinzufügen. Wenn Sie also ein Foto von sich auf Ihrer Website haben möchten , empfehle ich, ein professionelles Foto zu machen. Dies kann dazu beitragen, die Glaubwürdigkeit zu erhöhen und Sie viel professioneller aussehen zu lassen Jetzt möchte ich ein weiteres Textfeld hinzufügen Klicken wir also auf der anderen Seite auf diesen Text und fügen ihn hier Auch hier ist es in Weiß, also ändern wir es in Schwarz. Ich möchte auch, dass der Text links ausgerichtet ist, also klicken wir hier auf diese Schaltfläche , damit er nicht mehr zentriert ist. Ich möchte auch ein anderes Textfeld haben, also werde ich hier die Schaltfläche „Duplizieren“ drücken , um dieses Textfeld zu duplizieren Gehen wir jetzt zu unserem Dokument und kopieren und fügen den nächsten Also als nächstes kommt mein Name. Ich werde das nur ein bisschen größer machen. Und lassen Sie uns das auch fett und kursiv machen , damit es hervorsticht und ein bisschen anders aussieht. Und jetzt gehen wir zum Dokument und kopieren den nächsten Text. Und lassen Sie uns das in das nächste Textfeld einfügen. Ich möchte das auch kursiv haben, damit es hervorsticht und etwas interessanter aussieht, aber lassen wir es nicht fett, damit es sich vom obigen Text unterscheidet Auch hier möchte ich ein weiteres Textfeld haben, also lassen Sie uns das duplizieren Für diesen nächsten Text möchte ich ihn nicht kursiv haben, und ich möchte den Text viel kleiner haben , da ich hier viel mehr Text hinzufügen werde Gehen wir also zu unserem Dokument über und kopieren den nächsten Text. Und lassen Sie uns das in das Textfeld einfügen. Lassen Sie uns das einfach in der Größe ändern und neu positionieren. Und ich möchte, dass dieses Textfeld mit einem Foto übereinstimmt Dafür möchte ich, dass der Text einen bestimmten Abstand hat. Klicken wir also hier oben auf die Ausrichtungsschaltfläche und wählen Sie eine Leerzeichen-Textausrichtung Okay. Ich finde, das sieht jetzt etwas ausgewogener aus. Und noch einmal, lassen Sie uns einfach die Größe ändern und diesen Text neu positionieren. Lassen Sie uns das Bild einfach verschieben damit es etwas ausgewogener ist, und lassen Sie uns die Größe ändern und es erneut neu Das ist also eine ziemlich einfache Seite, aber ich finde, sie sieht ziemlich effektiv und sie ist gut gestaltet und ausgewogen Ziehen wir hier einfach die Fußzeile nach oben , weil wir den ganzen leeren Platz unten nicht brauchen Lassen Sie uns auch einfach die Seiten dieses Fotos neu positionieren und zuschneiden , da wir an der Seite etwas Totraum haben Okay, das ist also der Abschnitt über einen. Als Nächstes werden wir eine Fußzeile erstellen und einige Links hinzufügen, was wir im nächsten Video tun werden Also danke fürs Zuschauen und wir sehen uns dort. 9. Wir bauen eine Website in Canva – Teil 5: Okay, lassen Sie uns jetzt eine Fußzeile hinzufügen und einige Links zu dieser Also haben wir hier zuvor diesen Fußzeilenbereich erstellt. Wir können hier nach oben oder unten ziehen , um die Größe der Seite zu ändern Für diese Fußzeile möchte ich das Textfeld hinzufügen. Gehen wir also hierher und suchen das Textfeld und kopieren es mit Befehl C. Jetzt fügen wir es ein und positionieren es in der Mitte neu Gehen wir nun zurück zu unserem Dokument, und hier möchte ich die Copyright-Informationen für die Website einfügen die Copyright-Informationen für die Also lasst uns das kopieren und in dieses Textfeld einfügen. Lass uns das einfach etwas nach unten verschieben . Und jetzt fügen wir einige Symbole hinzu. Hier möchte ich einige Social-Media-Symbole hinzufügen , die auf andere Websites verweisen können. Lassen Sie uns zunächst ein YouTube-Symbol finden, das auf den YouTube-Kanal „Media Make Fun“ verweist. Geben wir also in den Elementen das YouTube-Symbol ein. Und lass uns dieses hier auswählen. Ich möchte auch die Farbe ändern, also klicken wir auf Farbe und ich möchte sie in Weiß ändern , und ich möchte sie in Weiß ändern damit sie mit dem Text unten übereinstimmt. Natürlich ist das YouTube-Symbol rot, aber ich denke, dass die Verwendung von Weiß viel besser zu diesem Design passt. Okay, lassen Sie uns einfach die Größe ändern und es neu positionieren und jetzt fügen wir ein weiteres Symbol Auch hier möchte ich das als kreisförmiges Symbol haben, also geben wir auch den Kreis ein also geben wir auch den Okay, der hier sieht gut aus. Und wieder möchte ich die Farbe auf Weiß ändern. Klicken wir also auf Farbe und dann erneut auf Weiß. Lass uns auf das YouTube-Symbol klicken und es über das YouTube-Symbol lenken und Größe ändern, damit wir es exakt auf die gleiche Größe bringen können Jetzt sind sich diese Icon-Designs also sehr ähnlich. So können wir diese Symbole mit unserem Kurs und auch mit unserem YouTube-Kanal verknüpfen . Lass uns jetzt rauszoomen und einen Blick auf unsere Website werfen. Wir haben also eine Homepage, Informationen über unseren Kurs und YouTube-Kanal, dann haben wir einen Portfolio-Bereich und über einen Bereich und ein Futter. Dies ist eine sehr einfache Website, aber wenn du eine einfache Website wie diese erstellen möchtest , kann Canva großartig sein Wenn Sie eine komplexere Website wünschen, möchten Sie vielleicht etwas wie WordPress oder einen anderen Website-Builder verwenden , der mehr Funktionen bietet Aber wie gesagt, wenn du einfach etwas Einfaches willst , kann Canva großartig sein Okay, lass uns jetzt ein paar Links hinzufügen. Für diese Schaltfläche hier möchte ich also einen Link zum Kurs hinzufügen. Also hier habe ich einen Link zum Kurs in meinem Dokument. Und lass uns mit der rechten Maustaste darauf klicken und zu Link gehen. Und jetzt können wir unseren Link einfügen. Wenn die Leute darauf klicken, wird es zu unserem Kurs weitergeleitet. Sie können hier also sehen, dass dies unser THL-Link ist. Sie werden feststellen, dass der Text nach dem Hinzufügen des Links unterstrichen wurde. Drücken Sie dann die Unterstreichungstaste, damit er nicht unterstrichen wird Lassen Sie uns diesen Button jetzt hier verlinken. Das geht auf unseren YouTube-Kanal. Hier haben wir den Link zu unserem YouTube-Kanal. Und noch einmal, lass uns mit der rechten Maustaste auf diese Schaltfläche klicken und zu Link gehen und ihn dann hier einfügen. Ich möchte auch nicht, dass dieser Text unterstrichen wird. Drücken wir also die Unterstreichungstaste, damit der Text nicht unterstrichen wird Okay, lassen Sie uns einige Links zu den Symbolen im Futter hinzufügen. Wählen wir also dieses YouTube-Symbol hier aus, indem wir darauf klicken. Und jetzt klicken wir mit der rechten Maustaste und gehen zu Link. Lassen Sie uns erneut den Link zum YouTube-Kanal hier einfügen und auf Fertig klicken. Machen wir jetzt dasselbe für dieses andere Symbol. Gehen wir zurück zu unserem Dokument und kopieren den Link für den Kurs. Klicken wir also mit der rechten Maustaste darauf, gehen wir zu Link, fügen diesen und hier ein und wählen Fertig. Schließen wir einfach diesen Tab an der Seite und schauen wir uns unsere vollständige Website an. Wir können uns auch eine Vorschau davon ansehen, indem hier oben auf die Vorschau-Schaltfläche klicken. Lassen Sie uns vorerst einfach die Option Navigationsmenü einbeziehen deaktivieren. Sie haben bemerkt, dass wir hier unten dieses Kontrollkästchen für das Navigationsmenü einbeziehen Sie können also hier oben sehen, dass wir diese verschiedenen Tabs haben und diese nicht wirklich mit unserer Website übereinstimmen. Wir können die Größe auch für Mobilgeräte ändern. Und für das Handy haben wir das Navigationsmenü, wenn wir oben rechts auf diese Schaltfläche drücken Was wir jetzt tun wollen, ist das Navigationsmenü zu ändern. Lassen Sie uns also das Navigationsmenü mit unserer Website abgleichen. Lassen Sie uns also diese Vorschau schließen. Wir können das Navigationsmenü ändern indem wir hier unten auf Notizen klicken. Lernen Sie für diesen Abschnitt hier also von Experten. Ich werde das kopieren und als Seitentitel der Notizen einfügen. Also das wird jetzt Teil des Navigationsmenüs sein. Gehen wir also zu dieser anderen Seite hier, auf der ich die Projekte zeige. Und in den Notizen nennen wir diese Seite Projekte. Gehen wir nun hier zur nächsten Seite, da diese Informationen über den Kurs und den YouTube-Kanal enthält. Wir könnten es auch Inhalt oder Kurse nennen. Aber dafür nennen wir es Kontakt. Und wenn wir jetzt hier auf die erste Seite klicken, heißt es Zuhause, und lassen wir diese Seite zu Hause. Okay, lassen Sie uns die Notizen schließen. Und jetzt klicken wir auf die Vorschau-Schaltfläche. Gehen wir zur Desktop-Ansicht und Sie können sehen, wie das Navigationsmenü mit unseren Seiten übereinstimmt. Okay, das ist also nur eine sehr schnelle Möglichkeit eine Website in Canva zu erstellen Canvas Website Builder ist ziemlich einfach, aber wenn Sie eine einfache Website erstellen möchten, kann dies sehr nützlich sein Wie gesagt, wenn Sie etwas Komplexeres erstellen möchten, möchten Sie vielleicht Wordpress oder einen anderen Website-Builder verwenden , mehr Funktionen und Merkmale bietet. Aber für eine Website, wie ich sie hier entworfen habe, kann Canva meiner Meinung nach großartig sein Okay, damit ist dieses Video beendet. Wir haben uns mit dem Aufbau dieser Website befasst. Ich hoffe, Sie fanden diesen Abschnitt nützlich, und wir sehen uns im nächsten. 10. Deine Website in Canva veröffentlichen und eine benutzerdefinierte Domain verknüpfen: In dieser Lektion erfahren Sie, wie Sie eine Website mit Canva kostenlos veröffentlichen wie Sie sie mit einer benutzerdefinierten URL oder über Go Daddy und Canva veröffentlichen einer benutzerdefinierten URL oder über Go Daddy und Okay, schauen wir uns jetzt die Veröffentlichung unserer Canva-Website an Also werde ich Ihnen zeigen, wie Sie Ihre Website veröffentlichen können, die eine Canva-Domain verwendet, und ich werde Ihnen zeigen, wie Sie eine benutzerdefinierte Domain verwenden , die wir mit Go Daddy verknüpfen Wenn du die benutzerdefinierte Domain verwenden möchtest, ist diese nur für Canva Pro-Benutzer verfügbar Okay, also zuerst zeige ich dir die Autobahn. Also werde ich dieses Design hier mit einer Autobahn veröffentlichen, die eine Canva-Domain verwendet Also müssen wir nur rüber gehen, um die Website hier oben rechts zu veröffentlichen, und ich empfehle, die Größenänderung auf dem Handy zu überprüfen Und dafür werde ich auch die Navigationsleiste einbauen die Navigationsleiste einbauen Geben Sie dann als Website-URL den Namen Ihrer Website ein. Wie gesagt, dies wird eine Canva-URL sein, also alles, was Sie in Herem Dot Canva Dot Site eingeben Herem Dot Canva Dot Site Du kannst dir also nichts aussuchen, manche Dinge werden mitgenommen Wenn ich zum Beispiel MMF eintippe, können Sie sehen, dass diese URL nicht verfügbar ist Aber wenn Sie Media Made Fun eingeben, können Sie sehen, dass es verfügbar ist Denken Sie also daran, es heißt Media Made Fun, Punkt auf meinen Punkt, Cava Dot Sit Also lasst uns jetzt auf die veröffentlichte Website klicken. Und das Laden kann einen Moment dauern. Und los geht's. Es heißt, dass unsere Website jetzt live ist. Also können wir das kopieren und einfügen. Und du kannst sehen, dass es live ist. Und Sie können hier auch auf Website anzeigen klicken, um zu unserer Dotm Dot Cava Dot Site-Website zu gelangen Okay, lassen Sie uns das vorerst schließen und lassen Sie mich Ihnen zeigen, wie Sie dieses nächste Design mit einem GoDaddy-Domainnamen verknüpfen Das ist also das andere Design. Und für dieses werde ich es mit meiner GoDaddy-Domain verknüpfen es mit meiner GoDaddy-Domain Wenn Sie keine benutzerdefinierte Domain haben , ist diese nicht relevant Und diese nächste Methode ist nur für Cava Pro-Benutzer verfügbar Also ich habe meine Godaddy-Website hier und unter Demins kannst du sehen, dass meine Domain Okay, jetzt gehen wir zu einer veröffentlichten Website. nun unter der URL der Website Klicken wir nun unter der URL der Website hier auf die Schaltfläche Bearbeiten. Jetzt klicken wir auf Get a New Domain. Wir können also darauf klicken, um unsere eigene Domain zu verwenden , oder wir können eine neue Domain kaufen. Dafür werden wir jedoch unsere eigene Domain verwenden. Und wie Sie hier sehen können, haben wir dieses Kronensymbol, was bedeutet, dass es nur für Canva Pro-Benutzer verfügbar Da wir Canva Pro verwenden, wählen wir dieses aus und klicken dann auf Weiter Hier können wir also unsere Domain eingeben. Denken Sie daran, bei Go Daddy war es mediamdfun.com. Also lass uns das kopieren und hier einfügen. Jetzt klicken wir auf Weiter und jetzt müssen wir uns mit Go Daddy verbinden. Klicken wir jetzt auf Login und Auto Connect. Und jetzt heißt es, verbinde tomdimadefun.com und ändere die DNS-Einträge deiner Domain Deshalb werde ich dafür auf Connect klicken. Okay, jetzt heißt es mediumadefun.com. Es ist jetzt deine Canva-Domain. Also klicken wir jetzt auf Schließen und unsere Domain sinkt jetzt So steht es hier, es ist normalerweise innerhalb von 20 Minuten erledigt, kann aber in einigen Fällen bis zu 72 Stunden dauern Wir erhalten auch eine E-Mail, wenn es fertig ist. Okay, lass uns jetzt auf Hughes's Domain klicken. Und jetzt können wir hier zu diesem Dropdown-Pfeil gehen und unsere kostenlose Domain auswählen, oder wir können hier unsere benutzerdefinierte Domain auswählen Also werde ich dafür unsere benutzerdefinierte Domain wählen. Auf Wunsch können wir auch einen Unterpfad hinzufügen, und ein Unterpfad ist Teil der URL, die nach der Hauptdomain steht normalerweise zur Organisation von Inhalten innerhalb der Website verwendet wird Zum Beispiel medmadfun.com Slash Blog. Dafür lasse ich dieses Feld jedoch leer. Wir haben hier auch einige Einstellungen denen wir unsere Website beschreiben können. Also habe ich hier einfach geschrieben: Lasst uns dafür sorgen, dass Learning Media Spaß macht. Okay, jetzt klicken wir auf Website veröffentlichen. Und das Laden wird einen Moment dauern. Jetzt heißt es also, dass Ihre Website bald online sein wird. Wir können also hier klicken, um eine Vorschau der Website anzuzeigen. Sie können hier sehen, dass es sich nicht um die URL handelt, die Spaß an Medien gemacht hat. Möglicherweise müssen wir warten, bis dies live ist. Kopieren wir es also über diese URL und fügen es in einen neuen Tab ein. Und du kannst sehen, dass es noch nicht fertig ist. Also müssen wir alle warten, bis das live ist. Okay, jetzt sind es ungefähr 12 Stunden und Sie können sehen, dass unsere Website live ist. Eine Sache, die Sie erwähnen sollten, ist, dass der Name Ihrer Website in einem Tab hier oben tatsächlich mit dem Titel Ihres Canva-Projekts identisch sein wird Titel Ihres Canva-Projekts identisch Stellen Sie also sicher, dass Sie Ihr Canva-Projekt entsprechend benennen. Wenn du nicht den richtigen Namen hast, kannst du dein Design jederzeit bearbeiten und deine Website dann erneut veröffentlichen Dieser Name wird dann als Name deiner Website aktualisiert Okay, so können Sie Ihre Website veröffentlichen indem Sie die kostenlose My Dot Cava-Dot-Seite verwenden und Ihre Cava-Website mit Ihrer benutzerdefinierten Go Dadi-Domain verknüpfen mit Ihrer benutzerdefinierten Go Ich hoffe, Sie fanden dieses Video nützlich, und ich werde mir das nächste ansehen 11. Erstelle eine Mailchimp-Anmeldeseite und verlinke sie mit deiner Canva-Website: Okay, in dieser Lektion werden wir uns ansehen, wie Sie Mel Chimp mit Ihrer Canva-Website verknüpfen, um Kunden-E-Mails Ihrer Canva-Website zu erfassen. Also, was ist Melhim? Melchim ist eine Marketingplattform, die hauptsächlich für E-Mail-Marketing entwickelt wurde Es hilft Einzelpersonen und Unternehmen, E-Mails an ihr Publikum zu senden und deren Leistung zu verfolgen Beliebt bei kleinen und mittleren Unternehmen. Es beinhaltet auch Funktionen wie das Erstellen von Landingpages. In diesem Video zeige ich Ihnen, wie Sie Mailchimp mit Ihrer Cava-Website verknüpfen, um benutzerdefinierte E-Mails zu erfassen Mit der richtigen Einrichtung können Sie eine E-Mail-Liste erstellen, um für Ihre Produkte oder Dienstleistungen zu werben und die direkte Kommunikation mit Ihrer Zielgruppe aufrechtzuerhalten direkte Kommunikation mit Ihrer Zielgruppe Okay, jetzt zeige ich dir, wie du ein Anmeldeformular auf Mailchimp erstellst und es dann mit deiner Canva-Website verlinkst Im Moment bin ich auf milchip.com und habe Die kostenpflichtige Version von Mailchimp bietet zwar mehr Features und Funktionen, aber lassen Sie uns das einrichten, indem wir einfach Also Mailchimp, du musst eine Zielgruppe einrichten, und das ist eine Liste mit E-Mail-Adressen und Namen von Personen, die deiner Mailingliste beitreten möchten Sobald Sie also eine Zielgruppe eingerichtet haben, gehen Sie zu Und jetzt klicken wir auf Neues Formular erstellen. einem Anmeldeformular können Kunden also ihre E-Mail-Adresse und auch ihren Namen eingeben Dieser wird dann automatisch zu Ihrer Zielgruppe hinzugefügt. Wir haben hier also ein paar verschiedene Typen. Die einfachste ist eine Landingpage für die Anmeldung. Dadurch wird also eine Landingpage erstellt, wir dann mit unserer Canva-Website verknüpfen können Also lass uns darauf klicken. Also nenne ich dieses Medium Made Fun Signup und klicke dann auf Continue to Builder Dann haben wir hier verschiedene Vorlagen. Aber nur um es einfach zu halten, werde ich auf diese klicken, was Ihre Liste erweitert. Aber wenn Sie möchten, können Sie hier eine dieser Vorlagen auswählen. Das ist vielleicht etwas stylischer, aber um es einfach zu halten, verwenden wir dieses hier. Okay, jetzt können wir dieses Anmeldeformular anpassen. Wir können Textfelder so mit der Maus überziehen. Und wir können auch über das Bildfeld ziehen und Bilder hinzufügen, wenn Sie möchten Wenn Sie mit der Maus über das Feld fahren, können wir hier auf diese vier Pfeile klicken und sie durch Ziehen neu anordnen, oder wir können hier auf das Papierkorbsymbol klicken, um sie zu löschen Lassen Sie uns das für dieses Beispiel löschen. Ich werde hier tatsächlich ein Logo hinzufügen, damit die Leute, wenn sie auf diesen Link klicken, wissen, dass er Teil von Media Make Fun ist , weil sie unser Logo sehen können. Lass uns hier auf das Bearbeiten-Symbol und dann auf Logo hochladen klicken. Und dann klicken Sie auf Hochladen. Und hier habe ich mein Logo als PNG-Datei. Und jetzt klicken wir auf Öffnen, und das wird dieses Logo hochladen. Das ist natürlich zu groß, aber wir können die Größe hier anpassen. Ich werde es aber ungefähr in dieser Größe haben. Dann können wir auf Speichern und Schließen klicken. Ich werde nur dieses Textfeld löschen , das ich zuvor hinzugefügt habe Klicken wir also auf das Papierkorbsymbol und dann auf Löschen. Und jetzt füge ich hier einen Titel hinzu. Also werde ich unserer Mailingliste beitreten und dann auf Speichern und schließen klicken. Dann werden wir hier weitere Informationen hinzufügen. Klicken wir also hier auf dieses Stiftsymbol , um dieses Textfeld zu bearbeiten Deshalb habe ich hier Ihren Namen und Ihre E-Mail-Adresse eingegeben, um in unsere Mailingliste aufgenommen zu werden , wo Sie E-Mails über unsere neuesten Nachrichten und Angebote Okay, dann werde ich speichern und schließen. Und dafür möchte ich eigentlich sowohl den Namen als auch die E-Mail-Adresse hinzufügen . Klicken wir also hier auf die Schaltfläche Bearbeiten. Und Sie können hier sehen, dass wir diese Checkboxen für Vor- und Nachnamen Ich denke also, dass es wichtig ist, den Namen oder zumindest den Vornamen zu erfassen, dann können Sie ihren Namen jederzeit zur E-Mail-Adresse hinzufügen , damit es persönlicher wirkt Okay, das ist ein sehr einfaches Anmeldeformular, aber ich denke, für dieses Beispiel ist es in Ordnung. Klicken wir also erneut auf Speichern und Schließen und Speichern und Schließen. Und dann haben wir diese nächste Seite hier, und Sie können hier unter Zielgruppe und Tags sehen , dass Kontakte zu Media Maed Fun hinzugefügt werden , also der Zielgruppe oder Liste , die ich zuvor eingerichtet habe. Wenn die Person ihre E-Mail-Adresse und ihren Namen eingibt, wird auch eine Bestätigungsnachricht angezeigt. Wir können hier auf Design bearbeiten klicken , um die Bestätigungsnachricht zu bearbeiten. Sie können also jetzt sehen, dass es sich um dasselbe Anmeldeformular handelt, aber wenn Sie hier auf die Schaltfläche Bearbeiten klicken , können wir sehen, dass es hier steht. nach dem Absenden des Formulars Besuchern nach dem Absenden des Formulars eine Bestätigungsnachricht Dann können wir unsere Bestätigungsnachricht hier aktualisieren , wenn wir dies wünschen. Ich denke, die Standardeinstellung ist in Ordnung. Sie können dies jederzeit ändern, wenn Sie möchten. Wir können auch auf „ Bestätigungsnachricht in der Vorschau anzeigen“ klicken , um dies hier zu sehen. Okay, das ist alles in Ordnung. Und lass uns auf Kleidung speichern klicken. Und jetzt werde ich dieses Anmeldeformular veröffentlichen. Klicken wir also hier auf Veröffentlichen. Und dann können Sie hier sehen, dass wir unsere URL haben. Klicken wir also mit der rechten Maustaste darauf und gehen wir zu Kopieren. Und jetzt kehren wir zu unserer Canva-Seite zurück. Wir haben diese Website bereits veröffentlicht, aber wenn wir dieses Design bearbeiten, müssen wir es erneut veröffentlichen, was in Ordnung ist Klicken wir also auf Design bearbeiten. Also werden wir jetzt eine neue Seite hinzufügen. Klicken wir also hier auf diese Schaltfläche, Seite hinzufügen. Und das ist ein bisschen groß, also lassen Sie uns einfach die Größe ändern. Dann füge ich ein anklickbares Textfeld in dem die Leute zu unserem Anmeldeformular weitergeleitet werden Lassen Sie uns also in den Elementen eine Form hinzufügen . Wählen wir diesen hier aus. Und jetzt zum Text, lassen Sie uns ein Textfeld hinzufügen . Also habe ich einfach eingetippt Klicken Sie hier, um unserer Mailingliste beizutreten. Lassen Sie uns den gesamten Text hier auswählen und die Farbe ändern. Jetzt ändern wir das auf Weiß und ziehen es dann hierher, damit Sie diesen Text sehen können. Jetzt klicke ich hier auf dieses Textfeld und dann auf Duplizieren Und ich gebe „Treten Sie unserer Mailingliste bei, um die neuesten Nachrichten und Angebote Okay, legen wir das in die Mitte und ziehen wir einfach über beide , um es nach unten zu verschieben. Und lassen Sie uns das einfach etwas kleiner machen und den ganzen Text hier auswählen und die Farbe ändern, damit er ein bisschen besser zur Geltung kommt. Lassen Sie uns für dieses Beispiel einfach Schwarz wählen. Klicken wir jetzt mit der rechten Maustaste auf diese Form und gehen wir jetzt zu Link. Jetzt füge ich die URL für das Anmeldeformular für männliche Schimpansen Okay, also lass uns auf „Fertig“ klicken. Und dann drücken Sie erneut eins. Machen wir dasselbe auch für den Text. Klicken wir also mit der rechten Maustaste darauf und gehen Sie dann zu Link und fügen Sie dann unsere URL hier ein, drücken Sie Fertig und drücken Sie dann erneut auf eins. Ich möchte auch nicht, dass dies unterstrichen wird, also lassen Sie uns das hervorheben und das Häkchen bei On D Line entfernen Dann empfehle ich, eine Vorschau anzusehen , um sicherzustellen, dass es funktioniert. Und jetzt gehen wir zu dieser Schaltfläche und diesem Text und klicken darauf Und du wirst feststellen, dass es zu unserem Anmeldeformular geht. Aber nur für dieses Beispiel habe ich meine E-Mail-Adresse und meinen Namen hinzugefügt Okay, jetzt klicken wir auf Abonnieren. Und du kannst jetzt sehen, dass es Erfolg war, du wurdest zur Zielgruppe hinzugefügt. Und jetzt, wenn wir zu Mailchimp zurückkehren und unter Zielgruppe stehen, kannst du hier sehen, dass meine E-Mail-Adresse und mein Name hinzugefügt wurden Sobald also jemand seine E-Mail-Adresse hinzugefügt und das Anmeldeformular abgeschickt hat, wird er zu einer Mailchimp-Zielgruppe hinzugefügt Gehen wir jetzt zurück zu Canva und veröffentlichen wir Klicken wir also hier auf die veröffentlichte Website. Und jetzt klicken wir auf die neu veröffentlichte Website. Dies kann wiederum einige Augenblicke dauern. Okay, jetzt kopieren wir unsere URL hierher und fügen sie in einen neuen Tab ein. Hier können Sie sehen, dass wir unseren Link haben , der zu unserem Anmeldeformular führt. Okay, so kannst du Mel hintwv Canva verlinken , um E-Mails deiner Zielgruppe und Kunden zu erfassen deiner Zielgruppe und Kunden zu Also vielen Dank, dass Sie sich dieses Video angesehen haben. Ich hoffe, Sie fanden es nützlich, und wir sehen uns im nächsten Video. 12. Vielen Dank und auf Wiedersehen + Kursprojekt: Okay, wir haben das Ende dieses Kurses erreicht. Vielen Dank fürs Zuschauen und ich hoffe, Sie fanden es nützlich. Für dein Klassenprojekt möchte ich, dass du deine eigene Website in Canva gestaltest Ich möchte dann, dass du einige Screenshots von deiner Website machst und dann einen kurzen Absatz darüber schreibst , wie du sie erstellt hast und warum Dann poste das als dein Klassenprojekt, damit ich mir deine Website ansehen und über deinen kreativen Prozess lesen kann. Nochmals vielen Dank fürs Zuschauen und hoffentlich habe ich noch einen Kurs gesehen.