Webdesign in Affinity Designer für Anfänger:innen und Fortgeschrittene

1. Webdesign in Affinity Designer Promo Video: Wenn Sie darüber nachdenken, als Webdesigner Freelancer zu beginnen, haben Sie wahrscheinlich versucht, Foto-Shop irgendwann in der Vergangenheit nutzen, und ich kenne den Schmerz, den ich Abendessen habe. Ich erinnere mich, dass ich Tage für Tage verbrachte, sogar Wochen nach Wochen, versuchte, sich an bestimmte Werkzeuge und Effekte zu erinnern. Aber zum Glück leben wir in Zeiten, in denen Sie als Webdesigner Freelancer starten wollen. Aber Sie können einfach Fotoshop beiseite legen. Hallo, mein Name ist David Tyminski, und in diesem Kurs erfahren Sie, wie Sie eine Flosse in Designer verwenden, um Websites von A bis Z zu entwerfen . Dieser Kurs ist voll mit wertvollen Informationen. Jeder Web-Designer Rookie sollte wissen, wie Sie die besten Farben und Mittel für Ihre Websites wählen. Was macht eine professionell gestaltete Website aus? Was sind die modernen Webdesign-Trends, über die Sie wissen sollten? Und das ist nur die Einführung, denn das echte Brot und Butter des Diskurses ist in seinen praktischen Teilen. Wir werden unsere Hände schmutzig und erkunden Sie alle Werkzeuge und Techniken professionelle Waffen und weigern sich, eine Website innerhalb Affinität Designer zu entwerfen, die Gebäude Drahtrahmen und Körnungen umfasst , die die Bausteine von jedem sind -Website, indem Sie Assets verwenden, um den Designprozess ultraschnell zu gestalten und Textstile zu erstellen, mit denen Sie Geld im Handumdrehen ändern können. Und natürlich, natürlich, eine Website entwerfen, werden Sie lernen, wie Sie sie vom Öffnen der Datei über Ort und Bilder, Hinzufügen von Text und Hintergründen bis hin zum Export in das Design, das Sie letztendlich ausgeben würden an einen Kunden. Wir haben eine Menge von den guten Sachen zu decken in diesem Kurs, und ich glaube wirklich, dass es Ihnen enorm helfen wird, erstaunliche Websites innerhalb einer passend zu Designer zu entwerfen , so würde ich gerne, Sie innen zu sehen. 2. 1Einführung in den Kurs: In diesem Kurs geht es darum, eine Passform in Designer für Webdesign zu verwenden. Wenn Sie zuerst mit Software nicht allzu vertraut sind, erfahren Sie schnell, worum es geht und wie Sie sie für das Webdesign einrichten. Bevor wir anfangen, etwas in Afinitor zu entwerfen, wird Designer einen Blick auf Web-Design-Konzepte und bewährte Praktiken werfen. Sie lernen, wie Sie Farben für Ihr Design wählen und wo Sie Farbe, Inspiration und fertige Farbthemen finden . Sie werden auch grundlegende Waffen und Topographie lernen, die nicht nur für ein gutes Web-Design, sondern für gutes Design im Allgemeinen extrem wichtig ist, um alles über Körper besteuerte Überschriften zu lernen und wie Zehe sie für eine große Benutzererfahrung paaren. Dann werden wir einen Blick auf eine typische Website-Struktur werfen. Design weise, natürlich. Wir werden über Logos, Navigationen Side Kriege und alle anderen Websites Bausteine sprechen. Danach werden wir darüber reden, was drin ist und was nicht in den Waffen auf der Welt drin ist. Wir werden auch im Web nach einigen Inspirationen für Webdesign suchen. Mit all diesen Kenntnissen und Fertigkeiten gehen Sie zum Entwurfsteil des Kurses, wenn die entstandenen Entwürfe einen Blick auf die Fertigstellung Ihrer Arbeit werfen, werden Sie lernen, wie Sie richtig speichern und für verschiedene Dateiformate exportieren. Es gibt eine ganze Menge gutes Zeug zu decken, und ich glaube wirklich, dass, sobald Sie den Kurs abgeschlossen und auf eigene Faust praktiziert haben, werden Sie anfangen, erstaunliche Website-Designs in einem fit in Designer in kürzester Zeit zu erstellen. Also lasst uns direkt in den Kurs springen und mit den Grundlagen beginnen. 3. 2.1Was ist Affinity Designer und wie du es für das Webdesign set: Wenn Sie völlig neu sind, um den Designer zu beleidigen, hier sind ein paar Fakten darüber. Zuallererst ist die Beleidigung des Designers in erster Linie eine Faktorgrafik-Design-Anwendung. Aber das bedeutet nicht, dass es nicht für Scream und Geräte Design geeignet ist. In der Tat ist es eine großartige Kombination aus Werkzeugen und Fähigkeiten, die für On- und Off-Screen-Arbeit gedacht sind. Zuerst war es nur für Mac OS verfügbar, aber seit Ende 2016 können Sie es auch nur Windows Machine installieren. In diesem Kurs werde ich eine PC-Version von der Software verwenden. jedoch Wenn SiejedochDesigner auf einem Mac installiert haben, sollten Sie keine Probleme haben, alleine zu folgen. Denken Sie daran, dass, wenn ich den Steuerungsmodifikator beibehalten verwende, Sie die Befehls-Modifikatortaste verwenden müssten. Und wann immer ich den Olt Modifikator Keep verwende, müssten Sie die Optionsmodifikatortaste auf Ihrer Tastatur verwenden. Die Umschalttaste ist für beide Betriebssysteme gleich. Was ist großartig an Designer in Bezug auf Interoperabilität ist, dass es Ihnen erlaubt, an verschiedenen Dateiformaten zu arbeiten und zu exportieren, die von Standard-Vektor, einmal wie V G und E. P s bis einmal wie V G und E. zu einem Standard-Raster-Dateien wie J. P, G, P und G und Geschenk. Es ermöglicht Ihnen, Standard-PSD und A. I Dateien zu öffnen , und es macht den Job wirklich gut. Es kann auch Ihr Kunstwerk in Dateiformate exportieren, die von anderen Design-Software wie Dobie Photo Shop und Adobe Illustrator gelesen werden können . Also, wenn Sie Ihre Arbeit als PDF-Tiff oder sogar PSD speichern müssen, können Sie das in Affinity Designer tun. Wenn Sie also irgendwann Ihren Entwurf an einen Entwickler senden, können Sie dies mit einer Standard-PSD-Datei tun, und Sie müssen sich keine Sorgen machen, dass der Entwickler die Datei nicht öffnen kann. Sie haben Affinität Designer unterstützt, Ebenen, Symbole, Fotoshop wie Effekte, Führungen und Körnung, und praktisch alles, was Sie brauchen, um Websites mit ihm zu entwerfen. Ich muss dir sagen, dass alles nur ein Tipp vom Eisberg ist. Ich meine, die Software kann so viele Dinge tun, und es gibt einige Aspekte, die es etwas zu machen als Illustrator oder Photoshopped. Für bestimmte Arten von Designaufträgen ist es wirklich ein One-Stop-Shop für Design-Anforderungen. Sie können Logos mit ihm Websites Visitenkarten zu entwerfen, praktisch alles, was Ihr Kunde vielleicht entworfen werden möchte. Aber in diesem Kurs geht es nicht um das Lernen. Alles, was man wissen muss, um einen Designer in Ohnmacht zu machen. Wenn Sie das brauchen, werfen Sie einen Blick auf meine, wie Sie schnell mit Affinity Designer-Kurs beginnen können, wo Sie alles, was zu wissen ist lernen. Die Software in diesem Kurs konzentriert sich auf die Verwendung des Programms in einem Web-Design-Szenario, daher denke ich, dass wir einen Blick auf die Web-Design-Fähigkeiten von Designer werfen können jetzt. 4. 2.2Affinity Designer’s web der Webdesign-Fähigkeiten: Afinitor Designer ist für große Sie eingerichtet. Ich entwerfe Erfahrung direkt aus der Box. Es gibt wirklich nicht viel, was Sie tun müssen, um alle seine Web-Design-Fähigkeiten zu nutzen , die einen Blick auf jetzt nehmen. Zuallererst, beleidigt. Der Designer unterstützt Layer, was sehr wichtig ist, wenn Sie Ihr Design ordentlich organisieren möchten. Es ist immer eine gute Idee, Ihre separaten Elemente, die separate Teile eines Website-Designs erstellen, auf verschiedenen Ebenen zu platzieren . Elemente, die den Header enthalten, sollten auf einer separaten Ebene gehen. Elemente, die die Seitenleiste enthalten, sollten auf einer separaten Ebene gehen usw. Es ist eine gute Produktionstechnik, um die Schichten richtig zu benennen. Anstatt ihre generischen Namen, wie z. B. Layer 1 Layer usw., zu belassen , sollten Sie sie umbenennen und ihnen logischere beschreibende Namen geben, die sich auf den Layer-Inhalt beziehen würden . Zum Beispiel, Hatter Food ER Sidebar Artikel, etc. Ich würde sogar einen Schritt weiter gehen und Creed Sub-Layer wert logisch beschreibende Namen, zum Beispiel, die Sub-Layer für nur die Navigation oder Brandon Blöcke in der Hatter-Ebene erstellen . Es gibt wirklich nichts Bezeichnenderes für ein schlampiges Design und Designer, das all seinen Inhalt auf nur einer einzigen generischen Schicht hält . Wenn Sie ein Fan von Schatten, Grady INts und Unschärfen sind , werden Sie glücklich sein zu hören, dass Designer eine Vielzahl von Effekten bietet, die Sie zu Ihrem Kunstwerk beenden können . Sie sind zerstörungsfrei, was bedeutet, dass sie das Kunstwerk nicht dauerhaft verändern, sondern dynamisch zu seinem hinzugefügt werden und jederzeit geändert werden können. Es wäre viel schwieriger, Website-Designs ohne unsere Boards zu erstellen. Sie sind der beste Weg, um nicht nur mobile Versionen der Website zu entwerfen, sondern auch um Ihre Arbeit zu präsentieren. Das Wichtigste, was er beim Erstellen von Websites in Designer berücksichtigen muss , ist, dass Sie standardmäßig, wenn Sie eine neue Datei erstellen, keine Kunsttafel erstellen. In Richtung Süden können Sie wählen, ob Sie ein Kunstwerk erstellen oder einfach als Standardseite verlassen möchten. Denken Sie daran, dass, wenn Sie in unserem Bericht erstellen möchten, wenn Sie Ihre Datei erstellen möchten, aktivieren Sie die Option „Kunst an Bord erstellen“. Natürlich, wenn Sie es einfach vergessen oder Ihre Meinung ändern, können Sie die Kunst immer an Bord nutzen. Noch eine Art Board Website Designs brauchen Pixel-Perfektion zu erstellen, und Sie können Designer, ganze Familie von Werkzeugen und Optionen verwenden . Nur dafür. Was ist großartig an dieser Funktion ist, dass Sie einfach eine Sie I design Fangvoreinstellung wählen und sicherstellen können, dass die Fangoptionen perfekt für Webdesignzwecke aktiviert sind . Es aktiviert auch die Force-Pixelausrichtung und Verschiebung durch Halten Pixel, nur um sicherzustellen , dass alle Objekte richtig gefangen und bewegt werden. Wenn Sie das Fangen haben. aktiviertem Design wird angezeigt, wenn die Objekte ausgerichtet sind, aber auch der Abstand zwischen bestimmten Objekten in Pixeln angezeigt. Die von U I entworfene Fangvoreinstellung wird auch dazu führen, dass Ihr Kunstwerk zwei Hilfslinien schnappt und am Raster rastet . Also, wenn es sie in Ihrem Workflow verwendet, Sie Ich habe Fangvorgabe entworfen, können Sie das Kunstwerk perfekt mit ihnen ausrichten. Und wenn Sie das Raster noch nie benutzt haben, weil es zu verwirrend war, werden Sie sich freuen zu hören, dass Designer ein automatisches Raster bietet, das selbst die besten Einstellungen findet. Du musst nicht alles alleine zählen. Das Raster ändert sich je nach dem von Ihnen festgelegten Zoomer-Wert. Natürlich, wenn Sie möchten, können Sie das Raster manuell ändern und Ihre eigenen Werte eingeben. Sie können auch den Guides Manager verwenden, um Ihre Guides genau dort zu platzieren, wo Sie sie wollen . Afinitor Designer ist in erster Linie ein Faktor-Design-Programm, aber es ermöglicht Ihnen, die Pixel-Umgebung zu imitieren, in der Ihre Website-Designs letztendlich leben werden . Für Webdesign-Zwecke können Sie die Standard-Pixelansicht und eine Retina-Ansicht mit hoher Pixeldichte verwenden. Auf diese Weise können Sie eine Vorschau anzeigen oder entwerfen, als ob es vollständig aus Pixeln gemacht wurde. Eine Website kann nicht ohne Text leben. Es ist so wichtig, dass viele Designer es zum Mittelpunkt ihrer Entwürfe machen so Manny grafische Elemente wie möglich entfernen. Und es ist wirklich einfach, mit Steuerdesigner zu arbeiten. Zusätzlich zu den Standardzeichen- und Absatzoptionen können Sie Textstile erstellen, die den Geldwechsel beschleunigen. Im Rahmen Ihres Designs. Sie können Dutzende und Dutzende von verschiedenen Textstile haben, und Sie können praktisch jeden Aspekt von ihnen ändern. Designer zählt mit der Möglichkeit, Ihre eigenen Bibliotheken aus Assets zu erstellen, die Sie beim Entwerfen von Websites verwenden können . Es kommt mit ziemlich finden Iowa 10 Assets, die Sie einfach auf die Paste Board Assets ziehen können waren Art von Symbolen. Der Unterschied zwischen Assets und Symbolen besteht darin, dass Sie Bibliotheken aus Assets erstellen können , die exportiert oder in ein bestimmtes Dokument eingebettet werden können. Und Sie können das nicht mit Symbolen genug in Designer tun. Sagen Sie also, Sie bauen einen Drahtrahmen für Ihre Website. Sie würden nur die schematischen Elemente für das Recht wollen? Erstellen Sie einfach Ihre eigenen Darstellungen eines Logo-Navigationssystems. Block verfügt über etcetera, dann ausgewählt, und aus dem Bedienfeldmenü, wählen Sie und aus der Auswahl. Das Element wird direkt in die Asset-Bibliothek gehen und auf Sie warten. Sollten Sie es noch einmal verwenden wollen. Beleidigen Sie den Designer kommt mit diesem separaten Arbeitsbereich, der nur für den Export von Elementen Ihres Designs gedacht ist. Es wird zur Exportpersona genannt, und es ist eine gute Möglichkeit, geschnittene Teile Ihres Designs zu exportieren. Sie können einfach das Slice-Werkzeug erteilen, ein Slice aus einem bestimmten Designelement erstellen und als separate Dateivertretung exportiert. Es gibt eine Menge von Tools und Optionen, mit denen Sie wunderschöne Website-Designs in einer Passform in Designer-Tools und Panelisten wie die Ebenen in Richtung Fangen erstellen können. Manager etcetera wird Ihnen helfen, Ihre eigenen Websites zu erstellen. Aber glaub mir, dass wir hier nur die Oberfläche abgeschwächt haben. Es gibt so viel mehr zu entwerfen Websites mit Beleidigung für Designer und Sie werden alles entdecken , wenn der Kurs fortschreitet. Ich denke, an dieser Stelle könnten wir direkt in die Erstellung unseres ersten Designs springen, aber ich möchte, dass dieser Kurs etwas mehr ist als nur ein Schaufenster von Designtechniken und -prozessen. Ich wollte Thora Wissen über zeitgenössisches Webdesign gewinnen. Als nächstes werden wir einen Blick auf die Prinzipien des guten Webdesigns werfen, gefolgt von praktischen Informationen über Farben, Typografie und Elemente, die verwendet werden, um eine Website zusammenzustellen. 5. 3.1Top 10 Prinzipien von guten Webdesign: Wenn Sie ein beginnender Webdesigner sind, kann die Fülle von Informationen, die Sie entdecken und lernen müssen, Ihre Hände drehen es. Deshalb habe ich eine Liste von 10 wesentlichen Prinzipien aus gutem Web-Design zusammengestellt, die Ihnen bei den Einstieg helfen wird. Schauen Sie sich jedes dieser Prinzipien ist eine Art Richtlinie, aber keine absolute Regel, die Sie nicht banden können. Wenn Sieihnen folgen, ihnen folgen, besonders wenn Sie gerade erst anfangen, können Sie viele Rookie-Fehler vermeiden. So gutes Webdesign kümmert sich immer um den Endbenutzer. Schließlich ist das Design, wie Steve Jobs es ausdrückte, wie Steve Jobs es ausdrückte,nicht so, wie es aussieht, sondern wie es funktioniert. Und es muss einwandfrei in Bezug auf den Dienst der Besucher in der bestmöglichen Weise arbeiten, müssen Sie die Website mit seinem Zweck im Auge zu gestalten. Sie müssen denken, wie der Benutzer denken würde, wenn er oder sie würde die Website besuchen, denken, was die Besucher erwarten, auf der Website Informationen, Unterhaltung, vielleicht Produkte zu finden Unterhaltung, . Was lockt das in Bezug auf Design und gestaltet die Seite dann entsprechend? Dieser hier ist äußerst wichtig, und ich muss zugeben, dass ich eine Art persönliche Voreingenommenheit gegenüber schlecht ausgeführten Text auf der Seite habe. Ich spreche nicht von spezifischer Topographie, sondern von besteuerter Komposition. Der Benutzer möchte die Informationen schnell und mühelos finden und konsumieren. Deshalb ist es so wichtig, Ihre Absätze korrekt zu erstellen. Schön zusammengesetzter Text hat Überschriften, kurze Absätze und Aufzählungszeichen zum einfachen Lesen. Ich denke, dass bis auf die Länge von Absätzen für informationsorientierte Designs von entscheidender Bedeutung ist. In den letzten Jahren hat sich das mobile Copyright im Internet verbreitet, so dass die gesamten Absätze so kurz wie ein Satz sind. Eine gute Anzahl von Sätzen in Absätzen ist in der Regel 2 bis 3. Es ist allgemein einig, dass Sinnesserifen-Schriften, also die ohne dekorative Endungen auf Buchstaben, leichter auf digitalen Bildschirmen zu lesen sind. Ich würde es nicht als Dogma betrachten, aber ich würde dringend raten, nicht mehr als zwei verschiedene Schriftarten in Ihrem Design zu verwenden . Ob Sie für Sand Saref oder Serif Typefaces gehen, ist eine Tochtergesellschaft, um in Ihrer Fondswahl während dieses Designs zu bleiben . Wenn du dich entschlossen hast, Sarah-Überschriften und eine serifenartige Leiche zu suchen, bleib einfach bei ihnen. Das Layout Ihrer Website sollte den Besuchern dabei helfen, die Informationen zu finden, anstatt sie frustrierend danach zu suchen. Deshalb ist es wichtig, das Design zu konstruieren, das es dem menschlichen Auge ermöglicht, den Inhalt leicht von oben nach unten und von links nach rechts von wichtiger zu weniger wichtig zu navigieren . Bald erfahren Sie mehr über die Farbtheorie und wie Sie sie im Webdesign verwenden. Aber im Moment, denken Sie daran, dass die Farben, die Sie wählen, Ihre Komposition machen oder brechen können. Es ist wichtig, Farbschemata zu erstellen, die den Benutzern helfen, die Botschaft der Website zu verstehen und die Informationen zu finden, die sie suchen, während das Design ästhetisch ansprechend macht . 6. 3.2Top 10 Prinzipien von guten Webdesign – weiterhin: Bilder können Sie in Knoten helfen, nur machen die Website schöner zu betrachten, sondern auch, um eine Geschichte zu erzählen. Sie können die Benutzer auf einer tieferen Ebene ansprechen, wenn sie richtig ausgewählt und gut mit dem Farbschema Sites kombiniert werden, sie werden Ihnen enorm helfen, ein schönes und nützliches Design zu schaffen. In letzter Zeit wird es viel häufiger, Kundenfotografie zu verwenden, anstatt nur kitschig stecken Fotos aus dem Web heruntergeladen. Denken Sie daran, die Bilder zu optimieren, wenn Sie das Design an einen Entwickler übergeben, und optimieren Sie Mittel, um die Bilder so zu komprimieren, dass sie kleiner sind. Größe hilft, die Website schneller zu laden. Die meisten modernen Websites basieren auf Gittern, und die am häufigsten verwendete ist das 12-Säulen-Raster. Betrachten Sie es als unsichtbare Linien von Siri, die Ihnen helfen, Ihr Website-Design zu strukturieren und es symmetrisch und einfacher zu programmieren. Diese Linien sind eine große Hilfe beim Platzieren der Elemente über dem Design. Das sind nur die Hauptcontainer. Alek Off Alignment ist sehr auffällig und erzeugt einen schlampigen Eindruck. Partituren erfahren Sie mehr über Körnungen und wie Sie Ihre eigenen erstellen können. Das ist selbstverständlich, dass Ihr Design auf mobilen Geräten gut aussehen muss. Tatsächlich könnten Sie sogar Ihre Entwürfe in erster Linie für mobile Geräte, insbesondere Smartphones,erstellen , insbesondere Smartphones, und dann Desktop-Designs aufbauen. Es wird Mobile First Approach genannt und ist ein Design als Reaktion auf die Tatsache, dass Benutzer viel öfter online gehen mit ihren Smartphones, nicht mit Desktop-Computern. In jedem Fall muss Ihr Design bereit sein, auf jedem Bildschirm angezeigt zu werden. Es gibt nichts zerstörerischeres für ein Design und dann ein Klappern. Halten Sie Ihr Layout einfach, damit sie leicht verdaulich sind. Das bedeutet, die richtige Menge an Farben zu wählen, die normalerweise nicht mehr als fünf beträgt. Es bedeutet, konsistent über die gefundene Wahl zu sein. Aber es bedeutet auch, die Interaktion zwischen Website-Elementen leicht zu verstehen, den richtigen Raum und ist aus einem Hauptgrund wichtig. Es macht den Konsum von Inhalten einfach und angenehm. Es gibt verschiedene Arten von Raum, und Sie können nutzen und müssen bewusst sein, off in Ihrem Design. Leerzeichen zwischen den Linien. Off-Text muss nicht zu klein sein, damit sich die Textzeilen nicht überlappen, aber auch nicht zu groß sind. Das menschliche Auge geht also nicht verloren. Ich kann auch mit Leerzeichen zwischen den Charakteren herumspielen. Aber ich würde für große Überschriften verlassen, wenn Sie für mehr von einem künstlerischen Ansatz in Web-Design und Entwicklung Welt gehen wollen , gibt es auch spezielle Arten von Räumen genannt padding und Randmuster ist der Raum zwischen den Teilen des Inhalts innerhalb eines Containers, und Ränder sind Leerzeichen zwischen Containern. allgemeine Regel ist das. Teile von Inhalten sollten sich nie berühren, und Sie sollten immer etwas Abstand zwischen ihnen haben. Gutes modernes Webdesign kann nicht ohne eine anständige Menge an Leerraum leben. Leerraum bedeutet Leerraum zwischen Objekten und ist notwendig für ein sauberes, modernes Aussehen. Leerraum kann ein bestimmtes Design auf eine bestimmte Weise lenken. Verwenden Sie es aufwändig, wenn Sie für eine gehobene Art von einem raffinierten Look Ihres Designs gehen . Das sind also die 10 wesentlichen Prinzipien des guten Webdesigns. Es gibt natürlich andere Prinzipien, die zu berücksichtigen sind, wie eine klare Navigation, die Verwendung des goldenen Verhältnisses oder der Ladezeit. Aber die allgemeine Idee ist immer das. Sie sollten für den Benutzer entwerfen und, wenn Sie Ihre Kunden objektiv im Auge haben, diese Prinzipien als Richtlinien für ästhetische und erfolgreiche Entwürfe verwenden 7. 4.1, der du vor der Auswahl von Farben berücksichtigen solltest.: nur in der richtigen Farbe Haut für Ihre nächste Website. Design ist zusammen mit Typografie. Am wichtigsten ist, dass die Farben, die Sie wählen, das erste, was die Aufmerksamkeit des Besuchers auf sich ziehen wird und, wenn sie richtig gewählt werden, nicht ihre Augen verletzen lassen und Finger schnell nach dem Schließknopf suchen. Der Grund für Ihre Farbwahl kann nur die Tatsache sein, dass Sie es mögen. Es ist ein Teil der gesamten Strategie, die hilft, die Nachricht zu senden, die Ihr Kunde senden möchte . Das mag seltsam klingen, aber denken Sie daran, dass Sie die Website nicht für sich selbst gestalten. Du entwerfst es nicht mal für deinen Klienten. Sie entwerfen es für Ihre Kunden. Und das bedeutet, dass die Autos von der Website müssen den Besuchern helfen, zu verstehen, worum es auf der Website geht. Durchsuchen Sie die Website ohne das Gefühl der Verwirrung und finden Sie die Inhalte, die sie suchen . Wie wählt man also tatsächlich die besten Farben für einen bestimmten Webdesign-Job? Es gibt nur sehr wenige Dinge, die Sie berücksichtigen müssen. Dies wird Ihnen helfen, die Nachricht zu verstehen, die die Website senden soll, und verstehen, was die Besucher erwarten zu erleben. Zunächst einmal müssen Sie wissen, was ist, dass Ihr Kunde tut, Ob es eine High Street Company, eine Mutter und Pop-Shop, eine Wohltätigkeitsorganisation, Sie müssen dieses Geschäft verstehen. Du würdest nicht dasselbe Farbschema für eine Finanzgesellschaft wählen, wie für einen Spielwarenladen , richtig? Wir werden vorerst etwas später über die Farbpsychologie sprechen. Notieren Sie sich auch, auch, dass Farben Emotionen vermitteln und entzünden, und es ist äußerst wichtig, die richtigen anzuzünden. Manchmal von Unternehmen in gewisser Weise zwingen in gewisser Weisedie Verwendung bestimmter Farben. Zum Beispiel, wenn Sie eine Website für einen Bio-Lebensmittel-Eck-Shop erstellen, höchstwahrscheinlich würden Sie für Erdtöne gehen, und wenn Sie eine Kindergarten-Website erstellen würden, würden Sie für einige bunte und gefundene Farbe -Paletten. Zweitens, wenn das Unternehmen bereits ein Logo hat oder es neu gestaltet, müssen Sie seine Farben berücksichtigen. Dies bedeutet nicht, dass alle Farben innerhalb der Website genau die gleichen sein müssen wie die im Logo verwendet, aber sie müssen sich definitiv ergänzen. Drittens, hören Sie auf Ihren Kunden, aber erliegen Sie nicht eindeutig schlechten Ideen. Ich meine, es gibt einen Grund, warum der Kunde Sie angeheuert hat, anstatt es selbst zu tun oder ihren Neffen zu bitten , seine Website zu gestalten. Aber natürlich müssen Sie nicht übermäßig schematisch sein, wenn Ihr Kunde in irgendeiner Weise auffallen möchte. Und wenn Sie einen Blick auf seine Konkurrenten Webpräsenz nehmen, können Sie ein wenig mit Farbschemata experimentieren. Wenn zum Beispiel Sie zum Beispieleine Website für eine moderne Umwelt ein Unternehmen entwerfen, müssen Sie nicht für dunkelblau und grau gehen, sondern streuen Sie die Dinge mit dem hellbraun oder grün. Schauen Sie sich die Website des Kunden earth dot org an. Dies kann nicht das beste Design der Welt sein, aber es zeigt deutlich, dass die Botschaft und Emotionen Arm oder wichtig als Kragen Korrektheit bei der Entscheidung über ein Auto Schema Sie in das Design verwenden möchten. Denken Sie daran, welche Art von Unternehmen Ihr Kunde ist und über die Benutzer, die es auf der Website besuchen werden. Als nächstes werden wir über praktischere Aspekte bei der Auswahl von Farben für Ihre Designs sprechen. Wir werfen einen Blick auf die Vorbereitung der Farben für die beste Benutzererfahrung 8. 4.2Wie du Farben für die bestmögliche Benutzererfahrung mischst.: Es gibt viele Designer, die ihre Augen über eine bestimmte Farbe oder Farbpalette beurteilen lassen wird gut für einen bestimmten Web-Design-Job sein. Aber das Problem mit diesem Ansatz ist die Tatsache, dass so viele Farben schön aussehen können. Und so maney Farbpaletten scheinen für dieses spezifische Design angemessen. Also, wie Sie sagen, ob Ihr Halsband Wahl gut ist? Gibt es eine Möglichkeit, die Farbkombinationen zu beurteilen, die Sie gewählt haben? Nun, wahrscheinlich Learys. Aber wir müssen einen Blick auf einen Aspekt aus der Farbtheorie werfen, aber ich verspreche, dass es so praktisch wie möglich sein wird. Grundsätzlich können wir über vier Arten von Farbschemata sprechen, monochromatisch, kostenlos und die Logos und versuchen Dachboden. Lassen Sie uns also über diese für ein zweites Modell sprechen. Chromatisches Farbschema verwendet eine Grundfarbe und verschiedene Tönungen Schattierungen und Situationen aus es. Es ist die beste Wahl, wenn Sie ein kohäsives Design benötigen, aber Sie können mit einem langweiligen Farbschema in eine Falle fallen. Hier zusammengesetzte Farbschemata, manchmal als split-frei bezeichnet werden, basieren zusammengesetzte Farbschemata,die manchmal als split-frei bezeichnet werden,auf zwei Farben von der entgegengesetzten Größe aus dem Farbrad. Wenn Sie Ihr eigenes komplementäres Farbschema erstellen möchten, werfen Sie einen Blick auf das Farbrad und stellen Sie sich vor, dass Sie eine Sanduhr darauf zeichnen. Im Wesentlichen nehmen Sie zwei Farben von gegenüberliegenden Enden aus dem Farbspektrum, was Ihrem Design mehr Freiheit gibt als die motorischen chromatischen Schemata. Wenn es Konsistenz ist, die Sie in Ihrem Design sind, gehen Sie für und Logos Farbschema. Werfen Sie einen Blick auf das Farbrad und wählen Sie drei benachbarte Farben. Diese Themen können ein einheitliches Feld erstellen, ohne als die monochromatische Farbe Askew geboren zu werden. Um ein versuchen Dachboden Farbschema zu erstellen, zeichnen Sie ein Dreieck, dessen Seiten die gleiche Länge haben und wählen Sie die Farben an den Dreiecken. Endpunkte. Dadurch entsteht ein vielfältiges, aber ausgewogenes Farbschema mit gleichermaßen lebendigen Farben. Abgesehen von diesen Haupttypen von Farbschemata gibt es einige weitere Faktoren, die Sie bei der Auswahl von Farben für Ihr Design berücksichtigen müssen . Ich spreche von Komplementierung, Kontrast und Lebendigkeit. Farben, die sich gegenseitig ergänzen, sitzen auf den gegenüberliegenden Endpunkten außerhalb des Farbspektrums da sie sich optisch signifikant unterscheiden. Es ist einfacher für das menschliche Auge, sie zu unterscheiden. Das ist, warum Menschen neigen dazu, Teig zu mögen, die leicht zu betrachten sind, was bedeutet, dass sie eine gewisse Balance bieten und das Auge nicht zwingen, nach leichten Unterschieden zwischen den Farben zu suchen . In einem monochromatischen Schema wird die Komplementierung in den trias und zusammengesetzten Farbschemata verwendet. Eine gute Benutzererfahrung kann nicht ohne die richtige Verwendung von Kontrast leben. Die wichtigste Wahl, wenn es um Kontrast geht, ist natürlich die große Grund- und Textfarbe. Wenn Sie sich nicht sicher sind, welche Farben Sie verwenden sollen, empfiehlt es sich, eine sehr helle Farbe für den Hintergrund und eine sehr dunkle Farbe für den Text selbstzu wählen dunkle Farbe für den Text selbst oder umgekehrt. Vibrancy ist die emotionale Seite des Farbschemas. Hellere, lebendigere Farben provozieren energetische Gefühle, während dunklere, ruhige, alle Farben die Besucher entspannten, was ihnen hilft, sich auf andere Dinge zu konzentrieren. Dies sind die wichtigsten theoretischen Werkzeuge, die Ihnen helfen sollten, mehr, gut vierte Entscheidungen für Ihre Farbschemata zu machen . Natürlich gibt es viel mehr Werkzeuge und Ideen zu verwenden und in Bezug auf die Auswahl der Farben zu wählen . Aber wenn Sie sich mit den von uns abgedeckten vertraut machen, sind Sie auf dem richtigen Weg zum professionellen Farbhandling im Grafikdesign. Da wir Emotionen erwähnt haben, die durch Farben hervorgerufen wurden, denke ich, dass es ein guter Zeitpunkt ist, über Farbpsychologie zu sprechen, was nicht nur im Webdesign, sondern auch im Designim Allgemeinen äußerst wichtig nicht nur im Webdesign, sondern auch im Design ist. 9. 4.3Wie du die „psychologisch richtige Farben auswählst“ auswählst: die Farben, die Sie für Ihr Design wählen, schaffen Sie eine bestimmte Stimmung. Sie müssen die Psychologie hinter bestimmten Farben verstehen. Farbpsychologie mag übermäßig wissenschaftlich klingen, aber es beschreibt einfach die Gefühle und Bedeutungen, die Menschen oft mit bestimmten Farben assoziieren . sie sorgfältig auswählen, können Sie die Gesamtnachricht einer Website verstärken. Werfen wir einen Blick auf einige der Grundfarben, die Sie am ehesten beim Entwerfen Ihrer Websites verwenden . Rot ist die lebendigste und aggressivste Farbe. Es ist die 1. 1, die Männeraugen anzieht, je nachdem, welche Farben es damit macht, Macht und Mut, aber auch Liebe und Leidenschaft vermitteln können . Da es in vielen Verkehrsschildern verwendet wird, es häufig auf Websites verwendet, um den Benutzer zu alarmieren, über Gefahren zu informieren. Daher ist es ein Fehler, es für Ihren Aufruf zu Aktionen zu verwenden. Solch ein Spartaner oder Links Orange ist eine der angenehmsten Farben zu betrachten. Es ist schwer zu verpassen, und es kann Spaß und energische Atmosphäre hervorrufen. Gelb ist die Farbe aus, die etwas Wärme und Sommerzeit. Es ist auch die sichtbarste Farbe im Spektrum, also nicht zu viel zu verwenden. Viele Menschen werden zu viel Gelb irritierend finden. Es ist besonders auffällig, wenn es mit Weiß oder Schwarz kombiniert wird, da es sich um Sicherheitsausrüstung , Schulbusse und Taxis handelt. Wenn Sie Leute nach ihrer Lieblingsfarbe fragen, sagen sie höchstwahrscheinlich blau. Es ist angenehm, seine unauffällig zu betrachten und macht Sie sich wohl fühlen. Vielleicht liegt es daran, dass es die Farbe des Himmels ist. Es ist auch die Farbe aus Wasser, so dass die Menschen verbinden blau mit Erfrischung und Reinigung blau, vor allem dunkelblau, ist die professionellste. Farbe schließlich die ist schließlich dieFarbe des Präsidentenanzugs. Verwenden Sie diese Farbe, wenn es Professionalität ist, die Sie vermitteln möchten. Mit Ihrem Design ist Grün die Farbe der Natur. Wenn Ihre Augen schmerzen, wenn Sie länger auf einen Computerbildschirm schauen, schauen Sie sich das Grün an. Es ist eine perfekte und offensichtlichste Wahl für organische, umweltfreundliche und gesunde Produkte, obwohl es eine Farbe des US-Dollarist US-Dollar . Wenn Sie eine Website für eine Finanzgesellschaft erstellen, gehen Sie nicht mit Grün über Bord. Stattdessen halten Sie sich an Dunkelblau, Dunkelgrau, Weiß und Schwarz, um Vertrauen und Professionalität zu vermitteln. Purple ist historisch mit dem Royalty verbunden, was es perfekt für Luxusmarken macht. Auch, wenn es mit anderen Farben kombiniert wird, wird es etwas von seinem königlichen Erbe verlieren. Mit Rot, kann es intim und romantisch fühlen. Mit Weiß und Rosa wird es spielerisch und kindlich. Warum es Reinheit und Unschuld bedeutet. Aber es wird auch verwendet, um Minimalismus und Raffinesse zu schaffen, die Sie am ehesten auf Websites sitzen . Konzentrieren Sie sich auf Hochzeiten, Gesundheitswesen und Schilder sowie auf modernes, minimalistisches Blog-Schwarz ist zweifellos die ultimative elegante Farbe. Es kommt nie aus der Mode. Es impliziert Stärke, Luxus, Böse, Tod und Vermeidung. Denken Sie daran, dass Sie entscheiden können, welche Emotionen die Besucher fühlen, wenn Sie sich die Website ansehen , die Sie entworfen haben, so dass Sie eine wichtige Rolle als Designer spielen. Außerdem können Farbbedeutungen zwischen Kulturen und Regionen dramatisch variieren, daher ist es besser zu überprüfen, ob die Farbe Joe's in einer bestimmten Kultur angemessen ist. Jetzt wissen Sie etwas über die Farbtheorie, und ich gebe zu, dass es sich überwältigend anfühlt. Glücklicherweise gibt es Werkzeuge, die Ihnen bei der Auswahl des richtigen Farbschemas sehr helfen können. Also als nächstes wird einen Blick auf sieben einfache Werkzeuge für die Auswahl fehlersicherer Farbschemata 10. 4.4-7 einfache Tools zur Auswahl fehlerhafter Farbschemata: Wahl Farben für Ihr nächstes Design kann ein langer und sogar entmutigender Prozess sein. Für mich dauert es immer viel zu lange, um die richtige Kombination zu finden, aber wahrscheinlich kann ihr ganzer Prozess mit einigen Online-Farbschema-Generatoren beschleunigt werden. Werfen wir einen Blick auf sieben einfache Werkzeuge für die Auswahl unserer Proof-Farbschemata. Fangen wir mit Kohler hex a dot com an. Dieses Zeichen ist großartig, wenn Sie ein Farbfanatiker sind. Alles, was Sie hier tun müssen, ist eine beliebige Farbe, Wert oder Farbnamen eingeben, um eine riesige Menge von Informationen im Besitz dieser Farbe und natürlich natürlich verschiedene Farbschemata zu erhalten. Sie werden auch Beispiele für verschiedene Verwendungen aus dieser bestimmten Farbe erhalten, zusammen mit Alternativen dafür. Und wenn Sie irgendwelche von den Alternativen bevorzugen, können Sie einfach darauf klicken, um alle notwendigen Informationen und Farbschemata zu sehen. Das zweite Werkzeug, Farbpunkt genannt, ist wirklich lustig und einfach zu bedienen. diesem Werkzeug können Sie schnell ein Farbschema erstellen, indem Sie die Maus nach links und rechts ziehen um den Farbton zu ändern, ziehen Sie nach oben oder unten, um die Helligkeit zu ändern, und scrollen Sie nach oben oder unten, um ihre Sättigung zu ändern . Wenn Sie mit der Farbe zufrieden sind, klicken Sie auf, um sie zu speichern und wiederholen Sie den Vorgang mit einer anderen Farbe. Das Werkzeug zeigt nur Farben an, die gut mit dem von Ihnen gewählten passen, bevor Sie den Vorgang so oft wiederholen können , wie Sie möchten. Die nächsten beiden, genannt Palatable, macht besonders Spaß zu bedienen. Sie können Ihre eigene Farbe wählen oder auf die Schaltfläche „Abneigung“ klicken, damit das Programm die Farben für Sie wählt . Wenn es Ihnen gefällt, klicken Sie auf „Gefällt mir“ und „Seve“, die nächste Farbe, die der vorherigen entsprechen soll, entspricht Ihrem Geschmack. Sie können auch eine bestimmte Farbe entfernen, um die gesamte Palette auf Farbe zu verkleinern. Verstand. Sie können Ihre eigenen Farbfelder auswählen, und wenn Sie sie mögen, können Sie sie sehen und treffen. Generieren Sie für das Programm zu finden, stellen Sie sich Farben zu denen vor, die Sie gewählt haben. Das Besondere an diesem Hocker in Bezug auf Web-Design ist, dass Sie die Website-Farben Option und Wasserpalette wählen können , die auf eine Dummy-Webseite angewendet wird. Materialpalette wurde erstellt, um hauptsächlich zum Zweck der Verschmelzung von Materialdesignfarben in Ihren Entwürfen. Also, was ist Materialdesign? Nun, es ist Google-Konzept-Design, das User Experience orientiert ist. Es ist speziell entwickelt, um am besten auf mobilen Geräten zu arbeiten und Materialpalette ist hier, um Ihnen bei der Auswahl der Farben zu helfen. Wenn Sie nach den Materialdesign-Prinzipien entwerfen möchten, müssen Sie hier nur zwei Farben auswählen und das Programm das schwere Heben für Sie durchführen lassen . Es wird nicht nur ein Farbschema für Sie schaffen, sondern auch größer. Eine Vorschau des Schemas, das auf eine mobile Benutzeroberfläche angewendet wurde, haben Sie wahrscheinlich von Can Va gehört ? Aber haben Sie von seiner Farbpalette zu Ihnen gehört? Es kann verwendet werden, um Farbschemas aus importierten Bildern zu erstellen. Dragon Bild auf die Schnittstelle und lassen Sie das Programm nehmen die Farben von diesem Bild. Und last but not least, ist mein Lieblings-Farbschema-Generator. Das ist völlig anders in der Art und Weise, wie es denkt, Paletten zu erstellen. Anstatt die Namen der Farben einzugeben, Bilder hochzuladen oder die Maus zu ziehen, um Farbfelder zu erstellen, geben Sie das Theme-Ereignis oder ein beliebiges Wort ein, das Ihr Design beschreibt. Nach ein paar Sekunden erhalten Sie Farbschemata, die mit diesem Schlüsselwort verknüpft sind. Ziemlich süß, was? Alle diese Farbgenerierungswerkzeuge sind eine bescheidene Darstellung eines Bereichs von Werkzeugen, die Sie online finden können . Die meisten von ihnen werden so ziemlich auf die gleiche Weise funktionieren. Also, wenn Sie nur Ihre ein oder zwei Favoriten finden, das ist wirklich alles, was Sie brauchen. Als Nächstes lernen Sie die Grundlagen der Topographie im Webdesign kennen, also gehen Sie nicht weg. 11. 5.1Eine super kurze Geschichte der Webtypografie: im Vergleich zu der mehr als 25 Jahre langen Existenz des Internets. True Web Typografie sieht aus wie ein Kindergartener. Es ist erst ein paar Jahre alt. Selbstverständlich enthielten auch die frühesten Webseiten Text. In der Tat war die erste Website überhaupt nichts über Text, aber die Wahl des Telefons war begrenzt, gesagt. Vor der Geburt aus. True Web-Topographie-Designer konnten aus fünf verschiedenen Schriftarten wählen, aber nur zwei von ihnen, Verdana und Georgia, wurden speziell für die Webnutzung erstellt. Die anderen Mittel, nämlich Aerial, Helvetica und Times New Roman, wurden aus dem Betriebssystem des Computers gezogen und in eine Website geladen. Natürlich bedeutet dies nicht, dass Designer und Entwickler höflich dem zu begrenzten Konzept zugestimmt haben, nur fünf verfügbare Schriften zu haben. Die einfachste Alternative war, Bild zu verwenden, wie Text Wünsche konnten die Mittel auf ihren Computern installiert verwenden , ohne zu viel Sorge, zu gebildet Lizenz in. Aber es gab zwei große Nachteile dieser Methode. Zunächst einmal, um das volle Bilddesign in eine Website zu verwandeln, mussten Sie es in eine lächerliche Anzahl von Bildern in einem Stück Software wie Photo Shop schneiden . Vergessen Sie auch nicht, dass dies die Zeit frei war. Nicht so schnelle Internetverbindung. Die Zeit, die es brauchte, um eine Seite voller Bilder zu laden, war also deutlich länger. Alles änderte sich in der 2010, als Google eine eigene Bibliothek aus Web-Fonds erstellt. Sie sind kostenlos, meist gut gemacht und definitiv einfach zu bedienen, sowohl für Designer als auch für Entwickler. Dies hat die Welt der Web-Typografie verändert. Heutzutage finden Sie webspezifische Mittel in allen wichtigen Typografie-Gießereien, und es ist schwer vorstellbar, Websites zu entwerfen. Ohne sie. Der Aufstieg von Responsive Webdesign hat ihre Typografie durch eine neue Art von Transformation gehen lassen. Die Tatsache, dass Ihre Arbeit auf verschiedenen Geräten betrachtet wird, macht es unmöglich, vorherzusagen , wie ein bestimmter Fonds auf einem bestimmten Gerät aussehen wird. jedoch Es gibtjedocheinige Grundregeln für die Auswahl der richtigen Mittel für die richtigen Arten von Arbeitsplätzen, und wir werden darüber als nächstes sprechen 12. 5.2Wie du Farben für die bestmögliche Benutzererfahrung mischst.: richtig gewählt. Typografie für das Projekt bedeutet, dass es hilft, die Nachricht von der Website zu senden. Es ist auch wichtig, sich daran zu erinnern, dass Schriftarten, genau wie Farben, bestimmte Arten von Emotionen hervorrufen können. Deshalb ist es wichtig, Ihre Freunde sorgfältig und mit dem Leser im Auge zu wählen. Benutzer, die die Website ansehen, werden die meiste Zeit damit verbringen, den Textkörper zu lesen. Deshalb ist es eine gute Idee, zuerst den Fonds für den Körpertext zu wählen. Die Schriftart, die Sie wählen, muss unauffällig Leiste ein ble und lesbar sein. Es gibt ein paar Möglichkeiten, Mittel mit diesen Eigenschaften zu wählen, aber ich habe versprochen, es so regelmäßig Designer freundlich wie möglich zu halten. Ich meine, nicht jeder Designer ist begeistert von Topografie. Was sind die Funktionen von unaufdringlichen und lesbaren Mitteln für Ihre Website-Designs? Ein lesbarer Fund hat Lose von X Höhe, das ist das vertikale Maß eines Kleinschreibung X. Je kürzer die X Höhe, desto kleiner wird die letztere erscheinen, was dazu führen kann, dass der Typ unleserlich wird. Auf der anderen Seite kann zu viel X Höhe die Buchstaben M und H schwer zu unterscheiden machen. Werfen Sie einen Blick auf das gleiche Wort in Lotto geschrieben und offene Söhne, um ihre Ex-Höhen zu vergleichen. Das zweite, was man sich notieren muss, ist, wie offen die Öffnungen sind. Aber was unsere Öffnungen Öffnungen sind die Lücken in Buchstaben wie ein C oder s. Je offener sie sind, desto lesbarer werden die Buchstaben. Sie müssen auch die Aufmerksamkeit auf die A. Absender und D-Zentren der Passagiere des letzteren zahlen, sind die Striche, die sich über die mittlere Linie erstrecken , und D-Zentren sind die Striche, die sich unterhalb der Basislinie erstrecken. Je unterscheidbarer sie sind, desto lesbarer wird der Text. Die meisten Saref-Schriften sind oft die ideale Wahl, um längere Textpassagen zu lesen. Aufgrund der spürbaren Striche in ihren A-Sendern und D-Absendern. Ihre Körpersteuerschriftart sollte mindestens vier verschiedene Stile enthalten. Reguläre Kursivschrift. Fett und fett kursiv. Wenn die Schrift keine kursiv formatierte Schriftart enthält, werden die Browser gewaltsam schräg. Und wenn es keine fett formatierte Version enthält, verdoppeln die Browser die reguläre Version der Vorderseite, was den Text schwer für die Augen macht. Das letzte, was Sie bei der Auswahl von Schriftarten für ihren Textkörper eine Notiz abnehmen sollten, ist der Kontrast zwischen dünnen und dicken Linien innerhalb von Buchstaben. Wenn Sie einen Blick auf Schriften wie Play for display werfen, werden Sie einen riesigen Kontrast zwischen dicken und dünnen Linien in separaten Platten bemerken. Schriftarten wie diese können in Überschrift Designs für Mode-Blogs gut aussehen, aber sie funktionieren nicht gut als Körper besteuert. Jetzt wissen Sie, was die fünf entscheidenden Merkmale von Schriftarten, die gut als Textkörper funktionieren. Diese Schriften haben großzügige X Höhe, offene Öffnungen, unterscheidbare Ass und D Absender, mindestens vier Stile und Gewichte und einen kleinen Kontrast zwischen Linien innerhalb von Leitern. Nein, es ist alles gut und gut über die Hauptfrage bleibt immer noch unbeantwortet. Und diese Frage ist: Wie groß sollte der Textkörper sein? Nun, die kurze Antwort ist 16 Punkte. Es ist die Textgrößen-Browser standardmäßig angezeigt. Es ist die Textgrößen-Browser sollen angezeigt werden. Im Allgemeinen funktioniert diese Größe gut für Laptops, Desktops und Telefone. Und was ist mit der Zeilenhöhe, was natürlich den vertikalen Abstand zwischen Textzeilen bedeutet. Eine gute Faustregel ist es, sechs Punkte auf die Körper-Text-Telefongröße hinzuzufügen Wenn Sie also 16 Wichtigkeit als Körper-Text Telefongröße verwenden, gehen Sie mit 22 Punkten als Zeilenhöhe . Natürlich können Sie mit anderen Linienhöhenwerten experimentieren. In der Tat verwenden viele moderne Blutdesigns großzügigere Linienhöhen, also haben wir den Körper bekommen. Textschriftart ist ziemlich gut abgedeckt. Wenn Sie all diese Regeln befolgen, werden Sie den Benutzern einen großen Gefallen tun, indem Sie das Lesen Ihrer Website zu einem angenehmen Erlebnis machen. Sie sparen sich immer viel Zeit und vermeiden Schriftarten. Sie sind es nicht wert, in Ihrem Design zu landen. Als nächstes wir einen Blick auf das Basteln von Aufmerksamkeitsgrabbern. Wir reden über Rubriken. 13. 5.3Wie du die richtigen Schriftarten für die Überschriften auswählst.: gute Überschriften und Unterüberschriften sind die Elemente einer Website von Design, die Benutzer anziehen und die weitere Lektüre fördern. Deshalb ist es wichtig zu lernen, wie man sie richtig erstellt. Wenn Sie sich nicht sicher sind, mit der Schrift in Gefahr mit dem Körperfonds zu verwenden, gehen Sie einfach für die gleiche Telefonfamilie. zum Beispiel für Wenn Sie sichzum Beispiel füroffenen Sand als Körperfonds entschieden haben, Sie eine kühne und vergrößerte zwei oder sogar eine dreifache Version davon für Ihre Rubriken. Dies wird das Design Luke harmonisch machen und die Zeit reduzieren, die benötigt wird, um die Website zu laden. Das ist der schnelle und einfache Weg, aber die Chancen stehen, dass früher oder später Ihr Designer so durchsetzen wird und Sie auffordern, verschiedene Schriften zu mischen . Sie sollten einen Fonds für Body-Tags und weitere vier Überschriften verwenden, wenn Sie das Beste aus beiden Welten wollen . Ich meine, wenn du auf der sicheren Seite bleiben willst und die Topographie deiner Website noch ein bisschen aufgerissen hast, kannst du in einer Superfamilie bleiben. Zum Beispiel können Sie Droiden-Söhne für die Rubriken und Droidenserif wählen. Für Text im Textkörper. Sie werden einige gute super Familien unter Google-Telefonen finden, zum Beispiel Roboto und Roboto Slab Merryweather und Merryweather Sands oder Noto Santas und Noto Saref. Die nächste große Frage ist, wie groß sollten die Überschriften sein? zunächst daran, dass Ihre Seite eine maximale Anzahl von sechs Überschriften verwenden wird. Nicht alle müssen notwendigerweise in das Design einbezogen werden. Ich meine, typische Designs gehen nicht unter die Überschrift für, aber es ist eine gute Praxis, eine Reihe von Größen für alle Überschriften zu entwickeln, um sie zu setzen. Einfache Überschriften sind Titel von den Website-Komponenten Überschrift eins ist in der Regel für die Sehenswürdigkeiten Branding reserviert , so technisch muss es nicht Text überhaupt sein. Es kann das Firmenlogo umfassen, die Überschriften, die die meisten Ihrer Entwürfe auf unsere Rubrik Zwei verlassen werden. Das sind deine Blocktitel, Titel im Hauptbereich usw. Ich würde empfehlen, sie mindestens 32 Punkte groß zu machen, was doppelt so groß ist wie eine typische Textgröße. Auch hier gilt der Zeilenhohe Troll, um sechs Punkte zur Schriftgröße hinzuzufügen. Alle anderen Überschriftengrößen variieren je nach Aufgabe, die sie innerhalb des Entwurfs ausführen. Zum Beispiel wird Überschrift drei normalerweise als Titel von Cyber-Elementen verwendet. Daher muss seine Größe gut mit dem gesamten Designkonzept funktionieren, anstatt nur ein Prozentsatz oder eine Art von einer Ableitung von den anderen Überschriften zu sein. jedoch Wenn Ihr Designjedochtief nach unten als Kopf in sechs geht, würde ich nicht empfehlen, es kleiner als die Textgröße selbst zu machen. Ich meine, kleiner als der Körper sich selbst angreift. Das ist einfach urkomisch, nicht wahr? Jetzt wissen Sie, wie Sie Schriftarten sowohl für Textkörper als auch für Überschriften auswählen können. Jetzt ist es an der Zeit, sie miteinander zu mischen. Machen wir das als Nächstes. 14. 5.4Wie du Schriftarten für Überschriften und body mischen kannst: Glück für uns. Es gibt eine Tonne von Ressourcen und auf Linsen für leichter für die Eltern. Werfen wir jetzt einen Blick auf einige von ihnen. Die 1. 1 ist ein Tool, das direkt in Google Fonds selbst integriert ist. Wenn Sie eine Schrift wählen, sagen wir offene Sand und klicken Sie auf Siehe Exemplar. Sie werden eine Panne von der Vorderseite sehen. In der unteren linken Ecke sehen Sie eine Liste von beliebten Front-Paarungen. Alles, was Sie tun müssen, ist ein vorderes Paar zu wählen. Und was sollte auf das Stück Text auf der rechten Seite angewendet werden? Sie können auch mit der Vorderseite überprüfen wird wie Überschrift und als Textkörper aussehen. Aber es gibt einen großen Nachteil dieses Werkzeugs. Sie erhalten nur eine bescheidene Vorschau auf die Gelder in Aktion. Es ist schwer vorstellbar, wenn man sich diese Textstücke anschaut, wie sie in verschiedenen Szenarien aussehen werden . Zum Beispiel, bei einem Aufruf von Action Sliders Karten etcetera, um einige weitere Vorderpaare zu sehen. Zusammen mit erweiterten Beispielen, gehen Sie zu Telefon starten große einfache dot io. Hier finden Sie ein paar ungewöhnliche Google aus Paris finden Sie bei der Gestaltung Ihrer nächsten Website eine von der größten und meistbesuchten Fondsmutter, ALS, ist Front Pair dot co. Hier finden Sie eine umfangreiche Bibliothek abseits der Vorderseite Paare, die in bestimmte Kategorien unterteilt sind. Übermitteln Sie eine beliebige Kombination aus Saref, San Serif und Kursivfonds, und wenn Sie eines der vorderen Paare mögen, können Sie es einfach mit einem einzigen Klick herunterladen. Sie erhalten eine ZIP-Datei, die Sie benötigen, um Telefone zu entpacken und zu installieren, die sich darin verstecken. Aber natürlich ist das größte Repository von Google Front-Paaren Google selbst. Ich meine, wenn Sie nur Google Google-Telefonpaare, finden Sie Tom's und Thomas aus Artikeln über die fertige aus Birnen für Sie zu wählen und zu verwenden. Wenn Sie also immer mit sich selbst diskutiert werden, welche Mittel zu verwenden sind, ist es eine gute Idee, die Vorschläge anderer Designer zu betrachten, die diesen mühsamen Prozess erfolgreich durchlaufen haben. Ein Wort der Vorsicht hier Wenn Sie eine Wortanzeige in einem Schriftartnamen bemerken, bedeutet das, dass es für Überschriften gedacht ist, nicht für Körper besteuert. Also, wenn ein Fondspaar eine Anzeige Art Fonds für Körpertext vorschlägt, ist das nur schlechte Ratschläge und Ignoranz. Seien Sie also vorsichtig, dass dies die gebräuchlichsten Wege und Tools sind, um große Google-Telefonpaare zu finden . Sie können eine gute Möglichkeit, eine einzigartige Website zu entwerfen, nur sehr daran denken, dass Sie nicht nur nach der künstlerischen Wirkung, sondern auch nach Lesbarkeit. Als Nächstes werden wir diesen Abschnitt kurz zusammenfassen und uns auf die drei wichtigsten Aspekte aus gut ausgewählten Mitteln für Ihre Website-Designs konzentrieren . 15. 5.5Die perfekte Schrift für die Benutzeroberfläche: Lassen Sie uns wissen, etwas ist los und werfen Sie einen Blick auf drei wichtige Aspekte aus jedem Fonds, der dankbar sein wird Ihre Web-Designs. Ich denke, dass Sie mittlerweile gut genug verstehen, dass Ihre Entwürfe Ihren Kunden Publikum dienen sollten . Wenn ein Benutzer die von Ihnen entworfenen Websites besucht und diese nach ein paar Sekunden verlässt, weil er nichts lesen kann, ist das ein Zeichen für ein schlechtes Design. Die besten Indikatoren für die Lesbarkeit sind klare Unterscheidungen zwischen Buchstaben, die ähnlich aussehen könnten . Zum Beispiel, Capital I und Kleinbuchstaben L gut gewählte Typografie bleibt außerhalb der Benutzer. Warten Sie, sozusagen. Ich meine, es macht den Lesevorgang einfacher. Aber Lesen ist nicht nur für die Anzeige von Blockbeiträgen. Es ist auch für das Lesen von Produktbeschreibungen, Lesen genannt Toe Aktionen auf Tasten über mich Abschnitte von Websites. Daher ist Typografie ein Mittel, um den Benutzer so schnell und so echt wie möglich von Punkt A nach Punkt B zu bringen. So abhängig von der Website Ziel, ob es Verkauf, Abonnieren oder Informieren leicht zu absorbieren Topographie kann stark helfen oder behindern Region dieser Ziele, und schließlich, gut Sie ich Schriftart funktioniert gut über verschiedene Bildschirmgrößen, egal welches Gerät oder Website auftaucht auf der Typografie Masse lesbar bleiben. Einige Leute behaupten, dass Sarah-Fonds auf Smartphone-Bildschirmen schwieriger zu lesen sind, dann serifenfreie Telefone. Und in der Tat könnten Menschen mit Lese- oder Sehstörungen eine kleinere Serifensteuer schwerer zu lesen finden . Aber wenn eine serifenwebschrift gut komponiert ist, sollte sie leicht zu lesen sein, auch auf kleineren Schrauben, auch für Menschen mit Leseverfahren, die jemals gefunden haben, zu wählen. Denken Sie daran, dass der Zweck aus jedem Text auf Ihrer Website verwendet, um Ihre Benutzer zu helfen, ihre Ziele zu erreichen . Berücksichtigen Sie den gesamten Kontext, anstatt sich bei Ihrer Entwurfsentscheidung nur auf eine Reihe von Regeln zu verlassen. Bisher haben wir einiges über Farben und Typografie im Webdesign gelernt. Jetzt ist es an der Zeit, einen Blick auf die Bausteine einer typischen Website zu werfen. 16. 6.1Header, Branding, Navigation und Hero: Beim Entwerfen von Websites müssen Sie sich an bestimmte Blöcke erinnern, die sie bauen. Einige von ihnen werden immer im Design vorhanden sein, aber einige von ihnen sind optional. Werfen wir einen Blick darauf, wie eine typische Website aufgebaut wird. Wir werden eine Website sezieren, beginnend von oben und nach unten. Der allererste Baustein einer Website wäre frisst Hutmacher. Es ist ein Container, der normalerweise die Brandon-Informationen wie das Logo und Slogan enthält, eine Art Navigationssystem und manchmal Kontaktinformationen, einschließlich Social Media Flügel. Viele Website-Designs, einschließlich Suchfeld in der Kopfzeile als auch. Typischerweise der Brandon auf der linken Seite und die Navigation auf der rechten Seite. Das optionale Kontaktinformations- und Suchsystem kann auch rechts, oberhalb oder unterhalb der Navigation angezeigt werden. Aber das ist nur eine Möglichkeit, den Hutmacher zu präsentieren. In einigen Designs, vor allem modernen Blutdesigns, der Heller Inhalt oft zentriert, wird der Heller Inhalt oft zentriert, so dass das Logo in der Mitte und die Navigation geht darunter, und er ist auch zentriert. Ich denke, es macht das Design noch besser organisiert und leichter zu verstehen. Was unter der Heidekraut geht, ist optional. Ich meine, du kannst etwas einschließen, das als Helden-Sektion bezeichnet wird. Also, was ist das? Grundsätzlich ist es eine Komponente, die wichtige Inhalte auf Ihrer Seite präsentiert. Sein Hauptzweck ist es, schnell die Aufmerksamkeit des Benutzers zu erregen und zu erklären, worum es auf der Website geht . Sie können es oft auf den Markteinblicken sehen, wo Sie aufgefordert werden, Ihre E-Mail-Adresse einzugeben um ein kostenloses e-Buch zu erhalten. Ooh, ein Bericht oder so etwas. In der Regel enthält Hero Abschnitt ein vollständiges Hintergrundbild oder ein Video mit überlagernden Inhalten, die Topographie groß und fett ist, und meistens finden Sie hier auch eine Art von Call to Action. Manchmal wird das vollständige Hintergrundbild zwischen den Header- und Heldenabschnitten als Reaktion auf Versionen des Designs geteilt , besonders bei Mobiltelefonen, kann ein Heldenbereich in etwas völlig anderes verwandeln. Das Hintergrundbild kann ersetzt oder sogar vollständig entfernt werden, wodurch das Design leichter wird. Eine andere Idee für den Heldenbereich ist, den Schieberegler zu verwenden , der ein Schaufenster von Bildern oder eine Kombination aus Bildern und Text ist. Diese Bilder sind interaktiv und ändern sich automatisch oder auf Benutzerinteraktion. jedoch Heutzutage beginnen Schiebereglerjedochüberflüssig zu werden. Zunächst einmal sind sie nicht zu s yo freundlich. Zweitens sind sie zu schwer und ein bisschen sinnlos auf den kleinen Smartphone-Bildschirmen. Aber der gesamte Heldenbereich ist wirklich optional. In einigen Fällen kann es tatsächlich den gesamten Zweck der Website behindern, und ich spreche von Blockdesigns. Eine Blondine dreht sich hauptsächlich um die Artikel, so dass Benutzer, die eine Website besuchen, mit dem, was er erwartet, hier zu finden , was genau die Artikel sind. Natürlich können die Artikel in einer interessanteren Weise präsentiert werden als nur Klappertext, aber wir werden über und über andere Abschnitte sprechen, die unter dem Helden im nächsten Video gehen . 17. 6.2Die Mitte und die unteren Abschnitte deiner Website-Website: Lassen Sie uns nun über die Kopfzeile und die Heldenabschnitte und stoppen Sie die Artikel und Seitenleisten . Diese Abschnitte werden nicht nur wegen Ihrer Designwahl anders aussehen, sondern vor allem wegen der Art der Website. Sie werden anders aussehen für eine blawg verschiedene kostenlose Corporate oder persönliche Website. Jährliche C-Variationen innerhalb dieser Konzepte, um die Dinge einfach zu machen. Wenn es sich nicht um ein Blawg handelt, sieht der Abschnitt unter dem Hero-Bild wie horizontale Kästchen aus, getrennt durch Inhalte und Farben, können sie Mixe-Off Icons, Textbilder und Links enthalten . Der Hauptgrund für die Erstellung dieser Abschnitte auf eine bestimmte Weise besteht darin, sie auf mobilen Geräten leicht lesbar zu machen . Der Schlüssel hier ist, um das Desktop-Design auf dem mobilen Design zu erstellen. Alles, was auf einem Smartphone gut aussieht, sollte bei Blockdesigns auch auf einem Desktop-Computer gut aussehen. Diese Abschnitte werden höchstwahrscheinlich die Artikel umfassen, und sie können auf verschiedene Arten präsentiert werden. Aber ein gemeinsamer Nenner ist, dass sie immer die Artikel Titel sie können auch vorgestellte Bilder präsentieren, blockieren Post Auszüge, Links und andere Informationen. Manchmal, wenn es sich um eine E-Commerce-Website, Artikel können Produktfotos enthalten, Beschreibungen Preise auf einer anderen Website Baustein, die neben den Abschnitten oder Artikeln sitzen kann , ist eine Seitenleiste. Eine typische Sidebar enthält Informationen, die in gewisser Weise die Hauptnachricht außerhalb der Website ergänzen. Es könnte die Autoren-Info des Blogs sein. Social-Media-Feed neueste Beiträge, Tags Aufruf zu Aktionen , verwandte Produkte, etc. Interessant an Seitenleisten ist, dass sie auf der rechten Seite der Seite auf der linken Seite oder auf beiden Seiten gleichzeitig sitzen können . Der letzte zentrale Baustein einer Website ist seine Fußzeilen sind im Laufe der Jahre aus einfachen einzeiligen Abschnitten gewachsen , die hauptsächlich das Urheberrecht in Folk enthalten. Sie haben sich zu anspruchsvollen Boxen mit vielen zusätzlichen Daten entwickelt. Fußzeilen und Kopfzeilen sind auf jeder Website gleich und enthalten Informationen, die sich nicht ändern. Egal, welche Seite der Benutzer gerade ansieht, sie sind ein One-Stop-Shop für alle wichtigen Informationen, die der Benutzer benötigen könnte. Deshalb sehen Sie in den Fußzeilenabschnitten Quick BIOS oder Über mich Links zu den wichtigsten Seiten oder aktuellen Angeboten. Eine aktuelle Commons Social-Media-Flügel oder ganze Unterabschnitte mit Social-Media-Feeds wie Instagram-Fotos. Fußzeilen sind in der Regel durch die Verwendung von Kontrast in Farben in Bezug auf die gesamte Website leicht zu unterscheiden . Wenn sie richtig gemacht werden, lassen sie die ganze Website professionell und sauber aussehen. Um die Dinge zusammenzufassen, enthält eine typische Website einen Header. Ein Held Abschnitt Abschnitte mit Artikeln, manchmal Seitenleisten und immer f Fußzeile. Jetzt, da Sie wissen, wie Sie eine Website strukturieren, ist es an der Zeit, sich Raster anzusehen. Sie könnten zunächst beängstigend aussehen, aber sie helfen, eine symmetrische und einfacher zu codierende Websites zu erstellen, also werfen wir einen kurzen Blick auf sie als nächstes. 18. 6.3Was sind Raster und wie du sie verwendest.: Also, was ist ein Gitter? Betrachten Sie es als ernsthafte unsichtbare Linien, die Ihnen helfen, Ihr Website-Design zu strukturieren und es symmetrisch und einfacher zu programmieren. Diese Linien sind eine große Hilfe beim Platzieren der Elemente Ihres Designs, nicht nur der Hauptcontainer. Ein Mangel an Ausrichtung ist sehr auffällig und erzeugt einen sinkenden Eindruck. Ein typisches Gitter besteht aus Einheiten, Dachrinnen und Säulen. Werfen wir einen kurzen Blick auf diejenigen, die ein 12-Säulen-Raster als Beispiel verwenden. Einheiten sind die grundlegenden Bausteine von jedem Gitter. Sie sehen aus wie lange, ein bisschen schmale Säulen mit etwas Platz auf jeder Seite von ihnen. Dachrinnen sind Räume, die auf der linken und rechten Seite jeder Einheit sitzen . Es spielt keine Rolle, ob es sich um ein Zentrum für rechte oder ganz linke Einheit handelt. Es gibt immer die gleiche Menge an Ghadir auf beiden Seiten von ihnen. Die Spalten haben den verwirrendsten Namen aus allen Körnungen Bausteine. Grundsätzlich sind sie Cluster von ähnlichen Inhalten, verteilt auf eine bestimmte Anzahl von Einheiten und bekam ihre. Das gebräuchlichste und vielseitigste Gitter ist ein 12-Säulen-Git Es ist ein großer Gemeinsamkeiten. Für Designer und Entwickler ist es der größte Vorteil, dass es leicht in verschiedene Gruppen von Einheiten unterteilt werden kann . beispielsweise Sie könnenbeispielsweisevier Spalten aus drei Einheitenclustern erstellen, sechs Spalten aus zwei Einheiten-Blastern usw. Das Schöne an diesem System ist, dass Sie Säulen miteinander mischen können. Zum Beispiel, auf der linken Seite, können Sie eine acht Einheiten Putz und auf der rechten Seite, eine vier Einheiten Cluster und so weiter. Der Trick hier besteht darin, das Gitter in Spalten zu teilen, deren einige immer 12 sein werden. Sie können Spalten auch horizontal erstellen, sozusagen. Ein Abschnitt kann in zwei Spalten unterteilt werden, ein anderer in vier, ein anderer in drei und so weiter. Ich würde raten, das Gitter die ganze Zeit zu benutzen. Anfangs mag es ein bisschen peinlich sein, aber nach einer Weile lieben Sie die Gitter. Sie werden Ihnen enorm helfen, zusammenhängende, ästhetisch ansprechende Designs zu schaffen . Wenn es einfacher für Sie ist, können Sie einfach eine PSD-Version eines 12-Säulen-Rasters herunterladen und es einfach im Inneren verwenden. Affinitäts-Designer. Sie können nur googeln 12 Spalten Körnung und Sie werden viele und viele Beispiele finden, aber ich denke, dass, um es ein bisschen besser zu verstehen, was unsere eigenen entwerfen würde, lassen Sie uns das im nächsten Video tun. 19. 6.4Wie du dein eigenes Raster entwirfst.: Lassen Sie uns Designer öffnen und ein neues Dokument erstellen, das das Webprofil für die Seitenvoreinstellung verwenden wird . Ich werde mit Full HD gehen und ich werde die Creat Art an Bord Option überprüfen. Ich lasse alle anderen Optionen intakt. Bevor ich mit dem Erstellen von irgendetwas beginne, stelle ich sicher, dass in der U I design Fangvoreinstellung aktiviert ist. Dies wird mir helfen, ein großes Pantoffel-Faktenraster zu schaffen. Beginnen wir mit der Erstellung eines grundlegenden rissigen Winkels, der 1200 Pixel breit sein wird. Dies ist wichtig, weil wir Designs erstellen werden, die auf einem 1200 Pixel-Raster mit und 1200 Pixel sind die typischste mit zeitgenössischen Websites. Stellen wir sicher, dass das Rechteck genau in der Mitte der Kunst an Bord ist, und jetzt können wir die ersten Führer herausbringen. Unterdrückt das Steuerelement, sind Tastenkombination auf meiner Tastatur und bringen zwei Führungen heraus, die auf beiden Seiten aus dem Rechteck schnappen wird . Unser Raster wird den Bootstrap-Richtlinien folgen. Wenn Sie nicht wissen, was Bootstrap ist, lassen Sie mich Ihnen einfach schnell sagen, dass es ein Web-Entwicklungsframework ist, das es in der W W W W Welt weit angepasst ist. Es verwendet ein 12-Säulen-Gittersystem, bei dem alle Spalten 15 Pixel aus klopfen auf beiden Seiten haben . Deshalb werde ich jetzt das Rechteck von 12 mit diesem Transformationsfeld göttlichen, und ich werde sicherstellen, dass zum Transformationsbeginn auf der linken Seite sitzt. Danach subtrahiere ich 30 Pixel vom Ergebnis in Rechteck, da 15 Pixel plus 15 große Slips auf jeder Seite 30 Pixel betragen. Das letzte, was zu tun ist, ist, die Spalte um 15 Pixel nach rechts zu verschieben, und die Basiseinheit ist bereit. Lassen Sie uns nun auf der ersten Spalte nach rechts klonen, indem Sie die Strg-Taste gedrückt halten bis die geklonte Spalte mit dem Original einrastet. Danach müssen wir den Kerl nur um 30 Pixel nach rechts bewegen. Nun, wenn wir nur in der zweiten Spalte auf der rechten Seite klonen, wird der Designer uns den Abstand zwischen den Spalten zeigen und sie an Ort und Stelle einrasten, wenn die Entfernungen gleich sind. Alles, was noch zu tun ist, ist die Steuerung plus J auf der Tastatur zu drücken. Um die letzte Transformation zu duplizieren, die Klonen und Verschieben war. Wir müssen es noch neun Mal machen, bis wir alle 12 Spalten haben. Jetzt haben Sie Ihr ganz eigenes maßgeschneidertes 12-Säulenraster für ein Website-Design. Wenn Sie möchten, können Sie die Farbe von den Spalten ändern, ihre Transparenz und natürlich ihre Größe ändern. Sobald das Design in der Höhe wächst, wenn wir zum eigentlichen Entwurfsteil des Kurses übergehen, werden Sie dieses gleiche Raster in Aktion sehen. Aber bevor wir das tun, werfen wir einen Blick auf das, was gerade in Bezug auf Web-Design ist. Lassen Sie uns die neuesten Webdesign-Inspirationen entdecken. 20. 7.1-7 Webdesign-Trends in der design: In den nächsten Videos werden wir einen Blick auf moderne Webdesign-Trends werfen. Dies wird Ihnen helfen, das Design von Mustern zu verstehen, die Designer heutzutage folgen . Beginnen wir mit Menüs, die beim ersten Glenn's versteckt sind. Sie verstecken sich in der Regel hinter drei Chorizo NITEL Bars genannt Hamburger-Handbuch. Klicken Sie einfach auf sie, um ein vollständig geblitztes Navigationssystem zu sehen. Wenn Sie denken, dass dies eine Möglichkeit ist, die mobilen APP-Menüs nachzuahmen, haben Sie absolut Recht. Da immer mehr Menschen surfen im Web mit ihren Smartphones, macht es Santa, einige dieser Erfahrung auf die Desktop-Website zu übertragen. Die Entwürfe, einer der Vorteile der versteckten Navigation, ist, dass es mehr Platz auf der Hauptseite schafft. Es ermöglicht, Hauptinhalte stärker hervorzuheben. Ein weiterer Vorteil seines Namensmenüs ist die Tatsache, dass Sie es mit einem traditionellen Menü kombinieren können , wenn dieses Design es braucht. Wenn Sie viele Orte haben, an denen Sie den Benutzer mitnehmen können, können Sie einige davon unter einem Menü ausblenden und andere im sichtbaren Menü anzeigen. Design weise mobile Menüs oft verwendet Hintergrundfarben kontrastieren mit dem Gesamtfarbschema der Website, so dass es sich von den anderen abheben. Der Text verbindet Farbkontrast mit dem Hintergrund für eine einfache Navigation. Es scheint, als hätten Benutzer daran gewöhnt, Navigationssysteme als einfache drei Zeilen zu sehen, die gesammelt werden müssen, um zu sehen, was sich darunter versteckt. Deshalb können Sie frei mit Hamburger experimentieren. Manu ist in deinen Entwürfen. Zeitgenössische Benutzererfahrung verschiebt sich langsam von visuellen zwei Wörtern. Deshalb spielt die Typografie eine größere Rolle als je zuvor. Aber was bedeutet große und mutige Typografie? Nun, es bedeutet sicherlich nicht, dass Sie unbedingt nur fett formatierte Versionen der Schrift verwenden und sie auf die höchstmögliche Größe setzen müssen. Es bedeutet, dass viele Designs eine ordentliche Menge an Platz für sauberen und prägnanten Text direkt in der Mitte eines bestimmten Abschnitts haben. Das offensichtlichste Beispiel dafür sind natürlich die Handlungen des Helden. Mit großen Typografie über Spur Hintergrundbilder, die moderne UX verschiebt sich in Richtung Slogans, die sauber von Größe und nützlich sind, was bedeutet, dass in der Zukunft, Typografie ist Rolle im Design wird größer als je zuvor. Die Smartphone-Revolution hat sich zweifellos geändert. Die Art und Weise, wie Menschen mit der Internet-Welt interagieren. Aber es gibt einen Aspekt dieser Revolution, der oft weggelassen wird, und das ist wirklich wichtig für US-Designer. Bis vor kurzem wurde das Hauptbetriebssystem verwendet, um mit Microsoft Windows online zu gehen. Aber jetzt ist es Googles Android, und Google hat sich mit ihrem Designsystem, genannt Materialdesign und Materialdesign Licht kommen . Deshalb Designer, die eine nahtlose erstellen möchten, die Sie erleben, für die Benutzer Hand Material Design Visuals verwenden. Ideen in den Web-Designs. Materialdesign ist nicht weg in einem Hanson flachen Design. Es konzentriert sich auch auf die Einfachheit, fügt aber einen Hauch von Dreidimensionalität. Wenn Sie es in Ihren Designs verwenden möchten, werden Sie glücklich sein zu hören, dass es mit einem ganzen Spektrum von Ihnen y Tools, Farben, Topographie, Interaktionen usw. kommt , Farben , Topographie , Interaktionen . Sie können sie auf dem Material überprüfen, das ich schulde. Webseite. Es ist nicht zu leugnen, dass das schnellste Wachstum und die Entwicklung in der Welt mobiler Geräte ist . Es hat erhebliche Auswirkungen für Web entwickelt, um, mit dem Schwerpunkt auf das Wort Design. Visuelle Kommunikationsverschiebung, die durch das mobile APP-Design begonnen wird, macht seinen Weg zum Webdesign als auch, und alles begann mit Instagrams Logowechsel. Modernes Design verwendet oft mehr und hellere Farben. Zusammen hat er Grady INts zurück, aber sie sind Sendungen und etwas subtil. Sie werden oft mit einfachen flachen Designsymbolen und prominenter Typografie gebetet. Was ist interessant? Radiance machen seinen Weg Zehe-Icon und Logo-Design als auch. Aber wie immer, im Fall von Grady INTS, müssen Sie wirklich vorsichtig sein, nicht mit ihnen über Bord zu gehen. Glücklicherweise gibt es Online-Tools, die Ihnen helfen können, schön aussehende Zutaten für Ihre Web-Designs zu erstellen . Das beste Beispiel ist ein Werkzeug namens U I Grady ints dot com. Hier finden Sie eine fantastische Sammlung von schönen Grady INTS, zusammen mit den Farbcodes für Easy Implementation, eines der am schnellsten wachsenden Elemente im Website-Design. Ost. Die Verwendung off-Video von Vollbild-bewegten Bildern oft als Hintergründe anstelle von Bildern verwendet , um Pop-ups und eingebettete Videos von Social Media Video ist ein Muss, wenn es um Inhalte geht . Die am weitesten verbreitete Verwendung von Video ist, dass es als Hintergrund in den Hero-Abschnitten von Websites angezeigt wird . Der beste Weg, Video in diesem Format zu verwenden, ist es, die Nachricht zu ergänzen und einen Call to Action, die über das Video gestellt werden. Aber manchmal, besonders auf persönlichen Websites, sind Videos von jeglichen visuellen Elementen frei. Sie sind freundlich aus Präsentation vom Eigentümer der Website. Es gibt auch Videos, die in gewisser Weise Standbilder nachahmen. Die Bewegung des Geländes ist begrenzt. Stellen Sie sich vor, Wind weht in den Bäumen, so dass sie perfekt als Hintergrundvideos, aber fügte hinzu, dass extra besondere etwas, um das Design, ohne abzulenken. Internet sagt, dass Video heutzutage König ist. Es ist durchaus möglich, dass an einem gewissen Punkt Ihres Designs Karriere gebeten wird, eine Website zu entwerfen, die Video in irgendeinem Format verwenden wird. Deshalb ist es eine wirklich gute Idee, diesen Trend genauer zu betrachten. Immer mehr Designer akzeptieren die Tatsache, dass sie wirklich darüber nachdenken müssen, dass ihre Designs häufiger auf Smartphone-Bildschirmen als auf Laptops angesehen werden. Das bringt eine totale Verschiebung in der Entwicklung ihrer Entwürfe mit sich. Die Desktop-Version der Website wird Onley, ein Derivat seines mobilen Originals. Dieser Designer muss ihn oder sich selbst fragen. Eine grundlegende Frage wird es nur Smartphone gut aussehen. Aber die Frage kann sich in Zukunft mit der Entwicklung von Wearables ändern. Vielleicht ist es Zeit, uns zu fragen, es auf einer Smartwatch gut aussehen wird? Was uns zur letzten Miete auf unserer Liste bringt, die Karten, die Sie entwerfen. Die Idee hinter Karten ist, den Inhalt in kleine Behälter zu stopfen, um es geräteübergreifend zu machen . Von Smartwatches bis hin zu großen Desktops. Jeder Container ist ein Cluster von Informationen über eine bestimmte Idee. Die Schnittstelle ist vereinfacht und leicht verständlich. Dieser Ansatz wird auch in vielen modernen Blog's verwendet, wo ein Artikel auf der Zielseite ein eigenes Modul hat. Dies sind die sieben wichtigsten Trends im Webdesign heute. Es ist eine gute Idee, sich dessen bewusst zu sein, da es sich nicht nur um Visuals handelt, sondern vielmehr um ganze Konzepte von effektiver Inhaltsbereitstellung an die Benutzer. Als nächstes werden Sie einen Blick auf ein paar Orte rund um das Web werfen, wo Sie einige großartige Web-Design-Inspirationfinden können Web-Design-Inspiration 21. 7.2Wo du die richtige Inspiration für dein nächstes Design findest: In diesem Video wir einen Blick auf ein paar Orte rund um das Web, wo Sie große Inspiration für Ihr nächstes Web-Design-Projekt finden . Die erste Website, die ich empfehlen würde, heißt ein Wort dot com mit einem dreifachen Doppel Sie für www buchstabiert . Hier finden Sie viele verschiedene Designbeispiele, die in Kategorien wie Illustration, Corporate Bloggen usw. gesammelt wurden Corporate Bloggen . Wenn Sie ein bestimmtes Design mögen, können Sie die Quell-Website besuchen und einen Blick darauf werfen, wie sie aufgebaut sind. Was, wenn überhaupt, Trends gibt es folgende und einfach lernen von der besten zweiten Website, die ich empfehlen würde ist ein WordPress-Theme Marktplatz namens Thema Wald dot net. Hier finden Sie nicht nur WordPress-Themes, sondern auch HTML-codierte Seitendesigns. Es ist ein riesiges Repository aus verschiedenen Designs Für Ihre Inspiration. Sie können aus vielen verschiedenen Kategorien wählen, und Sie können auch eine Vorschau anzeigen, wie ein bestimmtes Design in der realen Welt funktioniert. Sie können auch Webdesign inspiration dot com hier besuchen, auch nur bestimmte Tags und Kategorien, nach denen Sie ihre Designs sortieren möchten. Es ist eine große Ressource aus verschiedenen Designs. Ich denke, es ist die Vielfalt, die der wichtigste Aspekt aus diesem Web-Design-Repository viele und viele von Web-Design-Inspiration Repositories rund um das Web ist. Wenn diese drei sind nicht genug für Sie, obwohl ich denke, dass für den Anfang sie gut tun werden, können Sie nur Google Web-Design, Inspiration und immens sich in der Web-Design-Welt. Ich denke, dass Sie jetzt gerade genug keine Liste haben, um mit Ihren eigenen Entwürfen zu beginnen. Sie kennen die Prinzipien, die Sie kennen, die Trends und wo Sie nach Inspiration suchen können. Der nächste Teil besteht darin, Affinity Designer zu verwenden, um Ihre Ideen zum Leben erwecken zu lassen. 22. 8.1Jedes Design muss sich auf das Design von Websites bedürfnissen, das sich Scaffolding benötigt: aus einem typischen eifrigen Designern Sicht. Das Erstellen eines Drahtrahmens für ein Website-Design ist ebenso langweilig wie redundant. Nun, das ist nicht wahr. In der Tat kann ein Drahtrahmen dabei helfen, Ihren Workflow enorm zu beschleunigen, und es kann Ihnen viel Zeit sparen. Viele Ideen, die in Ihrem Kopf großartig erscheinen, wenn Sie sie sich vorstellen, neigen dazu, schlecht aussehen wenn sie auf einem Computerbildschirm gestellt werden. Und vertrau mir, ich weiß das aus Erfahrung, aber was ist ein Drahtrahmen, und warum mache ich so eine große Sache darüber? Drahtrahmen sind schematische Versionen von Websites, die Ihnen bei der visuellen Darstellung der Website-Bausteine helfen . Es gibt eine Tonne aus Plug Ins, Online-Tools und Ressource ist bezahlt und kostenlos, dass Sie bei der Erstellung von Drahtrahmen zu helfen. Aber in nur einer Sekunde werden wir unsere eigene Drahtrahmen-Bibliothek oder zumindest die wesentlichen Elemente eines Drahtrahmens entwerfen , und dann werden wir sie in unsere Asset-Bibliothek importieren. Aber zuerst, lassen Sie uns die Idee des Drahtrahmens und seiner praktischen Anwendung sezieren. Zunächst möchten Sie vielleicht einfache Boxen erstellen, die den Website-Elementen entsprechen würden. Es ist eine gute Idee, es gegen eine gute Sie bereits vertraut mit dieser vorläufigen Phase ist der grundlegendste Weg weg. Erstellen einer Website Gerüst Denken Sie daran ist ein einfaches Doodle, das Ihnen zeigen soll ob das, was in Ihrem Kopf ist, gut auf Papier oder Bildschirm aussehen wird. Die typischsten Boxen würden eine Brandon Element Navigationshelden Abschnitt, Bild, Banner, Fußzeile usw. darstellen , Bild , Banner , Fußzeile . Der nächste Schritt wäre, um die Informationshierarchie mit dem Typ zu erstellen. In diesem Stadium ist Ihre Schriftart nicht so wichtig wie die Verwendung unterschiedlicher Fondsgrößen, um die Unterschiede in der Bedeutung der Website-Elemente zu zeigen . Regel derRegelwerden die wichtigsten Elemente für die Verwendung in einer größeren Schriftgröße dargestellt, und die weniger wichtigen Elemente werden mit einer kleineren Schriftgröße dargestellt. nächste Schritt bei der Betonung der Bedeutung der Website-Elemente ist die Verwendung verschiedener Grautöne. Die allgemeine Regel besagt, dass dunklere Farben mawr bedeuten. Wichtige Elemente und hellere Farben bedeuten weniger wichtige Elemente. So sieht ein typischer Drahtrahmen aus. Ich denke, es ist eine gute Idee, eine eigene Drahtrahmen-Bibliothek zu haben, damit Sie sie immer verwenden können, wenn Sie eine Website entwerfen. Affinity Designer ermöglicht es Ihnen, Ihre eigenen Drahtrahmenelemente zu erstellen und sie in separate Gruppen von Assets zu platzieren . Werfen wir einen Blick auf den Prozess des Zusammenbaus dieser Elemente in Affinität. Designer. 23. 8.2Gestalte deinen eigenen Drahtrahmen in Designer: Wenn Sie Ihr eigenes Drahtrahmensystem erstellen, sollten Sie mit den Elementen beginnen, die Sie wahrscheinlich in einem typischen Webdesign-Szenario verwenden . Ich meine, wenn du willst, kannst du ein Glaubensbekenntnis, all die Elemente, die du dir vorstellen kannst. Aber ich denke, wenn Sie zuerst die wesentlichen Elemente erstellen, haben wir eine großartige Basis für den Bau und die Erweiterung von Drahtrahmen. Aber was sind diese wesentlichen Elemente? Ich denke, wir werden mit einer Marke in Block eine Navigation beginnen, zusammen mit einem Hamburger-Menü, einem Helden Abschnitt Block rühmen, einem horizontalen Text und Hintergrund-Teiler. Icahn Sidebar und eine Fußzeile. Heutzutage ist es vielleicht eine gute Idee, aus Gründen, mit denen Sie bereits vertraut sind, einen Videodraht von Elementen zu erstellen . Lassen Sie uns also unsere wesentliche Drahtrahmen-Bibliothek bauen. Ich möchte, dass Sie es als Ausgangspunkt für den Bau Ihrer eigenen Bibliothek betrachten. Ich möchte, dass Sie den Prozess und die Logik dahinter lernen. Dies ermöglicht es Ihnen, Ihre eigenen umfangreichen Drahtrahmen zu erstellen. Ich habe bereits ein einfaches Full-HD-Dokument erstellt, aber ehrlich gesagt, alle Dokumente, Zeichen, die mir erlauben würden, Ihr Kunstwerk bequem zu erstellen, werden in Ordnung sein. Beachten Sie jedoch, jedoch, dass ich mich nicht dafür entschieden habe, ein Kunstboard für diese Art von Skizzenarbeit zu erstellen. Ich glaube nicht, dass ein Kunstbrett notwendig ist. Ich werde auch sicherstellen, dass die U I Snap in voreingestelltem Osten eingeschaltet ist. Ich werde damit beginnen, einen Bildblock zu erstellen. Dieser wird in vielen Elementen verwendet werden, also denke ich, dass es ziemlich logisch ist, damit zu beginnen. Ich werde nur das Rechteck-Werkzeug greifen und ein Rechteck im Transformationsfenster erstellen. Ich werde 16 für mit und 94 Höhe eingeben, und ich tue dies, weil 16 mal neun Verhältnis das typischste Bildschirm-Seitenverhältnis ist. Und Bilder auf einer Website werden in der Regel auf diese Weise angezeigt, ebenso wie die Videos. Natürlich ist es viel zu kleine Röhre verwendbar, also werde ich ihre Proportionen im Transformationsfeld betrachten und die Größe vom Rechteck vergrößern . Aber die Tatsache, dass wir mit den 16 mal neun Pixel begonnen haben, wird das neue Rechteck Feind dieses 16 mal neun Seitenverhältnis machen . Ich möchte nicht, dass wir einen Schlaganfall haben, aber ich möchte ein ziemlich dunkleres Grau haben, Phil, sobald es erstellt ist, werde ich zwei sich schneidende Linien zeichnen, die darauf hinweisen, dass dies tatsächlich ein Bildelement ist. Also werde ich den Stift Tal greifen und ihn in den Linienzeichnungsmodus stellen. Ich werde Freude, Einfache Linie, die einen einen Punkt weißen Strich haben wird. Und kein Phil, natürlich, ich lasse die Deckkraft auf etwa 25 bis 30% fallen. Schließlich kopieren wir die Zeile und stützen sie zurück in. Dann lassen Sie es horizontal drehen, indem Sie das Kontextfenster verwenden. Alles, was noch zu tun ist, ist es in unsere Asset-Bibliothek zu bringen. Übrigens, wenn Sie die Asset-Bibliothek nicht aktiviert haben, gehen Sie einfach zur Ansicht und dann Studio und wählen Sie Assets im Assets-Bedienfeld aus. Ich erstelle eine neue Kategorie, die ich als Drahtrahmen umbenennen werde. Jetzt kann ich einfach das Bild auswählen und aus dem Panel-Menü auswählen und aus der Auswahl beginnen, ihre Bibliothek zu bauen. Und genau so haben wir das erste Element erstellt, und wir haben bereits begonnen, die Bibliothek zu bauen. Lassen Sie uns jedoch im nächsten Videofortfahren jedoch im nächsten Video 24. 8.3Letter wird weiterhin die Bibliothek aufbauen: Ich werde damit beginnen, ein Video Frau Ring Element zu erstellen. Und dafür werde ich das Bildelement klonen und die inneren Linien loswerden. Lassen Sie uns nun ein Play-Schaltflächen-Symbol dafür erstellen. Lassen Sie uns ihr Dreieck Werkzeug greifen und erstellt Dreieck, dass wir haben, um zu drehen und wieder Größe ein wenig. Wenn das erledigt ist, wird es einen weißen Phil geben. Legen Sie die Deckkraft auf 25% ab und richten Sie sie am Rechteck aus. Lassen Sie uns diese Jungs gruppieren, damit wir sie jetzt zu unserer Drahtrahmen-Bibliothek hinzufügen können, genau wie wir das Bildelement hinzugefügt haben. Jetzt werden wir ein Bild und Text kombiniertes Element erstellen. Auch hier werde ich das Bild wiederverwenden, das ich bereits habe, aber ich werde einen Titel und Auszüge hinzufügen. Dafür werde ich das Rahmentext-Werkzeug greifen und ein Textfeld zeichnen, das als Zweig wie das Bild sein wird. Ich werde keinen Text in korrigieren, aber ich werde stattdessen die Option „Füllstoff einfügen“ verwenden. Natürlich ist es eine gute Idee, den Titel wie eine echte Überschrift aussehen zu lassen, also werde ich die Schriftart zusammen mit ihrer Größe und ihrem Stil ändern. Ich werde es jetzt klonen und die Frontfamilie ändern, Sonnys Stil und die Führung auch. Also mit diesem Teil kann mehr wie ein Blawg Post Auszug aussehen. Der Vorteil, dieses Element auf diese spezifische Weise zu erstellen, besteht darin, dass ich es nicht ändern kann, nachdem ich es in eine Gruppe und dann in ein Asset verwandelt und es dann auf die Seite gezogen habe, die Größe nicht ändern und die Software die Textrahmen mit Text füllen lassen kann. Und trotzdem, wenn ich möchte, kann ich die Größe der Textrahmen ändern, sowohl den Titel als auch den Textauszug verkleinern oder erweitern, und das ist ziemlich praktisch. Nächstes Element wird erstellt ist, dass sie wieder Logo. Ich werde das Bildelement verwenden, aber dieses Mal werde ich es in ein Quadrat verwandeln. Ich füge auch ein Wort auf der rechten Seite hinzu. Jetzt werde ich diese Kerle gruppieren und sie in einen Vermögenswert verwandelten . Als nächstes wird ein Navigationssystem zu erstellen. Nun, das ist so am einfachsten in einem Stück Texteditor, dann duplizieren. Sie machen Spaß, für das Manual Inc zu verwenden, sollte nicht zu groß noch mutig sein. Lassen Sie uns auch ein Hamburger-Menü erstellen. Und das sind diese drei horizontalen Linien, die den Hauptmann abdecken. Erinnern Sie sich? Ok, großartig. Lassen Sie uns greifen den Stift tal und dann stellen Sie sicher, dass es im Linienmodus hat eine einfache Linie erstellt , die einen Zwei-Punkt jemand zu dunklen Strich und keine Phil haben wird. Wenn das erledigt ist, duplizieren wir die Zeile zweimal und verwandeln unser Hamburgerhandbuch in einen Vermögenswert. Unser nächster Auftrag ist die Schaffung eines Heldenabschnitts, und dies wird uns tatsächlich die Möglichkeit geben, eine ziemlich große Flexibilität zu nutzen wenn es darum geht, Assets innerhalb eines Designers zu erstellen. Ich war mit der Ausleihe des Bild-Asset und in großen stecken, und es ziemlich viel. Als nächstes erstellen wir eine große und fett gedruckte Überschrift, die im Kontrast geschrieben wird, in heller Farbe, gefolgt von etwas kleinerem Textkörper. Der letzte Akzent hier wäre, einen Aufruf zur Aktion hinzuzufügen. Lassen Sie uns also eine Schaltfläche mit dem Rechteck-Werkzeug und dem Type-Werkzeug erstellen, natürlich, das die Schaltflächenelemente gruppiert und dann alte Stücke mit Ausnahme des Hintergrunds gruppiert , aber eine Linie alles schön in die Mitte des Hintergrundbildes. Wenn wir wissen, Gruppe alle diese Elemente schwächen, verwandeln Sie sie in einen Helden Drahtrahmenelement, aber wenn wir sie getrennt halten, können wir sie auf die Vermögenswerte separat eingeben, was uns erlaubt, ein Held Asset und separate Elemente wie eine untere Überschrift jedes Stück aus Körper besteuert. Nun, das ist ziemlich praktisch, findest du nicht? Mit all diesen Elementen können wir nun ein Feature-Element erstellen. Sie können das Bild-Asset auf die Einfügeplatte ziehen, dann die Überschrift und deren Körper besteuert werden. Jetzt ist es nur eine Sache aus, das Bildelement in ein Quadrat zu drehen und in der Vorderseite der Überschrift und des Körpers zu ändern besteuert, um dies so zu machen, während Rahmenelement funktioniert. - Nein , wir haben so ziemlich alle Elemente, die wir brauchen, um einen Website-Drahtrahmen zusammenzustellen. Gelegentlich müssen wir das Rechteck-Werkzeug verwenden, um eine Ebene durch Erteilung zu erstellen, und wenn Sie möchten, können Sie rechteckige Drahtrahmenelemente erstellen. Aber ich werde mich an die wesentlichen Blöcke halten und Hintergründe erstellen, während ich gehe. Also lasst uns das wirklich machen. Werfen wir einen Blick auf das Hinzufügen von Draht aus Elementen, um eine schematische Vision unserer Website zu erstellen 25. 8.4Wie du die Assets für die Erstellung eines wireframe verwendest.: Sobald alle Ihre Assets erstellt sind, sind sie bereit und warten darauf, dass Sie sie verwenden, um Ihren Drahtrahmen zu bauen. In diesem Video werden wir einen Blick darauf werfen, wie Sie Ihre Assets praktisch verwenden, um einen Drahtrahmen zu erstellen. Der Prozess ist super einfach und angenehm. Ich würde empfehlen, ein Gitter als Basis für Ihren Drahtrahmen zu verwenden. Es empfiehlt sich, beim Erstellen eines Drahtrahmens ein echtes Webdesign-Szenario zu simulieren. jedoch Wenn es sichjedochum einen sehr, sehr vorläufigen Drahtrahmen handelt, wenn Sie nur das Gefühl vom Projekt bekommen möchten, müssen Sie das Gitter nicht unbedingt verwenden. Beginnen wir mit der Erstellung des Header-Abschnitts. Ich bringe die Brandon- und Navigationsblöcke über und positioniere sie richtig, so dass eine ziemlich große Menge an Leerraum oben und unten bleibt. Nein, es ist schnell erstellen Sie einen hellen Hintergrund für unsere Hatter zuerst alle Gruppierung der Kopfzeilenelemente und initialisiert die Option Einfügen hinter Auswahl in der Symbolleiste. nun anfange, Wenn ichnun anfange,einen aufrechten Winkel zu erstellen, der sich über die ganze Seite erstreckt, können Sie sehen, dass er hinter den schwereren Elementen eingefügt wird. Das letzte, was zu tun ist, wäre, alles gut an der mittleren Gruppe alle Elemente auszurichten und sie in Header Nr. umzubenennen. Lassen Sie uns den Heldenbereich der Website betreten. Wahrscheinlich wird dieses Asset etwas Feinabstimmung benötigen. Zum Beispiel möchten Sie erweitern oder kontrahieren. Vielleicht möchten Sie die Position der Elemente und vielleicht auch die Größe des Telefons ändern . Das Schöne an der Arbeit mit Assets in effin in Designer ist, dass Sie einfach Elemente innerhalb von Gruppen auswählen können , indem Sie darauf doppelklicken und sie so ändern, wie Sie normale Objekte ändern würden . Ich beginne den nächsten Abschnitt, indem ich eine weitere Überschrift und eine Unterüberschrift hinzufüge. Diese Jungs benötigen möglicherweise auch etwas Tweeting, je nachdem, wie Sie sie früher erstellt haben. Möglicherweise müssen sie ihre Fondsfarbe geändert werden. Größe angepasst. Vielleicht wollen wir die Ausrichtung von links zu Mitte dort wirklich flexibel und effektiv ändern. Wenn Sie sich entscheiden, dass Sie sie möglicherweise in der Frame-Assets-Bibliothek Ihrer Frau benötigen, können Sie sie einfach gruppieren und zum Assets-Panel hinzufügen. Ja, Sie können verschiedene Assets aus bereits vorhandenen Assets erstellen. Niemand springt einige vorgestellte Artikel. Ich werde zwei Zeilen mit vier Elementen in jeder von ihnen erstellen Ich werde in einem der vorgestellten Artikel bringen und es optimieren, bis es genau so aussieht, wie ich es wollte. Und da ich vier hintereinander haben möchte, darf ein Artikel drei Spalten unseres großen nicht überschreiten. Sobald es erstellt ist, werde ich es einfach nach rechts duplizieren und dann alle einmal nach unten versuchen. Schließlich werde ich alle Stücke auswählen, gruppieren und einen Hintergrund unter ihnen zeichnen, indem ich die gleiche Technik wie mit dem Hintergrund für die Kopfzeile verwende. Jetzt kann ich diesen Abschnitt umbenennen und ihn so etwas wie vorgestellten nennen. Aber Sie können es alles benennen, was diesen Abschnitt leicht erkennbar machen würde. Der nächste Abschnitt, den wir erstellen können, könnte ein von unserer Blawg-Art eines Abschnitts sein. Also lassen Sie uns in der Abschnittsüberschrift und angepasst von ihm für den Block rühmt, können wir entweder die vorgestellten Elemente, Elemente oder blawg Artikel verwenden . Dies ist nur ein weiterer Beweis dafür, wie flexibel dieses Programm ist. Ich meine, Sie können den vorgestellten Gegenstand greifen, das Bild auf der linken Seite und den Text auf der rechten Seite machen, während int als Asset beibehalten wird. Ich möchte nur Features in jeder Zeile blockieren müssen, so dass ein Beitrag sechs Spalten nicht überschreiten kann. Ich will auch die Prahlerei aufsteigen müssen, damit wir einfach die obere Ecke klonen können. - Natürlich , wie zuvor, können wir wissen, Gruppe all diese Stücke und schaffen einen etwas dunkleren Hintergrund für die Blöcke Aktion. Sie könnten sogar damit experimentieren, helle Elemente auf einen dunklen Hintergrund zu stellen, aber im Moment werde ich es einfach halten. - Der letzte Teil erstellt wird, ist die Fußzeile Abschnitt. Fußzeilen haben in der Regel einen ausgeprägten Hintergrund und sind ziemlich große Feiertage. Sie können das Firmenlogo und den Slogan halten. Einige Links, einschließlich Social Media , Ling's Instagram, Feeds , Extrakte usw. Dieses Mal werde ich damit beginnen, einen dunkleren Hintergrund zu erstellen, auf dem ich die Fußzeilenelemente auf der linken Seite platzieren werde . Ich werde den Bildblock hinzugefügt, der das Logo darstellen würde. Möglicherweise müssen einige Farbanpassungen vorgenommen werden, so dass es vor dem dunkleren Hintergrund darunter gut sichtbar ist. Ich werde einige besteuerte hinzufügen, die die über US-Extrakt für einige zusätzliche Informationen sein könnte. Ich meine, es ist nur ein Drahtrahmen, also testen wir nur die Platzierung bestimmter Elemente und versuchen nicht, das endgültige Design zu erstellen. Ich werde eine Variation von Instagram-Feed-Extrakt auf der Fahrt erstellen, und ich werde es bauen, mit dem Bild-Asset, das ich leicht ändern kann, wenn ich muss, und ich werde zwei Zeilen von Bildern hier darunter erstellen, ich fügt ein weiteres Stück Text und ein paar kleine Bildelemente hinzu, die soziale Medien darstellen. Aiken. - Die letzte Stufe wäre, alle Fußzeilenelemente zu gruppieren und die neu erstellte Gruppe richtig zu benennen . Und da gehen wir hin. Wir haben unseren eigenen Drahtrahmen geschaffen. Ich wollte Ihnen den Prozess zeigen, einen Drahtrahmen aus Assets zu bauen, die Sie selbst erstellen können . Stellen Sie sich vor, wie kompliziert Ihre Frau Rahmen sein kann, wenn Sie nur einige Zeit damit verbringen, schön aussehende Vermögenswerte zu entwerfen . Wenn Sie beim Erstellen eines Drahtrahmens gut sind, fügen Sie Ihrer Bibliothek immer mehr Elemente hinzu. Und bald werden Sie alle notwendigen Elemente haben, um y-Frames zu erstellen, mit null bis wenig Anpassungen erforderlich. Aber wenn Sie nicht Lust haben, Ihre eigenen ein Drahtrahmen-Bibliotheken zu erstellen, können Sie immer nach einigen Werkzeugen suchen und Ressource ist online. Sie haben ihre Grenzen, aber es ist eine gute Idee zu wissen, wie sie funktionieren und überprüfen. Wenn Sie sie in Ihrem eigenen Webdesign-Workflow verwenden möchten, werden wir sie als Nächstes untersuchen 26. 8.5Wireframing online: Es gibt viele Werkzeuge, und Ressource ist online, die Sie verwenden können, um Ihre eigene Frau Frames und Prototypen zu bauen. Das Problem mit ihnen ist, dass die Mehrheit der, die Sie am ehesten finden, bezahlt wird . Sie haben einige begrenzte freie Fähigkeiten. Aber um ihr wahres Potenzial aufzudecken, müssen Sie in den meisten Fällen eine wiederkehrende Gebühr bezahlen . Es gibt einen. Bis dahin möchten Sie vielleicht einen Blick auf die es heißt Wire Frame dot cc werfen, und es ermöglicht Ihnen, schnell Prototypen von Websites zu bauen. Wenn Sie es verwenden möchten, würde ich empfehlen, mit einigen Einstellungen zu beginnen. Zunächst einmal können Sie wählen, eine 12-Colin-Körnung anzuzeigen, was immer eine gute Idee ist, und zweitens empfehle ich, die Breite und Höhe des Drahtrahmens im unteren Teil der Registerkarte Einstellungen zu ändern . Das einzige, was Sie tun müssen, um von hier aus eine Frau zu bauen, ist mit dem Zeichnen zu beginnen. Das Tool zeigt Ihnen eine Reihe von Optionen, aus denen Sie wählen können. Sie können Ihre gezeichneten in eine Box dext Bildliste Absatz usw. verwandeln . Sie können die erstellten Elemente gruppieren und bei Bedarf sogar richtig anordnen. Ein großer Nachteil des Stuhls, der nur völlig frei zu sein scheint, ist, dass, um zu teilen oder unten mit Ihrer Frau Rahmen, Sie müssten sich für ihren Dienst anmelden. Und wenn du willst, werden das meine Gäste sein. Aber es gibt andere Möglichkeiten, den Drahtrahmen in Bearbeitung zu beschleunigen. Wenn Sie kostenlose Drahtrahmenvorlagen googeln, werden Sie eine Menge von freien Drahtrahmen finden. Ressource ist zum Herunterladen und Verwenden in Ihren eigenen Draht-Frame-Bibliotheken. Ich meine, wenn du nicht Lust hast, dein eigenes zu bauen, lass uns tatsächlich einen Blick darauf werfen, aus diesen fertigen Elementen eine Drahtrahmenbibliothek zu erstellen , bevor wir anfangen. Ich denke, es lohnt sich zu verwalten, dass, wenn die Datei, die Sie heruntergeladen haben, eine PSD-Datei ist, Sie werden froh sein, zu entdecken, dass öffnen es ein Stück Kuchen für Designer ist. Auch wenn es sich um eine anschauliche Datei handelt. Beleidigt, wird der Designer es ohne eine Sekunde zu zögern öffnen. Die meisten dieser fertigen Draht-Frame-Repositories enthalten Elemente, die Sie verwenden können, um Ihre eigenen Bibliotheken zu erstellen. Sie können diejenigen groß, die Sie mögen und macht sie zusammen für Betäuber. Erfassen Sie das Bedienfeld „Elemente“ und erstellen Sie eine neue Kategorie. Benennen Sie es nach Ihren Wünschen um. Aber Gnade etwas beschreibenden Namen. Nein. Sie können nur ein Drag & Drop die Elemente, die Sie benötigen und mögen, in die Bibliothek, so dass Sie sie später verwenden können . Natürlich ist dieser gesamte Prozess optional. Ich meine, wenn du willst, kannst du die Datei einfach so belassen und die Elemente kopieren und einfügen, die du brauchst, in deine Drahtframe-Datei. Eatherly arbeitet, und es wird Ihre Aufgabe sein zu entscheiden, welcher zu Ihrem spezifischen Workflow-Teig passt. Ich würde jedoch empfehlen, das Bedienfeld „Elemente“ zu verwenden, da Sie sie in Ihrem Arbeitsbereich immer griffbereit halten können und Sie nicht nach dieser spezifischen Zeit von Drahtrahmendateien suchen müssen. Also denke ich, wir haben den Drahtrahmen und die Materie ziemlich gut abgedeckt. Wir können zu einem weiteren wichtigen Aspekt übergehen, um mit dem Design zu beginnen, nämlich die Auswahl und Optimierung von Bildern, nämlich die Auswahl und Optimierung von Bildern, und ich komme 27. 8.6LAuf uns über Bilder und Symbole sprechen: Es ist schwer, sich eine Website ohne Bilder und andere grafische Elemente vorzustellen. stimmt, es gibt einige Designs, die Onley-Typografie verwenden, aber es sind sehr, sehr neech Projekte. Die Chancen stehen, dass Sie in Ihrer Karriere als Webdesigner Bilder in Ihren Projekten verwenden und sie sehr viel verwenden werden. Es ist wichtig zu wissen, wie man mit ihnen in Ihren Entwürfen umgeht. Also lasst uns jetzt das Thema erkunden. Der einfachste Weg, um ein Bild in Affinität hinzuzufügen. Designer wird gesagt, um den Ort zu nutzen. Bild-Werkzeug. Sobald Sie es getroffen haben, werden Sie aufgefordert, ein Bild auszuwählen, das Sie platzieren möchten. Es ist übrigens das Gleiche wie die Auswahl des Befehls Ort aus dem Dateimenü. Wenn Sie eine ältere Version von Illustrator vor gegebenen Designern verwendet haben, waren Sie wahrscheinlich sehr frustriert ruhig, wann immer Sie möchten, dass es ein Bild beschneidet , weil , naja, es gab nicht, wo Sie es tun konnten , ohne eine Clipping-Maske zu verwenden. Ein Möbeldesigner kommt mit einem Faktor Ernte. Es wird, dass Bilder einfach und schnell zuschneiden können. Alles, was Sie tun müssen, ist, den Begrenzungsrahmen an einer seiner Kanten zu greifen und einfach zu ziehen. Aber das ist nicht alles, was Sie das Bild frei innerhalb des neuen Begrenzungsrahmens neu positionieren können, und sobald Sie mit der Operation zufrieden sind, können Sie einfach schnell nur dieses Bild sichern, indem Sie die Exportfunktion in der Hier verwenden. Sie können wählen, mit welchen Dateiformaten Sie gehen möchten, aber ich würde empfehlen, sich an die Dateien zu halten. Einheimischer ehemaliger. Ich meine, wenn es ein J-Pick ist, wählen Sie einfach J. Pick und vielleicht fallen Sie die Qualität auf etwa 75%. Dies ist eine gute Grenze zwischen einer vernünftigen Dateigröße und einer guten Bildqualität. Denken Sie daran, Auswahl ohne Hintergrund zu wählen, da der Bereich, den Sie exportieren möchten, wenn ältere Bilder bereit sind, raten Sie, sie weiter zu komprimieren. Es ist extrem wichtig für die allgemeine Seitengeschwindigkeit, die die Suche und Optimierung in einfachen Worten beeinflusst Google mag. Wenn Bilder auf der Seite gut optimiert sind, gibt es viele Online-Tools, die Ihnen bei der Optimierung Ihrer Bilder helfen können. Über das, das ich am meisten verwende, heißt winzige J p g dot com, um seine Komprimierungsfunktionen zu nutzen . Einfach Drachenbild auf das Fenster und Buchstaben, dass Werkzeug seine Magie zu tun. Lassen Sie uns nun kurz über Orte im Web sprechen, wo Sie Bilder von guter Qualität kostenlos finden können . Ich habe es ist eine perfekte Situation, wenn Ihr Kunde für Stockbilder bezahlen will. Aber zum Glück gibt es Online-Repositories mit guten kostenlosen Bildern, die Sie als Alternative vorschlagen können . Mein Lieblingsplatz für kostenlose Stockfotos ist das Zeichen Pixel dot com genannt. Es ist eine große Quelle von Fotos aus anderen Stockfotos Repositories, so dass Sie nicht jeden einzelnen STECK-Fotoservice durchsuchen müssen, um Bilder zu finden, die Sie suchen. Geben Sie einfach das Schlüsselwort ein, das Sie benötigen und wählen Sie aus Dutzenden von qualitativ hochwertigen Bildern. Wie für Aikens, Onley neigen dazu, flache Icon dot com am meisten zu verwenden. Es ist eine großartige Website kostenlos, um hochwertige Symbole für Ihr Web-Design-Projekt zu verwenden. Wenn du eine Nikon gefunden hast, magst du. Sie können es entweder in eine Sammlung einfügen oder eine Vorschau anzeigen, und wenn Sie möchten, können Sie es an dieser Stelle auf Rat herunterladen. Wählen Sie s v. G. Als Dateityp. Es ist ein Standard-Faktor-Dateityp, der in jeder Art von Design-Anwendung gut funktioniert. Ich besuche auch kostenlose Pick Dot com, die ein riesiges Repository aus allen Arten von Design-Ressource ist Bilder, Symbole. Pia ist diese Vektoren, etcetera. Nein, aber, dass einige von ihnen bezahlt werden. So können Sie mit den Bildern im Inneren von fit in Designer arbeiten. Natürlich während des Entwurfsteils des Kurses werden Sie während des Entwurfsteils des Kurseseinige Beispiele für die Handhabung von Bildern in einem Webdesign-Szenario sehen. Vorerst möchte ich, dass Sie sich daran erinnern, dass Sie sie mit dem Platzbildwerkzeug importieren können. Sie werden sie mit dem Werkzeug „Faktor zuschneiden“ zuschneiden, und Sie können sie mit dem Befehl „Export“ exportieren. Gehen wir nun zum letzten Teil der Vorbereitungsphase über, bei der Textstile erstellt werden. 28. 8.7Wie du Schriftarten in Affinity Designer erstellst.: Textstile im beleidigten Designer sind ein guter Weg, um einen Web-Design-Prozess zu beschleunigen. Wenn Sie ein Fan ausgeschaltet sind, ändern Sie die Schriftsätze zu schnell. Sehen Sie sich verschiedene Variationen Ihres Designs an. Sie werden Textstile lieben. Erstellen eines Textstils basierend auf den Eigenschaften eines Textstücks, das Sie bereits eingegeben haben . Wählen Sie einfach den Text aus und gehen Sie dann zum Textstilbedienfeld und wählen Sie den gewünschten Stil aus. Haben Sie einen Dialog, der sofort erscheint, können Sie alle Zeichen- und Absatzoptionen anpassen , auf die Sie über die Zeichen- und Absatzfenster zugreifen können. Es ist am besten, mit der Eingabe des Stil-Namens zu beginnen, und ich würde vorschlagen, es etwas beschreibend zu machen. Ihr Textstil wird im Bedienfeld „Textstile“ angezeigt, sodass der Designprozess aufgrund eines leicht unterscheidbaren Namens schneller wird. Eine gute Produktionstechnik ist es, Ihren Stil basierend auf seinen wichtigsten Eigenschaften zu benennen. Wenn zum Beispiel möchten, Sie zum Beispiel möchten,dass der Textstil den Roboto Condensed Fonds verwenden soll, haben Sie ah, nur grüne Zeichen mit einer Größe von 32 Punkten werden diese Informationen als Textstilnamen eingefügt . Wenn Sie Ihren Text fertig sind, werde ich bereit sein und darauf warten, dass Sie ihn auf jeden Text anwenden, den Sie wünschen. Der Prozess der Erstellung von Textstilen in Afinitor Designer ist wirklich flexibel. Sie müssen nicht unbedingt einige zuvor erstellte Besteuerung haben, um daraus einen Textstil zu erstellen . Sie können einfach eine beliebige Taste aus dem Greet new text style Buttons im Textstil-Bedienfeld drücken und ihren Wunschtyp aus der Liste auswählen. Und wenn Sie einige Dinge über Ihren Textstil ändern müssen, aber Sie waren, um das Original zu erhalten, ist es am besten, einfach dupliziert und dupliziert Textstil, klicken Sie mit der rechten Maustaste darauf und wählen Sie Duplikat. Das gleiche Dialogfeld wird angezeigt, in dem Sie die Anpassungen eingeben können, die Sie ohne Tatsache im ursprünglichen Textstil anzeigen. Standardmäßig erhält der duplizierte Textstil eine numerische Suffolk. Also wieder ist es eine gute Idee, mit dem Ändern seines Namens zu beginnen, um einen Textstil mit der rechten Maustaste darauf zu löschen und wählen, löschen oder drücken Sie den Papierkorb, den ich in der unteren rechten Ecke des Panels betrachtete. Das Erstellen und Verwalten von Textstilen in Afinitor Designer ist ein einfacher Prozess, und so ist es sonnig in Textstile für Ihren Text. Ich bin mir sicher, dass, wenn Sie anfangen, eine Menge von Website-Designs zu erstellen, werden Sie sie wichtig in Ihrem Tag zu Tag finden. Routinetextstile schlossen diese Vorbereitungsphase des Webdesignprozesses ab. Sie haben jetzt das Wissen über alle Werkzeuge und Techniken, die wichtig sind, um eine Website in affinity Designer zu entwerfen . Beginnen wir also mit dem Entwurfsteil. 29. 9.1Die Design: Willkommen bei der Gestaltung eines Teils des Kurses. In den nächsten Videos erfahren Sie, wie Sie diese Landing Page mit Affinität, Designern, Tools, Techniken und einigen Tricks gestalten Designern, Tools, . Aber bevor wir ins Design und den Designprozess einsteigen, lassen Sie mich dieses Projekt für Sie schnell aufschlüsseln. Hier oben können Sie also die Kopfzeile sehen, und wir kamen zum Logo auf der linken Seite, dass es im Grunde nur einige Buchstaben sind, ein Stück Text mit den hinzugefügten Grady INTS. Und wenn wir dieses Solo erschaffen werden, werden Sie lernen, wie man Zutaten zum Leben hinzufügen Fonds zum Leben. Text in Affinität Designer auf der rechten Seite. Wir haben die Navigation zusammen mit em ein Social-Media-Icons geschlagen. Diese Jungs hier sind alle als V g Dateien, und bald werden Sie lernen, wie man in schlecht als V g schnell, wie diese sozialen Symbole und wie man mit ihnen in einem Gefühl zu Designer unter dem Header arbeiten wir zu diesem Heldenbereich hier bekamen, Dieses große Bild im Hintergrund, mit einem kleinen Rechteck, das über sein gelegt wird, um dieses Bild etwas dunkler zu machen. Wir haben natürlich natürlich dieses große Stück Typografie hier. Und wir haben dieses kleine Stück von einem Schieberegler bekommen. Navigation. Ich meine, Ich dachte, dass, wenn Sie jemals einen Schieberegler für Ihre Entwürfe erstellen möchten, ist eine gute Idee um zu warnen, wie eine kleine Navigation für eine für einen Schieberegler Abschnitt erstellen. Als nächstes haben wir einen weiteren Abschnitt mit den diesen vorgestellten Artikeln direkt hier. Natürlich vorher diesen haben wir vorher diesengroßen Teiler mit einer Abschnittsüberschrift und einem Unterüberschriften-Text bekommen und sind zu diesen Hilfe-Symbolen gekommen, die in zwei Zeilen aufgeteilt sind. Und für die Spalten hier habe ich den Text für jedes einzelne dieser Stücke gleich gelassen. Die Stücke von vorgestellten Elemente, weil ich dachte, dass , ähm , wissen Sie alles in ah Typ in neuen Worten neue Sätze nur überflüssig sein würden. Eso Ich habe gerade den Text kopiert und dann ersetzen Sie sie einfach die Symbole und diese beiden genau wie die Symbole hier in der Kopfzeile. Sie sind zwei. Sie sind als v g Elemente in dieses Dokument eingebettet. So werden Sie wieder lernen, wie Sie als V g m Symbole wie diese in ein unendliches Designer-Dokument einbetten . Als nächstes bekamen wir einen weiteren Abschnitt, der wie eine Trennlinie zwischen den vorgestellten Elementen und gut wäre , der nächste Abschnitt, der direkt hier kommt. Wie Sie sehen können, dass ein großes Bild auf der linken Seite und wir haben einige einfache besteuert auf der rechten Seite mit einem dunklen Hintergrund. Dies ist dies ein anderer vielleicht nicht ein ganzer Trend, aber ein Stück off Trend und das ist, dass Webdesign gerade jetzt verwendet wird. Ich meine, die ganze Seite in zwei Abschnitte zu teilen und ein Bild auf der einen Seite und ein anderes Stück zu platzieren die ganze Seite in zwei Abschnitte zu teilen und ein Bild auf der einen Seite und ein anderes Stück zu platzieren. Nun, ein Stück Text auf der anderen Seite. Nun, das ist nur einer von einem der Designer-Trends im Moment. Als nächstes kamen wir zu so etwas wie einer von unseren Blöcken Aktion. Also habe ich hier einen leichteren Abschnitt mit leichterem Hintergrund erstellt. Ich habe einige Bilder auf der linken Seite und diese Jungs hinzugefügt, wie Sie unsere Quadrate sehen können und das Hinzufügen dieser Bilder ermöglicht es uns, eine andere Technik aus für die Arbeit mit Bildern im Inneren zu lernen . Wenn in Designer mit diesen Jungs, dieses Bild genau hier, dieses große Bild in der Hero-Sektion. Nun, diese Typen wollten das Factor Crop Tool benutzen. Aber mit diesen Jungs, na ja, wir werden gut verwenden, es ist etwas andere Technik, um perfekte Bilder für Ihr gut ausgestattetes Bild auf Block Post für Ihren Block Post Auszüge wie diese Jungs hier zu schaffen . Dann haben wir so etwas wie einen Instagram-Feed, den ich wollte. Ich wollte es wie ein Instagram-Feed aussehen lassen. Und tatsächlich hier werden wir lernen, wie man Bilder hinzufügen und wie man Clipping-Maske im Inneren verwendet, beleidigt Designer. Und das wird noch eine weitere, denke ich, dritte Technik Weg weg mit Bildern in einem Möbeldesigner sein. Ich meine, ich habe Ihnen versprochen, dass, wenn wir zum Design Teil des Kurses kommen, Sie lernen, wie man praktisch Bilder innerhalb Affinity Designer verwendet, wenn Sie Websites entwerfen . Und diese drei Techniken, Ich denke, wird ein Denken wird befriedigen Sie Ihren Hunger für für Bildbehandlungstechniken . Als nächstes haben wir hier eine Fußzeile, die, wie Sie sehen können, eine völlig andere, völlig andere Hintergrundfarbe hat . Ich wollte es so machen, dass es wirklich kontrastiert. Ich wollte es in diesem Design hervorheben und wir haben die drei Abschnitte mit einigen Links und etwas Text hier bekommen. Und natürlich, diese Trennlinien, horizontale Linien und das ganze Design ist ihn mit dem Brunnen beendet, eine Wiederholung unserer unserer Kopfzeile, aber es ist viel kleiner. Das Logo ist kleiner, die Navigation ist kleiner und der gesamte Huter-Hintergrund ist ebenfalls kleiner. Also schätze ich, wir könnten anfangen zu entwerfen. Aber bevor wir mit der Konzeption beginnen, müssen wir uns die Vermögenswerte ansehen, die wir zur Verfügung haben. Wir müssen einige Textstile erstellen, um unsere Arbeit zu erleichtern. Wir müssen auch ein paar Farbfelder erstellen, und wir müssen einen Blick auf unsere Bilder werfen und ich komme, damit wir wissen, was wir zur Verfügung haben und was wir in diesem Design verwenden werden. Lassen Sie uns also einen Blick darauf werfen, wie sich die Zehe darauf vorbereiten, eine Website wie diesezu entwerfen Website wie diese 30. 9.2Letter So gestaltest du die Farbfelder: Das Dokument, das wir für unser Design verwenden werden, ist genau das gleiche Dokument, das wir erstellt haben, als wir über die 12-Säulen-Körnung gelernt haben. Aber es ist nicht nur die Körnung, die wir verwenden werden, um dieses Design zu realisieren. Es sind auch einige Farben, Topographie, Symbole, Bilder, all die guten Sachen, die wir brauchen, um sie die Website des Designs passieren zu lassen. Also lassen Sie mich kurz das Gitter verstecken und lassen Sie mich diese Kerle hochbringen. Wie Sie sehen können, habe ich hier gesangfarbene Quadrate, und ich habe hier unten einen dunklen Hintergrund. Die Quadrate werden also eine Basis für unsere Farbfelder sein. Und hier unten habe ich einen dunklen Hintergrund, der in einer Sekunde gut mit etwas Typografie bevölkert sein wird . Und ich habe diesen Hintergrund dunkel gemacht, weil, wie Sie im ursprünglichen Design sehen können, meisten unserer Typografie hier sind gefüllt mit einer unbreiten Farbe. Also ich denke, dass es einfach einfacher für Sie wäre, dass off white Farbe vor einem dunkleren Hintergrund off natürlich zu sehen , wir haben auch einige dunklere Stücke von Text, aber wir werden uns um diese Jungs später kümmern, also bin ich beginnt mit der Erstellung einer neuen Musterpalette. So, wie Sie hier im Musterfeld sehen können, können wir die Anzeige entweder Anwendung oder eine Dokumentpalette auswählen. Der Unterschied zwischen diesen beiden Jungs ist, dass, wenn wir eine Anwendung von Gaumen hinzufügen, die Farbfelder verfügbar sein werden. Und jedes Mal, wenn Sie in Ihrem Dokument erstellen und wenn Sie nur eine Dokumentpalette hinzufügen, ist diese Farbfeldgruppe auf Lee mit diesem spezifischen Dokument verfügbar. Also, eigentlich werde ich nur eine Dokumentpalette wie so erstellen. Und wie Sie standardmäßig sehen können, ist es kalt. Nun, eigentlich heißt es es, dass es auf dem Namen heißt, also ist es es so ist, dass es nicht wirklich kalt ist. Also werde ich diese Palette umbenennen, und ich werde es so etwas nennen wie, Vielleicht hat uns geschaffen. Dies ist der Name der Website. Lassen Sie es uns jetzt so sagen. Der Set-Teil über das Erstellen der Farben im Inneren, wenn in Designer aus dem vorhandenen Quadrat, so dass Sie es haben können, ist, dass Sie es eins nach dem anderen tun müssen, also kann ich nicht einfach alle diese Jungs schnappen und einfach vielleicht, wie setzen Sie sie hier oder wählen Sie einige, wählen Sie eine Option aus dem Menü, um alle diese Jungs eine separate Farbfelder hinzuzufügen. Leider gibt es Möglichkeiten, Anrufe aus dem gesamten Dokument zu erstellen. Aber da wir eine Grady int sortieren Sie hier, na ja, große Füllung, wenn in der Designer-Welt würde viel anders die Farben hinzufügen, die zwischen der linken , Teil der großen Tante und der richtigen Teil der großen, und wir ich wirklich nicht wollen, dass Wir wollen nur einfache swat Farben. Also werde ich mir diese erste strahlende Füllung hier schnappen. Und ich werde einfach auf dieses Paletten-Symbol klicken, das bei Phil zum Gaumen sagt, genau so werde ich sein, dass ich all diese verbleibenden Farben zu meiner Musterpalette hinzufügen werde , genau wie so. Und wenn ich fertig bin, habe ich meine Farbfelder mit dem Namen Erstellt, und ich kann sie in diesem Dokument verwenden. Nein, natürlich brauche ich diese Rechtecke nicht mehr. Ich kann sie einfach löschen. Und jetzt, wenn ich nur einen Brunnen erstellen, ist ein einfaches Rechteck. Ich kann alle von meinen Farben genau so verwenden Okay, also jetzt, da wir unsere Farben erstellt haben, können wir jetzt die Textstile erstellen, die wir für unser Design verwenden werden . Und wie Sie sehen können, gibt es, was viele verschiedene Farben bedeuten, dass Farben, aber Stile gehen direkt hier . Aber ich denke, dass wir mit der Erstellung der Textilien im nächsten Video beginnen können. 31. 9.3Letter erstellen: Dieses Design würde natürlich ziemlich traurig aussehen, wenn es nicht viele Bilder und Symbole hätte. Also habe ich ein paar Bilder für dich vorbereitet. Und natürlich wirst du diese Jungs gut in einem Ordner finden, den ich Teoh in diesem Brunnen verknüpfen werde, die Kursbeschreibung. Wenn Sie also folgen möchten, nur um einen Blick auf diesen Ordner zu werfen und alle Elemente und alle Stücke herunterzuladen , die Sie dort finden werden. Soweit die Bilder gehen, wo wir die Blogger-Auszug Bilder hier haben, diese kleinen Quadrate haben wir auch diese Instagram-Feed-Bilder und wir haben auch einige größere Bilder für unseren Helden Abschnitt. Also, wenn Sie mit einem anderen Bild gehen wollen, wollen Sie nicht mit dem, das ich verwendet, Sie wählen können gehen. Wählen Sie es von hier aus. Jetzt werden wir diese Bilder mit dem Platzieren und Platzieren des Bildwerkzeugs direkt hier hinzufügen. jedoch Wenn esjedochum Symbole geht, werden wir sie auf eine andere Art und Weise hinzufügen. Aber wir werden das in nur einer Sekunde erreichen. Also meine Icons sitzen in diesen Ordnerdiensten Also das sind all diese Icons genau hier . Und ich habe auch Social-Media-Symbole. Da sind diese Typen hier, und du wirst nicht den Befehl „place“ benutzen oder so etwas. Wir werden einfach all diese Icons in unser Design ziehen. Aber wie Sie in nur einer Sekunde bemerken werden. Es ist und es ist einfach, aber es wird es einige geben. Wir müssen ein paar Dinge über diese Symbole diese eingebettet zu tun. Und das ist das Schlüsselwort hier. Da war Aikens eingebettet. Wir werden auf das Dokument ziehen, aber das wird in einer Sekunde passieren. Wir werden ihren Entwurfsprozess beginnen. Lassen Sie mich einfach zum Hauptdesign übergehen. Wir beginnen den Designprozess mit der Erstellung des Logos direkt hier. So werden Sie lernen, wie man tatsächlich sie und die große hinzufügen und fiel zu Ihrem gut Stück Text Stück Lebenssteuer. Denn wenn ich nur das künstlerische Textil schnappe, wenn du willst, können wir noch einiges daran ändern. Wir können Apostroph distanzieren und einfach e tippen , und trotzdem ist diese Zutat Ach wurde auf die Steuer angewendet, und sie wird unterwegs aktualisiert. Aber ich werde es verlassen, das Leben den Apostroph in lassen. Und doch denke ich, dass wir auf die Schaffung gehen können, um in unserem ersten Stück Design zu schaffen, das wird dieses Logo sein. 32. 9.4LAuf uns ein Blick auf die Bilder und Symbole: Dieses Design würde natürlich ziemlich traurig aussehen, wenn es nicht viele Bilder und Symbole hätte. Also habe ich ein paar Bilder für dich vorbereitet. Und natürlich wirst du diese Jungs gut in einem Ordner finden, den ich Teoh in diesem Brunnen verknüpfen werde, die Kursbeschreibung. Wenn Sie also folgen möchten, nur um einen Blick auf diesen Ordner zu werfen und alle Elemente und alle Stücke herunterzuladen , die Sie dort finden werden. Soweit die Bilder gehen, wo wir die Blogger-Auszug Bilder hier haben, diese kleinen Quadrate haben wir auch diese Instagram-Feed-Bilder und wir haben auch einige größere Bilder für unseren Helden Abschnitt. Also, wenn Sie mit einem anderen Bild gehen wollen, wollen Sie nicht mit dem, das ich verwendet, Sie wählen können gehen. Wählen Sie es von hier aus. Jetzt werden wir diese Bilder mit dem Platzieren und Platzieren des Bildwerkzeugs direkt hier hinzufügen. jedoch Wenn esjedochum Symbole geht, werden wir sie auf eine andere Art und Weise hinzufügen. Aber wir werden das in nur einer Sekunde erreichen. Also meine Icons sitzen in diesen Ordnerdiensten Also das sind all diese Icons genau hier . Und ich habe auch Social-Media-Symbole. Da sind diese Typen hier, und du wirst nicht den Befehl „place“ benutzen oder so etwas. Wir werden einfach all diese Icons in unser Design ziehen. Aber wie Sie in nur einer Sekunde bemerken werden. Es ist und es ist einfach, aber es wird es einige geben. Wir müssen ein paar Dinge über diese Symbole diese eingebettet zu tun. Und das ist das Schlüsselwort hier. Da war Aikens eingebettet. Wir werden auf das Dokument ziehen, aber das wird in einer Sekunde passieren. Wir werden ihren Entwurfsprozess beginnen. Lassen Sie mich einfach zum Hauptdesign übergehen. Wir beginnen den Designprozess mit der Erstellung des Logos direkt hier. So werden Sie lernen, wie man tatsächlich sie und die große hinzufügen und fiel zu Ihrem gut Stück Text Stück Lebenssteuer. Denn wenn ich nur das künstlerische Textil schnappe, wenn du willst, können wir noch einiges daran ändern. Wir können Apostroph distanzieren und einfach e tippen , und trotzdem ist diese Zutat Ach wurde auf die Steuer angewendet, und sie wird unterwegs aktualisiert. Aber ich werde es verlassen, das Leben den Apostroph in lassen. Und doch denke ich, dass wir auf die Schaffung gehen können, um in unserem ersten Stück Design zu schaffen, das wird dieses Logo sein. 33. 9.5Let's So gestaltest du das Logo zuerst: Lassen Sie uns also diesen Designprozess beginnen, indem Sie ein solches Logo erstellen. Aber zuerst werde ich nur den Splitt verstecken. Ich werde es gerade nicht brauchen, aber ich werde eine neue Ebene erstellen, die ich A umbenennen werde und ich werde es, ähm, Header nennen ähm, , genau so. Und ich werde das künstlerische Textwerkzeug greifen und ich werde einfach nur schreiben in erstellen tat genau wie Also Jetzt ist der Spaß, den wir verwenden, nun, unser Haupt für bleiben Überschrift Telefon, das heißt Hinweis, , wie wir bereits wissen. Aber natürlich wollen wir nicht, dass es so Licht ist. Ich meine, wenn wir erstellen, wenn wir einen dunkleren Hintergrund erstellen, könnten wir natürlich mit dieser hellen Farbe gehen, aber Sie wollen einen Grady hinzufügen, um es zu tun. Und da wir dieses Musterfeld hier haben, füllen Sie diese tolle Info aus, können wir einfach zu unserem Text hinzufügen. jedoch Wenn Sie hierjedochkein großartiges und großartiges Farbfeld haben, können Sie einfach den Filter aktivieren. Und hier, wo Sie Typ sehen können, können Sie solid verwenden, was eine einfache Farbe jede Farbe sein würde, die Sie genau so wollen. Aber Sie können auch lineare Zutat wählen, elliptische Zutat, radial, konisch oder sogar Sie könnten ein bisschen Karte zu Ihrem lokalen hinzufügen, aber das wäre seltsam für ein Logo auf einer Website. Also werde ich einfach linear so wählen. Und wie Sie sehen können, haben wir das bereits. Zoomen Sie einfach ein bisschen hinein. Wir haben diesen Grady int Grady int Schieberegler genau hier. Und wenn Sie die Farben der großen und Schieberegler ändern möchten, können Sie einfach auf diese und dieses Feld hier klicken und Sie können die Farben von Ihrem Grady int aus Ihrem Grady in Stopps ändern . Also, vielleicht ist das so etwas wählen und noch dunkler. Ich meine, Sie können damit einen ganzen Nachmittag spielen und Sie können einfach klicken und die Richtung des Schiebereglers genau so ändern . , Wie gesagt, ich werde dieses Grady-Int-Muster einfach hier verwenden, und ich werde es jetzt deutlich kleiner machen. Ich werde Migranten zurückbringen, nur damit ich sehen kann, was ich hier mache. Und ich werde mein Logo hierher schieben. Ich werde es gegen meine linke nach linke Spalte legen. Aber diese erste Spalte hier und ich werde die Größe zu erhöhen. Lass uns vielleicht 36 sehen, und es wird ein bisschen zu groß sein. 28 sollte gut sein, genau so. Natürlich können wir das. Immer können wir es immer zu später ändern, wenn wir nicht so waren. Jetzt, da wir unser Logo haben, zeigen Sie Ihnen einfach schnell, wie es aussieht, jetzt, da wir unser Logo haben, das tatsächlich Behandlung benötigen könnte, die es bekommen könnte. Wir wollen es vielleicht etwas zu irgendwo hier ausdehnen. Warum nicht? Jetzt, da wir das Logo haben, können wir die Navigation erstellen und unsere ersten Aikens einbetten, die Social-Media-Icons, die wir gerade im vorherigen Video gesehen haben. Lassen Sie uns tatsächlich das Logo für nur eine Sekunde verlassen und dann gehen wir auf die Erstellung ihrer Navigation 34. 9.6LAuf uns die Menülinks erstellen: in diesem Video werden wir anfangen, diese Navigation von unserer Website zu bauen. Und es ist eigentlich so einfach wie nur das künstlerische Textil zu greifen, klicken und Drachen und tippen Sie etwas wie Ruhe und Sie Link. Warum nicht? Das kann es sein. Es kann jetzt Manual Inc lesen. Sie sind vorne. Es gehen werde ich mit ist gut, ist der gleiche Fonds wie das Logo. Also ist es Hinde? Natürlich. Ich wollte deutlich kleiner sein. Vielleicht 18 oder vielleicht 20. Wir werden in nur einer Sekunde sehen. Natürlich wollte ich eine andere Farbe haben, und ich wollte in allen Großbuchstaben geschrieben werden. Also werde ich zum Zeichenfeld gehen und hier kann ich alles ändern, was ich über diesen Text will . Nun, über diesen Nun, hatte dieses Ding Navigationselement. Also zuerst werde ich die Farbe von diesem Grady int ändern. Ich wähle meine Farbfelder aus, und es wird diese helle Farbe sein, genau so, und das Wort, dass Sie es jetzt sehen können. Wir werden das in nur einer Sekunde reparieren. Okay, jetzt werde ich hier alle Kappen unten rechts klicken. Also, jetzt haben wir unsere manuelle Tinte geschrieben mit Onley, den alten Kappen, dem Brunnen, der ganzen Kappe CIA. Lassen Sie uns nun auf das gesamte Navigationssystem aufbauen Nun, so einfacher wie es nur sein kann. Ich meine, lass mich es einfach schließen. Ich meine, wir können einfach die Steuerungstaste gedrückt halten und die Shift-Taste gedrückt halten, um das Verhältnis zu beschränken und diesen Kerl nach rechts zu schwächen. Und jetzt, wenn Sie nur die Kontrolle drücken, j schwächen duplizieren die letzte Transformation von denen war Copping sie waren nur fertig und ah, und bewegen. Also haben wir 12345 Handbuchungen genau so bekommen. Und ich weiß, dass Sie es wahrscheinlich nicht zu gut sehen, um klar. Deshalb werde ich diese Jungs nur gruppieren und sie zusammen mit dem Logo gruppieren , genau so. Und jetzt, wenn wir einfach auf diesen Einsatz hinter der Auswahloption klicken, die wir bereits kennen, und jetzt greifen Sie einfach das Rechteck-Werkzeug, das nur ein wenig herauszoomen. Und jetzt, wenn wir nur ein Rechteck erstellen, werden wir es unten erstellen. Das sollte in Ordnung sein. Du könntest es größer machen. Sie können es kleiner machen. Ich überlasse es dir. Ich werde es so lassen. Und natürlich möchte ich eine andere Art von ah andere Farbe Füllung haben wollen, Farbe diese dunklere Farbe. Und ich hoffe, dass Sie jetzt alles klar sehen können. Aber natürlich will ich nicht, dass diese Jungs mehr gruppiert werden, also werde ich sie einfach gruppieren. Aber ich werde auch diese Jungs gruppieren, weil ich im Moment sicherstellen möchte, dass die Entfernungen zwischen diesen Links diese Elemente hier gleich sind. Also werde ich Schicht kaufen, klicken, und ich werde alle von ihnen auswählen, genau so. Und auf der A-Zeilen-Tab werde ich diesen Kerl hier auswählen, der Raum horizontal sagt, genau wie so und dass ich schlagen werde. Okay, jetzt kann ich sicher sein, dass auf diesen Entfernungen gleich sind. Okay, jetzt, da ich weiß, dass all diese Entfernungen hier gleich sind, kann ich einfach all diese Typen auswählen und sie wieder gruppieren, genau so. Unser nächster Auftrag wäre also, die Social-Media-Icons hier auf der rechten Seite hinzuzufügen. Und wie ich bereits erwähnt habe, werden wir die als V G Dokumente in dieses Dokument einbetten. Jetzt mag es so klingen, als wäre es kompliziert, aber es ist wirklich nicht, aber es gibt tatsächlich ein paar Dinge, die 35. 9.7Let's Add to the 9.7Let's: Wie Sie sehen können,habe ich den Ordner geöffnet, in dem ich meine Bilder aufbewahre. Wie Sie sehen können, Also sind diese 1234 Icons bereit und warten hier auf mich. Also der einfachste Weg, einfach ein Dokument in ein anderes Dokument hinzuzufügen und einzubetten, genug in Designer, vor allem Aiken. Dokumente wie diese. Es ist die einfach zu packen und einfach hier in diesem Fenster zu platzieren . Jetzt mag es Ah klingen, gut, es kann aussehen, wie es ist ein super super einfach, und Hinzufügen, tatsächlich ist aber Änderung in diesem Symbol seine Farbe ändern Nun, das ist nicht so einfach. Ich meine, du könntest Nun, du könntest denken, dass alles, was es braucht, ist, nur zu greifen, dieses Symbol zu greifen und einfach seine Füllfarbe in etwas anderes zu ändern. So wie so. Aber wie Sie gut sehen können , passiert eigentlich nichts. Ich kann mich nicht ändern, um zu füllen. Ich kann den Strich nicht in der Nähe dieses Symbols hinzufügen. Wie Sie sehen können, passiert eigentlich nichts. Ich mache es nicht größer. Ich ändere den Schlaganfall nicht. Und warum ist dieser Hap? Warum kann ich das nicht? Warum kann ich nichts ändern? Alles darüber kann ich gut, das ist eigentlich, weil es ein eingebettetes Dokument ist. Afinitor Designer betrachtet diesen Kerl hier als nur eine Darstellung aus dem Original. Also bist du es nicht wirklich. Nun, Sie versuchen, dieses Symbol zu beeinflussen, weil Sie denken, dass es tatsächlich gut ist, das Original, aber es ist nicht. Das Original sitzt noch woanders eso. Und der einfachste Weg, um zu diesem Original zu gelangen, ist, indem Sie direkt hier auf diese hinzugefügte Dokumentoption klicken. Und sobald du das tust, kannst du es sehen. Affinity Designer öffnet dieses Dokument gerade in einem neuen Fenster. Wie Sie sehen können, steht hier eingebettet. Also jetzt könnten wir einfach die Füllfarbe zu unserem Dokument hinzufügen, um unsere ich komme in diesem Fall. Und wie Sie sehen können, haben wir nicht unsere Farbpalette hier. Wir haben es nur in diesem Dokument, weil wir es als Dokumentpalette erstellt haben, und wir haben es nicht einmal in einem etwas virtuellen und dynamischen Dokument direkt hier. Aber das ist definitiv nicht Das ist definitiv nicht etwas, mit dem wir umgehen können. Also gehe ich einfach zu meinem Originaldokument und im Farbfeldbedienfeld wähle ich die Exportpalette aus. Ich werde den Namen belassen, wie er ist Klicken Sie auf Speichern. Und dann, wenn ich zurück zu dem eingebetteten Dokument, Ich kann jetzt wählen Importpalette, und wir könnten es als eine Anwendung von Palette wählen. Warum nicht, dass ich diesen Kerl einfach aussuchen werde. Doppelklicken Sie darauf. Und wie Sie sehen können, haben wir unseren Gaumen hier und jetzt können wir wählen, dieses Licht gefüllt genau so. Und jetzt, wenn wir zurückgehen, können wir diesen Kerl nicht mal schließen. Und jetzt, wenn wir zu unserem Dokument zurückkehren, können Sie sehen, dass wir unseren Kerl, den unser Aiken erstellt hat, genau hier haben. Es hat den Fonds geändert und selbst wenn hier in der Platte in Toast-Panel es so zeigt , dass es irgendwie wie einen angewendeten Strich und Füllung hat. Und wie Sie sehen können, der Kopf warten, sie sind andere Farben als dieser Phil Anruf. Es ist wirklich, das nennt es? Das wird auf unsere angewendet und ich kann. Jetzt können wir es einfach kleiner machen, es irgendwo hier vor unseren dunkleren Hintergrund stellen und es noch kleiner machen. Vielleicht nicht so klein. So etwas sollte tun, ich denke, es sollte jetzt in Ordnung sein, um den Prozess zu beschleunigen, schwächen Einfach diesen Kerl nach rechts klonen. Ich halte Shift und Kontrolle so gedrückt. Und jetzt können Sie diese Option Dokument ersetzen direkt hier verwenden. Und wenn ich vielleicht Instagram wähle. Ich ändere dieses Dokument. füge jedoch Ichfüge jedochnicht dasselbe hinzu. Das gleiche Halsband füllte mich nach meinem Willen Aiken. Also wieder muss ich zum hinzugefügten Dokument gehen und ich muss zu erstellten Farbmustern gehen und ich werde das einfach so ändern. Und jetzt, wenn wir nur auf Kontrolle J klicken, können wir den Kerl klonen und ihn nach rechts verschieben. Genau wie so wieder, Dokument ersetzen. Wählen Sie mich aus. Twitter hat zu diesem Zeitpunkt das Dokument erneut hinzugefügt. Wählen Sie die passende Farbe wie so. Wie Sie sehen können, bleibt die Größe gleich. Aber das Auto wird leider nicht mehr für uns ändern. Wir können es nach rechts klonen. Ersetzen Sie das Dokument dieses Mal mit dem Pinterest Ich komme jetzt können wir es bearbeiten, ändern Sie den Kragen und wir können es einfach schließen, genau wie so. Okay, jetzt können wir sicherstellen, dass die Entfernungen zwischen diesen Handbuchungen die gleichen sind wie die Entfernungen zwischen Brunnen-Handbuch- und Social-Media-Icons und zwischen diesen Social-Media-Icons . Also werde ich einfach auf Gruppe diese manuellen Links und dann werde ich einfach zu der Auswahl diese Jungs hier hinzufügen , einige Shift klickt auf sie. Und jetzt, wenn ich Raum für Izon Tole wähle und auf OK klicke, schwäche dich ab. Wir können jetzt sicher sein, dass alle diese Jungs gleichmäßig verteilt sind. Also, jetzt können wir sie einfach gruppieren, bewegen Sie sie nach rechts, wenn Tatsache schwächen vielleicht sogar eine Linie von zu unserem Raster und dann einfach verschieben Sie sie irgendwo hier können wir jetzt einfach Freund dieses Logo ein wenig nach unten ein wenig, um sicherzustellen, dass die Linie schön. Und da gehen wir. Wir haben den Header erstellt. Wir können den Kerl natürlich vielleicht etwas runterbringen. Natürlich können Sie vielleicht die Entfernungen zwischen all diesen Jungs größer machen, wenn Sie wollen. Nun, das liegt ganz an dir. Aber das letzte Geschäft, das ich hier machen möchte, ist, dass sie angeben wollen, welche den Seiten tatsächlich die aktive Seite ist, also wollte ich eine andere Farbe haben. Nun dann, Nun dann die anderen Links einige einfach darauf doppelklicken und das ist die Art, wie Sie ein Targeting sind, ähm, ein Element innerhalb einer Gruppe, die ich einfach diese Grady hinzufügen und gefüllt einfach so. Und wir haben im Grunde ein wo haben unsere Brunnen-Header erstellt? Genau so denke ich, dass es ziemlich einfach war. Glauben Sie nicht, dass es etwas gibt, das Sie beachten müssen, zum Beispiel hinzufügen, Ah, Ah, die Gradierung gefüllt zu Text, besonders Erin, besonders Erin, dass svg-Symbole oder andere Dokumente sie einbetten und sie dann richtig behandeln. Aber ich denke, dass all diese Techniken wirklich gut sind, ziemlich einfach. Sie brauchen einige gewöhnungsbedürftige, aber sobald Sie den Hang von ihnen bekommen, werden Sie sie reibungslos und schnell verwenden. Also wäre unser nächster Auftrag, nur ein großes Bild zu schnappen. Legen Sie es. Teoh wird es zu unserem prominentesten Stück dieser Welt machen, dem Stop-Teil des Designs, und dann einen dunkleren Tisch gut, leichtere Typografie dagegen setzen und dieses Navigationssystem direkt hier erstellen. Lassen Sie uns also anfangen, das im nächsten Video zu tun 36. 10.1Lettisch beginnen mit der Hinzufügen des Hauptbildes: Der nächste Abschnitt, den wir erstellen werden, ist dieser Heldenbereich hier. natürlich, Wichtigste daran istnatürlich, dass es dieses große Bild als Hintergrund hat. Es gibt auch diese mutige Typografie, und wir haben auch dieses Navigationssystem hier unten unten, und die Erstellung des Abschnitts wird uns tatsächlich die Gelegenheit geben, eine Affinität Designer die Techniken und Werkzeuge zu entdecken , die ermöglicht es Ihnen, Bilder hinzuzufügen. Und diese Methode ist die einfachste. Es ist die einfachste, also werden wir damit anfangen. Aber bevor wir ein Bild hinzufügen, lassen Sie uns eine Ebene hinzufügen. Also werde ich eine später direkt hier erstellen. Ich werde es als „Held“ nennen, genau so. Und ich werde es unter den Huter-Abschnitt und Heather Layer genau hier verschieben. Der einfachste Weg, um ein Bild in einem Fit in Designer hinzuzufügen, ist einfach die Verwendung des Platzbildwerkzeugs , das dieser Typ hier ist. Was es tut, ist es einfach erlaubt, ein Bild zu öffnen und zu platzieren, was auch mit dem Befehl zur Dateiplatzierung getan werden kann. Aber mit diesem Befehl können Sie auch andere Dateiformate einbetten, nicht nur Bilder, wo es Platz Bild ist, so ist speziell entwickelt, um nur Bilder zu Ihrem Willen hinzuzufügen . Um Ihr Dokument klingt einfach auf sie und all diese Bilder klicken, übrigens, wir sind von den Achsen, die eine Website, die wir in einem der vorherigen Videos entdeckt kommen . Also werde ich einfach wählen, vielleicht dieses Bild, und wie Sie gut sehen können, passiert nichts. Ich schätze, Sie können nichts sehen, weil nichts anderes passiert, als unser Cherson-Cursor einen Sidekick bekommt. Und dieses kleine Symbol zeigt tatsächlich an, dass, wenn ich jetzt einfach irgendwo in meinem Dokument klicke , ich Fuß gehen werde. Fügen Sie dieses Bild hinzu. Und wie Sie sehen können, ist es groß. Es ist viel zu groß für unsere Zwecke, also müssen wir es kleiner machen und um es kleiner zu machen, schwächen einfach nur durch eine seiner Ecken gezogen, genau wie so, bis es gut wird, klein wie wir Sie brauchen es. Und übrigens müssen Sie die Umschalttaste nicht drücken und gedrückt halten, da , ein schwacher Designer standardmäßig davon ausgeht,dass Sie die Proportionen so beibehalten möchten, wie sie sind. Sie wollen Ihr Bild nicht verzerren, und das ist eigentlich sehr praktisch, weil wir unsere nicht verzerren wollen. Du willst unser Image nicht beginnen. Also, wenn Sie wollen todo Telefon Ihr Dokument haben das gleiche mit wie Ihre Leinwand. Sie können sie einfach hier in diesem Transformationsfeld eingeben. Aber was hier wichtig ist, ist, dass wir wollen, dass unser Abschnitt gezogen wird, dieses Hintergrundbild kleiner ist. Ich meine, wir wollten so breit sein, wie das Ganze dauern kann. Wir wollten von der linken Seite des View-Ports auf die rechte Seite des View-Ports gehen, aber wir wollen nicht, dass es diese Maut ist. Wir wollen es kleiner machen. Und natürlich, natürlich, wenn wir es nur an einem der Griffe hier greifen, werden wir unser Bild verzerren, und das ist definitiv nicht das, was wir wollen. Wie können wir also sicherstellen, dass das Bild proportional bleibt, aber es ist nicht so groß wie dieses Original. das Bild proportional bleibt, Wir könnten vielleicht die Clipping-Maske dafür benutzen, aber ich denke, es wäre einfacher, einfach den Faktor Ernte zu schnappen, bis dieser Kerl hier und einfach diesen Kerl ein bisschen nach oben zu bewegen, ich weiß nicht, vielleicht irgendwo hier sind wir gehen, um es in nur einer Sekunde zu überprüfen. Das Vektorzuschneidwerkzeug erlaubt uns also einfach, das Bild zu beschneiden. Auch wenn es Vektor-Ernte genannt wird. Es erlaubt uns, ein Bild genau wie so zu beschneiden, ohne zu beeinflussen und das Bild selbst können wir sogar wissen, bewegen Sie diesen Kerl in unserem Inneren unserer oder beschnittenen Bild abgeschnitten Rahmen, nur so, um sicherzustellen, dass es gut ist, es sieht nur ein Weg aus Wir wollen, dass es aussieht. Wenn wir also nur ein bisschen näher heranzoomen, und jetzt, wenn Sie nur einen Blick auf das Ebenenfenster werfen, können Sie sehen, dass wir unter unserem Bild gekommen sind. Wir haben dieses Rechteck hier hinzugefügt. Und, wie Sie an seinem Thumbnail sehen können, und wenn Sie mit Fotoshop vertraut sind, sieht es irgendwie wie eine Maske aus, denken Sie nicht? Nun, das ist im Grunde, weil es eine Maske ist, deren Maske dynamisch auf unser Bild angewendet wird. Wenn wir es gerade ausgeschaltet haben, können Sie sehen, dass wir unser ganzes Bild zurückbekommen. Aber wenn wir uns umdrehen, können Sie sehen, dass es genau wie so abgeschnitten wird, und es hat eine große wird profitieren. Ich meine, eine Maske zu unserem Bild hinzuzufügen, auch wenn wir Adam nicht gefragt haben. Ich meine, ein Freund des Designers hat diese maskuline automatisch hinzugefügt, aber wir können einfach dieses Rechteck umwickeln und wir können hier runter zu unserem Transformationsfeld gehen, stellen Sie sicher, dass unsere Transformation von einem der obersten Punkte geschieht. Und jetzt können wir diese Werthöhe hier einfach in etwas wie, ich weiß nicht, vielleicht 700 Pixel ändern ich weiß nicht, . Lass uns sehen. Und wie Sie sehen können, ist es unsere Maske wird auf genau 700 beschnitten. So haben wir jetzt 920 mal 700 Pixel, genau so. Und wenn wir jetzt nur in 100% Vorschau sehen und die Paneele loswerden, so können wir sehen, ob wir das wirklich gut mögen, diese Höhe, also wenn Sie es größer machen wollen, können wir es größer machen. Wir können es kleiner machen, wenn du willst, aber ich denke, ich überlasse es dir, zu entscheiden, ob du damit noch ein bisschen experimentieren willst . Du weißt, wie es geht. Es ist Oh, also kannst du es jetzt tun. Du kannst es selbst machen. Was ich aber tun möchte, ist, dass ich dieses Bild dunkler machen will, weil ich die Tatsache nicht mag, dass es so ist Es ist so leicht , vor allem wenn man bedenkt, dass ich in eine leichte Typografie darüber gesetzt werden werde in nur einer Sekunde. Also, was ich tun will, ist, dass sie es ein bisschen dunkler machen wollen. Aber, ähm, es gibt eine Sache, bei der du vorsichtig sein musst, aber ich werde dir alles im nächsten Video erzählen. 37. 10.1Lettisch beginnen mit der Hinzufügen des Hauptbildes: wie Sie weiterhin Ihre Website erstellen, entwerfen Sie und fügen Sie weiterhin Bilder und große Bilder wie diese hinzu. Ihr Dokument wird immer größer und größer werden und gehen. Dein Computer ist los. Teoh läuft langsamer, langsamer und langsamer. Ich meine, je mehr große Bilder es verarbeiten muss, desto langsamer ist, dass mehr RAM und der Prozess der Energie, der den gesamten Prozess verbraucht, so gibt es einen kleinen Trick, den Sie tun können , um sicherzustellen, dass alles schön aussieht. Aber zur gleichen Zeit ist alles, was ich dabei bin, schnell und reibungslos. Wenn Sie wissen, dass es Ihnen gut geht, lassen Sie dieses Bild so, wie Sie wollen, dass Ihr Heldenbild so groß wie dieser Kerl hier ist. Und Sie wollten so zugeschnitten werden, Sie können es einfach auswählen. Und jetzt, wenn Sie einfach zum Dateiexport gehen, können wir einfach eine Auswahl ohne Hintergrund auswählen, es zu einem J-Pegs machen, die Qualität auf etwa 75% fallen lassen. Und jetzt, wenn wir dieses Bild mit diesen Einstellungen exportieren , das ganze Bild wird beschnitten werden. Dies ist nicht mehr ein riesiges Bild. Es wird viel, viel kleiner sein. Aber es wird, naja, das gleiche sein wie die, die Sie hier gesehen werden. Also, wenn ich jetzt einfach voran gehe und auf Exportieren klicke und ich werde es als, ähm, Bild abgeschnitten genau so nennen ähm, und jetzt kann ich es einfach löschen. Und jetzt, wenn du auf das Bild gehen willst, Werkzeug und dass ich überprüfen kann, wo ich mein hier ist? Hier ist Und wenn ich einfach hier klicke, können Sie sehen, dass ich mein Bild abgeschnitten und perfekt mit meinem ganzen auf der gesamten Website-Design ausgerichtet habe. Und das ist eigentlich, dass Sie mit all Ihren gut tun können, zumindest diese großen Bilder. Wenn Ihr Computer vielleicht ein bisschen langsamer ist, wenn Sie nicht genug RAM haben oder Ihr Prozessor ein bisschen langsam ist , können Sie immer einfach ah sagen beleidigend zu Designer Teoh Inouye, optimieren Sie die Bilder, indem Sie sie einfach kleiner machen. Und sobald Sie sie zugeschnitten haben, sobald Sie sie gut vorbereitet haben, genau so, wie Sie es wollen. Sie können sie einfach als separate Assets speichern und sie dann erneut hinzufügen. Aber sie werden viel kleiner sein, und die Qualität wird ziemlich ziemlich gleich sein, und alles wird glatter laufen. Also jetzt sind wir bereit zu beginnen, das Halsband in unserem Bild hinzuzufügen. Und wieder, es wird etwas geben, das Sie verlassen haben, dass Sie Teoh Barre Geist haben, wenn Sie eine Farbe zu Ihren Bildern hinzufügen , weil Sie versucht sein könnten, wie ich normalerweise versucht werde, eine Sache zu tun, aber es wird nicht als sein Shooting funktionieren, also lassen Sie uns im nächsten Video darüber sprechen. 38. 10.2Wie du das Bild schnell ändern kannst.: wie Sie weiterhin Ihre Website erstellen, entwerfen Sie und fügen Sie weiterhin Bilder und große Bilder wie diese hinzu. Ihr Dokument wird immer größer und größer werden und gehen. Dein Computer ist los. Teoh läuft langsamer, langsamer und langsamer. Ich meine, je mehr große Bilder es verarbeiten muss, desto langsamer ist, dass mehr RAM und der Prozess der Energie, der den gesamten Prozess verbraucht, so gibt es einen kleinen Trick, den Sie tun können , um sicherzustellen, dass alles schön aussieht. Aber zur gleichen Zeit ist alles, was ich dabei bin, schnell und reibungslos. Wenn Sie wissen, dass es Ihnen gut geht, lassen Sie dieses Bild so, wie Sie wollen, dass Ihr Heldenbild so groß wie dieser Kerl hier ist. Und Sie wollten so zugeschnitten werden, Sie können es einfach auswählen. Und jetzt, wenn Sie einfach zum Dateiexport gehen, können wir einfach eine Auswahl ohne Hintergrund auswählen, es zu einem J-Pegs machen, die Qualität auf etwa 75% fallen lassen. Und jetzt, wenn wir dieses Bild mit diesen Einstellungen exportieren , das ganze Bild wird beschnitten. Dies ist nicht mehr ein riesiges Bild. Es wird viel, viel kleiner sein. Aber es wird, naja, das gleiche sein wie die, die Sie hier gesehen werden. Also, wenn ich jetzt einfach voran gehe und auf Exportieren klicke und ich werde es als, ähm, Bild abgeschnitten genau so nennen ähm, und jetzt kann ich es einfach löschen. Und jetzt, wenn du auf das Bild gehen willst, Werkzeug und dass ich überprüfen kann, wo ich mein hier ist? Hier ist Und wenn ich einfach hier klicke, können Sie sehen, dass ich mein Bild abgeschnitten und perfekt mit meinem ganzen auf der gesamten Website-Design ausgerichtet habe. Und das ist eigentlich, dass Sie mit all Ihren gut tun können, zumindest diese großen Bilder. Wenn Ihr Computer vielleicht ein bisschen langsamer ist, wenn Sie nicht genug RAM haben oder Ihr Prozessor ein bisschen langsam ist , können Sie immer einfach ah sagen beleidigend zu Designer Teoh Inouye, optimieren Sie die Bilder, indem Sie sie einfach kleiner machen. Und sobald Sie sie zugeschnitten haben, sobald Sie sie gut vorbereitet haben, genau so, wie Sie es wollen. Sie können sie einfach als separate Assets speichern und sie dann erneut hinzufügen. Aber sie werden viel kleiner sein, und die Qualität wird ziemlich ziemlich gleich sein, und alles wird glatter laufen. Also jetzt sind wir bereit zu beginnen, das Halsband in unserem Bild hinzuzufügen. Und wieder, es wird etwas geben, das Sie verlassen haben, dass Sie Teoh Barre Geist haben, wenn Sie eine Farbe zu Ihren Bildern hinzufügen , weil Sie versucht sein könnten, wie ich normalerweise versucht werde, eine Sache zu tun, aber es wird nicht als sein Shooting funktionieren, also lassen Sie uns im nächsten Video darüber sprechen. 39. 10.3LAuf uns das Bild etwas dunkler: Sie werden unser Bild etwas dunkler machen, denn wenn wir einenBlick auf das Original werfen, können wir sehen,dass es tatsächlich gut ist. Sie werden unser Bild etwas dunkler machen, denn wenn wir einen Blick auf das Original werfen, können wir sehen, Es ist dunkler als dieses Originalbild, weil wir diese leichte Typografie gegen dieses Bild setzen wollen . Und vor allem in dem Fall. Im Falle dieses Bildes, wenn wir Lichter Typografie vor diesen Hintergrund stellen, wäre es kaum sichtbar. Und das ist keine gute Benutzererfahrung. Was wir also tun wollen, ist, dass wir eine dunklere Sache machen wollen, die Sie vielleicht versucht haben zu tun. Wenn Sie Teoh versuchen, nur, wissen Sie, schlagen. Das System hat mehrmals versucht, Sie können versucht sein, einfach das Füllwerkzeug zu verwenden. Und für den Fülltyp möchten Sie möglicherweise eine Farbe auswählen. Zum Beispiel, wenn wir nur mit soliden gehen, können Sie sehen, dass wir tatsächlich keine Farbe hinzufügen. Aber wir ändern uns. Wir ändern das ganze Foto, und wenn Sie für diese Art von künstlerischen Effekt gehen wollen, wird meine Vermutung sein. Sie können viele verschiedene Farben wählen und tatsächlich die Art und Weise ändern, wie dieses Auto dieses, dass dieses Bild ist tatsächlich aussehen wird, aber das ist wirklich nicht, was wir wollen. Also denken Sie daran, gut, diese Option nicht zu verwenden, wenn Sie. Wenn Sie das Bild nur dunkler machen möchten, gehen Sie nicht für die Füllfarbe, um es zu machen. Aber wenn du versuchen willst, das System zu schlagen, wirst du es nicht so schlagen. Sie können jedoch einfach das Rechteck greifen, um ein kleines Rechteck zu erstellen und es mit einer dunklen Farbe zu füllen. Also werde ich einfach wählen. Vielleicht diese Farbe und ich möchte es so groß wie das Bild machen. Und da es 1920 um 700 ist, werde ich genau hier eingeben. 700 genau wie so können wir es jetzt einfach über unser Bild legen und sicherstellen, dass es so schnappt . Und jetzt können wir die Deckkraft einfach runterwerfen. Schauen wir uns etwas wie vielleicht 40% an. Ich denke, 40% sollten gut sein, weil, wie gesagt, das zugrundeliegende Bild ziemlich leicht ist, also denke ich nicht, dass wir die Deckkraft auf etwas wie, ich weiß nicht, 17% Goes sagte, dass wird einfach keinen Sinn ergeben. Natürlich könnten wir vielleicht versuchen, eine dunklere nennen es vielleicht schwarze Farbe und dann schwächen. Lassen Sie die Deckkraft noch weiter runter fallen. Aber ich denke, ich werde einfach mit meiner ursprünglichen Farbe gehen, und ich werde die Kapazität auf so etwas erhöhen, vielleicht 35 40% genau so. So können wir jetzt einfach sowohl das Bild als auch das Rechteck greifen und schwächen. Gruppieren Sie sie einfach, wenn Sie möchten. Sie können die Gruppe als vielleicht Hauptbild umbenennen, So etwas. Nur damit du was weißt? Es ist tatsächlich genau hier in dieser Gruppe. So können wir jetzt beginnen, diese Typografie hinzuzufügen, bei der wir in diesem Haupttext beginnen können. Der Haupttext hier. Denken Sie daran, wir einen bestimmten Textstil dafür erstellt haben, aber ich denke, dass wir es im nächsten Video tun können. 40. 10.4Jetzt Füge uns den Haupttext hinzu: Jetzt können wir anfangen, die Haupttypografie hinzuzufügen und sie gegen diesen dunkleren, diesem Bildhintergrund zu setzen . Also werde ich einfach das Frame-Steuer-Tool greifen und ich werde erstellen, ich werde einen Textrahmen erstellen , genau so, dass es nicht so große Taubs sein muss. Wir werden das Text-Werkzeug greifen und ich werde einfügen Füllstoff Text wählen, genau wie so und aus unseren Textstile, werde ich unser Denken wählen, genannt es Haupt Überschrift. Ich werde es nach links ausrichten und jetzt verschieben, irgendwo bewegen. Hier, lassen Sie mich nur sehen, ob schnappt schön moovit Sommer hier jetzt, wenn Sie wollen, können Sie natürlich. Ah, nun, gib hier ein paar echte Wörter ein, wie ich es im Original habe, aber ich überlasse es dir. Ich möchte Ihnen nur zeigen, wie Sie diese Art von Effekt erzeugen können. Nun, wenn Sie nicht mögen, wie das aussieht, wenn Sie die Art und Weise, wie die Charaktere platziert werden, nicht mögen, wenn Sie den Weg auf der Linie nicht mögen Hi, Tim ist, Ah, gut angezeigt hier. Natürlich kannst du das. Sie können ein paar Dinge daran ändern. So zum Beispiel können wir zum Beispieleinfach das Zeichenfeld packen und zum Beispiel versuchen, die Führung zu ändern, zu erhöhen, vielleicht auf 78 genau so. Und natürlich müssten wir diesen Rahmen einfach so erweitern. Sie können auch versuchen, den Abstand zwischen bestimmten Zeichen zu erhöhen. Und das ist natürlich natürlich das Tracking. Also lassen Sie uns für Sie sehen, geben Sie einfach eins ein. Ich würde damit nicht über Bord gehen. Wir sehen etwas geringfügiger zugenommen, aber nicht so viel. Und ich würde damit nicht zu weit gehen. Vielleicht bleiben wir einfach bei fünf. So etwas wie. Also sollte das in Ordnung sein. Und auch, wenn Sie wollen, können Sie vielleicht mit den anderen vorderen Gewichten versuchen, wie normale, halbkahl. Ich würde nicht mit Licht und vielleicht Medium gehen. Ich denke, dass kühn das Beste wäre, weil es uns ein Gefühl von Konsistenz in unserem Design geben würde . Ich meine, das Logo ist in jeder kühneren Version der Schrift geschrieben. Der Text verlinkt gut, die manuellen ing sind in einer fett formatierten Version von der Vorderseite geschrieben, also würde ich einfach mit dem Zustand bleiben mit fett Wenn Sie möchten, können Sie Teoh wählen, unterstreichen Sie diesen ganzen Text, wenn wir einen Blick auf das Original, weil Sie sehen können, dass ich zu diesem Wort nur die geschaffene Welt unterstrichen habe. Aber das ist bei Lee möglich. Wenn Sie nur, wenn Sie ein echtes Stück Textbuch hinzufügen, ist, wenn es nur, dass dieser automatische Füllstoff Text ist nur ein Filter und Sie werden nicht tatsächlich in der Lage, Teoh Ah, manipulieren Onley separate Werke. Also nur als Beispiel, wenn ich diesen Kerl schnappe und wenn ich ihn einfach überkopiere, werde ich sicher gehen, dass ich später hier rechts bin und diesen Kerl loswerden werde . Und wenn ich mich einfach umziehe, ist es hier oben genau so. Wenn du willst, kannst du einfach den Rahmen oder das künstlerische Textil packen. Vielleicht schnappe ich mir das künstlerische Textil und wir können einfach bestimmte Wörter auswählen. Also, zum Beispiel, lasst uns einfach faszinieren. Lassen Sie mich es einfach schnappen. Und jetzt kann ich es unterstreichen, oder ich kann es sogar verdoppeln, wenn ich will, aber ich kann es nicht mit der genau diesen Füllstoff Steuer tun, die Sie aus dem Texthandbuch verwenden können . Weil es, wie gesagt, wie gesagt,nur ein dynamischer Filter ist und Sie tatsächlich nicht in der Lage sind, einzelne Wörter zu manipulieren. Und natürlich, das letzte, was er tun würde, wäre, nur den Text und den Unterstreichungshintergrund zu greifen und einfach diese Jungs auf Dissenter auszurichten, genau so, nur um sicherzustellen, dass alles gut aussieht. Wenn wir also jetzt nur einen Blick auf unsere Fortschritte werfen, dann haben wir das bisher. Wir haben das Patent, den Header. Wir haben das Logo, wir haben das Menü, wir haben die sozialen Symbole, die Social-Media-Icons. Wir haben gut, fast fertig Heldenabschnitt fertig. Und wenn Sie keine Schiebereglernavigation erstellen möchten, können Sie einfach zu einem anderen Abschnitt zum nächsten Abschnitt wechseln. Aber ich glaube, wir gehen. Teoh werden auf jeden Fall zu schaffen, dass die Schieberegler Navigationstasten hier unten, Aber so weit so gut, wir haben, was leicht im Grunde fertig sein könnte , Fertigteil, oberer Teil des Designs, weil wir die -Header. Wir haben den Helden. Nun würden wir zum nächsten Abschnitt neben Abschnitt 2 vorgestellten Gegenstand wechseln. Aber bevor wir es nicht tun, bevor wir tun, war das tatsächlich die Navigation der Styler-Navigation hier unten unten, rechts, also bleiben Sie dran. 41. 10.5Letter fügt der 10.5Let's hinzu: Erstellen des Schiebereglers. Navigation ist eigentlich ein ziemlich unkomplizierter Prozess. Also lasst uns anfangen, es jetzt zu bauen. Zunächst möchte ich eine Ellipse erstellen, die eine Strichfarbe haben wird, und es wird keine Füllfarbe der Strich mit dem Baldachin haben. Nur einen Punkt. Wir können es später immer ändern. Und ich werde einfach eine Ellipse erstellen. Ah, bei etwa 25 Pixel in gut, sowohl mit als auch Höhe. Lassen Sie mich einfach näher hineinzoomen, damit Sie sehen können, was ich hier mache. Und was ich tun werde, ist, dass ich es einfach zwei Mal nach rechts klone. Es sind also eins und zwei genau so. Und was jetzt? Ich werde es tun. Lassen Sie mich diesen Kerl einfach nach links und rechts bewegen, diesen Kerl. Aber natürlich werden wir es reparieren, um den Raum zu reparieren, um reparieren. Und in nur einer Sekunde, Also der erste Nun, das erste Symbol der erste Kreis wird ein Phil haben wird eine große Füllung , die mit dem Grady in Schlepp-Logo entsprechen würde. Wir möchten darauf hinweisen, dass tatsächlich, diese Folie ist die erste Folie in den Stapeln. Deshalb wird dieser erste Kreiskreis eine Füllung haben. Klingt einfach auf meine große klicken und füllen Sie meine Farbfelder einfach so aus. Und jetzt können wir einfach diese Dreieck-Tasten auf der linken und auf der rechten Seite erstellen. Das wäre eigentlich unser vorheriger und nächster Unterteil. Aus dem Werkzeugfenster, das ich erstellen werde, wähle ich das Dreiecks-Werkzeug aus. Und ich werde einfach ein Dreieck erstellen, das so aussehen wird, also natürlich will ich nicht, dass es einen Phil hat. Ich wollte einen Schlaganfall haben, einige gehen einfach diese Jungs diese Farben auszutauschen. Und ich wollte einfach so leicht sein. Jetzt lass es mich einfach drehen. Ich halte die Umschalttaste gedrückt, und jetzt werde ich sie nach rechts und vom Werkzeugfenster klonen. Ich werde einfach ihren Philip-Kern des horizontalen Befehls aufsaugen, genau so. Und jetzt, wenn ich nur all diese Jungs auswähle, kann ich wieder zum Ausrichtungsfeld gehen und tatsächlich werden Sie dieses Linienfeld viel verwenden. Also rate ich Ihnen, dass ich Ihnen raten, dass Sie sich mit diesem Panel vertraut machen, weil es in Website-Designs äußerst wichtig ist. Es klingt einfach gehen, um den Raum horizontal klicken zu wählen. Okay, und dann können wir einfach all diese Typen gruppieren und sicherstellen, dass sie alle so zusammen bleiben . Jetzt werde ich sie einfach verschieben, sie einfach mehr als etwas bis irgendwo hier an das Raster ausrichten und einfach so etwas herauszoomen . Und da gehen wir hin. Wir kamen zu der Navigation, die erstellt, Natürlich, wenn Sie wollen, Sie können ihn immer machen. Wir werden den A haben, na ja, na ja, stärkeren Schlaganfall. Also lassen Sie mich einfach all diese Jungs wie so greifen und in der Strichleiste werde ich es auf vielleicht zwei Punkte erhöhen. So ist es nur so, dass sie vor unserem Hintergrund gut sichtbar sind. Und wenn ich jetzt einfach loswerden die Panels jetzt können wir sehen, dass wir die ganze Kopfzeile und wir haben die volle Helden Abschnitt Held Abschnitt zusammen mit unserem Schieberegler Navigation begrüßt. Das nächste, was wir tun würden, ist, dass wir anfangen würden, diesen vorgestellten Abschnitt zu erstellen, dieser große Abschnitt direkt hier. Also lasst uns tatsächlich anfangen, das im nächsten Video zu tun 42. 11.1LAuf Beginn des Secion: Der nächste Abschnitt, den wir erstellen werden, ist unsere vorgestellten Artikel des Abschnitts, also ist es Ah, es ist tatsächlich in zwei separate Teile unterteilt. Dieser Hauptteil wird, wie Sie sehen können, wie Sie sehen können,vor einem rosa Hintergrund gestellt, und es gibt diesen großen Abschnitt Überschrift und etwas Text darunter. Dann haben wir einen Teil des Abschnitts, der einen leichteren Hintergrund hat und ah, 1234 acht vorgestellte Elemente insgesamt, und jeder Gegenstand umfasst aus. Zum einen komme ich eine Überschrift, die Andy abnimmt. Wir könnten einen wie einen Lese mehr Button hier oder einen Link hinzufügen, aber es ist ah gut, es ist nicht notwendig, weil dieser ganze Abschnitt hier ein Link sein kann. Und es ist eigentlich gut, einfacher zu klickern oder auf einen Link wie diesen zu tippen, dass, wenn es ein großes wie dieses ganze und vorgestellte Element als nur ein kleiner Link hier unten ist, tatsächlich anfangen sie zu erstellen, dass dieser Abschnitt von diesem oben von rosafarbenem Teil Also noch einmal, lassen Sie mich einfach die Panels wieder zurückbringen. Ich werde mit dem Erstellen in einer separaten Ebene für meine für meinen Abschnitt beginnen, und ich werde es so etwas nennen wie ein vorgestelltes genau so Und ich werde es unter einem anderen Helden setzen , eine Heldenschicht. Also werde ich nur das Rechteck-Werkzeug greifen und ich werde erstellen und Rechteck, das sich über unsere gesamte Leinwand erstrecken wird. Ich werde es größer machen. Es gibt, sollten wir so etwas finden, damit wir es später immer ändern können. Und natürlich will ich nicht, dass es einen Schlaganfall hat. Ich wollte einen gefüllten haben und ich wollte es sein. Ich wollte rosa sein, genau so. Natürlich nicht. Was wir tun müssen, ist, dass wir diese Typografie einfach hinzufügen müssen. Also werde ich ihr den Text schnappen, ein Freund Tal Frame Textil. Ich werde einen Textrahmen erstellen, den ich mit etwas Füllertext füllen werde, genau so. Und da wir eine Unterüberschrift, eine Abschnittsüberschrift, nun , Textstil werde ich es einfach jetzt verwenden. Obwohl ich werde sich ändern, ist etwas. Ich werde es so in die Mitte legen. Nun, was wir tun können, ist, dass wir einfach dieses Stück Text ausleihen und es klonen und einfach im Textstil in Körperlicht ändern können , genau so. Und wenn wir wollen, können wir es noch größer machen, einfach so. Und wenn Sie denken, dass es zu klein oder vielleicht zu groß ist, können Sie einfach auf die obere Platte gehen und vielleicht 18 machen, wenn Sie wollen. Aber es ist eine völlig fakultativ. Ich meine, ich denke, ich würde einfach mit den einfachen 16 Punkten gehen, da sie das sind. A Mai nah, Telefon-Größe, die typische von Größe für Old Boy Tech. Also gehe ich einfach mit 16 genau so. Und natürlich können wir in nur ein bisschen mit der Position herumspielen. Und sobald es alles eingestellt ist, können wir einfach beide diese Jungs packen, gruppiert sie und dann Shift klicken Sie auf sie, dass der Hintergrund. Um es der Auswahl hinzuzufügen und zu schwächen, stellen Sie einfach sicher, dass alles gut an der Mitte ausgerichtet ist. 43. 11.2Let's Füge die wichtigsten Elemente hinzu: Nun, wie Sie sehen können, fangen wir an, einige einige einige einige Platz hier zu verlieren. Wir müssen den Kerl bewegen. Wir müssen unseren Willen erweitern, unseren Vorstand. Aber davor denke ich, dass wir diese Jungs vielleicht nur ein bisschen nach oben bewegen wollen und diesen Kerl vielleicht etwas kleiner machen und wieder alles schön an die Mitte ausrichten wollen. Genau so. Also, jetzt können wir ihr einfach das Kunstbrett holen Still, einfach so, klicken Sie auf die Kunst der Tafel. Lassen Sie mich einfach ein wenig hinauszoomen und erweitern Sie einfach unsere unser Boot und erweitert noch mehr tun irgendwo Vielleicht hier, einfach so. Das sollte gut sein. Also der nächste Teil, um das nächste Stück von Artwork zu machen, das wir brauchen, um Osten zu erschaffen? Natürlich, dieser untere Teil dieser vorgestellten Artikel Abschnitt. Diesmal werde ich also nicht damit anfangen, diesen Hintergrund zu erstellen. Ich werde damit beginnen, nur ein vorgestelltes Element zu erstellen, nur dieses. Also wieder, ich werde einfach zu dem Ordner navigieren, in dem ich meine Augenfarben behalte und ich werde eine in mein Dokument bringen. Okay, also habe ich den Ordner hier und jetzt kann ich einfach diese Responsive mitbringen, die ich so in mein Dokument komme . Natürlich ist es viel zu groß, also kann ich es einfach kleiner machen, so dass das in Ordnung sein sollte. Nur eine Minute. Aber und natürlich, wieder, wenn Sie die Farbe ändern wollen unsere von unserem Ich kann nicht, wir können nur diesen Phil und einen Strich für Strichfarbe Werkzeuge verwenden . Wir müssen es das Dokument hinzufügen und jetzt können wir einfach alles auswählen und wir könnten den Strich loswerden . Ich glaube nicht, dass wir es brauchen werden. Und wieder müssen wir unsere Mustergruppe finden und einfach die Farbe geändert haben. Und wir können diesen Kerl nicht schließen, genau wie jetzt als Nächstes. Was wir tun müssen, ist, dass wir diese Steuer unter unserem Symbol hinzufügen müssen. Also nochmal, ich werde den Rahmen Textil greifen, einen kleinen Rahmen wieder erstellen, etwas Füllstoff einfügen, aber dieses Mal werde ich die vorgestellte Überschrift Textil verwenden. Genau so. Natürlich hatte es kann eine Zeile der Steuer es Hand haben, es könnte zwei Zeilen Text haben. Ich überlasse es Ihnen, was, na ja, na ja, wie groß diese Menge Text in Ihrem Entwurf sein wird. Als Nächstes werde ich mir diesen Kerl einfach in Kelowna ausleihen. Dour erweitert nur ein bisschen, aber ich werde dieses Textil zu Körper dunkel einfach so ändern. Wie Sie sehen können, spart uns die Arbeit mit Textilien eine Menge Zeit. Es macht den gesamten Prozess einfach und angenehm. Wirklich, es ist nur eine Angelegenheit, den Füller Text und das Recht auf Textstil hinzuzufügen, und wir sind im Grunde fertig. Aber damit könnte ich schwächen. Sie nun einfach sicher, dass alles gut an der Mitte ausgerichtet ist, genau so, und wir können es jetzt einfach gruppieren. Ein weiterer Vorteil von Arbeit auf diese Weise ist, dass, wenn wir jetzt nur kleiner machen, können Sie sehen, dass die Füllstoffsteuer sich auch auf unsere beiden auf die Größe der neuen Größe von unserem Aiken anpasst , Quellen hoffen, egal wie klein werden wir es machen oder groß, es wird immer gut sein, schön im Verhältnis angezeigt. Natürlich können wir immer einfach auswählen, auswählen und vielleicht ein wenig erweitert, so dass es so gut aussieht ein bisschen anders. Eine Sache, die wir brauchen, um meine beim Erstellen dieser Jungs genau hier zu begraben, ist, wenn wir einfach zurück zum Original gehen , können Sie sehen, dass wir 1234 vorgestellten Artikel hier in einer Reihe haben. Und natürlich haben wir zwei Reihen. Was bedeutet, dass, da wir vier Elemente haben, müssen wir sicherstellen, dass es nicht größer als drei Spalten ist, richtig, weil vier mal drei östlichen 12. Jetzt kann ich sehen, dass ich es bin. Ich denke, ich werde okay sein, weil meine Ikone nicht zu größer ist. Es ist nicht breiter als nur die drei Spalten. Also wirklich, alles, was wir jetzt tun müssen, so viel Gerechtigkeit davon, alles, was wir jetzt tun müssen, ist einfach zu köllen. Diese ganze Gruppe, diese alle Typen rechts, genau wie so, und dann drücken Sie einfach die Kontrolle J Control J. Und natürlich, wir möchten Sie vielleicht etwas Hausreinigung machen. Vielleicht wollen wir etwas tun. Es gibt einige Ausrichtung, genau wie so, nur um sicherzustellen, dass alle diese Jungs ausgerichtet werden, um proportional auszurichten und natürlich können Sie mit der Größe dieser Symbole herumspielen. Ich überlasse es dir. Was ich tun möchte, was ich Ihnen hier zeigen möchte, ist, wie man ihn erschaffen kann. Dies ist der Abschnitt von vorgestellten Artikeln. Aber natürlich wollen wir nicht, dass all diese Symbole nur Computer und mobile Geräte sind. Wir wollen, dass sie verschiedene Symbole sind, oder? So, genau wie im Fall unserer Social Media Icons, können wir einfach auswählen und 11 Bild, wenn ich hier kann. Und denken Sie daran, dass Sie ihm eine Untergruppe oder ein Objekt innerhalb einer Gruppe anvisieren können, indem Sie einfach darauf doppelklicken , indem Sie einfach darauf doppelklicken , genau so . Und jetzt können wir einfach drücken, Dokument ersetzen und einfach das Bild finden, nach dem wir suchen. Ich mache dasselbe mit dem Rest aus dem Dokument. Einige werden einfach das Dokument ersetzen. Ersetzen Sie das war die Broschüre. Vielleicht wächst diese Beratung vielleicht dort. Warum nicht der nächste mit Gebäuden als nächstes könnte die Kamera sein und die letzte könnte die i-d-Karte sein . Genau so. Natürlich müssen wir immer noch ihre Farben ändern, oder? Ich meine, wir wollen, dass diese Farben gut sind, etwas. Nun, genau. Nun, in Übereinstimmung mit den anderen Farben mit unserer mit unserem Farbschema. Also würde ich diese Farben auch zusammen mit diesen mit diesen Textstücken machen, ich würde sie sicherstellen, dass die richtige Farbe haben. Nun, wir sind gut, mit diesen Textstücken zu gehen, denn denken Sie daran, dass wir Textstile erstellt haben, als wir diese Textilien erstellt haben, haben wir die richtige Farbe hinzugefügt, die hier angezeigt wird. Aber diese Symbole müssen immer noch die richtige Farbe haben, um ihnen hinzugefügt zu werden. Also wieder, wenn wir einfach doppelklicken auf eine bestimmte eingebettet, um dieses Symbol hier zu dokumentieren und doppelklicken Sie darauf erneut, wir können mit isoliert in einem in einem separaten Fenster einbetten. Und jetzt wählen wir einfach alles, was wir wieder können, nur stellen Sie sicher, dass wir die richtige Farbe hinzufügen und der Prozess ist der gleiche wie es waas bevor ich weiß, dass die Änderung hier sehr gering ist. Ich meine, man kann nicht wirklich den Unterschied in den Farben sehen. Aber glauben Sie mir, es gibt einen Unterschied in den Farben. Und um fast konsistent über Ihr Design zu sein, ist es gut zu wissen, dass es gut ist zu machen. Es ist gut sicherzustellen, dass alle Farben richtig angezeigt werden. Also lass mich diesen Kerl überprüfen und sollte gut sein. Also lassen Sie mich einfach schnell den Brunnen hinzufügen, die richtigen Farben Zehe all diese Jungs und ich werde gleich wieder bei Ihnen sein. Wenn also alle Farben dabei sind und alle Farben richtig sind, können wir jetzt einfach alle diese Symbole auswählen und gruppieren. Jetzt können wir sicherstellen, dass wir hinter ihnen ziehen. Also werde ich die Einfügung hinter dem Auswahlmodus aktivieren, genau wie so, greifen Sie das Rechteck-Werkzeug und erstellen Sie einfach eine Direktion, die sich über die gesamte Leinwand so erstrecken würde . Ich denke, das sollte gut sein. Und natürlich werde ich sicherstellen, dass es das richtige Feld hat. Dieses Mal wird das ein bisschen dunkler. Grau Genau wie so Nun wäre das letzte, was zu tun wäre, nur sicherzustellen, dass alles gut in die Mitte lebendig ist , genau so. Und natürlich, wenn Sie wollen, können Sie es vielleicht noch gut machen, diesen ganzen Hintergrund größer, wenn Sie wollen, oder vielleicht die Symbole nur ein bisschen kleiner. Aber wie gesagt, ich überlasse alles Ihnen. Ich möchte, dass Sie mit all diesen Techniken experimentieren, weil dies der einzige Weg ist, wie Sie gut in ihnen werden . Der nächste Abschnitt, den wir erstellen werden, wird unser zweiter Feature-Abschnitt sein , der dieser Typ hier ist. Und übrigens, dies wird in diesem Abschnitt schaffen wird uns eine weitere Gelegenheit geben aber mit Bildern im Inneren zu arbeiten, beleidigt Designer und sehen und wie wir auch verwalten können. Werden Bilder in den Designer einfügen, so bleiben Sie dran 44. 11.3Let's füge den zweiten Artikelbereich hinzu.: in diesem Video werden wir einen weiteren wichtigen Aspekt für den Umgang mit Bildern innerhalb des Affinity-Designers entdecken . Wir werden diese Funktion zweiten vorgestellten Abschnitt direkt hier erstellen und wir werden beginnen. Lassen Sie mich einfach die Panels zurückbringen, indem Sie eine weitere Ebene erstellen. Also werde ich einfach ein erstellen und es umbenennen, wie es in Dies wird in Ordnung sein. Wir werden es wieder unter einem vorgestellten bringen. Ich benutze sie den Ort, das Bildwerkzeug, und ich werde dieses Bild hier auswählen. Was ich möchte, ist, dass dieses Bild gut über den linken Teil vom Ansichtsport gestreckt wird . Also muss ich sicherstellen, dass es nicht über die sechste Collins-Säule in unserer großen kommt . Also sind es 12345 sechs. Also werde ich dafür sorgen, dass es gut mit dieser Kolumne übereinstimmt. Genau wie so. Genau so. Und wie Sie sehen können, wird das Bild hier auf der linken Seite zugeschnitten. Standardmäßig wird Affinity-Designer alles beschneiden, was seine Kante berührt, oder es geht über seine. Also, wenn Sie mit Foto-Shop vertraut sind und Wenn Sie mit Illustrator vertraut sind, werden Sie feststellen, dass, na ja, diese beiden Sie bereits wissen, dass diese beiden Stücke von Software behandeln Bilder in dieser Art von Situation ein etwas anders. In Illustrator können Sie ein Bild außerhalb des Kunsttafels platzieren und sich frei bewegen und in einem Fotoshop. Standardmäßig wird das Bild sozusagen von der Kunsttafel sammeln . In Afinitor Designer erhalten Sie das Beste aus beiden Welten, weil Sie standardmäßig zugeben, dass das Bild rechts abgeschnitten wird und der direkte Winkel abgeschnitten wird oder dieser ganze Abschnitt einen Clip bekommt. Alles wird beschnitten. jedoch Wenn Sie esjedochnur weit genug bringen, können Sie es von diesem aus dem Cannabis von der Sockelleiste selbst lösen, damit Sie es neben haben können . Sie können es sozusagen auf der Seite haben. Sie können es gut machen, Sie können in Ihren Zeitplan verwandelt, Ihre Notizen oder so etwas. Aber wenn du willst, kannst du es auf das Design bringen und du kannst ihm die Sockelleisten dein ganzes Bild schneiden lassen , und das ist eigentlich das, was ich will, also möchte ich es auf die sechste Spalte setzen. Also ist es 12345 und es sind sechs. Lassen Sie mich nur sicherstellen, dass es schön ausgerichtet ist, genau so, vielleicht nur ein bisschen oben. Ich werde es nur ein bisschen Nagy aufmachen. Und natürlich ist das nächste Kunstwerk, das wir erstellen müssen, der richtige Teil dieses Abschnitts. Also werde ich nur das Rechteck-Werkzeug greifen, und ich werde ein Rechteck erstellen, das sich so dehnen wird. Natürlich, wenn ich wollte, könnte ich gehen und es so ausstrecken. Aber das muss ich nicht. Also werde ich es einfach so lassen und ihm eine richtige, richtige Farbe geben . Und jetzt werde ich sicherstellen, dass alles gut so ausgerichtet ist. Und das letzte, das letzte, was hier zu tun ist, wäre, nur den Text hinzuzufügen. Also nochmal, ich werde das Rahmentext-Werkzeug greifen und einen Textrahmen erstellen. Füllen Sie es mit dem nächsten, und ich werde sicherstellen, dass es den richtigen Textstil hat, der die Abschnittsüberschrift Ausrichten wäre! Es ist links drauf, vielleicht einfach kleiner zu machen, einfach so. Ich werde dafür sorgen, dass es gut auf meine vielleicht mit dieser Kolumne abgestimmt ist, genau so. Ich werde es heraufbringen. Brennan ist runter, klonen es, und änderte dies in Textstil in Körperlicht. Das kann nur ein bisschen erweitert werden, genau so. So können Sie sehen, wie einfach dies, wenn Sie die Füllstoffsteuer haben und Sie die Textstile haben, wie einfach es ist, nur einige Steuerstücke hinzuzufügen und Text mit dem Text Sterne zu manipulieren . Also gehe ich einfach auf die Zehe, schnappe diese Typen, gruppiere sie und stelle sicher, dass sie an der Mitte ausgerichtet sind, genau so. Und wir haben diesen Abschnitt erstellt jetzt schwächen Nur ich hoffe, dass all diese Jungs nur um sicherzustellen dass sie sind, sie sind gut zusammen. Und da gehen wir hin. Wir haben ihn und die zweite Feature-zukünftige Gruppe erstellt. Lassen Sie mich nur gewähren, wo es hingehen muss, genau so. Und da gehen wir hin. Der nächste Teil, der nächste Abschnitt, den wir erstellen werden, wird dieser Blawg-Beitrag sein, der Postauszüge tatsächlich blockiert , genau hier, so könnte dies wie von unserem Blawg-Abschnitt sein und all diese Jungs könnten blockiert werden Post Block Post Auszüge und wieder. Und diese Schaffung dieses Abschnitts wird uns eine weitere Gelegenheit geben. Teoh Arbeit mit Bildern auf eine noch andere Weise, so gut, diese so könnte dieser Weg tatsächlich wirklich praktisch in Ihrem täglichen Willen jeden Tag kommen. Nun, Website ein Design Arbeit, so bleiben Sie dran. 45. 12.1LAuf Beginn der Creatig der Blog-Seite: bevor wir mit der Erstellung aus unserem Block Abschnitt beginnen, müssen wir unser Artboard noch ein bisschen mehr erweitern. Also werde ich sicherstellen, dass dieses Kunstboard noch ausgewählt ist. Klicken Sie auf das Hofbrett und erweitert noch mehr zu irgendwo hier, vielleicht sogar ein bisschen mehr. Jetzt muss ich das Raster selbst erweitern. Also lass mich einfach das Gitter finden. Es ist genau hier, dass ich es einfach so runterbringen werde. Lass es mich einfach wieder sperren und ich werde eine weitere Ebene erstellen und sie Ach, Block nennen . Genau so. Beginnen wir also mit der Erstellung des Abschnitts hängen. Also werde ich ihr den Rahmen Textil packen und einfach einen Textrahmen erstellen, der so etwas aussehen wird . Ich werde etwas Text einfügen, und ich werde sicherstellen, dass die Abschnittsüberschrift als dieser Stil aktiviert ist. Und ich werde sicherstellen, dass ein Linienmittelpunkt auch so eingeschaltet ist. jedoch Ich möchtejedochdie Farbe dieser Überschriften ändern. Ich werde einfach diese dunklere Farbe wählen, genau wie so Jetzt werde ich es vielleicht nur eine Textzeile machen dieses Mal und ich werde sicherstellen, dass es an der Mitte meiner Kunsttafel ausgerichtet ist. Genau wie so, wenn wir einen Blick auf das Original nehmen, werden Sie feststellen, dass die vorgestellten Bilder tatsächlich Quadrate sind. Und wenn Sie möchten, können Sie das Faktorzuschneidewerkzeug greifen, Bilder importieren und versuchen, sie zu beschneiden, wissen Sie, um die quadratischen Proportionen zu entsprechen. Aber es gibt einen einfacheren Weg, quadratische Bilder in einem Möbeldesigner zu erstellen. Sehen wir uns das jetzt an. Ich werde einfach schnell ein neues Dokument erstellen, das ich nicht einmal speichern werde. Aber ich werde sicherstellen, dass es tatsächlich die quadratischen Proportionen hat, sozusagen, dass ich eine quadratische Leinwand erstelle. Ich werde sicherstellen, dass die mit zum Beispiel 200 Pixel und Höhe gleich sind, und ich werde einfach schlagen. Okay, Jetzt ziehe ich einfach das Platzbild-Tool, und ich kann einfach zu dem Ordner navigieren, in dem ich meine Bilder behalte und beginne bei in Bildern. Also werde ich mit diesem Kerl hier anfangen, und ich werde es platzieren, und natürlich ist es viel zu groß, also muss ich sicherstellen, dass IHS was? Das ist kleiner. Lassen Sie mich einfach ein wenig hinauszoomen und ich halte die Steuertaste gedrückt und ich mache es viel kleiner marschieren . Genau so. Genau so. Und jetzt, wie Sie sehen können, verhält sich meine Leinwand, mein Boot, wie eine Clipping-Maske. Also bin ich auf Lee, um den Krieg zu retten. Ich kann in meinem Campus sehen. Also jetzt meine, mein Kunstwerk ist 250 Pixel breit und 250 Pixel hoch. Jetzt kann ich einfach das ganze Dokument exportieren, weil es die richtigen Abmessungen hat und die richtigen Proportionen ein J-Pic hat. Ich werde nur die Qualität auf rund 75% senken und ich kann einfach den Export erreichen. Und natürlich, da ich diese Bilder bereits hier erstellt habe, werde ich mich einfach anders benennen, vielleicht als einfach so und dann B c. D. Etcetera. Also, was wir jetzt tun können, ist, dass wir einfach dieses Bild greifen und wählen Bild ersetzen, und wir können jetzt wählen Vielleicht dieser Kerl hier und wie Sie sehen können, es ist Ah, dieses Bild fühlt die gleichen Proportionen wie unser vorheriges Bild. Also müssen wir nichts ändern, was sein könnte, wie die Proportionen zu ändern. Nichts dergleichen. Wir können einfach ein Bild ersetzen und dann einfach nur die Steuerung alle plus Shift Plus als Abkürzung verwendet , um die Exporteinstellungen zu erhalten. Und alle Vorschaueinstellungen sind bereits da, so dass wir einfach weitergehen und auf Exportieren klicken können. Benennen Sie diesen Kerl um und tun Sie das gleiche wird den Vorgang noch einmal wiederholen. Also lasst uns einfach greifen auf dieses Bild, wie So wieder alte Steuerverschiebung s Export, sehen und geben Sie ersetzen Bild. Vielleicht dieser Typ gerade jetzt, alte Kontrollverschiebung als Export und dieser Kerl wird sein, ich denke, d wie so wieder Bild ersetzen und ich denke, es wird vielleicht dieses Bild dieses Mal wieder sein . Alte Steuerverschiebung als. Und es wird sein und Bild ersetzen. Und lasst uns denken, dass dieser Kerl zu viele Bilder, denke ich. Aber zu viele Bilder und Export und f einfach so. Jetzt können wir dieses Dokument einfach schließen. Wir brauchen es nicht wirklich, aber jetzt können wir einfach nur greifen die Ort Bild Werkzeug, und wir können Platz in Bildern beginnen. Also lass mich einfach mein Bild finden, genau so. Und wenn Sie möchten, können Sie es kleiner machen, einfach an einer seiner Ecken ziehen und es kleiner machen, genau so. Natürlich, wenn wir die Dokumente kleiner machen, würden wir wir das Bild überhaupt nicht ändern müssen. Aber nur um des Erlernens spezifischer Techniken hier im Möbeldesigner willen , lass es uns einfach den längeren Weg machen. Also jetzt haben wir ein Bild und alles, was wir wirklich tun müssen, ist, etwas Text auf der Seite hinzuzufügen, denn wenn wir einen Blick auf dieses Original werfen, können Sie sehen, dass es ein Bild gibt und es einige Texturen, eine Überschrift und es gibt einen Text auf der richtig und eigentlich sowohl die ich meine, die Überschrift und der Text. Sie haben bereits bestimmte Textilien in unserer Bibliothek, also wirklich nur zu tun ist, um das Rahmen-Text-Werkzeug zu bekommen und zu greifen und einfach einen Textrahmen bei einem Text zu erstellen und aus den Textstile wählen Sie vorgestellte Überschrift machen es vielleicht Gerechtigkeit nur ein bisschen kleiner. Ausrichten. Es ist links und vielleicht nur kleiner, genau so. Und dann klonen Sie es einfach so nach unten und erweiterte ein wenig geändert. Ah, Textstil zu Körper dunkel. Genau so. Und so können wir einen vorgestellten Artikel erstellen, einen Block Auszug genug in Designer. Wir können natürlich natürlich mit etwas Position in nur ein bisschen herumspielen, da wir wollen ah drei vorgestellten Artikel über unser Pace Board haben. Ein vorgestellter Gegenstand darf vier Anrufe nicht überschreiten, richtig, da drei mal vier gleich 12 ist. Also, jetzt können wir einfach nur das Bild greifen, den Text greifen und einfach nur so kleiner machen, und stellen Sie sicher, dass berühmte Designer macht all das schwere Heben für uns. Es ist ah, das Bild kleiner zu machen, und es ist ah, macht sie, dass der Text des Rahmens kleiner als auch. Aber jetzt können wir es einfach einfach hier setzen und den Textrahmen erweitern, so vielleicht diesen Kerl auch ein bisschen erweitern. Und da gehen wir. Wir haben unseren Rahmen. Nun, wir haben unser vorgestelltes Bild erstellt 46. 12.2LAuf uns die Bilder ersetzen: Also, um unsere Blogger Beiträge Abschnitt beenden wir müssen Rampe unsere vorgestellten Artikel schwächen Gruppe es wachsen , wenn Sie wollen. Und jetzt hat er einfach die Zehe, die sie halten, um den Schlüsselklon zu kontrollieren und nach rechts, genau so. Alles, was wir jetzt tun müssen, ist, Kontrolle J zu drücken, um die letzte Transformation zu duplizieren. Nun, wenn wir alle diese vorgestellten Elemente auswählen und sie irgendwo hier unten bringen, können wir jetzt sechs Elemente erstellen. Und alles, was wir jetzt tun müssen, ist nur greifen, doppelklicken Sie auf dieses Bild, um es zu greifen und klicken Sie, Ersetzen Sie Bild, finden Sie das Bild, tun Sie das gleiche mit diesem Kerl. Das wird Bild sehen, genau wie dieser Typ wird das D-Bild so sein. Dies wird das Bild sein, und dies wird das F-Bild sein. Nun lassen Sie uns einfach einen einfachen Link hinzufügen, der sagen würde Siehe die Blawg. Also werde ich den künstlerischen Textiltyp reingreifen, sehen Sie die Blondine, diesen Block, nicht unbedingt im Baumstamm. Und jetzt können wir einfach ah, hatte die vorgestellte Überschrift Textil dazu. Aber ich möchte nicht, dass diese Zeichen groß geschrieben werden. Also werde ich sicherstellen, dass im Zeichenfeld die Großbuchstaben Funktion so ausgeschaltet ist und ich werde sicherstellen, dass die Farbe richtig ist. Genau so, ich werde es Sommer auf der rechten Seite setzen. Irgendwo hierwäre das in Ordnung. Irgendwo hier Und natürlich, jetzt können wir einfach sicherstellen, dass all diese Typen gruppiert sind und all diese Jungs eine Gruppe sind. Jetzt können wir einfach den Hintergrund unter ihnen hinzufügen, damit wir das Rechteck-Werkzeug greifen und anfangen können , einen Hintergrund zu zeichnen. Und natürlich werden wir sicherstellen, dass es nicht so dunkel ist, obwohl es schön aussehen könnte. Und aber es wird diesen hellen Aziz-Hintergrund haben. Genau wie so Jetzt können wir nur greifen beide diese Jungs, stellen Sie sicher, dass sie in der Mitte richtig ausgerichtet sind erweitern diesen Kerl nur ein bisschen, um sicherzustellen, dass es auch gut, genau in der Mitte des Kunstboards. Und da gehen wir hin. Wir haben den Blockabschnitt erstellt. Als nächstes werden wir diesen Instagram-Feed-Abschnitt erstellen und wir werden eine Menge Spaß mit der Maskierung in einem Fit in Designer haben . Zuerst werden wir eine Reihe von Rechtecken erstellen, und dann werden wir sie als Clipping-Masken verwenden, um diesen Instagram-Feed zu erstellen, also bleiben Sie dran. 47. 13.1Lauf Beginn der Bildergalerie: unsere Website fängt an, schön auszusehen. Wir haben bereits den Headerbereich hier, zusammen mit den Navigations- und Social-Media-Symbolen. Wir haben das Heldenbild mit dem Hintergrundbild, der Typografie und der Schiebereglernavigation erhalten. Dann haben wir diesen großen Abschnitt von vorgestellten Artikeln direkt hier bekommen, die es in zwei separate Unterabschnitte aufteilen würden . Und dann kamen wir zu diesem zweiten vorgestellten Artikel, der Unterabschnitt, der unsere gesamte Website in zwei Hälften links und rechts teilt. Und dann haben wir unsere von unserer Blawg-Abteilung bekommen. Also als nächstes werden wir den Instagram-Feed einen Abschnitt für unser Design erstellen. Also werde ich wie gewohnt eine neue Ebene erstellen und wir könnten es Instagram nennen. Oder wir könnten einfach nennen es Galerie, genau wie so, in dem Prozess aus der Erstellung der Galerie, werden Sie lernen, wie ein Clipping Masken innerhalb der Möbeldesigner zu verwenden, und er wird die letzte Technik sein, die mit Bilder in dieser Software. Also, was wir hier wollen, ist ein Siri aus Rechtecken und Quadraten, die die Container für unsere Bilder sein werden . Also werde ich nur zu Opa das Rechteck-Werkzeug, und ich werde einfach erstellen. Ich werde einfach ein Rechteck erstellen, das sein wird, na ja, na ja, etwas wie Also warum nicht? Nein, ich werde es einfach so nach rechts klonen und vielleicht etwas kleiner machen, um so etwas wie Also Dann werde ich es wieder nach rechts klonen und es erweitern, als int wieder und noch mehr erweitert. Und dann werde ich einfach diesen Kerl schnappen, ihn nach rechts bewegen und es deutlich kleiner machen, genau wie so Lampen und werde vielleicht einige dieser Farben ändern, nur damit es nicht so langweilig aussieht. Und was wir jetzt tun können, ist zu schwächen, einfach diese Typen runter zu bringen und sie zu klonen, genau so, sie in eine Gruppe zu verwandeln und sie einfach so umgedreht zu haben. Also, jetzt unser Testament. Unsere Galerie von Instagram Feed ist nicht so repetitiv. Ich werde auf Gruppe diese Jungs und jedes einzelne von diesen kleinen Elementen aus diesen kleinen Rechtecken und Quadraten wird 11 Container für unsere für unsere Bilder sein. Also, was wir jetzt tun können, ist schwächen einfach anfangen, Bilder hinzuzufügen. Also werde ich das Platzbild-Tool verwenden, und ich werde zu meinem Instagram-Ordner navigieren. Ich habe speziell diese Bilder nur ein bisschen kleiner gemacht, nur damit du nicht sehen musst, dass ich sie neu dimensioniert. Und Justin, sie werden zu viel klingen, um diesen Kerl zu öffnen und ihn einfach so zu platzieren. So jetzt können Sie in meinem späteren verbringen alles sehen, was ich das Bild bekam und ich habe all diese Rechtecke hier. Also, wie Zehe tatsächlich dieses Bild mit einem dieser Rechtecke schneiden? Nun, es ist einfach und nicht einfach zur gleichen Zeit. Es ist einfach, weil Sie es einfach greifen und bewegen Sie es unter dem Rechteck, das Sie wollen. - Teoh. die Kinder Auch werden wie ein Clip in einem Chaos arbeiten. Sagen wir mal, es wird dieser grüne Kerl hier sein. Aber wie Sie sehen können, manchmal müssen Sie einfach nur zu ziehen und den richtigen Platz für diese Technik zu finden . Aber sobald Sie es gefunden haben, können Sie sehen, dass Sie es genau so zu einer Clipping-Maske machen können, und wir können es irgendwo hier verschieben. Das sollte in Ordnung sein. Also nochmal, ich werde sicherstellen, dass ich auf dem richtigen Spieler hier bin und ein anderes Bild schnappen. Vielleicht ist das vielleicht diese Buntstifte, wie so und ich werde einfach so klicken. Und ich frage mich wirklich, dass dieses Bild von diesem grünen Rechteck abgeschnitten wird. Wie Sie hier sehen können, meine Ebenen Panel, alle diese Rechtecke haben eine andere Miniaturansicht, und es ist Ah, ich denke, es ist eine gute Idee, diese Jungs zu machen, um ihnen eine andere Farbe zu geben, denn jetzt können Sie sehen, dass sie sich auch im Ebenenfenster unterscheiden, so dass es einfacher ist, einfach zu unterscheiden, welches Rechteck welches ist. Also werde ich diesen Kerl unter dieses Rechteck bringen, aber wie Sie sehen können, ist er wirklich gut verschwunden. Das liegt daran, dass es außerhalb unserer Clipping-Maske fällt. Aber wenn wir es über unser Rechteck bewegen, erscheint es magisch wieder. Genau wie so. Also, jetzt können wir einfach den Prozess mit allen verbleibenden Bildern wiederholen, aber ich denke, bevor wir das tun, können wir vielleicht die Farben von einigen dieser Rechtecke ändern, weil wir hier vier Ping-korrekte Winkel haben , und es könnte ein wenig verwirrend in unserem Ebenen-Panel Also lassen Sie uns nur, dass einfach schnell einige beliebige Farben wählen. Nur so sind unsere Rechtecke in unserem Ebenen-Panel gut sichtbar. Vielleicht auch dieser schwarze. Lassen Sie mich einfach seine Farbe in eine bläuliche Farbe ändern. Und jetzt können wir tatsächlich sicherstellen, dass wir auf der richtigen Ebene sind. Platzieren Sie ein Bild, vielleicht dieser Kerl und sagen wir, dass es von diesem grünen Kerl hier abgeschnitten wird. Also lassen Sie mich es einfach im Ebenenfenster finden. Es ist dieser Typ hier, und ich werde ihn einfach dorthin bringen. Dann werde ich sicherstellen, dass ich auf der richtigen Schicht bin, und vielleicht diese, und vielleicht lasst es uns vielleicht über diese rote ziehen, also wieder hier und schieben sie nach oben. Also lassen Sie mich diesen Prozess mit all den verbleibenden Bildern schnell machen, und ich werde mich in nur einer Sekunde bei Ihnen melden. Und da gehen wir hin. Wir haben die Galerie erstellt, der Instagram-Feed erstellt. Also denken Sie daran, dass, um eine Clipping-Maske zu erstellen, na ja , der einfachste Weg nach innen, wenn in Designer ist nur ein Bild zu platzieren und dann einfach es in einen Behälter wie ein ah zu legen , gut, Rechteck oder ein Quadrat oder ein Kieselsäure oder jede Form, die Sie wollen. Also, jetzt, da wir diesen Abschnitt erstellt haben, wird unsere nächste Reihenfolge des Geschäfts sein, nur ihre Fußzeile zu erstellen. Und in unserem Fall von Footer ist gut besteht aus zwei Teilen mit von diesem gegen den Greenback Boden und die kleinere hier in der Unterseite. Das ist eigentlich eine Wiederholung von unserem Hutmacher. Lassen Sie uns also anfangen, das im nächsten Video zu tun. 48. 13.2LAuf Gestalte die erste Spalte der Fußzeile: in diesem Video werden wir anfangen, unsere Fußzeile zu erstellen. Und wie Sie sehen können, habe ich unsere Kunst bereits erweitert, aber weil sie zu klein wurde. Also lassen Sie uns jetzt eine andere Ebene erstellen. Lassen Sie mich hier einfach eine schnelle Hausreinigung machen. Also lassen Sie mich einfach schnell creedy neue Ebene und nennen es Fußzeile genau wie so werde ich es hier unten unter der Galerie bringen , und ich denke, dass wir mit dem Erstellen des Hintergrunds beginnen, weil unsere Steuer wird weiß sein und ich einfach wollte für Sie gut sichtbar sein. Also werde ich das Rechteck-Werkzeug greifen und einfach einen Hintergrund erstellen, der so groß sein wird . Ich denke, es sollte gut gehen. Natürlich muss es die richtige Farbe haben. Und vielleicht werde ich es nur ein bisschen notieren, genau so. Aber ich werde jetzt tun, ist ich werde den Rahmen Textil Gramp und ich werde einen Text Freund erstellen , der vielleicht drei Spalten breit sein wird. Genau wie so und wieder. Fügen Sie Füllstoff, Text aus dem Kurs ein, wenn Sie einen wirklich Text ehemaligen Client hätten, würden Sie damit bevölkert. Aber da wir es nicht haben. Wir sind einfach damit bevölkert, es mit dem etwas Dummy-Text zu füllen. Also werde ich voran gehen und Textstile wählen und Abschnittsüberschrift wählen und lassen Sie mich einfach so aufstellen Vielleicht erweitert nur ein bisschen so und setzen Sie es ein bisschen nach oben, um hier zu stolpern. Das sollte in Ordnung sein. Natürlich, wenn Sie nicht wollen, dass Teoh diese Textrahmen so groß ist, dass Sie es einfach kleiner machen können. Oder Sie können einfach das Rahmentext-Werkzeug immer wieder greifen und einen anderen Textrahmen erstellen und etwas Füllungstext einfügen, weil dieses Mal beleidigte Designer Ihnen wahrscheinlich einige andere Wörter an den Editor geben wird , die Sie verwenden können, um die Simulator, der, na ja, Überschrift jeden bestimmten Abschnitt. Lassen Sie mich einfach löschen. Ich werde diesen Kerl ganz deutlich hinunterklonen. Ich werde es nur für eine Sekunde lassen, weil ich jetzt den Stift holen will. Ich will sicherstellen, dass ich den Schlaganfall verbrauche, aber nicht von diesem Kerl, so dass wir nur Diesel gewählt haben. Ich werde wieder das Mental schnappen. Ich werde dafür sorgen, dass ich bei Lee den Schlaganfall habe, dass ich keinen Phil habe, und ich will streicheln, um leicht zu sein. Und ich werde eine Linie erstellen, die von links nach rechts alle über diese vier Spalten kratzen wird. Und ich tue das, denn wenn du nur dieses Wort hier lassen würdest, würde es irgendwie leer aussehen. Ich meine, wir werden in nur einer Sekunde ein paar Links hier links haben. Und wenn wir es einfach so verlassen und dann eine andere Spalte und eine andere Spalte eingegeben haben, denn insgesamt werden wir drei Spalten haben. Es wäre einfach so aussehen, als würden sie viel Platz verschwenden. Und diese Linie hier wirkt wie ein netter Divider wie ein netter Philip. Es ist nicht zu aufdringlich, aber gleichzeitig sieht es wirklich so aus, als hätte es seinen Platz. Also im Moment werde ich das einfach von einem Abschnitt zu Körperlicht ändern, genau so, und ich werde es nur 11 Worte machen. Und ich werde es aufheben und es vielleicht dreimal so klonen und natürlich , , wenn Sie wollen,können Sie einfach einen weiteren Textrahmen hinzufügen und den Textfüller ändern. Oder Sie können einfach ein anderes eingeben. Es gibt noch ein paar andere Worte, die du wählst. Vielleicht ein paar wirklich Links, wenn Sie wollen. 49. 13.3LAuf die Gestaltung und die gesamte Fußzeile fertigstellen: insgesamt. Wir wollen drei Spalten haben. Wenn wir uns das Original ansehen, sind es drei Spalten. Es sind diese Kerle hier. Also möchte ich sicherstellen, dass jede dieser Spalten richtig ausgerichtet ist. Teoh die richtige ein Gitterruf. Aber dieser Hintergrund blockiert meine Sicht darauf. Also werde ich sicherstellen, dass dieser Phil hier im Farbfeld-Panel ausgewählt ist, dass ich es auf etwas wie 25% fallen werde. Vielleicht bringe ich es in nur einer Sekunde zurück. Also lassen Sie mich einfach ein wenig hineinzoomen. Und jetzt, wenn ich all diese Jungs all diese Elemente packe und ich werde sie jetzt gruppieren, kann ich diesen Kerl leicht nach links bewegen und dann einfach die Steuerung J drücken, um es nach rechts zu klonen , genau so. Und jetzt können wir einfach unseren Hintergrund greifen und die Deckkraft auf 100% im Original zurückbringen . Wir haben etwas mehr Text rechts hier auf der rechten Seite, also so etwas wie ein etwa US-Auszug rechts hier auf der rechten Seite, anstatt nur Links hier auf der linken Seite. Also werde ich einfach auf diese Jungs klicken, entfernen Sie sie und dann doppelklicken Sie auf diesen Kerl und gerade so erweitert. Vielleicht nur ein bisschen. Nur ein bisschen hoch und vielleicht klonen Sie es irgendwo hier runter. Und wenn wir die Panels nur für eine Sekunde entfernen und vielleicht etwas verkleinern, können wir sehen, dass wir unsere Spalten mit den Links und etwas Text hier erstellt haben. So echt alt. Es bleibt zu tun, ist einfach nur sicherzustellen, dass alles gut ausgerichtet ist. Also müssen wir nur gruppieren all diese Jungs bringen die Paneele zurück, fügte das Schlafzimmer zur Auswahl und nur eine Linie, alles zu dissenter. Also, wirklich, das Letzte, was wir hier tun müssen, ist, einfach den Header Paul von diesen Jungs zu leihen, genau wie so genannte Pete und einfach hier runter gehen, die richtigen Funde direkt später finden, darin versteckt und Bringen Sie es einfach ein bisschen runter. Vielleicht ziehen wir es nach oben. Und jetzt, was wir tun könnten, ist, dass wir einfach alle diese Jungs kleiner machen könnten, denn normalerweise, wenn Sie einen Fuß in einem Header wiederholen, sozusagen, sind diese Jungs in der Regel nur kleiner all diese Elemente oder kleiner. Also werde ich machen, dass es so groß und Sprichwort geht für dieses Menü. Also werde ich es einfach kleiner machen, genau so. Und natürlich können wir einfach unsere Hartfaserplatte entfernen, ein bisschen rausbringen und los geht's. Wir haben unser Design kreiert. Also hoffe ich wirklich, dass du gelernt hast, dass sie es auch wissen. Aber vor allem, dass Sie genossen die Erstellung dieser Website zusammen mit, weil ich wirklich hoffe , dass Sie es zusammen mit mir erstellt haben. Wenn etwas nicht stimmt, spulen Sie das Video einfach zurück schauen Sie es noch einmal an. Und wenn etwas immer noch nicht zu klar ist, können Sie immer nur eine Frage stellen In unserem Diskussionsforum, das Design kann fertig sein, aber wir sind nicht fertig arbeiten mit noch einige Dinge zu tun haben. Wir brauchen immer noch Teoh. Wir machen es bereit für die Lieferung an den Kunden und liefern es an einen Webentwickler. Wenn Sie mit einem arbeiten, wenn Sie nicht wünschen, die Website selbst zu entwickeln. Aber das Design ist fertig 50. 14.1Die Gestaltung an den Kunden: Wenn Sie mit der Gestaltung einer Webseite fertig sind, ist es Zeit, sie an den Client auf verschiedenen Stufen der Kommunikation mit dem Client zu liefern. Sie werden verschiedene, leicht geänderte Versionen aus dem Design präsentieren , daher ist es gut zu wissen, wie Sie Ihre Arbeit schnell speichern und teilen können. Mit einer Sache zu Designer, Die offensichtlichste Art der Präsentation Arbeiter wäre, das Design zu speichern und es an den Kunden zu senden . In den meisten Fällen haben sie keinen beleidigten Designer unter Computern installiert. Daher müssen Sie eine Datei senden, die ein gewöhnliches, leicht erkennbares Licht ist und die die Qualität Ihres Designs bewahrt. Das einfachste und narrensicherste Dateiformat, das Sie an Ihre Kunden senden können, ist natürlich J. P G. P G. Speichern Sie Ihre Arbeit als J-Pic-Datei ist so einfach wie mit dem Exportbefehl, den Sie unter das Dateimenü. Wirklich, die einzigen beiden Optionen, die Sie brauchen, um die Aufmerksamkeit auf eine dieser Stufe zu zahlen, ist, dass der Qualitätsschieber und der Bereichsauswahl, wie ich mir vor dem besten Kompromiss zwischen guter Qualität und kleiner Dateigröße vorgestellt, 70 zu 75%. Ein großer Nachteil, obwohl es deaktiviert ist, eine J-Pick als Dateiformat zu verwenden, ist, dass es keine Transparenz unterstützt. Wenn Ihr Entwurf einige grafische Elemente enthält, die Transparenz enthalten, wählen Sie den Teig P und G als Dateiformat aus. PNG unterstützt Transparenz, aber wie Sie sehen können, gibt es keine Möglichkeit, die Qualität zu kontrollieren, was im Grunde den Grad der Kompression bedeutet. Ihre Akte. Vet bedeutet, dass PNG-Dateien normalerweise größer sind als J.P Gs, aber Sie wissen bereits, wie man P und G komprimiert, so dass die größere Dateigröße kein Problem sein sollte . die Gegend betrifft, möchten Sie Juden ganzes Dokument oder eine bestimmte Kunst an Bord exportieren, wenn Europhile mehrere Designs hat , die über mehrere Kunsttafeln verteilt sind, wie viele Fragen von Studenten fragen, welche Vaterformate sie liefern sollten ihre Klienten. Also lassen Sie mich dieses Problem wirklich schnell ansprechen, vorausgesetzt, dass das Design vorbei ist und dass der Kunde glücklich ist und bezahlt hat, ist es Zeit, Ihr Design zu übergeben. Die Dateiformate, die Sie in ihr Lieferpaket einfügen, sollten alle wichtigen Formate enthalten, wie z.B. P und G. J. Paige. Pdf PSD tiff und last but definitiv nicht zuletzt die Quelldatei, die in diesem Fall ist dot a f Design. Ich würde empfehlen, das Design in all diese Dateiformate zu exportieren und dann die Dateien im Schlepptau einzupacken . Eine kleinere Datei, aber der Client ist eingeschaltet. Lee gewann Ende des Entwurfslieferungsprozesses. Der andere ist der Entwickler, der die Website entwickeln wird. Ich meine, wenn du der Entwickler bist, kannst du das nächste Video überspringen. Aber wenn Sie nicht sind, lassen Sie mich Sie durch den Prozess führen, indem Sie die Datei und verschiedene Assets als nächstes an den Webentwickler übergeben. 51. 14.2Die Datei an den Entwickler liefern: Wenn Sie bereit sind, das Design an einen Entwickler zu senden, gibt es ein paar Dinge, um die Sie kümmern müssen. Zuallererst sind die Chancen, dass ein Entwickler, an den Sie die Datei senden werden Photoshopped nur alt auf seinem Computer Fotoshop ist einfach so allgegenwärtig, dass Sie wirklich feiner Sand in einer PSD- oder TIFF-Datei sein sollten . Export in jedes über diese fünf Formate erfolgt natürlich über den Expertenbefehl, der im Dateimenü gefunden wird. Aber wenn Sie auf eine PSD exportieren, können Sie aus einem von drei Voreinstellungen wählen, von denen nur zuerst ein Thema Ihrer Sorge sein sollte . Entweder können Sie dem Designer mitteilen, maximale Genauigkeit oder maximale Bearbeitungsfähigkeit beizubehalten. Leider wird keine dieser Voreinstellungen Text als Aditya Ble beibehalten. Es spielt keine Rolle, ob Sie den Füllungstext verwendet haben oder einige echte Wörter eingeben. Designer konvertiert sie in Pixel. Alle Ebenen und Masse sollten beibehalten werden, aber nicht der überprüfbare Text. Es ist also nur etwas, das Sie beachten sollten. Ein weiterer wichtiger Faktor, den Sie in diesem speziellen Prozess berücksichtigen müssen, ist das Exportieren der Assets, die Sie in Ihrem Entwurf verwendet haben . Ich spreche nicht von etwas, das Sie in das Assets-Panel einfügen, sondern von den Bildern, Symbolen und anderen grafischen Elementen, die Sie verwendet haben. Es gibt im Grunde zwei Möglichkeiten, aus diesen Assets im Designer zu exportieren, also werfen wir einen Blick auf sie beide. Die 1. 1 ist großartig. Wenn Sie nur ein oder zwei Assets schnell exportieren müssen, wählen Sie einfach ein Bildsymbol oder sogar einen Text wie unser Logo aus und verwenden Sie den Exportbefehl . Wählen Sie das Dateiformat, das Sie benötigen, und vergessen Sie nicht, den Bereich zu ändern. Option zur Auswahl ohne Hintergrund Hit Export, und Sie können alle Assets, die Sie wollen sehr schnell exportieren. Aber ein Freund des Designers kommt mit einem speziellen Arbeitsbereich, der nur dem Export gewidmet ist. Es nennt sich die Exportpersona, und wir werden es als nächstes betrachten. 52. 14.3Wie du die Persona verwendest, um die Assets in Bulk exportieren zu können: Die Exportpersona ist ein ganz anderer Arbeitsbereich und setzt Werkzeuge ein, die nur für den Export Ihrer Assets erstellt wurden . Sein Hauptwerkzeug wird zum Slice-Werkzeug aufgerufen, und es ermöglicht Ihnen, kleine Stücke von Artwork namens Slices zu erstellen, und diese Slices können dann in separate Dateien umgewandelt werden, dank der Slices Panel. Aber es gibt ein großes Problem mit diesem Tool. Manchmal stellen Sie sich wirklich vor, dass das Slice mit dem tatsächlichen Objekt, das Sie exportieren möchten, extrem schwierig sein kann . Leider können Sie nicht einfach ein Bild oder ein anderes Asset auswählen und dann die Slice Stola auswählen, um ein perfektes Slice zu erstellen . Ich weiß nicht, wie es dir geht, aber für mich ist das wirklich frustrierend. Aber zum Glück gibt es eine Lösung dafür. Wenn Sie nur das Auswahlwerkzeug greifen und mit der rechten Maustaste auf ein Kunstwerk klicken, können Sie die Option „Slice erstellen“ auswählen und welcher Designer das Slice für Sie erstellt hat und ihm sogar einen Namenskorrespondent mit seinem Namen im Ebenenfenster und was noch kühler ist . Sie werden mehrere Elemente gleichzeitig auswählen und mehrere Slices mit der gleichen Methode erstellen . Sobald alle Slices erstellt wurden, können Sie zum Slices Panel wechseln und auswählen, welche davon exportiert werden sollen . Einfach ankreuzen oder antikieren, dann exportieren Sie entweder nur eine einzelne Datei oder alle gleichzeitig. Vergessen Sie nicht, die Exportvoreinstellung auszuwählen, die Ihren Anforderungen entspricht. Auf diese Weise können Sie die Exportpersona verwenden, um einzelne Assets aus Ihrem Design zu speichern. Ich denke, es ist ein guter Weg, mehrere Kunstwerke zu exportieren, wenn Sie Zeit sparen möchten . 53. Vielen Dank fürs Anschauen des Kurses: Also herzlichen Glückwunsch. Du hast den Kurs abgeschlossen. Ich hoffe wirklich, es hat dir gefallen und dass du viel gelernt hast. Ich meine, ich hoffe, dass Sie sich mittlerweile viel wohler fühlen, wenn Sie einen schwachen Designer verwenden, um Websites zu entwerfen. So haben Sie im Kurs nicht nur gelernt, wie man seine Tools und Techniken benutzt, um eine Website zusammenzustellen, sondern auch Webdesign-Trends und Inspirationen. So wählen Sie die besten Mittel und Farben für Ihre Websites. Wo finden Sie tolle Bilder, wie man mit Symbolen arbeitet, wie man mit Farben arbeitet, im Grunde alle wesentlichen Werkzeuge, Dinge, Techniken und Tricks, die Sie beginnen sollten und es Ihnen ermöglichen, -Websites unabhängig voneinander. Also, wenn Sie diesen Kurs mögen, geben Sie ihm bitte eine ehrliche Bewertung. Und ich hoffe, Sie in einem meiner nächsten Kurse zu sehen haben ein schönes Design. Mein Name ist David Tyminski. 54. 1Letter Lass uns den Wireframe für das Design entdecken: in den nächsten Videos erfahren Sie, wie Sie dieses moderne kreative Blockdesign erstellen, und wir werden sowohl die erste Seite als auch eine einzelne Beitragseite erstellen. Bevor wir jedoch zum eigentlichen Designprozess übergehen, wir einen Blick auf den Drahtrahmen, den ich speziell für dieses Design erstellt habe. Und fangen wir eigentlich mit dem Drahtrahmen für nur die Haupt, die Vorderseite, eine blockierte Seite an. Wie Sie sehen können, habe ich mit der Kopfzeile begonnen und Sie können sehen, dass es ein Logo auf der linken Seite und ein Navigationssystem auf der rechten Seite. Jetzt ist der Hintergrund dunkel, weil ich will. Letztendlich werde ich den Hintergrund schaffen, der dunkel sein wird, und ich werde einen gewissen Kontrast in helleren Elementen wie dem Logo und dem Navigationssystem setzen. Vor diesem Hintergrund unter der Heidekraut haben wir den Helden der Sektion, und obwohl es in diesem Drahtrahmen aussieht, als würden wir nur ein einziges Bild erstellen , in der Tat, im Hauptdesign, wir werden etwas erschaffen. Wir sind interessiert. Wir werden einen Karussell Schieberegler mit den mehreren Bildern erstellen, Block Post Auszüge und natürlich Navigation. Darunter habe ich mich entschieden, in die Hauptabschnitte in zwei Abschnitte zu teilen. Also auf der linken Seite haben wir den Block Boast Auszug der wichtigsten vorgestellten Block rühmen Auszug. Und auf der rechten Seite habe ich beschlossen, eine Sidebar zu erstellen. Also zuerst auf der linken Seite, haben wir auf das zukünftige Bild aus der Zukunft zu blockieren rühmen. Und dann haben wir ein paar einfache Frauen-Rahmendarstellungen außerhalb des Datums. Natürlich sind all diese Elemente ein einfacher Text. Also haben wir das Datumsdraht-Rahmenelement auf dem Block Post wird ihren Titel leiten. Wir haben zum Autor Info die Anzahl der Commons hier. Wir haben einige kleine Darstellungen der Social-Media-Icons, die wir zum Block Post Auszug auf den Tags oder den Kategorien bekommen haben , und den Read More Button hier auf der rechten Seite. Und all diese Jungs, all diese Elemente werden gegen einen Kontrast im Hintergrund dieses Behälters als eine andere von Boden, eine breitere, während ein heller Hintergrund angezeigt. Und es steht im Gegensatz zu dem ganzen Hintergrund von der gesamten Blutblock-Webseite. Wie, darunter könnten wir weitermachen. Wir könnten diese Idee einfach duplizieren und einfach all das klonen, all diesen ganzen Container für einen Blockpost. Außer, aber ich habe beschlossen, dass wir Dinge würzen könnten, die wir diesen Block hier in zwei separate Abschnitte in zwei separate Spalten aufteilen könnten . jedoch Wir duplizierenjedocham Block Post. Außer, aber natürlich machen wir es viel, viel kleiner. Und diese beiden Spalten Host wird 123456 Block Post Auszüge zusammen. Und darunter habe ich beschlossen, eine Flasche oder einen Textlink zu setzen, der zu älteren Blockbeiträgen auf dieser Website und auf der rechten Seite navigieren würde . Wir haben die Sidebar hier. Und der Cyber ist auch in spezifische Collins unterteilt. Also lassen Sie mich vielleicht einfach schnell zoomen, ein bisschen hineinzoomen genau so. Also kamen wir zum Suchfeld hier, dann bekommen wir das erste. Der erste Abschnitt, der ah ist, na ja , der beginnt mit einem kleinen Label gleich hier. Dann bekamen wir den Bildtext und einige Social-Media-Zyklen. Und das ganze dieser ganze Abschnitt, das wird Fragment wird unser über mich Abschnitt sein. Dann haben wir noch ein Etikett und einen Text bekommen. Dann haben wir so etwas wie ein beliebtester oder Trendblock bietet. Also haben wir ein Bild auf der linken Seite auf dem Block. Verfügt über Titel auf der rechten Seite, das Datum und den Willen, das Datum oben und die Kategorie oder Tags hier unten. Und wie Sie sehen können, werden diese kleinen Behälter durch eine Trennlinie getrennt. Aber nicht alle von ihnen. Der letzte hat diese Zeile nicht, denn hier haben wir ein anderes Label. Also würde diese Trennlinie hier überflüssig aussehen. Ich glaube nicht, dass wir hier gebraucht haben. Also und dann, natürlich, wir haben nur ein einfaches Label und einige Bilder der und dieser Abschnitt. Ich habe beschlossen, es wie ein Container für einige Anzeigen zu machen. Vielleicht Also, wenn alles, was getan ist, können wir in die Fußzeile gehen, wenn Sie es wollen, können Sie vielleicht etwas Instagram-Feed direkt hier hinzufügen. Aber da wir diesen Instagram-Feed in unserem vorherigen Design erstellt haben, dachte ich, dass ich diese Entscheidung Ihnen überlassen würde. Ich meine, wenn Sie diesen Instagram-Feed-Container hier unten erstellen möchten, wissen Sie bereits, wie es geht, und Sie können in diesem Draht in diesem Design enthalten. Also habe ich mich entschieden, einfach auf eine gerade in die Fußzeile zu gehen. Und wie Sie sehen können, habe ich es in drei Spalten mit den gleichen Labels unterteilt, wie wir sehen können, wie wir in unserer Sidebar hier sehen können. Und natürlich haben wir hier unten einige Links auf Text, und ich habe wiederholt, dass die Kopfzeile wiederholt. Aber natürlich ist es, wer schwillt, kleiner Weg, viel kleiner als der Hauptheller oben. Und natürlich, natürlich, basierend auf diesem Drahtrahmen, werden wir dieses Design erstellen. Aber ich denke, dass wir es zusammenbrechen und im nächsten Video. 55. 2Let's Entdecken des Blog-Designs: Also in diesem Video werden wir einen Blick auf ihr Hauptdesign werfen. Jetzt wissen wir, wie der Drahtrahmen aussieht. Jetzt ist es an der Zeit, einen Blick auf das Hauptdesign zu werfen. Wie das ganze Konzept aussehen wird, basierend auf diesem Drahtrahmen. Also wieder, in der oberen linken Ecke in unserem Hutmacher, haben wir den lokalen, was ein einfacher, einfacher Text auf der rechten Seite ist . Wir haben das Navigationssystem mit den Social-Media-Icons genau hier. Es ist also ein hübsches, ziemlich grundlegendes Konzept, aber ich mag diesen minimalistischen Ansatz, wenn es um Header geht. Dann haben wir das Heldenbild bekommen. Und wie Sie sehen können, haben wir ein Karussell erstellt. Der Typ Schieberegler, ein Karussell Schieberegler, ist ein Schieberegler, der nicht nur ein Bild, ein großes Bild Ausgaben über den gesamten Ansichtsport, sondern eine ernsthafte off, kleinere Bilder, die, wenn? Ich meine, wenn Sie auf eins klicken, bewegen sich die Navigationstasten einfach nach links oder rechts, genau wie ein Karussell. So hat jeder von diesen, wie Container für Bilder, seinen eigenen einzigartigen Titel genau hier. Und natürlich haben wir diese Navigationstasten hier und wenn Sie sich fragen, warum diese Jungs weiß sind , dieser Titel, dieser Pfeil und dieser Titel und dieser Pfeil und dieser Pfeil gut, das Bagram für dieser Pfeil und ich denke, es ist wie eine dunkelrosa Farbe. Nun, das ist nur, weil ich angebe, was ich aussehen würde, was ich wollen würde, um diese Links so aussehen, wenn Sie über diesen Pfeil schweben, möchte ich, dass der Hintergrund rosa wird. Und wann immer ich über diesen Titel schwebe, wollte ich rosa werden. Dasselbe gilt für dieses Zuhause. Nun, für den Link für die aktuelle Seite hier. Aber dieses Foto geschuldete Logo wird sein, wird, na ja,die ganze Zeit rosa sein na ja, . Als nächstes haben wir natürlich natürlich unsere Sektionen. Also haben wir das Hauptbild das vorgestellte Bild direkt hier bekommen. Die Daten, der Titel des Block-Beitrags. Wir kamen zum Autor Info, Kommentare, Icons, Text, Text, einige Tags und den Read More Button hier unten. Wir werden bereits im Drahtrahmen-Teil was sehen? Was alle diese Behälter enthalten sollten. Aber beachten Sie, dass einige dieser Typen, na ja, die gleiche Farbe haben. Ich meine, dieses Diät-Datum ist die gleiche Farbe wie die Blockbögen. Dies nach Text ist das Gleiche. Cholera. Der Textauszug ist die gleiche Farbe wie unsere Farben für sie, die Social-Media-Symbole. Allerdings sind alle diese Links direkt hier die Kommentare, die Fotografie Lifestyle Reise-Tags sind in einer anderen Farbe geschrieben. Dies ist die Hauptfarbe für die Links in diesen Containern. Aber wenn du über sie schwebst, sagten sie, sie sollen rosa werden, genau wie diese Typen hier. Deshalb sind sie in einer anderen, anderen Farbe geschrieben . Aber wenn Sie zu diesen Thes Post gehen, außer Sie betrachten, haben beschlossen, nur die grundlegenden Links Farben zu verlassen, die grün sind, die in diesem Fall grün ist. Und natürlich werden alle diese Texte geschrumpft, also sind sie kleiner als die Haupttexte hier oben. Und natürlich haben wir zwei Spalten und wir haben verschiedene Fotos, und wir haben sechs Elemente zusammen. Nun, soweit sie bis zur Seite von Margo, können Sie sehen, dass wir diese einfache Lupe hier haben, dass dieser Behälter eine einfache , einfache Grenze hat , , und ich habe die Textsuche hier drinnen, und dann kamen wir zu den Etiketten. Dann haben wir den Fototext bekommen, der, ähm, ausgerichtet auf das Zentrum Social Media I Pistolen. Und dann ist da noch der Text, den wir gerade gesehen haben. Natürlich, das Etikett und der Text. Dieser Text wird nicht an der Mitte, sondern an der linken Seite ausgerichtet . Und dann haben wir die beliebtesten Block prahlt. Also dieses vorgestellte Bild. Es spannt sich von oben nach unten. Aber natürlich wird es nur um 1/3 aus dem ganzen Behälter genommen. Wir haben das Datum auf dem Block Post Titel und die Kategorie genau hier, und wir haben 1234 Container. Und dann könnten wir nur einen Container bekommen, 40 Anzeigen. Und natürlich sind es nur ein paar einfache Bilder. Und dann, natürlich, haben wir das Essen. Oder lassen Sie mich einfach rauszoomen. Wir haben die Fußzeile mit ein paar Beinen. Es ist nur ein Platzhalter-Text. Und natürlich habe ich es duplizieren. Aber, ähm, aber die Kopfzeile von oben nach unten geschrumpft. Also haben wir das Logo bekommen. Wir haben die Navigation und einige soziale Medien, die ich habe. Also gehen wir hin. So wird unser grundlegendes Design aussehen. Aber natürlich brauchen wir noch T o. Werfen Sie einen Blick darauf, brauchen wir noch T o. was unser Vermögen an den Farben, den Fonds, den Bildern, die wir verwenden werden, um dieses Design zu verwirklichen. Aber ich denke, dass wir das im nächsten Video machen sollten. 56. 3Lass uns ein Blick auf unsere Assets: Um dieses Design zu verwirklichen, werden wir im Grunde drei Dinge brauchen. Wir brauchen Halsbänder, Bilder und Typografie. Nun, diese Waldfarben gehen. Wir haben im Musterfeld die ganze Gruppe hier erstellt. Also bekamen wir 12345 Farben. Wir werden nicht mehr brauchen. Wir haben zu dieser sehr blass, sehr blass, tolle Farbe, die eigentlich die Farbe aus unserem Haupthintergrund ist. Das ist dieser Typ hier. Wir kamen zum Akzent in weißer Farbe. Das ist die Farbe aus diesen Links die Navigationslinks, diese Social-Media-Symbole, natürlich, die Hintergründe aus den Containern, eine Quelle. Dann kamen wir zur wichtigsten Typografie Farbe, die diese sehr, sehr, sehr dunkelgraue Farbe ist. Es ist nicht schwarz, es ist sehr für eine Dunkelheit. Und dann kamen wir zu diesen beiden Hauptakzent in Farben, die diese Bank dieses dunkelrosa und diese grüne Farbe ist. Und ich habe diese ganze Palette erstellt. Sie mit Kühler, die co dieses Tool, die bereits gut waren, lernten wir eines der vorherigen Videos und ich begann mit nur einem Ich wusste, dass ich eine dunklere erstellen wollte zu großen Hintergrund liegen und ich wollte einige weiße Behälter dagegen setzen -Hintergrund. Also habe ich zuerst einfach den Wert für diese tolle Farbe eingegeben, die weiße Farbe. Und dann habe ich gerade diese sehr, sehr dunkelgraue Farbe hinzugefügt . Und dann lasse ich einfach den Algorithmus, um diese beiden Akzente in Farben für mich zu finden. Natürlich haben wir hier eine Menge Bilder. Und das sind sie. Sie werden Ihnen alle in einem separaten Ordner geliefert werden, so dass Sie mit mir arbeiten können . Und wie Sie sehen können, gibt es eine ganze Menge dieser Bilder und sie sind gleichgültig gegenüber Größen und in verschiedenen Behältern. Und diese Art von Design wird es uns ermöglichen, wieder mit den in Bildern in bestimmten Behältern wie quadratische Behälter, rechteckige Behälterzu arbeiten Behältern wie quadratische Behälter, rechteckige Behälter . Daher denke ich, dass es von zentraler Bedeutung ist zu wissen, wie man mit Bildern innerhalb eines Rahmens reibungslos arbeitet. Der Designer, wenn Sie Websites entwerfen und lassen Sie mich nur sagen, dass wir nicht gehen, um Masken zu verwenden , würden eine andere Technik der Arbeit mit Bildern innerhalb eines Freundes zu Designer verwenden, das könnte ein bisschen einfacher für Sie. Oh, es könnte schon nicht müde sein. Am Ende des Tages müssen Sie entscheiden, welche Technik für Sie einfacher ist, ob es Maskierung oder diese andere noch ein bisschen geheimnisvolle Technik. Und nachdem wir gut sind, nachdem wir wissen, nachdem Sie beide Techniken Maskierung und die andere kennen , werden Sie in der Lage sein zu entscheiden, welche besser für Sie funktioniert. Diese Wald-Typografie geht also. Ich habe beschlossen, mit der Roboto Superfund-Familie zu gehen. Jetzt heißt es Super Family, weil Sie verschiedene Schriften innerhalb dieser Familie und verschiedene Fonds bekommen , mit dann diese Familien, zum Beispiel, das Logo direkt hier und da Block Post Titel geschrieben werden mit der Firma, der Roboto Condensed und seine kühne Version des Fonds. Aber der Hauptkörper Text geschrieben wird, wird mit Roboto regelmäßig geschrieben. Aber die Links hier sind geschrieben mit Roboto, kursiv und, natürlich, die lesen mehr Text hier und sie verwenden Roboto fett, dass komprimiert, aber roboto fett und all diese Jungs haben separate Textilien hier. jedoch, Ich denkejedoch,dass wir in diesem Fall in diesem Fall nicht zuerst Textilien herstellen werden. Aber ich denke, dass wir sie zuletzt erschaffen werden. Ich meine, mit Entwürfen wie diesem. - Es ist was? Bis es fertig ist, ist es immer ein funktionierender Fortschritt, oder? So können Sie Ihre Meinung von Zeit zu Zeit ändern oder öfter als von Zeit zu Zeit und darüber , wie Ihre Gelder aussehen sollten. Also, bis Sie sich ganz entschieden haben, sagen wir, die Blutposttitel oder die Links, sollten Sie nicht. Ich denke, dass das vielleicht nicht. Du solltest es nicht tun. Aber es ist eine gute Idee. Es kann sein, zu warten, bis Sie das Konzept alles herausgefunden haben und dann nur um das Textil zu kreieren . Und ich denke, dass dies der Ansatz ist, den wir in diesem Design verfolgen werden, weil Arbeit mit Textilien in einem Freund zu Designer ein bisschen schwierig sein kann. Vielleicht hilft Ihnen diese Art und Weise, die Textilien genug in Designer zu nutzen und ermöglicht es Ihnen, mit ihnen ein wenig effizienter zu arbeiten. Okay, also haben wir den Drahtrahmen abgedeckt. Wir haben diesen Entwurf kaputt gemacht und wir wissen, welche Vermögenswerte wir brauchen werden. Erinnern Sie sich auch nicht an die erinnern Vergessen Sie nicht, dass wir diese Abschnitte gegen separate Schichten gestellt haben . Also haben wir die Header-Schicht bekommen. Wir haben den Helden die Seitenleiste der Schnittebene geschichtet, Fußzeile. Und natürlich, natürlich, das ganze Design wird angezeigt, wird gegen ein Gitter gesetzt, das Sie hier sehen können . Also denke ich, wir haben alles ziemlich gut abgedeckt. Seien Sie nicht überrascht, wenn, von Zeit zu Zeit werde ich entweder auf den Drahtrahmen oder vorzugsweise dieses Hauptdesign beziehen , weil ich nicht möchte, dass ich zu viel Zeit damit verbringen möchte, mich anzuschauen, herauszufinden, was das Original war. Verzeihen Sie mir, wenn ich nur von Zeit zu Zeit, werfen Sie einfach einen Blick auf das Original Swyche und so kann ich Ihnen die Techniken zeigen, die benötigt werden, um dieses Design ein bisschen schneller zu erstellen, ohne zu versuchen, herauszufinden, die Telefongröße oder die Farbe. Also, ohne weitere Umschweife, lasst uns tatsächlich direkt in den wichtigsten Designprozess eintauchen. Und fangen wir mit der Schaffung des Hutmachers an 57. 4Wie du das Logo und die Nav erstellst.: Wie Sie sehen können, erstellen wir unser Design und basierend auf dem 12-Säulen-Raster, das wir zuvor verwendet haben. Wenn Sie also mit mir zusammenarbeiten möchten, können Sie einfach die gleichen fünf herunterladen, die Sie herunterladen konnten, als wir unser vorheriges Design erstellt haben, und einfach die Arbeit, die diese Datei verwendet. Aber bevor ich anfing, etwas zu entwerfen , werde ich eine Ebene für unseren Header erstellen. Im Ebenenbedienfeld klicke ich einfach auf die neue Ebene. Ich komme und ich werde es anrufen. Header hat sie genau so Kopf, und ich werde es unter das Gitter verschieben. Also werde ich damit beginnen, den Taschenboden für den Header zu erstellen und lassen Sie mich einfach schnell einen Blick auf das Original werfen, um die Abmessungen dieses Hintergrunds zu überprüfen. Und wie Sie im Transformationsfenster sehen können, sind es 1920 Pixel breit und 100 Pixel hoch. Und natürlich ist es 1920 Pixel breit, weil dies der mit aus unserem View-Port von unserer Webseite ist. Also, was ich tun werde, ist, dass ich natürlich auf der Header-Ebene bin, die das Rechteck-Werkzeug packt. Erstellen Sie ein Rechteck, das in den Weltdimensionen sehr willkürlich sein wird. Denn gerade jetzt werde ich sicherstellen, dass mein Bezugspunkt hier auf diese linke obere Ecke gesetzt ist , damit ich ihn verschieben kann. Teoh die linke obere Ecke von meiner Webseite. Also werde ich einfach Null für den X-Wert und Null für das Wild eingeben. Warum Wert Genau so, um es an dieser oberen linken Ecke rechts hier gefangen zu machen. Und jetzt gehe ich einfach Teoh. Nun, ich werde sicherstellen, dass diese Link-Option nicht aktiviert ist. Also werde ich 1920 tippen und ich werde 100 für die Höhe eingeben, genau so. Und da gehen wir. Wir haben unseren Hintergrund erstellt. Natürlich müssen wir ihm immer noch eine richtige Füllfarbe geben. Also werde ich hier auf dieses dunklere Muster klicken und jetzt können wir anfangen, unser Brunnen-Logo zu kreieren . Also werde ich mich wieder auf mein Original beziehen. Ich möchte nur die Größe von dieser Front sehen, wie Sie sehen können, es sind 42 Punkte wie das , und es ist natürlich, geschrieben in der Widerlegung verdichtet, fett. Und übrigens, wenn Sie diese Roboto Super Family nicht auf Ihrem System installiert haben, müssten Sie auf die Google-Web-Fonds gehen und einfach heruntergeladen und von dort. Aber wir haben bereits diskutiert, wie es geht. Also denke ich, dass Sie keine Probleme haben sollten und sie laden einfach auf dieser Front herunter und installieren es. Insider Afinitor Designer. Also werde ich nur das künstlerische Textil greifen, genau wie so natürlich werde ich sicherstellen, dass ich auf der richtigen Schicht bin. Also mit dem künstlerischen Textil, Ich werde einfach klicken und ziehen, um Text zu erstellen. Ich werde die Front zu Roboto komprimiert einfach so setzen, und ich werde seine kühne Version wählen. Und ich werde 42 für seine Größe eingeben und die Farbe ändern, um diese, äh, blass willkommene Rückzahlung einer dunkelrosa Farbe genau so. Und ich werde Feind eintippen, wie so geschleppt. Und ich gehe einfach zu und natürlich muss ich es auf die richtige Ebene verschieben, und ich werde es einfach nach oben bewegen, bis es ihre meine, äh gut, vielleicht Körnung passt äh gut, . Und natürlich können wir einfach beide Typen auswählen, um sicherzustellen, dass dieses ah Logo genau in der Mitte von unserem Hintergrund sitzt . Und ich gehe einfach zur Schlange von der Arrangementafel und wähle diesen Kerl hier . Es sagt eine Linie Metall genau so. Drücken Sie OK Und wir sind fertig mit dem Logo. Also als nächstes würden wir dies schaffen wird dieses Navigationssystem zusammen mit diesem Holz, der Brunnen wird Social-Media-Elemente. Also nochmal, lassen Sie mich einfach die Höhe von diesem Kerl überprüfen. Es ist ah Roboto Medium 16 Punkte, wie Sie hier sehen können. Also werde ich mir einfach wieder das künstlerische Textil schnappen. Klicken und ziehen. Ich werde die Farbe in Weiß ändern, die ich tippen werde und vielleicht nach Hause genau so lassen Sie mich einfach gegen das dunklere Hinterzimmer bewegen. Also gibst du zu. Und so war es Roboto ein Roboto Medium Roboto Medium acht auf der Höhe war 16 Ich glaube. Lassen Sie mich das nochmal überprüfen. 16 und ah, Was wir tun wollen, ist Wir wollen sicherstellen, dass alle diese Navigationslinks mit Onley Großbuchstaben geschrieben werden . Also werde ich zum Zeichenfeld gehen und ich werde diese Option hier wählen , die alle Großbuchstaben sagt. Und wenn ich einfach darauf klicke, können Sie sehen, dass diese all diese Briefe in getreu zu ihrer Großversion geändert werden . Aber soweit ich mich erinnere, wurde unser Home-Link mit dieser rosa Farbe geschrieben, was darauf hinweist, dass dies tatsächlich die aktive Seite ist. Also werde ich es in die rosa Farbe ändern, genau wie so Jetzt ist das einzige, was hier noch zu tun ist, diesen Kerl einfach nach rechts zu duplizieren , und ich halte die Steuerungstaste und die Umschalttaste gedrückt, um die Bewegung genau wie so. Und ich werde die Farbe Zehe Weiß ändern, und ich werde etwas anderes eingeben, zum Beispiel, zum Beispiel, vielleicht Galerie und bemerken, dass wir weder die Feststelltaste noch die Umschalttaste drücken müssen um sie zu machen diese Buchstaben alten Kalb. Weil sie sind, Sie haben immer noch die alten Cap-Attribute direkt hier zugewiesen. Das wurde gesagt, nur eine Sekunde, um in das Zeichenfeld zu gehen. Jetzt können wir es einfach schließen lassen. Jetzt können wir diesen Kerl einfach wieder nach rechts köllen und ah, eintippen und vielleicht meine Ausrüstung und vielleicht noch eine, die einfach nur sein wird, äh, sagen wir, vielleicht kontaktieren Sie einfach so. Also, jetzt haben wir die Navigation. Ah, Navigationssystem, das ich erstellt habe. Ich werde diese Typen ein bisschen zur Seite bringen, genau so. Vielleicht alle von ihnen, aber weiter zur Seite. Was wir jetzt tun müssen, ist, dass wir diese Jungs hier hinzufügen müssen, diese Social-Media-Icons genau hier. Dafür werden wir das Polizeikommando benutzen. Und ich denke, dass ich denke, dass wir das im nächsten Video machen könnten, weil wir etwas mit unseren Social Media Icons bearbeiten werden. Also denke ich, dass es am besten wäre, wenn wir das im nächsten Video machen 58. 5LetLASs Füge die 5Let's hinzu: Also, bevor ich in den Social-Media-Symbolen beginne, lassen Sie mich einfach schnell überprüfen, wie groß sie sind. Lassen Sie mich einfach ein bisschen hineinzoomen und lassen Sie mich einfach auf diesen Kerl hier klicken. Es ist Ah. Nun, sagen wir, es sind 16 Pixel hier. Also, was ich tun werde, ist, dass ich auf den Ort Bild Werkzeug klicken, und ich werde zu navigieren, wo ich meine Social-Media-Symbole halten. Und ich werde mit dem Twitter-Symbol anfangen und ich werde einfach aufschlagen und es irgendwo hier platzieren. Natürlich ist es viel zu groß, also werde ich es diesmal kleiner machen. Ich werde sicherstellen, dass die Sperr-Seitenverhältnis-Option eingeklemmt ist. Und ich werde 16 eingeben, um diesen Kerl viel kleiner zu machen . Aber natürlich ist die Farbe dieses Symbols, na ja, nicht gut. Es soll weiß sein, aber wie wir bereits wissen, können wir es einfach in unserem Werkzeugfenster ändern. Wir müssen auf die hinzugefügte Dokument-Option gehen, und wir müssen einfach nur weiße Farbe so wählen und diesen Kerl schließen, damit wir jetzt Ah haben können , so dass wir jetzt an diesem Symbol unsachgemäße Farben haben können. Als nächstes kann ich einfach nur Köln diesen Kerl auf der rechten Seite gehen, um Dokument zu ersetzen und wählen Sie vielleicht Facebook. Aber wieder, wie Sie sehen können, müssen wir wieder die Farbe ändern. Ich wünsche dem Designer einen Freund. Nun, ich schätze, es ist keine Schachtel. Also kann ich sagen, ich wünsche mir wirklich, dass sie diesen Fehler behoben haben, aber ich denke, dass es am besten wäre, wenn sie nur dysfunctional hinzufügen, dass, wenn ich in diesem Kerl in diesem eingebetteten Dokument bin, ich seine Attribute klone, damit sie ein Klon sein könnten . Wie in diesem Fall könnte der Kragen auch auf das geklonte Objekt geklont werden. Aber da es nicht ist, müssen wir immer noch ein Dokument hinzufügen, klicken Sie auf das weiße, ein Musterfeld, dann duplizieren Sie das Facebook. Ich komme nach rechts dupliziert lassen Sie mich nur dupliziert, genau wie so wieder das Dokument mit dem Instagram-Logo ersetzt, Dokument hinzugefügt und wieder geklont diesen Kerl ausgewählt und Kleidung auf der rechten Seite. Ersetzen Sie es mit einem Prise Arrest Logo bearbeitet ed, weiße Farbe. Und da gehen wir. Wir haben das Augenkonzert geschaffen. Das letzte, was hier zu tun ist, wäre, alles gut auszurichten. Also, was ich will, ist, dass ich gleiche Entfernungen zwischen all diesen Jungs will, nicht nur die Textlinks, sondern auch mit den Aikens. Also, was ich tun werde, ist, dass ich zuerst dieses Pinterest-Logo aufwuchs, das ich instagram, Facebook, Twitter und all diese Jungs. Und ich werde sicherstellen, dass sie richtig ausgerichtet werden, um in die Mitte zu dissenter , genau wie so Jetzt könnte ich sie nach rechts bewegen und sie mit meinem Gitter ausrichten. Zoomen Sie einfach ein bisschen hinein, genau so. Das sollte gut sein. Also, was ich jetzt tun will, ist, dass ich sicherstellen will, dass der Abstand zwischen all diesen Jungs gleich ist. Also nicht nur zwischen den Text-Links, sondern auch zwischen Text-Lings und Social Media Icons. Also, was ich tun werde, ist, dass ich einfach auf all diese Elemente klicken, um sie auszuwählen . Aber nur diese Jungs und die Social-Media-Icons auch, genau so. Und ich werde dazu gehen. Vielleicht lassen Sie mich es ein wenig nach unten ziehen, damit Sie alles besser sehen können. Also werde ich zu diesem Bereichsfeld gehen und von der Option horizontal ausrichten werde ich Raum horizontal wählen. Und wenn Sie es verlassen wollen, wie auch verteilt, na ja, Sie können es tun. Aber wenn Sie sicherstellen möchten, dass der Abstand zwischen all diesen Elementen genau derjenige ist, den Sie wollen, können Sie einfach auf überprüfen, bestellen, bestellen, verteilen und einfach mit diesem Schieberegler hier herumspielen. Vielleicht. Lassen Sie uns etwas um 20 oder 24 Pixel sehen. Ich denke, das sollte dies tun, jetzt können wir diese Jungs einfach nach rechts bewegen und sicherstellen , dass sie gut mit unserem Raster ausgerichtet sind. Vielleicht nur ein bisschen nach rechts. So etwas. Und wir könnten sie einfach nach Präsident Control G auf unserer Tastatur gruppieren. Also, jetzt, wo all diese Jungs sind Linien erstellt, zoomen Sie zurück, Alle diese Jungs sind erstellt. Wir können wieder sicherstellen, dass alles gut ausgerichtet ist. Ich denke, ich muss diese Jungs wieder so gruppieren, Control G. So können wir einfach sicherstellen, dass sie so gut ausgerichtet sind, und dass sie richtig in Bezug auf den Hintergrund ausgerichtet sind, nur wie so. Also gehen wir hin. Wir haben diesen Hutmacher erschaffen. Wenn ich nur Tab drücken, können wir unsere Website sehen. Ich schätze, dieser Typ hat sich etwas bewegt. Wir können unsere Website in ihrer ganzen Schönheit sehen. Nun, Website, es ist nur, es ist nur unser Header. Wir können schnell einfach einfach so das Netz loswerden. Damit wir sehen können. Und unsere und es gab Führer, damit wir alles besser sehen können. Das ist also das, was unser und das ist, was unser Header aussieht. Ich denke, es sieht so aus, als ob es irgendwie minimalistisch aussieht, aber zur gleichen Zeit ist diese rosa Farbe das in ein bisschen. Ah, nun, es lässt diesen ganzen Header etwas lebendiger aussehen. Die nächste Bestellung des Geschäfts wäre also, unseren Schieberegler zu erstellen. Lassen Sie mich einfach zurückzoomen, um unseren Schieberegler zu erstellen, um diese Fotos zu erstellen, um diesen Block zu erstellen. Nun, sie führen tatsächlich zu einem Blockposten. Also ich denke, wir könnten sagen Block Post Titel und die Navigation. Aber wir werden das im nächsten Video tun 59. 6Let's Füge die ersten Bilder hinzu: so wie üblich, werden wir mit der Erstellung des Heldenabschnitts beginnen, indem wir eine ungeeignete Ebene für diesen Abschnitt erstellen . Also nochmal, ich werde einfach eine neue Ebene hinzufügen und ah, nennen Sie es. Ah, Held. Und ich werde es einfach so unter die Header-Ebene verschieben. Also, was ich wieder tun werde, ist, dass ich einfach das Rechteck-Werkzeug packen und ich möchte es so weit wie die Website selbst machen. Und ich werde es einfach richtig positionieren, genau so. Denn was wir jetzt tun werden, ist, dass wir drei separate Container für diese Bilder erstellen werden . Eso, um drei separate Behälter zu haben, müssen wir dieses Rechteck genau hier göttlichen. Lassen Sie mich einfach so Männer jemals so leicht wie das. In diesem Stadium ist die Höhe also nicht wichtig. Es wird in nur einer Sekunde sein. Aber im Moment, was wichtig ist, ist, dass sich unser Rechteck über unsere Webseite über unseren View-Port erstreckt . Da wir also drei separate Container haben wollen, müssen wir unser Rechteck durch drei teilen. Also da drin und ich werde einfach zuerst, werde ich sicherstellen, dass ich es vom Ankerpunkt links getrennt bin. Also, was ich tun werde, ist, dass ich einfach einen Schrägstrich drei eintippen werde, der das ein Rechteck durch drei teilen wird, genau so. Und wie Sie sehen können, ist es mit seinen 640 Pixeln genau so. Also, wenn ich möchte, dass dieser Container ein Quadrat wie hier ist, muss ich einfach die Höhe gleich mit machen . Also in diesem Fall, 640 genau wie jetzt, eine andere Sache, die gut zu beachten ist, ist, dass die Hauptabstände zwischen Abschnitten oder innerhalb von Abschnitten und zwischen Hauptelementen aus Abschnitten normalerweise 25 Pixel oder doppelt so sind, dass ist 50 Pixel. Der Abstand zwischen diesen Behältern ist also diese Lücke hier. Dieser Rand beträgt 25 Pixel, und der Rand zwischen diesem Schieberegler und dem Heller beträgt ebenfalls 25 Pixel. Also, jetzt werde ich diesen Kerl einfach mit dem Header die Schnappschüsse nach oben bewegen und für den y-Wert wieder sicherstellen, werde ich wieder sicherstellen,dass mein Bezugspunkt es genau hier oben setzt. Und ich gehe einfach auf die Zehe. Füge 25 einfach so hinzu. Aber ich werde diesen Kerl 25 Pixel nach links verschieben, weil ich diese Art von einem Karussell betroffen erstellen möchte , dass diese Container tatsächlich aus dem View-Port gehen. Also wieder, ich werde diesen Kerl in den Brunnen bringen, ich werde ihn um 25 Pixel nach links bewegen. Also für den X-Wert werde ich einfach ein Minus 25 genau so eingeben. Und dann werde ich diesen Kerl einfach nach rechts klonen, bis er mit dem Original zusammenbricht. Und ich gehe Teoh, füge 25 einfach so hinzu. Und dann werde ich diesen Kerl zu den richtigen Druckknöpfen mit dem Original klonen, dass ich 25 hinzufügen werde , genau so. Also, jetzt haben wir drei separate Container, die gut, der linke Container und der rechte Container sind irgendwie wie aus unserem View-Port und natürlich, sie in der Mitte. Wir sind zu diesem ganzen quadratischen Container gekommen. Natürlich sind alle diese Jungs quadratische Container, aber diese könnten irgendwie aussehen, als wären sie eher ein Rechteck. Da können wir diese 25 Pixel Lücke genau hier sehen. Also nochmal, wenn ich einfach nur sicherstelle, dass diese Jungs auf der richtigen Ebene auf der Heldenschicht sind, kann ich jetzt eine andere verwenden. Ein weiterer Trick zu machen, um diese Jungs werden sich verhalten, wie sie Bildcontainer sind. Also, wenn ich mich einfach in meinem Ebenen-Panel öffne, können Sie sehen, dass ich all diese Rechtecke hier habe. Okay, Also habe ich schnell sichergestellt, dass meine Rechtecke auf dem richtigen Spieler sind, dass die richtigen Ebenen auf der rechten Seite gelangweilt sind, und ich könnte sicherstellen, dass sie in die richtige Richtung angezeigt werden. Also lassen Sie mich es einfach schnell überprüfen. Also werde ich diesen Kerl runterbringen. Also, jetzt alle diese Rechtecke alt, während diese Quadrate als unsere Bildcontainer arbeiten können und das ist so einfach, wie einfach eine auszuwählen und dann sicherzustellen, dass die Einfügen einfügen innerhalb Auswahloption genau so aktiviert ist Und dann, wenn wir einfach entweder Entsafter den Ort Bild zu oder gehen Sie zum Datei-Menü und dann platzieren navigieren Sie zu der Stelle, wo wir halten unsere Bilder jetzt einfach schwächen, wählen Sie einfach ein Bild Vielleicht. Vielleicht dieses Kaffee-Bild. Warum nicht? Und jetzt, wenn wir einfach klicken, wird dieses Bild in diesem roten Behälter platziert werden. Dieser Rackwinkel wird in unserem Fall quadratisch sein, und jetzt können wir es einfach nur ein bisschen kleiner machen. können wir. Du kannst es bewegen, wenn wir wollen. Genau wie so. Also nochmal. Wählen Sie das Rechteck aus. Stellen Sie sicher, dass dieses Einfügebild innen eingefügt wird. Die Auswahloption ist aktiviert. Platzieren Sie ein Bild. Navigieren Sie einfach zu dem Ordner, in dem Sie Ihre Bilder aufbewahren. Und vielleicht werde ich diesmal etwas mehr Kontrast wählen . E. Oder vielleicht nicht. Vielleicht. Lassen Sie uns bleiben in der Bar und dem Bar-Thema. Ich gehe mit dem Kuchen klicken wie, also stellen Sie sicher, dass es nur ein bisschen größer ist. Ähm, vielleicht so, das sollte gut sein. Und das letzte wieder, Selector. Das im Inneren gesammelte Rechteck. Einfügen innerhalb Auswahloption und platzieren Sie das Bild Und vielleicht diesmal das Sandwich. Da wir in einer Bar sind, bleiben wir einfach in der Bar, das Bar-Thema , Äh, genau so. Also, da gehst du hin. So können Sie einfach das einfachste verwenden. Die einfachste sagt wirklich, schön aussehende Bildcontainer zu erstellen. Also haben wir den Header, den wir bekommen haben. Wir haben zu diesem Helden Abschnitt wird fast fertig. Wir haben ihm die Bilder hinzugefügt. Wir haben die Rechtecke erstellt und dann haben wir sie in Bildplatzhalter verwandelt. Aber natürlich, was wir noch brauchen, ist nicht die Navigation, die die Pfeile auf der linken und der rechten und natürlich, natürlich, der Block posten sie Titel. Aber fangen wir an, das alles im nächsten Video zu tun. 60. 7Let's Füge den Bildern hinzu: Also werde ich anfangen, ah, die restlichen Stücke von unserem Karussell Schieberegler zu erstellen , indem ich zuerst die Schriftart, die ich dem ursprünglichen Design hinzugefügt habe, überprüft . Also, wie Sie sehen können, wird es mit der Roboto komprimierten, fett Version des Fonds geschrieben , und es ist auf 46 Punkte gesetzt. Und natürlich natürlich der Mitte. Man ist nicht in der weißen voll zu verwenden, aber das dankbare, weil es anzeigt, dass es ist dass es ist, wie, Markieren Sie das, dass es in der aktiven Link jetzt ist. Also zurück mit unserem Design, werde ich einfach so den Rahmen Textil packen. Natürlich werde ich sicherstellen, dass ich auf der richtigen Ebene bin, und ich werde einfach so klicken und ziehen, und ich werde die Front auf Roboto Condensed setzen und ich werde wählen. Es ist natürlich, mutige Version. Stellen Sie sicher, dass es auf 46 gesetzt ist. Ich glaube, ich glaube, es war 46. Ich werde es weiß machen, und jetzt werde ich einfach Text einfügen Füllstoff Text einfach so wählen, und ich werde es an der Mitte ausrichten. Ich werde diesen Rahmen ein bisschen kleiner machen, so dass wir nur mit drei Textzeilen übrig sind, genau wie, so dass es einfach ein wenig nach rechts bewegen und ich werde es nach unten in den Sommer verschieben. Hier, das würde es finden. Also, jetzt werde ich diesen Kerl einfach so nach rechts bewegen, und dieser Typ auch nach rechts, und dieser Typ auch nach rechts, genau wie jetzt werde ich diesen Kerl zu diesem Stück Text drehen, um zu denken, und es ist schon ein bisschen sichtbarer, nur wie so. Aber wie Sie sehen können, da wir diesen ersten Fülltext ein- und zweimal nach rechts geklont , ist es immer noch derselbe Text, oder? Aber wir können es schnell ändern, indem wir zuerst ein Stück aus Füllstoff Text auswählen, dann zum Textmenü gehen, Füller einfügen, Text. Klicken Sie einfach darauf, um es auszuwählen und wählen Sie es dann noch einmal aus, um ein anderes Stück Text einzufügen . Also wieder, de select, fügen Sie Fülltext ein und fügen Sie dann Fülltext wieder ein. Also ist es ein weiteres Stück Text. Moment besteht jedoch die Wahrscheinlichkeit, dass Ihr Text von Zeit zu Zeit vor einem bestimmten Hintergrund vor einem bestimmten Bild nicht allzu sichtbar ist. Bankers wie in diesem Fall, wenn Sie es einfach als weiß lassen würden, können Sie sehen, dass wir das nicht können. Wir können es jetzt wirklich nicht dagegen sehen. Das wird hier auf den Teller kommen. Wenn Teoh auf Pink gesetzt ist. Dann, ja, es ist sichtbar, aber ohne das ist es nicht wirklich sichtbar. Wie können wir das jetzt beheben? In solchen Situationen ist es eine gute Idee, eine Art Schiebebeutel Boden zu haben. Fügen Sie es zu Ihren Test-Image-Containern hier hinzu. Also, was ich tun werde, ist, dass ich einfach ein Rechteck erstellen werde, das, na ja, das gleiche wie unser Assauer Bild des Platzhalters sein wird na ja, . Aber es wird über das Bild gelegt werden, und dann werden wir ein Grady int hinzufügen und seine Deckkraft nach unten fallen lassen. Ich weiß, es klingt nach viel, aber es ist wirklich, wirklich einfach. Also vertrau mir, vertrau mir einfach bei diesem. Also werde ich in einen selektiven, diesen Bildplatzhalter gehen , und wenn ich zu meinem Ebenen-Panel gehe, können Sie sehen, dass ich diesen Kaffee hier habe. Es ist ein Rechteck mit einem Kaffee-Bild darin, also was wir tun können. Und eigentlich, was wir tun müssen, ist gut, ich denke, es wäre einfach am einfachsten. Teoh duplizieren dieses Bild Container, die wir hier haben. Also werde ich es einfach in meinem Ebenen-Panel finden. Das ist dieser Typ hier und Sie können sehen, dass es Rechteck sagt und dass es dieses Kaffee-Bild gibt , das in dieses Rechteck gesetzt wird. Was wir also tun könnten, ist, dass wir einfach mit der rechten Maustaste darauf klicken und Duplikate auswählen können. Oder Sie könnten immer das Steuerelement plus J-Verknüpfung verwenden. Und was es tut, ist, dass es ein Duplikat aus diesem Bild dieses Brunnens erzeugt, das ganze Objekt darüber. Also haben wir ein Rechteck und wir haben hier ein Kaffee-Bild. Also, was wir tun könnten, ist, dass wir einfach dieses Kaffee-Bild so auswählen können. Und wenn wir gerade gelöscht, können Sie sehen, dass wir nur mit einem Flugzeug Rechteck links sind. Und wenn Sie auf das Feldwerkzeug genau so gehen, können wir den Typ der gefüllten von Volumenkörper zwei linear ändern, um einen Grady int zu erstellen. Und wenn Sie wissen, klicken Sie auf dieses Symbol direkt hier, wir können den Willen die Kapazität ändern, die Position, natürlich, die Art als auch. Aber was wir hier wollen, ist,dass wir diese Farbe von grau zu einfach weiß einfach soändern dass wir diese Farbe von grau zu einfach weiß einfach so und ihre Deckkraft ganz auf Null fallen lassen wollen, genau so. Und jetzt können wir einfach noch mit dem Filter den Grady int so nach oben verschieben. Genau so. Natürlich können wir immer noch auf unseren Grady int klicken und vielleicht diesen Kragen in schwarz einfach so ändern . Und wenn Sie wollen, können Sie einfach seine Deckkraft fallen lassen. Sagen wir vielleicht 15 einfach so, und es sieht schon viel besser aus. Also nochmal, so wie die Wiederholung mich diesen Kerl schnappen ließ. Dieses Rechteck und ich werde es nochmal duplizieren. Werde das Bild in diesem Kerl hier los. Dann mit dem Filter wird die gefüllte zu linear geändert ein Grady int dieser Grady in Farbe von grau zwei einfachen weißen Tropfen seine Kapazität auf 50 oder vielleicht sogar Null ändern . Genau so, änderte die Farbe dieses Kerls in Schwarz, ändere seine Kapazität auf 50 und bringe dann einfach diesen Kerl von unten nach oben einfach so. Also, jetzt waren unsere gut, Titel können ein bisschen besser sichtbar sein. Also, wenn ich diesen Kerl jetzt einfach von rosa zu weiß ändere, können Sie sehen, dass es so viel besser sichtbar ist. Also werde ich wieder greifen. Das ist Sandwich-Rechteck. Ich werde es einfach so duplizieren. Und wieder werde ich dieses Bild loswerden, genau wie so und wieder Gehe zum Füllwerkzeug, ändere es von Volumenkörpern zu linear und ändere den Grady int. Lassen Sie uns einfach mit Null Opazität gehen Diesmal, lasst uns ändern. Lassen Sie uns diese Farbe in schlichtes Schwarz ändern, wie so wieder, ändern Sie die Deckkraft auf 50%. Und lassen Sie uns den Grady von unten nach oben bewegen, genau so. Und da gehen wir. Wir haben den Schieberegler das Karussell erstellt, außer natürlich für die Navigation, die wir im nächsten Video erstellen werden 61. 8Let's Füge die Knöpfe hinzu: Bevor wir also beginnen, in der Navigation von während für unsere Carrizalez Leder zu erstellen, denke ich, dass wir einige einfache, einfache Hauswirtschaft machen sollten . Ich meine, ich möchte sicherstellen, dass all diese Elemente, all diese Stücke schön gruppiert und beschriftet sind. Also, was ich tun werde, ist, dass ich einfach beide Maustasten klicke und ich werde einfach diese Jungs auswählen und die Steuerung drücken. G. Und ich bin ein celeb, der sowohl die linke als auch die rechte Maustaste drückt, um auf Elemente durch Fragmente aus ihren Begrenzungsrahmen zu wählen. Also nochmal, ich werde einfach klicken und auswählen. Aber manchmal funktioniert es nicht richtig, und Sie müssen wirklich wieder klicken, nur um sicherzustellen, dass es Zebina richtig ausgewählt. Also wieder, klicken und sammeln und wählen, genau wie so, Control G. Und da gehen wir. Also, jetzt können wir diesen Kerl vielleicht als, äh, sagen wir Bild eins. gehen wir hin Danngehen wir hin. Dieser Typ als, äh, Bild zu und der dritte Typ als Bild drei. Okay, jetzt lassen Sie uns ihn von der Navigation erstellen, und das wird Ihre ziemlich einfach sein. Was ich tun werde, ist, dass ich sicherstellen werde, dass mein Brunnen, für diesen Moment, in dem mein Schlaganfall eingestellt ist. Teoh diese dunkle Farbe und ich werde den Bleistift greifen und ich werde es in diesem in seinem Standard-Stiftmodus überlassen . Und ich werde einfach auf Shift halten und klicken Sie auf eins zweimal und dann wieder schnell. Um diese Art von einem dieser Art von Pfeil zu schaffen hatte genau so. Lassen Sie mich einfach etwas näher heranzoomen. Also jetzt lasst uns nur einen Greifer, die rechteckige Zehe und halten Sie die Verschiebung gedrückt, den Schlüssel, um ein Quadrat zu schaffen, das so etwas aussehen wird. Also, was wir jetzt tun können, ist, dass wir einfach sicherstellen können, dass diese Jungs richtig ausgerichtet werden . Und wenn du willst, kannst du diesen Kerl immer größer machen. Wenn das so ist, ist das deine gut durchdachte Wahl. Aber ich glaube, ich werde es verlassen, um es so zu lassen. Nun, natürlich, wir wollen nicht, dass Teoh beide auswählen Diese Jungs klonen sie nach rechts und einfach reflektieren sie, um das zweite Tier aus unserer Navigation erstellt. Aber wie ich bereits erwähnt habe, und wenn wir uns das Original ansehen, können Sie sehen, dass dieser Kerl ist Nun, dieser Pfeil wird vor einen rosa Hintergrund gesetzt, weil dies nur anzeigt, dass, wenn dieser Pfeil ausgewählt wird, wenn der Benutzer darauf klickt oder tippt, sollte er sich ändern. Also in diesem Fall gehe ich einfach Teoh, vielleicht drücken Sie eine Verschiebung, wirkt, um mit Strich zu füllen und, natürlich, änderte einen Strich zu dieser rosa Farbe und stellen Sie sicher, dass es unter der Pfeil einfach so. Jetzt, da wir diese Jungs sind erschaffen. Vielleicht, bevor ich sie hochziehe, lass mich diesen Kerl vielleicht drehen, um ihn in Weiß zu verwandeln. Dasselbe für diesen Kerl. Und natürlich, da sie Art zu backen sind, können wir sie schnell kleiner machen. Tun Sie so etwas und schnappen Sie sich diese Typen. Vielleicht setzen alle Gruppe sie schnell irgendwo hier so und dann schnappen diese Jungs setzen sie irgendwo hier und jetzt können wir sie einfach so gruppieren und sicherstellen, dass sie ausgerichtet sind um den Dissenter richtig eingegeben, genau wie so. Natürlich, wenn du willst, kannst du mich einfach den Zoom schnell machen lassen. Wenn du willst. Sie können vielleicht den Schlaganfall machen, aber größer. Also anstelle von Juan, lassen Sie uns einfach versuchen, so dass das gleiche gilt für diesen Pfeil statt für einen. Lassen Sie uns tun, dass es nur sichtbarer ist. Und natürlich müssen wir dasselbe für diesen Pfeil tun, anstatt für einen. Machen wir es zwei, genau so. Und wenn wir jetzt einfach wieder hinauszoomen, ist das, was unser Schieberegler aussieht Kurs. - Vielleicht. Lasst uns einfach diese Jungs schnappen und sicherstellen, dass sie richtig ausgerichtet sind. Natürlich auch senkrecht. Lasst uns sie einfach so runterbringen. Und jetzt, wenn wir einen Blick auf unser Dollar-Design werfen, fängt es an zu schauen. Sieh nett aus. Wir haben den Header mit dem Logo mit der Navigation mit den Social-Media-Symbolen bekommen. Wir haben den Karussell Schieberegler dabei, die Pfeile auf, natürlich, die Folien und den Text. Also kamen wir zur Heidekraut und die Heldenabschnitte erstellt. Als Nächstes würden wir also zu den komplexeren Teilen übergehen. Also wurden wir gewarnt. Jetzt können wir unseren Umzug zu bewegen vielleicht diesen ersten großen Block rühmen Auszug einen Abschnitt, also lasst uns anfangen, es im nächsten Video zu erstellen. 62. 9Letse erstellen: Lassen Sie uns einfach anfangen, einen vorgestellten Image-Container zu erstellen, indem Sie zuerst die Körnung aufheben. Ich will das Gitter sehen, weil ich wissen will, wie. Warum hast du den Block Post Container erschossen, wie breit es sein sollte. Denn wenn du Teoh gehst, wenn wir uns das Original ansehen und wir nehmen einen Blick auf das Gitter werfen. Wir können sehen, dass es sich über eine bestimmte Anzahl von Spalten ausbreitet, und der Cyber breitet sich auch über eine bestimmte Anzahl von Spalten aus. Und in diesem Fall breitet sich der Blockposten über die neun Spalten aus und entscheiden Balken über drei Tore weil neun plus bis drei gleich 12. Also in unserem Fall müssen wir sicherstellen, dass unser A-Blockpostcontainer ich meine, nun, nun, unser vorgestellter Bildcontainer breitet sich über neun Spalten aus. Also, wie üblich, werde ich damit beginnen, eine neue Ebene zu erstellen, genau wie so. Und ich werde es nennen, äh, Blut rühmen vorgestellt. Lasst uns nehmen, dass Dir das nicht gefallen hat. Ich werde es runterbringen, also werde ich einfach das Rechteck packen, und ich werde sicherstellen, dass es eine sichtbare Farbe hat. aber vielleicht zum Film, und ich werde es über neun Spalten verteilen, genau wie so werde ich es bringen, so dass es passt. Es berührt also meinen Helden, einen Abschnitt hier, genau so. Und lass es mich einfach ein bisschen runterbringen. Und was ich jetzt tun möchte, ist, dass ich es um 25 Pixel nach unten verschieben möchte. Also werde ich 25 zum Y-Achsenwert hinzufügen, genau so. Und das ist unser Imagecontainer, Natürlich, so weit wie seine Ah, ein Zit. Ah, was? Vielleicht lassen Sie mich einfach nur mit, weil ich sehen kann, dass es nicht zu ist. Das ist es auch nicht . Ja, dieser Typ, der dieses Mal in Ordnung ist. Es breitet sich über genau neun Spalten aus, und wie faras sie, die Höhe dieses Containers geht in diesem Fall, es ist ziemlich willkürlich. Ich meine, du könntest es moralisch wie ein Quadrat lassen, wenn du willst, oder du kannst für das Standard-Verhältnis 16 mal neun gehen, wenn du willst, und ich denke, ich gehe mit diesem etwas wie 5 50 Pixel. Ich glaube, es ist offensichtlich, 16 mal neun. Ich meine, es ist ein „Es ist ein Fotografie-Blawg“. Vielmehr muss es nicht all das sein, wie Videoaspekt in Bezug auf seine Bilder. Nun, da wir diese ah haben, dieser Container erstellt, was wir tun können, ist, dass wir es vielleicht einfach herunterbringen könnten, um den Container für unsere Brunsttext-Auszüge zu erstellen . Und das wird der Hintergrund für unsere Textauszüge sein. Und ich werde das Füllhalsband auf, na ja, diese weiße Farbe ändern na ja, . Also werde ich zu Mustern gehen, wählen Sie Weiß, genau so. Also, jetzt haben wir, wenn wir Teoh haben, lassen Sie mich einfach nur ein bisschen nach rechts bewegen und wieder sicherstellen, dass sie gut mit unserer rechten Spalte ausgerichtet sind . Wie Sie sehen können, manchmal erfordert es einfach nur ein bisschen aus Optimierung, um alles Pixel perfekt zu machen, genau wie so. Aber es ist ein Ich denke, dass es wichtig ist. Deshalb achte ich auf diese kleinen Details. Also wieder, jetzt, wo wir diese Jungs erstellt haben, konnten wir einfach wieder und greifen dieses Rechteck hier und wieder wählen Einfügen Website-Auswahl und finden Sie ein unpassendes Bild Vielleicht das. Lass uns mal sehen. Vielleicht ist dieser große Ben ein Foto. Warum nicht? Lasst uns einfach anklicken. Zu müde, um einfach so zu platzieren. Verbreiten Sie es und da gehen wir. Wir haben unsere und wir haben unser Hauptbild erstellt. Natürlich war das der leichte Teil. Der schwierigere Teil ist das Hinzufügen all dieser Stücke aus dem Text. Natürlich ist es ein Es ist nicht schwer, den Text hinzuzufügen, aber um sicherzustellen und sie so zu gestalten, dass sie miteinander interagieren, so wie sie sollten, ist manchmal eine große Herausforderung. Weil sieh sie dir an. Diese Jungs müssen ein bisschen anders sein. Ich meine, nicht nur innen, sondern auch sie sind kursiv und dass diese Jungs völlig, völlig nicht kursiv. Es ist eine kühne, es ist verdichtet, es ist wirklich auffällig. Aber diese Jungs müssen auch auffallen, aber auf eine andere Art und Weise. Sie müssen informativ, sichtbar, aber nicht aufdringlich sein. Es ist also diese Art von Balance, die oft schwer zu erreichen ist, wenn Sie diese aufwändigen, aufwendigen Stücke aus dem Text erstellen . Lassen Sie uns also anfangen, unsere Stücke aus dem Text zu erstellen. Unser Block verfügt über Links, Textauszug und diesen weiterlesen Link im nächsten Video 63. 10Let's Füge die ersten Elemente hinzu: Bevor wir also anfangen, den Text zu erstellen, müssen wir ein Problem beheben. Ich meine, wenn wir jetzt einen Blick auf unseren Block Post Auszug Container werfen und den Hintergrund betrachten, können wir sehen, dass es absolut keine Contras zwischen diesen Jungs gibt. Es ist nicht beabsichtigt, ich muss zugeben, aber tatsächlich gibt uns eine gute und die Chance, eines zu entdecken. Ein Merkmal der Affinität. Designer in beleidigt den Designer können Sie und Farben nicht nur auf Objekte, sondern auch auf das ganze Kunstwort. In diesem Fall müssen wir also kein separates Rechteck erstellen, das sowohl als Rechteck als auch als Hintergrund darstellen würde , wie in anderen Design-Software wie Illustrator, wir können einfach die Kunst an Bord auswählen und schwächen. Klicken Sie einfach auf dieses große, graue Farbfeld, um es so aussehen zu lassen. Und genau so füllten wir die gesamte Kunst an Bord mit nur einer Farbe, und jetzt können wir sehen, dass wir das haben, was diesen Kontrast zwischen unserem Hintergrund und dem Container genau hier unterscheiden wird . Also werden wir den Prozess der Erstellung des Textes für unseren Blockpost beginnen, außer mit dem Datum Und obwohl es nur eine Zeile neben der nächsten ist, werde ich ihr Frame-Steuerwerkzeug für dieses Stück Steuer verwenden, weil der Rahmen Texel dem Datum Und obwohl es nur eine Zeile neben der nächsten ist,werde ich ihr Frame-Steuerwerkzeug für dieses Stück Steuer verwenden, weil der Rahmen Texel Behandeln Sie einen Begrenzungsrahmen, der uns erlauben wird, alles gut auszurichten. Und er wird den Datenrahmen wiederverwendbar machen. Also lassen Sie mich einfach den Rahmen Textil greifen und klicken und ziehen, um Textrahmen zu erstellen. Nun ist der Spaß, den wir nutzen werden, natürlich Roboto. Es ist kursiv Version. Die lustige Größe ist 14 und natürlich ist die Farbe diese sehr, sehr dunkle schwarze Farbe. Nun, wenn Sie möchten, können Sie etwas Füllungstext verwenden. Aber ich werde das Datum 2017 genau so eintippen und jetzt werde ich diesen Rahmen kleiner machen, bis er gut zu meinem Date mit dem Datum passt. Also nicht, was wir tun müssen, ist, dass wir in ihm den ganzen Weg bis zur Haltestelle links beten müssen, bis es schön mit ihm schnappt, genau wie so und jetzt können wir es nach rechts um 50 Pixel verschieben. Denken Sie daran, dass unser ursprünglicher Punkt Transformationspunkt nach oben links und unten um 50 gesetzt ist. Genau wie so in diesem Stück Text wird unsere Art sein, wie ein Anker für das Erstellen des Restes in Stücken aus Text. Also, jetzt können wir tun, ist, dass wir dieses Stück Text wiederverwenden können, um den Blockbeitrag Titel zu erstellen, also werde ich es einfach auswählen, halten Sie das Steuerelement auf meiner Tastatur und dupliziert nach unten genau so Jetzt werde ich diesen Textrahmen den ganzen Weg erweitern auf der rechten Seite, bis es mit dem Hintergrund einrastet. Und da es sich um einen Text aus dem Brunnen handelt, wurde es ähnlich wie ein Objekt. So können wir einfach 50 von unserer Vorderseite von der Breite subtrahieren, um sicherzustellen, dass der Abstand zwischen diesem linken Teil des Textfreundes nicht so ist, dass der Abstand zwischen dem rechten Teil des Textrahmens und dem -Hintergrund. Natürlich müssen wir den Text ändern. Wird die Textgröße gefunden und alle entlang, dass. Aber zuerst, lassen Sie es um 25 Pixel nach unten verschieben, genau wie so und jetzt kann es die Schriftart von Roberto zu Roberto Condensed ändern. Es ist mutige Version und lassen Sie mich einfach mit dem Original überprüfen. Es sind 54 Punkte. eso Bolzenfernbedienung Oh, verdichtet 54, genau so. Und natürlich können wir es immer noch mit jemandem mit einem Dummy-Text füllen. Wenn Sie etwas Sinnvolles eingeben möchten, seien Sie mein Gast, aber einfach gehen, um zu gehen, ich werde einfach etwas Füllertext einfügen und die Textrahmen erweitern , so dass wir etwas mehr oder Text bekommen. 64. 11Letter-Fügende die Textstücke hinzufügen: Die nächsten Textstücke sind also der Name des Autors, Kommentare. Und natürlich haben wir diese Social-Media-Icons hier unten bekommen. Also wieder können wir diesen Kerl schnappen, ihn runterkriegen, bis er mit dem Original zusammenbricht, und wir können diesen Kerl einfach kleiner machen. Genau wie so änderte der Fonds von Widerlegung zurück zu entfernten, oh, verdichtet zurück zu Roboto und diesmal, regelmäßige 14. Genau wie so. Und anstelle von Füllungstext werde ich einfach das Wort durch eingeben. Aber bevor ich das mache, lass mich einfach 25 hinzufügen. Und ich werde einfach so eintippen. Und natürlich, lassen Sie mich es einfach deutlich kleiner machen, und ich gehe nach Kelowna, um das Recht zu tun. Das sollte in Ordnung sein. So etwas kann ein bisschen auf der rechten Seite sein, und ich werde den Namen des Autors eingeben, und ich werde diesen Textrahmen erweitern, und in diesem Fall werden wir die Farbe von dieser Note zu grün und von Regulär bis kursiv. Und dann müssen wir diesen Kerl nach rechts köllen, um den Link für Kommentare wie diese zu erstellen und vielleicht können wir diese Typen einfach gruppieren. Und alles, was noch zu tun ist, nur die Social-Media-Icons hinzuzufügen, diese Jungs hier. Aber ich will nicht, dass du guckst, mich anklickst und all das tun die gleichen Dinge, die wir getan haben, als wir den Header erstellt haben . Denn wieder, es wäre nur, ah, ah, fügen Sie die Dokumente hinzu, bearbeiten Sie sie, ersetzen Sie sie, ändern Sie die Größe. Ich meine, ich glaube, du kennst den Bohrer bereits. Du weißt, wie man es macht. Also lassen Sie mich einfach eine Abkürzung nehmen und einfach diese Typen kopieren, um den Prozess schneller und angenehmer für Sie zu machen . Also werde ich einfach diese Jungs kopieren, und ich werde einfach das Tempo genau so machen und sie genau so ausrichten. Okay, als nächstes würden wir, äh nun, das nächste, was wir tun müssen, ist, einfach diesen Kerl zu leihen, ihn mit diesen Typen hier unten auszurichten und mich schnell nachsehen zu lassen. Ich denke, es sind wieder 25 Pixel. Also wieder, ich würde diesen Kerl einfach Justin nach unten bewegen, Eingabetaste drücken und dann die vordere Rückseite auf Roboto oder reguläre 16. Überprüfen Sie die Blei und ändern Sie sie von 16 auf etwas wie 22. Genau so. Lassen Sie mich es einfach schließen. Und dann noch einmal, nur ich denke, dass wir das noch brauchen. Ja, diese Ah, diese Textstücke hier, die Fotografie, den Lebensstil und die Reise Eso, die ich einfach schnappen werde, einfach ein bisschen hineinzoomen, diesen Kerl schnappen und ihn wieder so klonen, tun plus 25 und geben Sie die Tags ein. Lassen Sie uns nun diesen Textrahmen so erweitern. Und das letzte Stück Text, das wir brauchen, ist nur dieser Lese mehr Button hier unten. Also nochmal, was wir tun können, ist, dass wir diesen Kerl einfach nach rechts klonen können und ihn vielleicht etwas nach unten schieben können. So ist es ein bisschen prominenter, genau wie so und für den Charakter im Zeichenfeld. Ich werde mich ändern, und ich werde sicherstellen, dass diese Buchstaben in allen Großbuchstaben geschrieben sind, genau wie so ändern Sie es von rechts Alec zu Ich denke, es war mittel, aber lassen Sie mich einfach schnell überprüfen Nein, es war bowled, einige gehen, um es von Medium zu fett zu ändern. Und natürlich werde ich eintippen, lesen Sie mehr genau so. Vielleicht werde ich es nach rechts ausrichten und vielleicht ändern wir es von grün zu dieser rosa Farbe . So wissen wir, dass dies tatsächlich einfach eine Verbindung. Und jetzt können wir ihn einfach von der Stunde, unserem Hintergrund packen und ihn nach oben bewegen und dann einfach 52 es 50 Pixel hinzufügen. Aber ich will nicht, dass sie sich bewegen. Ich will es nicht bewegen. Ich möchte seine Höhe einfach so hinzufügen. Und wenn wir jetzt einfach wieder hinauszoomen, können wir sehen, dass wir unseren Text erstellt haben. Nun, ich werde zuerst die meisten blockieren. Außer, dass wir das Bild bekommen haben. Wir haben die Steuer, wir haben die Icons, wir haben die Links und alles sieht sieht sieht wirklich schön aus. Wenn du willst, kannst du einfach gehen, vielleicht dieses Stück Steuer packen und es vielleicht etwas kleiner machen. Und dann fügen Sie einfach einen anderen, einen weiteren Absatz hinzu, um es ein bisschen aussehen zu lassen. Und wir werden etwas anders, schätze ich, lebendiger. Aber denken Sie daran, dass Sie sicherstellen müssen, dass diese Entfernungen wieder gleich sind. Und vielleicht lasst uns einfach schnell die Stapel in etwas anderes ändern, genau so. Es sieht also nur so ein bisschen dynamischer aus. Lassen Sie es uns so sagen. Also gehen wir hin. Wir haben den ersten Block-Post außer erstellt. Unser nächster Auftrag wäre es, die Spalten mit den beiden und mit den beiden Welten, kleineren Bildern zu erstellen Welten, . Einige zurück mit diesen kleineren Stücken Stücke von Text. Aber wir werden anfangen, das im nächsten Video zu tun. 65. 12LAuf Beginn der Erstellung des Blog: in den nächsten Videos. Wir werden diese Block mit Auszügen erstellen. Diese Karten sind hier. Wir haben bereits den wichtigsten Block-Post hier. Jetzt ist es an der Zeit, sie hinzuzufügen. Cut wie älter auf dem Block rühmt Container hier unten. Und wie Sie sehen können, haben wir zwei Spalten, die linke und die rechte Spalte. Und jeder hat drei Block-Postkarten. Eso Ich denke, man könnte sagen, dass es drei Reihen und jeder Hosts zu blockieren Prahlwagen . Nun, was wichtig ist, hier zu verstehen, ist, dass wir Nun brauchen, wir wollen die gleichen Lücken zwischen diesen Elementen aufrechterhalten wie wir, wie wir es hier geschaffen haben. Also, was auch wichtig ist zu verstehen ist, dass diese Karten werden wie viel, viel kleiner als unser Hauptblock Post. Also könnten wir vielleicht überlegen, einige von diesen Elementen entfernen, anstatt alle diese Tags hinzuzufügen , Social-Media-Symbole, all diese Links möchten wir einfach wie ein Handel sie die Design-Elemente für mehr Einfachheit und die Benutzerfreundlichkeit. Also lassen Sie mich zurück zu unserem Hauptdesign hier, und lassen Sie mich einfach schnell das Raster aufheben Also das erste, was ich tun werde, ist, dass ich eine separate Ebene für mein Blockpostraster erstellen werde. Also werde ich einfach einen neuen Layer hinzufügen und ihn umbenennen, um Postgrade zu blockieren. Jetzt werde ich es unter den Block schieben. Post wie das jetzt vorgestellt. Also, was wir jetzt tun wollen, ist, dass wir Ah erstellen wollen, so etwas wie visuelle Führungen, die uns helfen würden, Container für unsere Wagen zu erstellen. Das erste, was ich tun werde, ist, dass ich mir ein einfaches Rechteck-Werkzeug schnappen werde. Ich werde es etwas sichtbar geben, gescheitert. Vielleicht diese dunklere Gefühl, genau wie so Jetzt werde ich ein erstellen ein Rechteck erstellen, das über all diese neun Spalten gerade so dehnen wird. Und lassen Sie mich einfach schnell sehen, ob Kerl, wenn ich alles richtig ausgerichtet habe und ich glaube, ich habe einfach so so gemocht Also möchte ich eine 25 Pixel Lücke zwischen diesem Hauptcontainer und meinem nächsten mit meinem nächsten Raster haben . Also, im Transformationsfenster, werde ich einfach 25 Pixel für den Wert der Y-Achse hier hinzufügen. Aber denken Sie daran, den ursprünglichen Punkt auf einen der obersten Punkte genau hier zu setzen. Es kann entweder links in der Mitte oder rechts sein. Solange es ein Spitzenpunkt ist, wird es uns gut gehen. Also werde ich jetzt nur noch 25 hinzufügen. Um gleiche Lücken zwischen unseren Elementen aufrechtzuerhalten, müssten wir eine 25 Lücke zwischen Will 25 Spalten für unsere Karten schaffen, richtig? Also wieder, lasst uns das Rechteck-Werkzeug greifen und dieses Mal vielleicht wie eine vertikale Rechtecke erstellen, genau wie so. Und vielleicht ändere ich einfach seine Farbe in etwas. Vielleicht ist diese rosa Farbe, so dass Sie alles besser sehen können, und ich werde sicherstellen, dass es hat. Dass es mit ist genau 25 Pixel, genau wie so. Und jetzt können wir es einfach greifen, bewegen Sie es nach oben und stellen Sie sicher, dass es eine Sonde ist, dass diese Bohne und wir werden in der Mitte von unserem Haupt passieren, wie unsere Haupt-visuelle Führer. Also wähle ich sowohl den Ball, diese Rechtecke, und ich bin einfach Position in diesem Kerl genau in der Mitte, genau so. Aber natürlich werden wir dieses Rechteck nicht brauchen, also werde ich alle auswählen. Und hier werde ich wählen, subtrahieren von unseren von unseren Pfadoperationen genau so. Und jetzt kann ich sicher sein, dass der Abstand zwischen meinen Containern genau 25 25 Pixel beträgt. Wenn Sie diese Rechtecke nicht sehen möchten, aber dennoch einige visuelle Hilfslinien haben möchten, die Ihnen helfen, die Größe der Container für die Karten festzulegen, könnten Sie immer einfach in ihre Führer bringen. Wenn Sie diese Rechtecke nicht sehen möchten, aber dennoch einige visuelle Hilfslinien haben möchten, die Ihnen helfen, die Größe der Container für die Karten festzulegen Also zuerst gehe ich Teoh, zeig den Herrschern, dass ich Schauherrscher sehen werde. Oder Sie könnten einfach mit Kontrolle und unsere Abkürzung gehen, die noch schneller wäre. Und ich werde einfach anfangen, die Guides so auszudrucken. Also weiß ich, wo meine Container waren und wo meine Container gerade so anfangen. Und wir könnten eine horizontale genau so und eine vertikale einfach so herausbringen. Also, wenn Sie Teoh nicht wollen, lassen Sie mich einfach sicherstellen, dass diese Jungs richtig positioniert sind. Wenn Sie also diese Rechtecke nicht sehen wollen, können Sie einfach mit den Jungs herumspielen. Aber ich würde auf jeden Fall empfehlen, mit den Rechtecken zu beginnen. So wissen Sie, wo Sie ihre Führer positionieren können. Also, sobald sie fertig sind, können Sie einfach entfernen Sie diese Rechtecke. Und jetzt müssten sie nur noch das Haupt dieses Hauptbild greifen. Lassen Sie mich einfach das Raster, diesen Hauptcontainer, ausschalten , klonen und einfach mit seiner Größe und dem Text herumspielen. Aber ich denke, dass dies etwas ist, das wir im nächsten Video tun werden. 66. 13Letter erstellen: Okay, jetzt können wir anfangen, unsere Karten für das Raster zu erstellen. Also werde ich die Sichtbarkeit von den Herrschern von Präsident Control ausschalten. Plus sind einfach so. Und ich werde alles auf diesem Block Post Featured Layer auswählen und ich werde es kopieren und fügen Sie es alle meine Block Post Gitter Layer, genau wie so und jetzt gruppieren alles. Also im Moment ist dieser ganze Container nur einer ist nur eine Gruppe. Lassen Sie mich nur sicherstellen, dass es auf der richtigen Ebene ist, genau so. So können wir es jetzt einfach mit unseren Guides verschieben. Verschieben Sie es in die linke Ecke, genau so. Lassen Sie mich einfach ein bisschen schnell wieder rauszoomen. Also, wenn wir anfangen, diesen Kerl so kleiner zu machen, können wir entweder alles proportional verkleinern und den Text gut, unberührt lassen . Aber wir können auch an diesem oberen Bob unten rechts greifen. Bringen Sie es rein. Und wie Sie sehen können, da wir unseren Text als auch Live-Fülltext erstellt haben, ändern sich die Textrahmen. Sie versuchen, sich auf die neue Größe vom Kurs anzupassen. Es sieht nicht so aus, dass es nicht einmal aus der Ferne in Ordnung ist, aber wir werden es in nur einer Sekunde reparieren. Aber bevor wir Krug starten, ist es nur in der Steuer. Lassen Sie mich einfach schnell ändern diese Big Ben ein Foto, einige gehen zu doppelklicken Sie darauf, um es zu navigieren und zeigen Sie es in meinen Ebenen Panel. Also werde ich es einfach so loswerden und dann dieses Rechteck erneut auswählen. Stellen Sie sicher, dass ich die Seitenauswahl Option eingeschaltet unsicher und einfach zu ihnen navigieren einen Ort, wo ich meine Bilder zu halten und vielleicht lassen Sie uns mit diesem Kuchen Foto gehen. Genau wie so werde ich auf nur die Größe klicken und da gehen wir. Wir kamen zu dem erstellten Bild. Wie ich bereits sagte, könnten wir opfern und die Menge an Designelementen, die wir hier für wie, mehr Sichtbarkeit, bessere Sichtbarkeit , Kampf Usability haben. Und ich denke, das ist etwas, das wir jetzt dio-werden. Also, zuerst, ich gehe Teoh, drehen Sie sich gut, diese Spink den Spink-Text in einen grünen Text. Ich will nicht, dass es so ist. Ich will kein Link mehr sein, also lasse ich es jetzt einfach so für das Date. Ich werde einfach darauf doppelklicken und erweitert, genau wie so Jetzt werde ich nicht mit diesen Social-Media-Symbolen. Ich werde sie loswerden. Ich werde die Kommentare nicht verwenden, also werde ich doppelklicken. Manchmal müssen Sie ein paar Mal doppelklicken, um zu einer Gruppe innerhalb einer Gruppe in einer Gruppe zu navigieren , die sie funktioniert. Aber manchmal muss man einfach klicken. Konnte gewickelt zweimal in nur einer weiteren Zeit klicken. Also, jetzt gehe ich Teoh, vielleicht schnapp dir diese Tags und verlängere sie nur ein wenig. Und ich denke, ich werde vielleicht einfach ein Wund-Tag einfach so hinterlassen und den Kerl so leicht nach links bringen. Natürlich waren unsere. Unser Hauptanliegen ist dieser Titel hier, denn er wird das Sichtbarste auf unseren Karten sein, also müssen wir sicherstellen, dass er sichtbar ist, aber gleichzeitig nicht zu aufdringlich ist. Einige gehen, um darauf zu doppelklicken, und ich werde den Fonds von einem ändern 54 zu Mal sehen 22. Vielleicht denke ich, das in Ordnung und vielleicht lassen Sie uns einfach leicht die Zeilenhöhe von 22 erhöhen. Also lass uns mal sehen. 26. Lassen Sie mich einfach rauszoomen, um zu sehen, wie es aussieht. Das wäre in Ordnung. Ich denke, wir können es so lassen. Wir können später immer mit ihm herumspielen. So jetzt können wir einfach unsere Haupttext-Dinge Hauptcontainer für unseren Post Auszug packen und lassen Sie mich einfach schnell vielleicht ein wenig auf drei Zeilen Text verschieben erweitert. Es ist nur ein bisschen oben, genau wie jetzt. Wir könnten uns vielleicht den Titel schnappen und ihn einfach so etwas nach unten schieben. Und lasst uns sehen, wie es jetzt aussieht. Ich denke, es sieht in Ordnung aus. Geschwächt. Wir können es so lassen. Natürlich könnten wir den ganzen Nachmittag mit all diesen Elementen spielen und versuchen, ihnen die perfekte Balance zu finden, aber in der Regel nur eine Angelegenheit off. Hinzufügen von einem Punkt Teoh auf die Telefongröße oder zwei Punkte. Also überlasse ich es dir. Aber ich denke, dass es jetzt gut aussieht, also werde ich es so lassen. Alles, was wir jetzt wirklich tun müssen, ist, dass wir dieses Ganze einfach kopieren oder duplizieren müssen, diese ganze Gruppe nach rechts und dann nach unten, den Text ändern, die Bilder ändern und unser Raster wird komplett sein. Aber fangen wir an, das im nächsten Video zu tun. 67. 14Let's Füge die verbleibenden Karten hinzu: Jetzt können wir unsere erste Karte nach rechts duplizieren und dann beide Karten zweimal nach unten duplizieren damit wir unser Raster erstellen können. Also werde ich zuerst diese Karte greifen, Kontrolle halten und verschieben, um diesen Kerl nach rechts zu klonen, genau so. Dann werde ich verschieben, beide Karten schwächen und wieder kontrollieren, kontrollieren, verschieben, klicken und sie herunterbringen. Und natürlich wollen wir zu diesen Jungs. Ich meine, wir wollen die Lücke zwischen diesen Typen auf 25 Pixel haben. Also nochmal, ich werde einfach 25 hinzufügen genau so und jetzt wieder können wir einfach auf beide Karten klicken, klicken und ziehen, natürlich, natürlich, halten Sie die Steuerungstaste gedrückt. Und dann können wir wieder 20 fünf hinzufügen. Genau so. Alles, was wir jetzt tun müssen, ist, dass wir diesen Text einfach ändern müssen. Natürlich müssen wir die Bilder ändern und das große wird grundsätzlich komplett sein. Also nochmal, ich gehe. Teoh, isoliere das. Ah, dieses Bild hier. Und wie Sie sehen können, habe ich es hier in der Systemsteuerung im Ebenenfenster. Ich kann nur wissen,, löschen Sie dieses Bild und wieder stellen Sie sicher, dass die Einfügung innerhalb Auswahl Option ist eingeschaltet Platz das Bild und Griff, vielleicht die Katze Foto. Warum nicht einfach, so tun Sie das Gleiche mit diesem Kerl so isoliert in meinem Ebenen-Panel. Schnappen Sie sich das Bild, entfernen Sie es und wieder, nur um innerhalb der Auswahl wie so und wieder einfügen. Vielleicht fügen Sie dieses Bild einfach so hinzu. Was Sie also auch tun könnten, ist, dass wir den Text ändern könnten. Denken Sie daran, dass, da dies eine Füllstoffsteuer ist, ist dies ein Filter Anwendung Füllstoff Text schwächen. Dennoch können wir auf das Textmenü auf Chek gehen Füller Text einfügen und dann dasselbe tun. Fügt Füllungstext erneut ein. Und dieses Mal Affinity Designer wird uns einen anderen abgesetzten Dummy Lauren Gibson Text gegeben. Wir können das gleiche tun mit der Dusche wird posten, außer so dass er es einfach isolieren kann nicht die Insert-Füllstoff Steuer und dann klicken Sie einfach einfügen Füllstoff Text wieder, nur um es ein bisschen anders aussehen. Also wieder, ich werde zu diesem Bild navigieren, es im Ebenenfenster finden, dieses Bild löschen, so stellen Sie sicher, dass ich in dem Bild in der Auswahl basiert. Schnappen Sie sich dieses Kaffee-Bild. Vielleicht diesmal. Und wie Sie sehen können, ist es viel zu groß, also müssen wir es kleiner machen. Also halte ich gerade die Steuertaste gedrückt. Teoh macht es von seinem Mittelpunkt kleiner. Genau so. Das sollte gut sein. Vielleicht ändern wir wenigstens den Titel. also wieder Gehen Siealso wiederzum Textmenü und fügen Sie einen weiteren Satz Füllungstext ein. Dieses Bild, wie so DoubleClick Oona, um es im Ebenenfenster zu finden. Entfernen Sie es in bestimmten Seitenauswahl. Korrupte das Foto genau wie so über nur ein bisschen herum. So füllt es unseren Platzhalter gut aus. Machen Sie das gleiche mit diesem Bild, so dass Sie einen Möbeldesigner wirklich Osten sehen können, flexibel, wenn es um das Hinzufügen von Bildern kommt, Erstellen von Blockpost Auszüge, Ich werde tatsächlich in jeder Art von Bild von Platzhaltern erstellen. Vielleicht machen wir diesen Kerl aber kleiner, weil er, wie Sie sehen können, wie Sie sehen können,ein bisschen zu groß ist. Und sobald Sie wissen, die einfachen Techniken, können Sie wirklich beschleunigen den Prozess und erstellen Sie eine professionell aussehende Blogger Block Front ,Titelseite. , Also werde ich nur diesen Text geändert, wie so vielleicht dieses Bild geändert. Ändern Sie diesen Titel so in einer Art Fülltext. Und da gehen wir. Wenn wir jetzt einfach zurückgehen und vielleicht die Sichtbarkeit von unseren Guides ausschalten. Genau wie so haben wir jetzt das Hauptbild gemacht Block Post. Und dann haben wir das Gitter hier, sieht wirklich schön aus. nun daran, dass dies nur 11 Art von Gut ist, die Sie erstellen können, um andere werden kleinere Block-Posts in Ihrem Design zu zeigen . Du könntest ihn immer einfach erstellen, vielleicht dieses Hauptbild duplizieren, diesen entwürdigenden Blockpost, der nur ein paar Mal dupliziert wurde und eine Liste von großen, großen Image- und Textcontainern haben . Oder Sie können einfach eine Liste mit dem Bild auf der linken Seite und Text auf der rechten Seite erstellen. Aber wir werden es in der Seitenleiste erstellen. Deshalb wollte ich dieses Konzept hier nicht duplizieren. Und Sie könnten auch etwas schaffen, das ein Labyrinth und Bedauern genannt wird, das im Grunde wie eine Prise Festnahme Fütterung aussieht. Also in einem Maurer bedauern Sie nur größere Bilder können ein bisschen mehr Steuern sein, so Container sehen aus wie Blöcke unterschiedlicher Größe. So jetzt wissen wir, wie man ein Blockpostraster erstellt, das wir zuerst erstellt haben. Wir haben einige visuelle Führungen erstellt, denken Sie daran, dass wir zu den Rechtecken erstellt haben, dann zu den Führungen. Und dann haben wir diesen Hauptcontainer einfach von oben kopiert. Wir haben behauptet, dass wir zu unserer Schicht konkurrierten, die seine Größe ändern wird. Und dann ändern wir einfach den Text in Bildern und befreien einige der Elemente von, wie Social-Media-Zyklen und einige Links. Natürlich, wenn Sie wollen, könnten Sie noch etwas hinzufügen. Noch ein paar weitere Container hier. Aber ich denke, dass ich jetzt einfach gehen werde. Das hat es. Aber ich bin jedoch, jedoch, werde die älteren Beiträge Battle hier hinzufügen, und wir werden eine schmale hinzufügen, weil wir die Benutzer haben wollen, um sie die Möglichkeit zu klicken und auf diese Schaltfläche, um ältere Boote innerhalb unserer Design. Aber lassen Sie uns das eigentlich im nächsten Video 68. 15Let's Hinzufügen der älteren Posts Link: also möchte ich Ihnen die Dinge einfach machen. Also, wenn Sie dieses Design neu erstellen, können Sie einfach Ihre neu erstellt schneller und ah, und sehen und einen besseren Blick auf, was hier los ist. Also habe ich beschlossen, nur eine, na ja, diese Karten zu nennen na ja, , all diese Gruppen. Dementsprechend habe ich beschlossen, ihnen Zahlen zu geben. Wenn Sie sich diese Datei ansehen, können Sie einfach ein bisschen einfacher damit arbeiten. Also, jetzt ist es tatsächlich erstellen diese älteren Beiträge. Ah, Link hier unten. Also werde ich nur ihr schnappen die künstlerischen Text Hocker Bilder schnell vergrößern und ich werde klicken und ziehen und tippen Sie in älteren Beiträgen. Wie Sie sehen können, verwende ich die komprimierte Schriftart von Roboto. Lass es mich einfach schaffen. Das wird dunkelgrüne Farbe und ich glaube nicht, dass ich will, dass es so groß ist. Lass es uns ein bisschen kleiner machen. Lassen Sie uns versuchen, 20 20 sollte in Ordnung sein. Und natürlich wollten wir genau in die Mitte zwischen diesen Jungs gestellt werden und wir wollten so formuliert werden , wie wir eine 25-Pixel-Lücke schaffen wollen zwischen diesem ein Stück Text und diesen Containern so wieder. Was ich tun werde, ist, dass ich 25 so hinzufügen werde, um es so herunterzubringen. Natürlich wollte ich nicht auf der Hauptschicht sein, also werde ich es auf diesen Block setzen, Bögen, Cred, Schicht einfach so. Und vielleicht lassen Sie es uns hier runterbringen. Wenn wir uns das Original ansehen,können wir sehen, dass hier unten dieser kleine Pfeil ist. Wenn wir uns das Original ansehen, Um es zu erschaffen, können wir sie benutzen. Die benutzerdefinierten Formen in einem Fader Designer. Also werde ich einfach die Pfeilspitze greifen und schnell eine schmale erstellen, die so ähnlich aussehen wird . Also aus dem Kontextmenü, werde ich für die Linke bekannt wählen und einfach so und Ehevertrag, bringen sie die Dicke nach unten. Mal sehen, vielleicht 10%. Das sollte in Ordnung sein. Lassen Sie mich es einfach schnell kleiner machen hier Sommer. Und was das Recht und den Geist angeht, lasst uns es einfach so von Pfeil zu Stachel ändern und seine Farbe ändern. Und jetzt, wenn wir seine Größe ändern, können Sie sehen, dass wir diesen Pfeil immer noch so manipulieren können. Und natürlich, wenn Sie die Shift-Taste gedrückt halten, können wir sie verhältnismäßig kleiner machen, bis es so etwas ist. Nein, ich bringe es hier rauf. Und vielleicht werde ich das noch so etwas ausweiten. Ich will nicht zu groß sein. Und natürlich können wir immer noch die Dicke ändern. Wenn wir Thio wollen, natürlich können wirnatürlichdie Enden ändern. Wir können die Dicke unseres Pfeils ändern. Lass uns gehen, vielleicht mit 20%. Also lasst uns die Dicke dieses auf 20% ändern, um daran zu denken, dass es wirklich, wirklich klein sein wird . Vielleicht ist es eine gute Idee, es nur ein bisschen sichtbarer zu machen, genau so und vielleicht einfach kleiner gewesen, oder? Also jetzt können wir es ein wenig nach rechts verschieben, gruppieren und sicherstellen, dass sie irgendwo in der Mitte positioniert sind, genau wie so lassen Sie uns 25 hinzufügen und da gehen wir. Wir haben das Gitter erstellt. Unser nächster Auftrag wäre, diese Seite Arbeiter zu schaffen. Im Moment sind wir zum Header gekommen. Wir haben diesen Schieberegler, den wir zum Hauptbild bekommen haben. Nun, Hauptblock, Postcontainer. Und wir haben die de Block Beiträge Grid, zusammen mit dem älteren verfügt über einen Link hier auf der Unterseite. Also, jetzt wollen wir tatsächlich gehen, um den Schieberegler zu erstellen. Und wir werden diese Art von Design ausführlicher untersuchen, beginnend mit dem nächsten Video. 69. 16Let's to the Sidebar: in den nächsten Videos. Wir werden diese Sidebar erstellen, Also lassen Sie uns einen Blick auf sie jetzt werfen. Zunächst einmal können Sie sehen, dass es sich hier um eine Streckung über drei Spalten handelt, und es ist in separate unterteilt. Nennen wir sie Ideen, und jede Idee ist, ah, Tag ist genau hier beschriftet. Also zuerst haben wir ein einfaches Suchfeld bekommen. Es ist also nur ein einfaches Rechteck mit etwas Text im Inneren und sie das Lupensymbol genau hier. Wir haben auch diese erste Idee, diesen ersten Container, der dies über mich Container ist. Also kamen wir zu diesem Label. Wir kamen zum Bild, und wie Sie sehen können, es ist ein Es ist ein quadratisches Bild, einige Textcontainer und Container und soziale Medien. Ich komme hier runter. Dann bekamen wir einen einfachen, einfachen, wie einen Textcontainer mit einem anderen Label. Und dann haben wir den beliebtesten Container bekommen. Dies ist eine Art wie ein Blogger Post Feed, aber es zeigt auf Lee die beliebteste, die beliebteste Block rühmt, und diese und diese Blockboote können diejenigen, die die größte Anzahl von Kommentaren mögen oder , die gemeinsam genutzt wurden. Die meisten Male. Und wie Sie sehen können, ist dieser kleine rechteckige Behälter in zwei Teile unterteilt. Also auf der linken Seite haben wir ein quadratisches Bild, und dann haben wir hier einen Textcontainer mit einem Datum mit dem natürlich, ähm, mit dem Post-Titel und dem Tag. Und es gibt eine kleine Linie, die diese Typen hier teilt. Und natürlich der letzte Container diese Trennlinie nicht, denn darunter haben wir dieses Label, das einen nächsten nächsten beginnt, wird Abschnitt die Anzeigen enthalten , die natürlich in diesem Fall sind einfache Bilder, nur um die Anzeigen in unserem Design zu repräsentieren. Lassen Sie uns jetzt anfangen, unsere Sidebar zu erstellen, und fangen wir an, sie mit einer neuen Ebene zu erstellen. Also lassen Sie mich die Panels zurückbringen und lassen Sie mich eine neue Ebene erstellen, und ich werde es Randleiste nennen. Und jetzt sind wir bereit, unseren ersten Abschnitt in unserer Sidebar zu erstellen. Welche natürlich ist sie, dass das Suchfeld Element direkt hier an der Spitze? Also fangen wir an, das im nächsten Video zu tun 70. 17Let's erstellen: Also werde ich anfangen, die solche Box zuerst zu erstellen, indem ich das Rechteck-Werkzeug verwende. Und ich werde sicherstellen, dass es den weißen Phil hat und sie dunkler Schlaganfall und dass der Schlaganfall nicht zu groß ist. Ein Punkt sollte ausreichen. Lassen Sie mich jetzt einfach so schnell hineinzoomen und jetzt können wir ein Suchfeld erstellen, das so etwas sein wird, dass es nicht sein muss, muss nicht zu groß sein. Wir können vielleicht sogar kleiner machen, um 50 Pixel zu mögen, genau wie so Jetzt werde ich das Gitter loswerden. Ich brauche es nicht mehr. Was ich aber brauche, aber brauche, ist die Text-Einsicht. Also mit dem künstlerischen Textwerkzeug werde ich klicken und ziehen und so etwas wie „Hier suchen“ eingeben. Und natürlich wollen wir die Schrift von Roboto kondensiert zu einfachen Roboto ändern. Vielleicht nicht dünn, sondern kursiv. Genau so. Ändern Sie die Größe in etwas wie 16. Lassen Sie uns die Farbe in diese dunkelgraue Farbe einfach so ändern. Und natürlich, lassen Sie uns sicherstellen, dass es tatsächlich das Gefühl ist , , das beeinflusst hat, nicht der Schlaganfall, und lassen Sie uns jetzt vielleicht die Kapazität auf, sagen wir, 50,50%. Und was wir jetzt tun müssen, ist natürlich, dass wir die Lupe schaffen müssen, die kein Problem solide sein sollte. Schnappen Sie sich einfach das Ellipse Tal, erstellen Sie eine Ellipse. Und jetzt lasst uns das Rechteck-Werkzeug greifen und ein Rechteck erstellen, das ein gefülltes, dunkleres, gefülltes und ich möchte nicht, dass es irgendeinen Strich hat, genau so und lass es uns kleiner machen. Lasst uns vielleicht sogar mit einem Pixel gehen. Warum nicht? Und lassen Sie es von seinem unteren Punkt um 45 Grad drehen, genau wie so und machen wir es etwas kleiner. Gehen wir so etwas auf 10 Pixel herunter. Und jetzt könnten wir vielleicht einen schimpfenden Finalisten ein bisschen runterbringen. Und wenn Sie wollen, natürlich können Sie es natürlichkleiner machen, also werde ich sie einfach gruppieren und sie zu so etwas kleiner machen. Und natürlich können wir auch seine Kapazität fallen lassen. Sehen wir 50% wie bei unserem Text, und natürlich müssen wir Ihren Durchgang von allen Elementen wieder in Prozent stören, ich lasse mich einfach wieder rauszoomen. So sieht es aus. Völlerei. Bewegen Sie den Kerl vielleicht ein bisschen nach rechts. Wie Sie sehen können, ist es nicht wirklich schwierig, aber es braucht nur eine Menge Optimierung. Lassen Sie mich diesen Kerl vielleicht auf 12 Punkte bringen, genau wie so gut, aber ein bisschen nach links. Und jetzt schauen wir mal, wie es aussieht. Es könnte zu klein für dich sein. Es könnte zu groß für dich sein. Es ist bereits bekannt, wirklich eine Frage der Vogel persönlichen Vorlieben. Okay, lass es uns so lassen. Lassen Sie uns nicht zu viel Zeit damit verbringen, es aussehen zu lassen. Perfekt aussehen geht aus meiner Erfahrung. Ich kann Ihnen sagen, dass es selten perfekt aussieht, und ich verbringe viel zu viel Zeit damit, nur und ich verbringe viel zu viel Zeit damit, nur wirklichwinzige Anpassungen vorzunehmen. wirklich Trotzdem sieht es in Ordnung aus, aber wie wir wissen, ist es besser als perfekt. Lass es uns also so lassen. Unser nächster Teil wäre also, diesen ersten Container zu erstellen, der der Abschnitt über mich war. Also müssen wir das Label, das Bild und dann etwas Text mit Social-Media-Icons erstellen . Also fangen wir an, das im nächsten Video zu tun 71. 18lets Erstellen: Also habe ich beschlossen, die Elemente zu gruppieren, die unser Suchfeld erstellen. Und ich nannte die Gruppe gut, Suchfeld hier unten. Also, jetzt können wir weitermachen, um in unserem ersten über gut, erste Abzeichen, erste Label und dann das ganze über mich Teil von der Seitenleiste zu erstellen. Also, was ich zuerst tun werde, ist, dass ich das Rechteck-Werkzeug greifen und die Farbe in diese rote oder rosa ändern werde . Und natürlich, natürlich, stellen Sie sicher, dass die Deckkraft rückwärts zu Beckett 100% ist. Und ich werde anfangen, mein Rechteck von dieser linken unteren Ecke aus dem vorherigen Rechteck zu erstellen . Das sollte gut sein. Ich werde es vorerst lassen, einfach so. Und jetzt werde ich ein weiteres Rechteck erstellen, das sich von rechts zwei links erstreckt, genau wie so und wieder. Ich will nicht, dass es zu groß ist. Was wir jetzt tun müssen, ist natürlich, dass wir hier etwas Text hinzufügen müssen. Also werde ich das künstlerische Textil schnappen, klicken und ziehen Sie direkt über mich, genau so, dass ich es von metallisch zu fett ändern werde, einfach so. Und natürlich werden wir die Farbe in Weiß ändern und das vielleicht ein bisschen auf 14 bringen werden wir die Farbe in Weiß ändern und das vielleicht ein bisschen auf 14 bringen. 14 sollte gut sein, und ich werde es heraufbringen. Und wie Sie sehen können, müssen wir dieses Rechteck möglicherweise etwas anpassen. Also sieht alles gut aus. Vielleicht sogar ein bisschen nach rechts, einfach so. So können wir jetzt all diese Elemente greifen, sie gruppieren und einfach herunterbringen. Ausgehend von der Resent von der Mitte wird der obere Punkt bringen Sie sie um 50 Pixel nach unten. So können wir jetzt beginnen, dieses Bild zu erstellen. Wird dieses Bild und dieser Textcontainer So werde ich gerade wieder umwickelt das Rechteck Zehe finden diese unten links unten, linke Ecke verschieben, klicken und ziehen. Machen Sie es ein bisschen größer, um es tatsächlich quadratisch um 25 Pixel niedergeschrieben zu machen. Natürlich spielt die Farbe dieses Containers an dieser Stelle keine Rolle, aber ich werde es klonen, es etwas kleiner machen, genau wie so und natürlich verwandelte dies in diesem Rechteck in ein tun Image-Container. Einige gehen, um auf diese einfügen innerhalb Auswahloption klicken und finden Sie das entsprechende Bild. Vielleicht ist dieses Bild, weil natürlich, Dies ist nicht über mich Abschnitt, so wäre es am besten, einige zeigen. Zeigen Sie das Foto von der Person, die der Autor von der gebloggten ist. Lasst es uns so zentrieren. Lassen Sie uns auch die Farbe dieses Hintergrunds einschalten , richtig? Schnappen Sie sich den Textrahmen, Zehenrahmen Textil und erstellen Sie ein einfaches Stück Text, der so etwas aussehen wird . Ich denke, das sollte gut sein. Wir werden ausrichten ist richtig nur eine Sekunde. Ich werde es mit einigen mit etwas Füllstoff füllen. Und, natürlich, stellen Sie sicher, dass ich die Widerlegung regelmäßig, aber 16. Und natürlich möchte ich mich ändern, und ich möchte auch die Farbe ändern. Stellen Sie einfach sicher, dass ich alles richtig ausgewählt habe. 16. Ändern Sie die Farbe in diese dunkelgraue Farbe, genau so. Und, äh, vielleicht lassen Sie es uns an der Mitte ausrichten und werfen einen Blick auf die Zeilenhöhe. Lass es uns ein bisschen runterfallen. 2 22 Vielleicht werde ich nur drucken, und jetzt können wir sicherstellen, dass alles in Bezug auf unseren Hintergrund auf das Zentrum ausgerichtet ist , und ich werde diese sozialen Medien einfach schnell ausleihen. Ich komme. Ich werde sie hier und wieder kopieren. Ich werde sicherstellen, dass sie in der Mitte in Bezug auf diesen Container gut ausgerichtet sind. Und jetzt können wir einfach den Text und die Symbole gruppieren sie. Und jetzt eine Linie alles schön in die Mitte, genau so. Also haben wir unseren Containercontainer erstellt. Jetzt habe ich gerade bemerkt, dass ich denke, dass ich gerade eine gut hinzugefügte 25-Pixel-Lücke anstelle einer 50-Pixel-Lücke erstellen sollte . Aber weißt du, manchmal werden diese Fehler gut, die ich mache, uns einen netten Anreiz geben , , ein paar neue Dinge über andere als Designer zu lernen. Unsere Art von wie das Lösen von Design-Herausforderungen, die Sie auf jeden Fall am wichtigsten kommen, wenn Sie Websites entwerfen, denn die Chancen sind, dass Sie gehen, um Fehler zu machen, und das ist in Ordnung und es ist tatsächlich sogar gut. Nun, es ist gut, solange man aus diesen Fehlern lernt. Also werde ich all diese Elemente greifen. Lassen Sie mich nur sicherstellen, dass ich all diese Elemente packe. Ich werde sie gruppieren und jetzt, was wir tun können, ist, dass wir einfach sicherstellen können, dass dieser Kerl diesen ursprünglichen Punkt auf die Spitze gesetzt hat und einfach, um ihn um 25 Pixel zu bringen. Ich werde hier ein paar Mathematik machen, also werde ich mit minus 25 gehen. Und da gehen wir. Da wir diese Lücke hier auf 50 Pixel gesetzt hatten, hat jeder, der sie auf 25 gesetzt hat. Also immer wirklich tun müssen, ist nur 25 Pixel von dieser Lücke hier zu subtrahieren. So sieht es jetzt aus. Also haben wir unser Suchfeld bekommen. Wir haben unseren Abschnitt über mich. Wir haben das Bild bekommen, ähm, diesen Textcontainer, und wir kamen zur Anleitung. Also haben wir den ersten bekommen. Nun, erste 2 Teile von unserer Sidebar erstellt Der nächste Teil der Sidebar wäre, dies zu erstellen. Lassen Sie mich einfach zurück zum Original, diesem kleinen Stück Text hier und diesem kleinen Etikett. Also lassen Sie uns das im nächsten Video 72. 19Let's Erstellen des Textbereichs von der Seitenleiste: So können wir sie jetzt Mein Blawg-Abschnitt von unserer Seitenleiste erstellen. Und wieder werden wir die Elemente wiederverwenden, die wir bereits hier haben. Also zuerst werde ich das Etikett genau wie so packen und es runterkopieren, bis es mit diesem, äh, diesem Behälter einrastet äh, , lassen Sie mich die Panels zurückbringen und ich werde es um 50 Pixel einfach so hinlegen und lassen 's ändern alle rot, dann die über mich Text, Lassen Sie uns es in meinen Block ändern. Also mit dem Text, der dem künstlerischen Textil erzählt werde ich diesen Text auswählen und einfach mein Blawg so eingeben. Und natürlich, je nachdem, wie groß oder wie breit dieser Text für unser Label ist, müssen wir es vielleicht tun. Es ist nur der Hintergrund. Also in diesem Fall werde ich dieses Distel Rechteck greifen und dieses Rechteck nur ein bisschen kleiner machen , genau so. Also, jetzt kann ich einfach diesen Text ausleihen direkt hier und diesen Hintergrund CO p und es basiert und wie so natürlich herunterbringen, werde ich auf Gruppe alles. Ich werde diese Social Media-Symbole nicht brauchen, die ich loswerden werde. Ich werde gehen. Teoh, ändere die Ausrichtung von Mitte Zwei links einfach so. Und wir können diesen Absatz einfach runterbringen. Wenn sie etwas Füllstoff Text im Inneren ändern. Warum nicht? Genau wie so und jetzt breitet den Kerl aus. Erstellen auf diesem Stück aus wie einfache einfache Dank kann uns eine andere Gelegenheit Toe geben, lernen Sie einen weiteren Aspekt der Arbeit mit verschiedenen Funktionen und sagte, Sir, Sir, In Affinität Designer, denken Sie daran, dass wir im Allgemeinen Lücken, die entweder 25 Pixel oder 50 Pixel sind. Also, wenn Sie wollen, können Sie das aufrechterhalten. Nun, diese Idee in Ihren Textfeldern. Also zum Beispiel, hier, wenn wir sicherstellen wollen, dass tatsächlich, dass die Lücken, die Polsterung in dieser Box auf 25 Pixel gesetzt wird, wenn wir bereits verwenden, was wir haben Nun, das ist eigentlich wirklich, wirklich einfach . Alles, was wir tun müssen, ist sicherzustellen, dass sich unser Textfeld über unseren Brunnen, unseren Hintergrund in diesem Fall ausbreitet . Was wir jetzt tun können, ist, dass wir es einfach kleiner machen können. Also zuerst werde ich es von oben kleiner machen, um die 25 Pixel Lücke zu schaffen. Also werde ich den ursprünglichen Punkt nach unten setzen und ich werde 25 von seiner Höhe subtrahieren , genau so. Und ich werde den zentralen Punkt in der Mitte sitzen lassen. Und jetzt werde ich 50 von der mit subtrahieren, weil ich will, und ich möchte die Lücke auf der rechten und auf der linken Seite erstellen. Und sie beide sollen 25 sein 25 plus 25 ist in der Regel 50 einige gehen 50 hinzufügen. Ich werde 50 so subtrahieren, und da gehen wir. Jetzt können wir sicher sein, dass der Abstand zwischen den oberen und den linken und den rechten Teilen Kanten unseres Behälters oder genau 25. Jetzt kann ich diesen Kerl einfach loswerden und diesen Kerl runterbringen. Und wenn du willst, kannst du auch sicherstellen, dass der Abstand zwischen diesen Jungs 25 ist. Aber ich werde nicht so gut gehen. Ich werde nicht gehen. Ich werde diese große Lücke nicht schaffen. Ich werde vielleicht hinzufügen 12 Pixel genau wie so und wieder mit dieser Art schwächen tun genau das gleiche. Wir können es einfach so runterbringen. Und stellen Sie sicher, dass das tatsächlich 20 ist. Dass die Lücke hier 25 ist. So können wir eso einfach schwächen. Einfach was schnappen? Vielleicht lassen Sie uns diesmal die Transformation von oben machen. Und von der Höhe Blei, subtrahieren 25 genau so. Und ah, sicher, wir können den nächsten Füllungstext einfach so ändern. Okay, also kamen wir zu diesem Stück hier, erstellt, so dass der nächste Abschnitt wäre, diesen großen, beliebtesten Blawg-Feedblock Post Feed direkt hier zu erstellen . Also fangen wir an, das im nächsten Video zu tun. 73. 20Lass uns den ersten Container für die beliebtesten Posts erstellen: Beginnen wir also erneut mit dem Erstellen des nächsten Abschnitts, indem wir nur einige Elemente duplizieren. Ich werde dieses Label hier schnappen und es runterbringen, bis es mit diesem Top-Container abschnappt und ich werde 50 Pixel hinzufügen, genau wie so als nächstes werde ich einfach das Rechteck-Werkzeug packen. Wie Sie sehen können, verwenden wir hauptsächlich die einfachsten Werkzeuge. Und ich werde einen Container erstellen, wie so vielleicht in den Boden bringen. Und ich werde einfach wieder 2025 Pixel hinzufügen. Und wenn wir uns das Original ansehen, können wir sehen, dass es in zwei Abschnitte unterteilt ist. Aber ehrlich wurde es zuerst in drei Abschnitte unterteilt, weil ich hier eine 1/3 2 3. Division erstellen wollte . Also, wie können wir das tun? Der einfachste Weg, dies zu tun, ist, einfach zuerst dieses Rechteck eine Kopie und Einfügen in es so zu kopieren, und lassen Sie mich vielleicht schnell seine Farbe ändern, damit Sie das besser sehen können. Also jetzt bekommen wir verschiedene zwei verschiedene Container zu verschiedenen Rechtecken. Also, wie man zwei Container aus diesem einen Container erstellt, der und einer dieser Container 1/3 von der Summe mit und der andere wird 2/3 von der Summe mit sein. Also zuerst werde ich diesen ersten Container dieses erste Rechteck nicht durch drei teilen. Genau wie so, um eine 1/3 Version aus dem Ganzen diesen ganzen Container zu erstellen. Also jetzt haben wir dieses kleinere Rechteck und dieses größere Rechteck genau hier. Also werde ich diese beiden Typen und von der Pfade Operation greifen, die ich wählen werde wie so teilen. Also haben wir nur dieses Rechteck und dieses Rechteck. Aber wie Sie Raum so gut sehen können, ist das ein Rechteck und wir wollten eine quadratische Ursache sein, wenn wir zum Original gehen, ist dieser Typ ein Quadrat. Da es also ah ist, mit 90 Pixeln, muss die Höhe gleich sein. Einige werden einfach 19 eingeben. Genau so ist Adam mit diesem Kerl in dasselbe geraten. Geben Sie einfach 90 ein und dies ist unser erster unser erster Container. Jetzt ist das letzte, was zu dio, natürlich. Nun, Container weise. Ich weiß es. Ich bin, bin ich Sake. Behälter. Eine Menge ist, eine Linie zu erstellen. Das sagte diese Teilung genau hier. Also werde ich einfach die Direktion zum Rechteck-Werkzeug wieder greifen und ein Rechteck erstellen über unsere drei Spalten erstreckt und es schwer macht. Machen Sie es nur ein Pixel hoch, genau so. Und ich gehe Teoh Bush es um 12 Pixel runter. Ich möchte Pixel nicht in zwei Hälften teilen, und ich weiß, dass wir normalerweise 25 Pixel haben und wir bald 25 Pixel zwischen diesen Containern haben werden. Aber ich möchte, dass diese Linie genau in die Mitte dieser Lücke steht, genau hier. Also, da 25 geteilt durch 2 bis 12,5 und wir können Pixel teilen, so dass wir entweder mit 12 oder 13 gehen können , werde ich mit den 12 gehen. Und genau so wird unser erster Container erstellt. Also bekam er den Bildplatzhalter auf der linken Seite. Nächster Platzhalter auf der rechten Seite. Und diese Linie ist hier unten eine Grenze. Im nächsten Video werden wir anfangen, den Inhalt hinzuzufügen. Wir werden das Bild hinzufügen wir gehen, um den Text hinzuzufügen und dann diesen Block Post Auszug duplizieren . Nun, wir werden es drei oder vier Mal duplizieren, also bleiben Sie dran 74. 21Let's Erstellen der Liste der beliebtesten Blog-Posts: jetzt, bevor wir Kelowna diesen Container und gefüllt mit Inhalt. Lassen Sie uns den Text, den mein Block in Text am beliebtesten ändern. Natürlich können Sie etwas anderes eingeben, wie andere Benutzer lesen oder wie die meisten gelesenen. Nein, die meisten geteilt, meisten wie, was immer Sie wollen. Ich werde nur mit Standard gehen, beliebtesten und ich werde die Größe ändern. Ich werde die Größe dieses Hintergrunds nur ein bisschen größer machen. Also, jetzt gehe ich runter. Ich gehe, ich werde zoomen ein wenig zurück. Also, jetzt können wir einfach dieses Rechteck greifen und es in einen Bildcontainer mit ihnen verwandeln , dass das ist, was dieses System wir bereits kennen. Ich werde nur auf das Bild in genau so basieren. Und jetzt können wir anfangen, Text hinzuzufügen. Also lassen Sie mich einfach schnell leihen vielleicht dieses Datum oder vielleicht von unserem von unserem meisten Gitter. Also werde ich das Datum der explodiert den Post mit dem Titel und dieses Tag kopieren sie und basierte sie über sie hier drüben. Und natürlich, natürlich, bringen Sie sie einfach so. Und vielleicht werde ich dieses Datum nur ein bisschen kleiner Zehe machen, wie 10 Punkte. Hoffentlich ist dies immer noch sichtbar für dich und lege es irgendwo hier hin. Nur einige sind so, jetzt werde ich diesen Kerl kleiner machen. Versuchen wir 18 und lassen Sie uns die Zeilenhöhe ändern, um 22 oder vielleicht sogar 20 zu schlagen. Und lassen Sie uns den ganzen Behälter viel, viel kleiner machen und sehen, wie er hier aussehen wird. Es könnte immer noch ein bisschen zu groß sein. Vielleicht machen wir es etwas kleiner. Und vielleicht lassen Sie uns die Steuer noch kleiner machen. Eigentlich, lassen Sie uns als langsamste 16. Vielleicht können wir jetzt nur ein bisschen verlängern, auch irgendwo hier und jetzt können wir einfach diesen Lebensstil Dezember dieses Tag greifen. Und da das 10 war, gehen wir auch mit 10 hier und machen es nur ein bisschen kleiner. Und lasst uns das richtige Wort eingeben, genau wie so Jetzt kann er einfach all diese Jungs schnappen und verteilen, genau so, dass wir sie jetzt gruppieren können. Und da gehen wir. Wir haben unseren ersten Container erstellt. Wenn Sie einfach wieder hinauszoomen. So sieht es aus, und ich denke, es sieht aus. Ich finde, es sieht ziemlich nett aus. Also, was wir jetzt tun können, ist, dass wir diesen ganzen Behälter Kelowna runter nehmen können, bis er mit unserer Linie schnappt . Das sollte gut sein. Lassen Sie uns jetzt noch einmal hinzufügen. 12 oder sogar ein 13. Also bekam er 25 genau wie so und wieder. Wir können einfach das ändern, äh, dieses Bild hier. Das ist dieser Typ hier. Und natürlich kennen Sie den Bohrer bereits. Du weißt, wie man es macht. Also, das ist einfach schnell. Lassen Sie uns einfach schnell auf dem Foto ändern. Vielleicht machen diese Steine dieses Mal das ganze Bild kleiner. Genau so. Und wieder können wir uns ändern. Wir können den Text einfach so ändern. Und wieder, lass uns einfach Köln ist runter. Fügen wir 12 hinzu. Und wieder, lassen Sie uns die Bildeinfügung im Inneren ändern. Die Auswahl ist diesmal vielleicht verschwunden. Lassen Sie uns das Bild kleiner machen. Wie Sie sehen können, ist es viel zu groß, einfach so. Und wieder können wir uns ändern. Wir können diesen Text hier ändern Kurs. Wir könnten das Tag auch ändern, aber lassen Sie es uns jetzt nicht tun. Und lass uns noch einmal die ganze Routine machen, also werde ich diesen Kerl runterbringen. Ich werde 13 Pixel hinzufügen, weil Sie insgesamt 25 haben wollen, genau so. Und dieses Mal werde ich das von dieser Linie einfach so loswerden, und ich werde mich ändern. Ich werde das ändern. Dieses Bild, etwas anderes. Ich gehe zur Basis Zehe. Vielleicht dieses Weihnachten, dieses Weihnachtsfoto in, genau wie so und wieder. Ändern Sie diesen Text so. Und da gehen wir. Wir haben unsere beliebtesten, beliebtesten Blutvorrats-Feeder erstellt. Das letzte, was zu tun wäre, wäre, den Spot für diese Anzeigen direkt hier zu erstellen. Alles, was wir wirklich tun müssen, ist, dieses Label zu erstellen und dann einfach die Fotos, die Container, Porta Fotos und die Fotos für sich selbst hinzuzufügen die Container, . So sehen sie alle so aus, dass das natürlich ist, wenn Sie wollen, können Sie einige wirklich etwas wie 20% Rabatt auf solche Dinge entwerfen. Aber ich werde nur mit den einfachen Bildern gehen, nur um Ihnen den Prozess zu zeigen. Und ich will nicht, dass du Teoh Zeit damit verbringst, mich anzuschauen und einige flippige, flippige Verkaufsstellplätze auf einigen funky Bereichen zu finden. Verkaufs-Anzeigen, solche Dinge. Lassen Sie uns also anfangen, unser letztes Stück aus der Seitenleiste im nächsten Video zu erstellen. 75. 22Let's erstellen: Lassen Sie uns also wieder mit der Erstellung im Bereich Anzeigen beginnen, indem Sie einfach das Label ausleihen. Also werde ich es runterbringen und ich werde 50 Pixel hinzufügen. Und anstelle der beliebtesten, Ich werde in eingeben, wir werden in Anzeigen Kopf eingeben. Natürlich müssen wir diesen Kerl kleiner machen, und wir müssen den Kerl viel, viel größere Ursache machen . Wie Sie sehen können, ist es zu klein. Also fangen wir einfach an, hinzuzufügen, Und übrigens, Sie könnten sie verschieben halten, um Werte in 10 Pixel-Schritten hinzuzufügen hier im Transformationsfenster . Also halte ich die Schicht gedrückt und du kannst sehen, dass ich den Wert durch Spannung ändere. Okay, jetzt müssen wir nur einfache, einfache Quadrate erstellen, die unsere Bilder beherbergen. Also wieder, ich werde das Rechteck-Werkzeug greifen Shift halten, um dieses Quadrat zu erstellen, genau wie so. Und natürlich werde ich es so um 25 Pixel nach unten verschieben, und ich werde es nach unten bringen, und ich werde Kontrolle J drücken, um es noch einmal zu klonen. Aber natürlich müssen diese Jungs auch um 25 Pixel runtergehen. So ein und zwei Mal in nur einer Sekunde. Und jetzt können wir diese Container in Image-Container verwandeln. Also wieder, Einfügen entscheidet Auswahl, packte das Bild, legte es hinein, mach es kleiner, so dass wir etwas nur ein bisschen kleiner sehen können. Genau wie so wieder mit diesem Kerl basiert, Vielleicht, vielleicht vielleicht dieses Bild drinnen, so. Und der letzte basierte etwas drinnen. Vielleicht ist dieses Sandwich einfach so. Also gehen wir hin. Wir haben die Sidebar Said erstellt wurden. Natürlich nicht. Nur eine Sidebar, denn wir haben es schon. Dann, ähm, dieser Header, wir haben den Schieberegler, und dann kamen wir zum Hauptblock Post hier, und wir haben die Seitenleiste. Wir haben diese gut gekennzeichnet, dass Blut rühmt sich auch, und wir haben die Anzeigen. Und das Einzige, was wir hier unten vermissen, ist die Fußzeile. Und wir werden auch anfangen, die Fußzeile im nächsten Video zu erstellen 76. 23Let's tart Erstellen des Footer: Ich werde dafür sorgen, dass ich für diese Kunst an Bord ausgewählt habe, und ich werde mir die Kunst an Bord ansehen. Trotzdem, dass ich mein Kunstbrett auf irgendwo hier ausdehnen werde, also werde ich dasselbe mit den Grützen machen. Ich werde seine Sichtbarkeit wieder einschalten und ich gehe, Teoh, Teoh, entriegeln. Und dann werde ich es einfach so erweitern. Wenn wir also einen Blick auf das Original werfen, können wir sehen, dass das Essen er in zwei Teile geteilt ist. Zuerst haben wir diese Spalten mit Links bekommen, aber jetzt haben wir auch den Hutmacher, der hier unten in der Fußzeile wiederholt wird. Ich meine, es ist das Konzept für die Kopfzeile wird hier unten in der Fußzeile wiederholt. Was wir also tun können, ist, dass wir einfach den Header greifen können. Ich meine, alle seine Elemente, genau wie so und stellen Sie sicher, dass wir die richtige Ebene erstellt haben einige einfach schnell eine Fußzeile später erstellen. Und ich werde es einfach so runterziehen. Und sobald ich Ah eingeschlagen habe, können diese kopierten Elemente in dir sehen, dass sie genau an ihrem vorherigen Platz basieren . Aber was wir tun können, ist, dass wir dieses Original 0.20 einfach so einstellen können, und wir können Stipe in so etwas wie 2600 lassen und schnell abschwächen drucken. Wie Sie sehen können, ist es hier unten. Also lassen Sie uns vielleicht wie, 2000 Pixel hinzufügen , und es wird hier unten genau so gehen. Und natürlich muss dieser Kerl kleiner sein, also lass es uns schnell kleiner machen. Also werde ich diesen Fonds von ändern 42 Ich werde den ursprünglichen Punkt aufgrund dieser mittleren linken Punkt von 42 setzen . Lassen Sie uns sehen, 20 in der Lage sein, kleine 26 sollte in Ordnung sein. Und jetzt, da dieser Typ auf 2026 eingestellt ist, lassen Sie mich einfach schnell das Gitter sperren und vielleicht sogar schalten wir es seine Sichtbarkeit aus. Jetzt, wo wir diesen Kerl erschaffen haben, müssen wir diese Jungs auch kleiner machen, also werde ich sie mit diesem Wahlzehen packen, und ich werde sie kleiner machen, also werde ich das Seitenverhältnis sperren und bringen sie, bringen ihre Höhe nach unten oder sagen wir 2 12 Pixel. Vielleicht sollte das in Ordnung sein. Und da gehen wir hin. Dies, dass dies unser wäre, dass dies unser Brunnen sein würde, hätte sie in der Fußzeile wiederholt . Wir wollen diesen Kerl vielleicht sogar nur kleiner machen, genau so. Und stellen wir sicher, dass alles so gut an der Mitte ausgerichtet ist. Und lassen Sie mich einfach schnell wieder hinauszoomen, die Sichtbarkeit aus den Panels ausgeschaltet, und dies wäre das erste Element aus unserer Fußzeile. Das nächste Element wäre dies. Gehen Sie einfach zurück zum Original, dieser große Teil aus der Fußzeile mit diesen Spalten und Links und nebenbei bemerkt, dass diese Thes Hintergründe die Farbe der Farben dieser Hintergründe unterschiedlich sind. Dieser ist dunkler, und dieser ist heller, und eigentlich ist dies nur ein Ausweg, wie kombinierte Fußzeilen zu schaffen. Nennen wir sie so. Natürlich könnte dieser Kerl dunkler sein und dieser Kerl könnte leichter sein, wenn du willst, oder beide von diesen Typen könnten die gleiche Farbe haben, und sie könnten einfach mit einer Linie geteilt werden. Zum Beispiel, wenn das Ihre Design-Wahl wäre. Es gibt also verschiedene Möglichkeiten zum Erstellen, wie z. B. kombinierte Fußzeilen. Eso Werfen wir einen Blick auf, ähm auf beide. Nun, eigentlich, drei Designer Szenarien, wie wir eine wie eine kombinierte eine spätere Fußzeile erstellen können, geschichtete, geschichtete Fußzeile. Aber fangen wir eigentlich an, das im nächsten Video zu tun. 77. 24Let's Entdecke verschiedene Anfängen von verschiedenen Footer: Eine Möglichkeit, ein kombiniertes Essen zu kreieren, wäre, diesen Jungs die gleiche Farbe zu geben als das . Je größer der erste Teil im zweiten Teil. Dasselbe eine Hintergrundfarbe. Also lassen Sie es uns jetzt schnell machen, damit wir das gleiche Brunnen-Rechteck mit dem gleichen Hintergrund erstellen können. Genau wie so. Allerdings könnten wir diese Jungs mit einigen mit einigen Zeilen göttlichen, also können wir einfach dieses Rechteck ausleihen und es viel, viel, viel, viel, viel kleiner machen und es so ein Rot sagen lassen. Aber lass es uns nicht so dick machen. Lassen Sie es uns einfach halten. Gehen wir zu vielleicht zwei Pixeln. Aber natürlich wollten wir sein Du wolltest gut auf dem ganzen Kunstbrett verbracht werden. Also lassen Sie uns das Sperr-Seitenverhältnis deaktivieren. Und jetzt ist es einfach nur ah, tippen Sie in zwei. Also lass mich jetzt einfach schnell diese Typen ausleihen. Nur damit du sehen wirst, wovon ich rede, werden wir sie in einer Sekunde erschaffen. Also, wenn wir jetzt nur diese Typen in so etwas aufbauen, damit Sie sehen können, dass wir jetzt diese Typen haben, werden diese Kerle vor den gleichen Hintergrund stellen. Aber diese Teile wurden mit dieser Zeile gut getrennt. Also, dieser hier weg von der Schaffung dieser Art von Fußzeile, wir könnten auch einfach, ähm, diesen Hintergrund zu greifen ähm, und ihn dunkler zu machen. Gehen wir mit vielleicht nicht mit Schwarz, aber etwas wirklich, wirklich Dunkles. So etwas. Und lasst uns das von Kurs loswerden. Wenn du willst, kannst du es so lassen, aber ich werde es loswerden. Das ist also unser originelles Design. Und natürlich, wenn du willst, kannst du diesen Kerl vielleicht dazu bringen, diesem Anrufer diese hellere, tolle Farbe zu geben , und wir können ihn vielleicht dunkler machen, genau so. So ist es wirklich, wirklich bis zu Ihrer Design-Wahl mit dem, was ah, für welches Farbschema Sie gehen oder wenn Sie sich entschieden haben, einfach mit einer Farbe zu gehen. Aber diese Elemente mit einem mit einer einfachen Zeile zu teilen funktioniert in beiden Richtungen. Ich wollte dir nur verschiedene Ideen zeigen, wie du diese Art aus kreieren kannst. Wir entwerfen eine Website, ein Website-Element. Also im nächsten Video werden wir diese Elemente beenden. Keine Sorge, ich werde nicht gehen. Ich werde es nicht so lassen. Wir werden einen Blick darauf werfen, wie man diese Jungs erstellt, und so beginnt es tatsächlich, sie im nächsten Video zu erstellen. 78. 25let-s fertiggestellte das Projekt und erkunden das nächste: Also werde ich mit dem Zurückbringen des Rasters beginnen, genau wie so und ich werde 11 Label ausleihen. Also werde ich mir das vielleicht mein Blutschild einfach so schnappen. Und natürlich werde ich sicherstellen, dass ich auf dem richtigen Spieler bin. Dies für die Schicht viel hier, dass ich es einfügen werde, gegossen gegen mein Gitter. Ich werde 50 hinzufügen, um die Lücke zu schaffen, genau wie so Jetzt kann ich wieder hinauszoomen, und jetzt können wir einige Nun, einige Links, einige Steuern erstellen einige Links, . Also werde ich das nächste Frame-Werkzeug greifen, und ich werde schnell einen Textfreund erstellen, der sich über nur diese drei Spalten verteilen wird, und ich werde Füllungstext einfügen und ich werde seine Farbe ändern Zwei einfache weiße. Und natürlich machen wir es größer 16 22 für die Zeilenhöhe. Und wenn Sie wollen, können Sie es einfach so lassen oder wir könnten einfach nur ein bisschen kleiner machen und bemerken , dass, wenn wir einfach zurück zum Original gehen, diese Zeilen sind viel, viel gut, warum sie als nur drei Säulen. In der Tat verteilen sie sich über vier Spalten, aber die Steuer übersteigt diese vier Spalten nie. In der Tat wollte ich diesen Typen einen kleinen Teich kurz halten, weil, wissen Sie, da hier oben Links steht, als ich wollte, dass es wie Links aussieht. Aber so muss es nicht sein. Ich meine, meine, auf der linken Seite, können Sie eine Spalte mit etwas mehr Text haben, was, sagen wir, wie, ich weiß nicht, vielleicht einige mawr wichtige Informationen, die sie mit den Benutzern teilen möchte. Es muss also keine Links zu sein, nur um dieses Design willen, ich habe gerade beschlossen, es zu machen, um es Links zu machen. Aber wieder, wir können einfach nur, um es ein paar einfachen Text zu machen, genau wie so. jedoch Was ichjedochauf jeden Fall tun möchte, ist, dass ich diese Linie auf vier Spalten verteilen , also muss sie ganz nach rechts gehen. Na ja, genau hier. Also lassen Sie mich es einfach schnell erweitern. Ich werde auf Shift halten und den Pfeil nach oben gedrückt, so dass es zu diesem vierten Anruf sendet . Jetzt werde ich den Text ändern. Mal sehen, Lassen Sie uns vielleicht etwas eingeben wie, na ja, mehr Text, genau so. Und lassen Sie uns diesen Hintergrund erweitern , vielleicht nicht so viel. , Das sollte gut sein und nicht, was wir einfach dio konnten, ist, wir könnten einfach dieses Etikett, diesen Text und diesen Text packen und es einfach so nach rechts köllen und dannControl J drücken, um es zu klonen dieses Etikett, und es einfach so nach rechts köllen und dann Klonen Sie es noch einmal. Ich werde das Netz loswerden. Ich werde seine Sichtbarkeit ausschalten. Und jetzt, natürlich, können wir einfach, wie, wie, ändern Sie diesen mehr Text in Links und, natürlich, ändern Sie die Größe ein bisschen so. Und wie Sie sehen können, müssen wir es wieder tun. Es ist nur die Größe dieser Bar, also werde ich sie größer machen. Und natürlich könnten wir einfach diesen untersten Text loswerden, über vielleicht lassen Sie uns einfach diesen Kerl erweitern , schneiden Sie ihn, loswerden dieses grundlegende hinten vorne und vielleicht einfach kleiner machen. Es sieht also tatsächlich wie eine Art von Links aus, genau so. Und lasst es uns hier als mehr Text belassen. Ich bin mir ziemlich sicher, dass Sie bereits wissen, für welche Art von Effekt wir hier tatsächlich gehen . Da diese Lücke 50 Pixel beträgt, wollen wir auch, dass diese Lücke 50 Pixel beträgt, oder? Wir wollen ein kohärentes, konsistentes Design haben . Also werde ich das machen und diesen Hintergrund verkleinern, einfach so. Vielleicht nur noch mehr. Und jetzt werde ich, von seinem Stopp ad 50 Pixel bis zu seiner Höhe, einfach so. Und jetzt gratuliert wir all diese Elemente und bewegten sie so hoch. Und jetzt können wir diese ganze Fußzeile auswählen, diese ganze vier Ebene schichten, sie auf den älteren Text verschieben und jetzt wieder um 50 nach unten verschieben. Und natürlich wäre das Letzte, was zu tun ist, nur den Artikel zwei zu packen und ihn so deutlich kleiner zu machen . Und da gehen wir hin. Wir haben das hier nicht. Nun, diese Waffenwebseite, die diese vordere Webseite erstellt hat. So können Sie eine Titelseite für ein modernes Blawg erstellen. Also begannen wir mit der Erstellung eines Logos und einer Navigation mit einigen Social-Media-Symbolen. Wir haben den Header erstellt, dann haben wir das, während der Held Abschnitt mit dem Karussell Schieberegler, die Bild-Container, Navigation und die Blutpost-Titel erstellt die Bild-Container, . Und darunter haben wir dem Brunnen das Hauptmerkmal hinzugefügt, um zu blockieren verfügt eso mit dem Bild und dem Textcontainer darunter. Und dann haben wir am Block Post Raster hinzugefügt und auf der rechten Seite, haben wir hinzugefügt, Ah, eine ziemlich komplizierte Seite, wo ich denke, mit Suchfeld über mich Abschnitt Text Abschnitt, beliebtesten Blut rühmt und auf der Werbung Abschnitt. Und natürlich haben wir es mit der Fußzeile beendet, einem Abschnitt, der sich in zwei Teile teilen würde. Jetzt, in den nächsten Videos, werden wir den einzelnen Beitrag innerhalb der Affinity-Designer Single Post Seite erstellen, weil wir dem Benutzer und dem Entwickler zeigen wollen, wie wir denken, dass die Website aussehen sollte wenn ein -Benutzer einen Block Post lesen möchte. Also gehen wir zu einem Image-Container. Wir werden eine Menge Text hinzufügen. Wir werden eine einfache Navigation hinzufügen, so dass der Benutzer zum nächsten und vorherigen Beitrag gehen kann, und dann werden wir den Abschnitt Commons hinzufügen. Aber wir werden auch viele der anderen von den Elementen wiederverwenden, die wir bereits erstellt haben, wie die Kopfzeile, Die Fußzeile und die Seitenleiste. Also, wenn das etwas ist, an dem Sie interessiert sind, schauen Sie einfach weiter. 79. 26Let's erkunden das einzelne Post: in den nächsten Videos werden wir eine einzelne Beitrag-Seite für unser Blockdesign erstellen und dass wir einige Dinge anders machen werden . Wir werden einige verschiedene Elemente hinzufügen, und wir werden auch einige Elemente belassen, die bereits entworfen sind und bereits Teile unseres Designs sind. Also etwas ist normalerweise in einer einzigen Blockpost Änderung, aber ein einzelner Block Post ändert sich. Und manche Dinge bleiben gleich. Zum Beispiel, der Header wie dieser, der Seitenkrieg, denn das war meine Design-Wahl. So entschieden die Website unserer Staaten das gleiche und das Essen er bleibt gleich. Aber all die anderen Dinge sind anders, beginnend mit dem Heldenbereich. Wie Sie sehen können, haben wir nicht den Schieberegler hier. Ich habe beschlossen, das vorgestellte Bild hier anstelle des Schiebereglers zu platzieren. Und dann, natürlich, haben wir eine Nummer. Nun, der ganze Block Pfosten auf der linken Seite. So ist unser Hauptdesign wieder in zwei Säulen unterteilt. Also dieser Block rühmt sich über neun Spalten erstreckt. Und natürlich erstreckt sich die Sidebar über drei Spalten. Und genau hier haben wir zu den Daten den Block Post Titel bekommen, einige Links den Text. Und dann zeigen wir, Ah, dem Entwickler oder dem Benutzer, wie das Bild aussehen wird. Und dann haben wir gezeigt, wie ein Block Zitat das Stück Text aussehen wird, als hätten wir natürlich bekommen. Hier finden Sie Links, ein paar Tags, soziale Medien. Ich komme hier runter und dann haben wir zu einer einfachen Navigation für vorherigen Post und die nächste rühmen, zusammen mit einem Bild und einem Block Post Titel. Dann haben wir einige Karten für verwandte Block, beide so können diese blockiert werden rühmt, die in der gleichen Kategorie vorwärts, die die gleichen Tags und Dinge wie das haben . Und dann haben wir den Kommentarbereich hier unten mit diesem gut Dummy Commons Dummy-Avatare und einige Post wird kommentieren Boxen wie der Kommentarname, E-Mail Post Common Button hier unten, Jedoch mit dem gemeinsamen Abschnitt Gold, es gibt eine Sache, die Sie begraben müssen, denn wenn Sie eine Blawg erstellen, sind die Chancen, dass der Entwickler ziemlich oft wird einige bereit aus den Plug Ins für den gemeinsamen Abschnitt zu verwenden . Zum Beispiel diskutieren oder Facebook-Kommentare Plugging, und diese beiden sind die häufigsten Plugins verwendet, um einen Block zu erstellen, rühmen Commons unter den Block Posts auf diesem Abschnitt ist. Aber in diesem Video wollte ich Ihnen nur zeigen, wie Sie vollständig, völlig benutzerdefinierte, völlig benutzerdefinierte, das Aussehen eines Kommentarabschnitts innerhalb eines gebloggten Beitrags erstellen können. Also lassen Sie uns tatsächlich mit der Schaffung unseres Helden Bild beginnen. Und dann werden wir ein paar visuelle Jungs erstellen, die uns helfen werden, all diese Stücke zu schaffen . Nun, Textstücke, Bildtitel, all die Dinge, die dort innerhalb eines Block-Post benötigt werden. Ah, Einzel-Block-Pfosten-Container. 80. 27Let's erstellen: Wie Sie sehen können, habe ich hier nicht. Ich habe kein Bild. Und der Schieberegler? Ich habe hier keinen Block Prahlerei. Ich habe nur die Sidebar, den Header. Und natürlich die Fußzeile. Lass mich schnell den Fuß runtergehen oder hier runter. Also beginnen wir mit dem Hinzufügen dieses Featured Bild statt unserem von unserem Schieberegler. Jetzt habe ich schon ein Rechteck hier unten. Das ist dieser Typ hier. Und ich habe es einfach schnell erstellt, weil ich denke, dass Sie den Bohrer bereits kennen. Weißt du, was in nur einer Sekunde passieren wird? Ähm, das ist dieser Typ hier. Ich hatte es gerade wirklich, wirklich schnell erstellt, um es zum Container für unser vorgestelltes Bild zu machen. Also wieder, ich werde sicherstellen, dass diese Einfügeoption innerhalb der Auswahl aktiviert ist und ich werde zu dem Ort navigieren, an dem ich meine Bilder behalte. Lassen Sie mich sehen. Ich denke, es war die große schlechte Erfindung, dieser Typ hier und ich werde es einfach so einfügen. Und natürlich, machen Sie es deutlich größer. Verschieben Sie es irgendwo hierher. Ich denke, dass dies in Ordnung sein sollte, wie Sie hier sehen können Es gibt eine gut 50 Pixel Lücke zwischen meinem Bild und diesem Suchfeld hier. Um also einen Blockpostcontainer zu erstellen, denke ich, dass es gut wäre, einige visuelle Anleitungen für uns zu haben. Also ich denke, dass wir damit beginnen könnten, den Haupthintergrund zu erstellen, diesen Hintergrund, diesen Kerl hier für unseren Block Post. Also zuerst gehe ich Teoh, ich denke, wir können diese Schicht einfach sehen. Wir werden nicht mehr daran arbeiten. Also lasst uns eine neue Ebene erstellen und nennen wir es Ah, Single Post, genau so. Und ich werde und es könnte über der Sidebar sein, genau so. Also, was ich jetzt tun werde, ist, dass ich ein Rechteck erstellen werde, das sich über all diese neun Spalten erstreckt , genau so. Jetzt, da ich diesen Container erstellt habe, kann ich ihn einfach nicht nur ein bisschen heraufbringen. So ist es, Herzogin, unser Bild. Und wir können ihm vielleicht schnell eine andere Farbe geben, damit wir nur ein bisschen besser sehen können . Jetzt können wir einfach 50 zum Y-Achsenwert hinzufügen, um ihn genau so herunterzubringen. So passt es jetzt zu unserem Brunnen, die Höhe von unserer Sidebar. Aber natürlich muss es weiß sein, genau so. Und jetzt können wir es einfach hinunterbeten, bis irgendwo hier. Nicht zu weit. Ich denke, das sollte Kampf sein. Vielleicht nur noch ein bisschen mehr, einfach so. Also jetzt möchten wir einfach wissen, wie Bäcker, dieses innere Klopfen dieses innere Ende und sollte sein und wie viel Platz wir haben, um mit zu arbeiten. Ich meine, wir wollen wissen, wie breit der Text zu diesem Text dieser Block Post Titel sein muss. Wie warum hat dieser Text und in der Unterseite sein muss So sieht alles schön aus und es ist für von unserer Idee off bei 50 oder 25 Pixel, Lücken innerhalb unseres Designs. Also, wie können wir das tun? Nun, das erste Wochenende schnappen Sie sich einfach unser Rechteck. Dieser Typ hier, kopiere es. Und ich denke, wir können es jetzt sperren, damit wir es nicht versehentlich vermasselt haben. Also lassen Sie es uns einfach schnell verriegeln. Und jetzt können wir es einfach wieder einbauen. Also, jetzt haben wir zwei von ihnen und lassen Sie uns einfach schnell seine Farbe ändern. Also lassen Sie uns jetzt den Transformation Ursprung Punkt in die Mitte und lassen Sie uns schnell 100 von der ausgepeitschten aus unserem Rechteck subtrahieren, genau wie so Und jetzt ist es dasselbe für die Höhe tun. Jetzt subtrahiere ich 100, weil 50 plus 50 100 ist. Und da wir eine 50 große Seele Lücke oben 50 Pixel Lücke auf der Unterseite und 50 Pixel Lücke auf der linken und rechten haben wollen , Wenn ich 50 plus 50 auf beiden Seiten hinzufüge, bekomme ich 100. Also jetzt kann ich diesen Leitfaden einfach als meine Referenz verwenden So könnten wir vielleicht seine Deckkraft herunterlassen, um 25% zu sagen und vielleicht sperren und dann einfach gegen den Brunnen diesen Hintergrund arbeiten. Aber ich möchte, dass ich sehen möchte, wie mein Wille den Inhalt für den Block Post besteuern wird vor diesem weiten Hintergrund aussehen wird. Ich will wissen, was ich hier mache. Wir wissen nicht, was ich entwerfe, also werde ich schnell ein paar Guides herausbringen. Also werde ich gehen, um die Lineale zu zeigen, und ich werde schnell einen Führer, eine horizontale Führung und eine vertikale Führung zu schnappen . Das wird genau hier sein. Lassen Sie mich einfach schnell sehen, ob ich ja, jetzt ist es nein, Es sitzt dort, wo es sitzen muss. Ich werde nur verstecken die Regeln durch die gegenwärtige Kontrolle sind. Und jetzt kann ich diesen Container wirklich loswerden, den ich nicht brauche, um dieses Rechteck Also jetzt habe ich jetzt weiß ich, wie breit meine Steuercontainer sein können und wir können im ersten Textcontainer im nächsten Video anfangen . 81. 28Let's Füge den Blog-Titel hinzu: Also in diesem Video werden wir beginnen, den Text hinzuzufügen und wir werden mit dem Block Post mit dem Titel beginnen . Wenn wir also schnell einen Blick auf diesen Kerl werfen, können wir sehen, dass wir das Datum der Blockpost bekommen haben. Nun, Titel. Und wir haben den Namen des Autors und die Anzahl der Kommentare, die sind, die einfache Links sind. Also jetzt werde ich sicherstellen, dass ich auf der richtigen Ebene die einzelne Post-Schicht genau hier bin. Ich werde das künstlerische Textwerkzeug greifen, klicken und ziehen und sicheren Typ in das Datum eingeben. Sagen Sie dies, dass vielleicht 15 Juli 2017. Genau wie so. Und ich werde natürlich seine Farbe und seine Größe ändern, um vielleicht 14 zu sparen . Und ich möchte nicht, dass es in Großbuchstaben geschrieben wird, einfach so ändern Sie die Farbe so. Lassen Sie mich kurz mit dem Original konsultieren. Ich glaube, ich glaube, es ist für heute Abend, Alec. Ja, das ist es, ich talic. Also werde ich es von normal zu kursiv ändern. Warum nicht? Und lasst uns einfach im Juli so tippen und jetzt kann ich diesen Kerl einfach verschieben Move this will text container to. Natürlich muss es auf der rechten Ebene sein und ich kann es jetzt hier an die obere linke Stelle verschieben, um es mit diesen Guides genau hier zu vergleichen. So können wir jetzt den Block Post Titel erstellen. Also werde ich dieses Mal den Textrahmen toe gramp und ich werde erstellen, ich werde das Textfeld erstellen . Vielleicht wäre das einfacher. Lassen Sie mich einfach wieder hinauszoomen und ich werde es über alle Spalten verteilen, genau so. Und jetzt können wir es einfach ausdrucken. Trotzdem berührt es die 15 aus dem Juli 2017 und jetzt können wir es herunterbringen. Und im Original, ich denke, es ist ich denke, es ist 25, aber lassen Sie uns einfach schnell überprüfen Lassen Sie uns die Entfernung überprüfen. Also mit dem Rechteck-Werkzeug, Ich gehe zu Ja, es wird 25. Also, jetzt können wir uns das einfach schnappen, äh, diese Platte wird mit einem Textrahmen versehen, und wir können es einfach von oben runterwerfen. Lass es um 25 fallen, einfach so. Und natürlich wird es roboto fett verdichtet sein. Aber die Front wird viel größer sein. Wir werden in nur einer Sekunde sehen, wie groß es sein soll. Wenn wir nur einen Fülltext einfügen, ihn links ausrichten, größer machen, sagen wir mal 46 sehen, lassen Sie uns die Zeile viel größer verstecken. Lassen Sie uns überprüfen 46 und lassen Sie uns diesen Rahmen nur ein bisschen kleiner machen, also sehen, wie es aussieht. Lassen Sie mich es einfach so nach rechts bewegen und lassen Sie uns die Jungs schnell verstecken. Aber Präsident kontrollierte Semi-Säule und lassen Sie uns vielleicht schnell das Gitter als gut verstecken, damit er alles klarer sehen kann. Ich finde, es sieht schön aus, ich denke, lasst es uns wieder so lassen. Wenn Sie den Text ändern möchten, um die Zeilenhöhe oder vielleicht auch die Fondsfamilie auszublenden, können Sie das natürlich tun. Aber ich möchte Ihnen nur die Techniken und die Denkweise zeigen, wenn ich diese Art von Design kreiere . Also im Moment, was wir tun können, ist, dass wir einfach dieses Stück Text vom 15. Juli nehmen können, es hier ablegen und den Text ändern, um zu kaufen und dann den Namen des Autors einzugeben. Und jetzt können wir diesen Kerl einfach nach rechts bringen und dann vielleicht um 25 Pixel verschieben, genau so. Und lasst uns diesen Text in die Zahl von Kommentaren ändern. Ich werde das durch Wort loswerden, aber ich werde eintippen und die Anzahl der Kommentare genau so. Also, jetzt können wir diese Jungs einfach um 25 Pixel runterbringen, genau so. Und natürlich, wenn du willst, kannst du diesen Kerl vielleicht ein bisschen näher an 15 Pixeln herumziehen. Das liegt wirklich an dir. Werfen wir einen Blick auf das Original. So kam er zum Namen des Autors, der Anzahl der Kommentare, dem Datum und dem Block Post Titel. Natürlich, wenn Sie wollen, können Sie diese Lücken vielleicht auch etwas kleiner machen, auch etwas kleiner machen, wie 12 Pixel oder 15 Pixel. Ich überlasse es dir. Ich möchte das Design inkonsistent halten, also was auch immer , ich habe 50 Pixel, und wenn ich es wie deutlich kleiner machen möchte, eine andere Lücke, gehe ich einfach mit dem halben Wert, , ich habe 50 Pixel, und wenn ich es wie deutlich kleiner machen möchte, eine andere Lücke,gehe ich einfach mit dem halben Wert, der ist 25 wie Nun, wie hier, Wie in diesem Fall, Weil ich Ihnen sagen muss, dass ich ein bisschen wie eine Symmetrie und gleiche Zahlen Buff bin. Das Z ist nur das war nur meine Jeans, weißt du, natürlich. Ah, wir Designer. Sie können ein wenig verrückt gehen, wenn Sie wollen, und wir nehmen ein tun Dinge ein bisschen anders. Also werde ich meine Guides so zurückbringen, damit wir sehen können, dass alles schön berührt . Und wenn Sie möchten, können Sie die Steuer ändern, um zu sehen, wie es wird, um den Rahmen zu füllen. Wenn Sie mit diesem Kurs verschiedene, verschiedene Wörter spielen möchten , werden wir diesen Rahmen ein bisschen anders füllen. Also das nächste Stück, das wir hier erstellen werden, ist Nun, eigentlich sind all diese Absätze, einschließlich dieses Blockzitats und natürlich werden wir dem Bild und diesen Tags hier unten hinzufügen. Aber lassen Sie uns das eigentlich im nächsten Video tun 82. 29Lets Füge die Absätze und Bilder hinzu: Also, jetzt, da wir zu dem Titel gekommen sind, lassen Sie uns den Haupttext für unsere Blogge erstellen, und ich werde schnell dieses Stück Text ausleihen. Dieser Titel hier, weil es ein Rahmen-Textil ist, wird für uns nur schneller sein, um einige Dinge darüber zu ändern. Anstatt einen neuen Textrahmen zu erstellen, werde ich ihn hier etwas größer machen. Und, natürlich, ändern wir den Fonds von Roberto kommen Zahnarzt zu Roboto. Ah, regelmäßig, einfach so und ändern wir die Schriftgröße 16 und die Zeile verstecken sich von 46 auf etwas weniger beeindruckendes. Versuchen wir es, 26, vielleicht nicht sechs Monate, 26. Genau wie so. Natürlich können Sie mit dem mit der Führung mit der Zeilenhöhe spielen, wenn Sie wollen. In der Tat, in vielen modernen Blöcken, können Sie sehen, dass die Linie Verstecken tatsächlich ziemlich groß ist. Ziemlich umfangreich, muss ich sagen. Ich denke, es macht es vielleicht ein bisschen einfacher zu lesen, vor allem in einem kleineren Gerät, Also, wenn Sie mit etwas Größerem gehen wollen, können Sie das tun. Sie können auch vielleicht machen. Natürlich hängt es von der Front ab, aber Fonds wie Roboto oder offene Sand sind speziell, speziell entwickelt, um auf kleineren Bildschirmen angezeigt werden oder, Sie wissen, gut sichtbar auf den Bildschirmen in wenn sie angezeigt werden, die digital, so dass Sie es vielleicht noch kleiner machen können, wenn Sie wollen, und immer noch mit dem mit der größeren Zeilenhöhe spielen, um es noch mehr aussehen zu lassen. Oder sagen wir, sichtbar, wenn das ist, was Sie wollen. Aber ich werde bei den regulären 16 bleiben und ich werde mit einer kleineren Zeilenhöhe gehen, vielleicht 28. Lass es uns so lassen. Also jetzt lassen Sie es wieder nach unten um 50 große Quelle, Genau wie so und bemerkte, dass etwas Interessantes passiert mit den Absätzen in meinem Textrahmen. Ich meine, wenn Sie möchten, können Sie einfach den Rahmen kleiner machen und ihn dann herunterbringen, um einen anderen Absatz zu erstellen , und dann müssten Sie die Standard-50 Pixel hinzufügen, wenn Sie 50 Pixel machen wollten. Aber es gibt eine einfachere Möglichkeit, Absätze innerhalb von Textrahmen zu erstellen, also lasst uns diesen Kerl einfach runter bringen. Vielleicht, so Und jetzt gehen wir nicht zum Zeichenfeld, sondern zum Absatzfeld direkt hier und hier erhalten Sie verschiedene Abstandsoptionen, damit Sie an der ersten Zeile enden können . Sie können und werden diesen Raum in der Tat vor dem Absatz behandeln. Aber was wir wollen, ist, dass wir nach diesem Absatz ein Leerzeichen schaffen wollen. Also, wenn ich einfach mit Null hier gehe, können Sie sehen, dass die Absätze Nun, eigentlich gibt es keine Unterscheidung zwischen Absätzen. Aber wenn ich mit etwas Verrücktes wie 100 gehe, kann man sehen, dass die Lücke extrem, extrem groß wird . Und natürlich wird es anders aussehen, wenn es nur den Füllungstext geändert hat. Sie können sehen, dass die Absätze immer noch diesen 100 Pixel Abstand nach Absatz beibehalten, oder? Aber natürlich wollen wir nicht, dass es so groß ist. Lasst uns mit 25 gehen, genau wie so und wieder. Wir können vielleicht einige der Füllungstexte ändern, um einen völlig anderen Look zu schaffen , und wir könnten damit den ganzen Nachmittag spielen, um es anders aussehen zu lassen. Denken Sie, dass ich nicht zu viel Zeit damit verbringen werde. Ich wollte Ihnen nur zeigen, wie Sie die Absatzoptionen verwenden, um diese Art von Ah zu erstellen, diese Art von Effekt. Also, jetzt schätze ich, das können wir. Also können wir das Bild hinzufügen, dieser Typ hier. Also vielleicht lassen Sie mich schnell Brendas Kerl nur ein bisschen bis zu irgendwo hier und ich werde das Rechteck zu greifen, und ich werde ein Rechteck erstellen, das so etwas sein wird. In der Tat erschaffe ich ein perfektes, perfektes Quadrat. Natürlich kann es ein direkter Winkel wie dieser sein, dass es einfach Ihre Design-Wahl ist. Ich wollte nur mit einem Quadrat gehen, um es aussehen zu lassen, um es ein bisschen anders aussehen zu lassen, da es sicher für die Fotografie ist. Blut, lasst es uns holen. Aber lasst uns ein bisschen kreativ werden. Also gehen wir mit vielleicht 200 mal 200 und lassen Sie uns diesen Kerl um 25 Pixel runter bewegen, genau so. Also nicht, was wir tun können, ist, dass wir einfach einen Absatztext auf der rechten Seite von unserem Bild erstellen können, so dass wir einfach diesen Textrahmen ausleihen , ihn nach unten bringen und ihn dann nach rechts verschieben können. Und jetzt möchte ich genau die gleiche Lücke haben wie die Lücke zwischen den Absätzen. Also will ich es. Ich möchte 25 Pixel haben, richtig? Was ich also tun werde, ist, dass ich diesen Textrahmen einfach kleiner machen werde. Also werde ich sicherstellen, dass mein Transformationsursprungpunkt nach rechts gesetzt ist. Und ich werde 25 von diesen Textrahmen subtrahieren mit Genau wie so wieder, ich kann diesen Kerl runterbringen, bis er meinem Bild entspricht, genau wie so wieder machen es nur ein bisschen größer. Vielleicht Brot ein bisschen nach oben und wieder 25 hinzufügen wie so. So, jetzt können wir vielleicht lassen Sie uns einfach schnell den Text ändern, den Füllstoff Text. Also müssen wir es kriegen. Weißt du, wir lassen es so aussehen, als wäre es wirklich was, Tex. Wenn es auch nur ein einfacher Lauren Epsom ist, genau so und vielleicht ist das nur ein bisschen zu viel. So können wir jetzt einfach das Rechteck greifen und wieder ein Bild einfügen. Vielleicht machen wir dieses Töpferbild dieses Mal es kleiner, genau so, und da gehen wir. Wir haben das Bild Nun, wir haben in das Bild in unserem Block eingefügt. Prahlen Sie sich. Natürlich, wenn Sie wieder wollen, können Sie das Bild vergrößern. Sie können es über die ganze gut ausgeben, unser Wille Text an den Container. Eso Es ist eigentlich vielleicht so schnell zu machen, also werde ich es wieder runterbringen, genau wie so. Füge 25 einfach so hinzu und ich gehe. Teoh, schnappen Sie sich dieses Töpferbild und gelöscht. Ich werde das Rechteck nicht über unseren Weltcontainer erstrecken. Und vielleicht machen wir es ein bisschen größer auf so etwas wie 400. Nun, das ist vielleicht nur ein bisschen zu viel. Lass es uns 300 machen und lass es uns so lassen. Also wieder, lassen Sie uns ein Bild einfügen, vielleicht das Stadtbild. Lass es uns einfach so größer machen. Jetzt können wir diesen Text wieder auf 25 senken und jetzt können wir den Block hinzufügen. Zitieren Sie dieses Stück Text hier, und das Blut Zitat Text ist in der Regel wissen Sie, etwas Wichtiges, das innerhalb des Textes ist. Wenn es ihnen gut geht, wenn der Autor eine Sache hervorheben möchte, dann wird er oder sie normalerweise das Blockzitat verwenden, um dieses Stück Text hervorzuheben. Also lasst uns das jetzt wirklich machen. Lassen Sie mich einfach hineinzoomen. Vielleicht machen wir es etwas kleiner. Genau wie so schreckliche Führung wieder runter. Lasst uns 25 Pad und lasst uns ein paar Dinge darüber ändern. Zunächst einmal machen wir es mutig einfach so. Lass es uns schaffen. Lasst es uns in die Mitte ausrichten und es etwas kleiner machen. Lass es uns vielleicht nur ein bisschen größer auf so etwas wie 24 machen. Lassen Sie uns vielleicht eine Zeilenhöhe zu 32 hinzufügen Lassen Sie uns dies nur ein bisschen größer machen und den gesamten Textrahmen kleiner machen. Ich meine, eine schmalere, weil in der Regel diese Blut-Zitate sind nicht, dass für verteilt auf die Websites. Also lassen Sie es uns so sagen. Okay, also haben wir das Blockzitat erstellt, also würden die letzten Teile des nächsten Jahres nur gut sein, vielleicht lassen Sie uns einfach ein Stück Text hier hinzufügen, und fügen wir diese Tags hinzu. Vielleicht werde ich es einfach schnell von diesem Füllstoff Text auf eine andere Füllsteuer ändern, genau wie so und einfach schwächen, einfach nur schnell leihen diese Kommentare, Text einfach so. Gehen wir runter und lassen Sie uns wieder einleben. Ich werde es verschieben, bis es mit unseren, die wir mit unseren Guides haben, und ich werde 25 hinzufügen. Und lassen Sie uns diesen Text von Kommentaren zu einigen zu einer Steuer ändern oder das ist Clipping gewesen. Tippen Sie einfach so etwas wie Lifestyle-Fotografie auf vielleicht Reisen, wissen Sie, Dinge wie das. Okay, also wird der Text erstellt, und das letzte Stück vom letzten Teil des Puzzles wäre, diese Social-Media-Symbole hier unten und diese einfachen Zeilen hinzuzufügen , damit der Benutzer unsere Inhalte teilen kann. Also lasst uns das eigentlich im nächsten Video machen. 83. 30Let's Hinzufügen der 30Let's: Also werde ich mit der Ausleihe und den Social-Media-Icons beginnen. Vielleicht aus der Seitenleiste. Ich werde nur schnell zu ihnen kommen. Ich werde sie kopieren. Lassen Sie mich einfach hineinzoomen und ich werde sie hier stützen. Und natürlich muss ich sicherstellen, dass ich auf der richtigen Ebene bin. Also lassen Sie mich einfach auf eine einzelne Post-Layer gehen und genau so einbauen und natürlich möchte ich, dass sie viel, viel größer sind . Also werde ich einfach 32 sehen. 32 sollte in Ordnung sein. Und ich werde sie gruppieren, weil ich gerade jetzt nicht nur ihre Farbe ändern möchte, sondern auch diesen elliptischen Hintergrund hier hinzufügen möchte. Was ich zuerst tun werde, ist, dass ich so in den Lippen kreiere. Ich werde natürlich das Symbol dagegen setzen , diesen Hintergrund und dafür die Lippen. Ich meine, ich möchte, dass diese Ellipse zeigt, dass, wenn jemand über diese Ellipse schwebt, dieser Ellipse schwebt, Link und es ist gut, es zeigt tatsächlich an, dass er hervorgehoben wurde, damit wir einfach umdrehen können. Es ist eine Farbe wie so und jetzt können wir die Farbe von unserem Symbol ändern. Da es sich also um ein eingebettetes Dokument handelt, werde ich es bearbeiten. Wir kennen den Bohrer bereits, genau so, und das Bild wird gut. Es bekommt einen anderen Anruf. Lassen Sie mich die Ellipse einfach etwas größer machen. Lass es uns schaffen. Lassen Sie uns verdoppeln seine machen eine doppelte Größe des Symbols. Also, wenn das Symbol an dritter Stelle ist, lassen Sie uns die Ellipse 64 einfach so machen und jetzt können wir einfach diese Jungs bewegen, um zu entscheiden. Jetzt können wir uns die Ellipse ausleihen. wir einfach sicher, dass alles gut ausgerichtet ist. Leihen Sie sich die Ellipse legen Sie sie unter das Symbol. Das ist eine Reihe von diesen Typen richtig. Und natürlich wäre diese Ellipse einfach grün. Und ich möchte dieses Facebook-Symbol weiß sein. Jetzt werde ich es noch einmal köllen und lassen Sie uns dieses Instagram-Symbol richtig ausrichten und das Dokument hinzufügen. Wie Sie es sehen können, wenn wir das eingebettete Dokument geschlossen haben, kommt es immer wieder zu unserem 1. Dokument direkt hier zurück. Also lassen Sie mich einfach zu dem zurückkehren, an dem wir gearbeitet haben und wieder Köln. Dieser Kerl, aber es unter ihr die ich komme, wähle alles wieder, fügte das Dokument hinzu. Ok. Und wir haben die Ikonen Creed. Und natürlich können wir jetzt einfach alle diese Jungs zuerst die Icons und ihre Hintergründe gruppieren, so sagen wir mit diesen Jungs. Und jetzt können wir sie einfach , Sir verteilen, Sir. Also werde ich zur Ausrichtungs- und Distributionsoption gehen und sie verteilen. Natürlich, wenn Sie sie nach einer bestimmten Anzahl verteilen wollen, können wir das tun. Natürlich kann, sagen wir, sagen wir, 16 Punkte sein. Vergiss nicht zu schlagen. Okay, jetzt können wir einfach rauszoomen und sehen, wie es aussieht. Und ich denke, es könnte ein bisschen zu groß aussehen, nicht wahr? Vielleicht zu groß. Also können wir jetzt einfach all diese Typen schnappen. Und anstelle von 64 gehen wir mit so etwas vielleicht 48 vielleicht sogar kleiner als das. Vielleicht wie 36, denke ich, dass 36 in Ordnung sein sollte. Lass uns gehen. Lass uns nicht kleiner als das sein. Wir können sie jetzt einfach gruppieren, und jetzt, da ich sie in Bezug auf meinen Hintergrundcontainer ausrichten möchte. Ich brauche Teoh. Schalte es frei. Also zuerst. Natürlich muss ich sie finden. Das ist dieser Typ hier. Also werde ich diese beiden Typen packen, die sie ausgerichtet haben und jetzt weiß ich, dass ich diesen Hintergrund wieder sehen kann . Das Letzte, was hier zu tun ist, wäre, es dort zu setzen, wo es hingehen muss. Ich meine, in Bezug auf die Ausrichtung, nur, ähm, ähm, es oben. Und jetzt ist es einfach gesagt, Lasst uns einfach hinzufügen Lasst uns nur 25 dazu haben. Und jetzt können wir einfach einige einfache Rechtecke hinzufügen, die wirklich klein sein werden. Ich möchte, dass er vielleicht sogar so niedrig ist, so klein wie ein Pixel. Aber ich möchte, dass sie nur ein bisschen breiter von 38 oder vielleicht 42. Und ich will, dass sie schwarz sind, oder das von diesem sehr, sehr dunklen, tollen Kragen. Und ich werde sie hier setzen. Jetzt können wir diesen Kerl einfach hier klonen, und ich werde diese beiden Elemente in eine Gruppe verwandeln. Also jetzt kann ich einfach sowohl die Rechtecke als auch auf den Social-Media-Icons greifen und ich kann sie einfach an der Mitte in Bezug zueinander ausrichten. Und natürlich, wenn Sie diese Rechtecke näher beieinander sein wollen, können Sie einfach eine auswählen, wie so ein bisschen nach links gedruckt, vielleicht nur ein bisschen mehr. Aber da diese immer noch eine Gruppe sind, kann ich einfach eine auswählen. Wenn ich es einfach verkaufen könnte, so und ich kann die Gruppe auswählen, meine ich die Social-Media-Icons. Und wieder, wenn ich sie einfach in die Mitte bringe, können Sie sehen, dass sie schön in Bezug zueinander ausgerichtet sind. Aber natürlich muss ich sie jetzt gruppieren und in Bezug auf mein Rechteck ausrichten, genau so. Also, wenn ich jetzt wieder verkleinere und vielleicht die Panels ausschalte, können Sie sehen, wie es jetzt aussieht. Natürlich ist das letzte, was hier zu tun ist, nur diesen Ding-Container zu greifen , 50 Pixel in seine Höhe zu tun. Lassen Sie uns 15 genau so haben, und wir haben im Grunde unseren Hauptcontainer erstellt. Also haben wir zu diesen Stücken aus Text hinzugefügt. Wir fügten hinzu, dass der Block Post mit dem Titel Diese Stücke Off Paragraphs die Bilder, Blut-Zitat und die Social-Media-Zyklen. Also das nächste, was zu tun ah wäre, mich einfach zurückgehen zu lassen, wäre, diese vorherigen Beitrag hinzuzufügen und nächsten Navigationselement rühmen, weil wir wollen, dass die mit dem Benutzer Leser in der Lage sein , schnell zum vorherigen Beitrag und nächsten Beitrag gehen, um sie auf unserer -Site. Also lasst uns das im nächsten Video machen. 84. 31Let's Füge die Vorne nächste Post hinzu: in diesem Video werden wir ein Navigationssystem für die vorherigen und nächsten Beiträge erstellen. Also zuerst, was ich tun werde, werde ich das Rechteck-Werkzeug greifen und ein Rechteck erstellen von diesem unteren und linken Viertel von meinem Container erstreckt, den ich seine Dimensionen machen werde . Jemand Spezifischer. Ich wollte sagen wir, 300 Pixel breit sein sagen wir, , und ich wollte 75 Pixel sein, bis ich ziemlich breit sein wollte . Denn denken Sie daran, dass wir ein Bild auf einem Bild auf der linken Seite und etwas Text auf der rechten Seite haben müssen. Wir müssen also etwas mehr Platz haben, damit wir arbeiten können. Also werde ich seinen ah-Hintergrund ändern. Nun, es ist gefüllt, Dwight, und ich gehe Teoh, bringe es um 25 Pixel runter. Das nächste, was ich tun werde, ist, dass ich diesen Kerl kopieren und ihn vorne einfügen werde, und ich werde sicherstellen, dass es tatsächlich ein Quadrat ist. Also wollte ich 25 Pixel mit und 75 Pixel innerhalb von 75 Pixeln in der Höhe haben. Also jetzt bekommen wir dieses Bild gut dieses Rechteck und ein Rechteck darunter. So können wir jetzt beide greifen und einfach und einfach teilen. Also sind wir mit nur diesem Quadrat links, dieses Rechteck Ende dieses Quadrates. Natürlich wird dieses Quadrat unser gut sein, Bild ein Platzhalter. Also wieder, ich gehe einfach schnell Fuß ein Bild platzieren. Vielleicht dieser Pier. Ich hoffe, dass es Ihnen gut geht, dass Sie nicht mit diesen Bildern ausgezeichnet werden. Ich wollte wirklich eine Menge von ihnen haben, aber ich schätze, es ist unvermeidlich, dass sich einige von ihnen einfach wiederholen. Also lassen Sie mich einfach schnell machen dieses Bild kleiner ist. Also die Onley Textstücke, die wir brauchen, werden tatsächlich die Links für das vorherige Beitragsende des Blockposttitels selbst sein . Also werde ich die künstlerische Textil klicken und ziehen und tippen Sie in eingeben und vorherigen Beitrag. Und natürlich, natürlich, lasst uns einige Dinge darüber ändern. Zunächst einmal möchte ich nicht, dass es kursiv ist, und ich will nicht, dass es so groß ist, einige vielleicht Lassen Sie uns mit 12 gehen und lassen Sie uns einfach sicherstellen , dass diese Elise die Buchstaben mit allen Großbuchstaben genau so geschrieben werden. Und vielleicht machen wir es noch kleiner, 10 so zu sagen, und dann werde ich diesen Kerl mitbringen , aber vielleicht nicht. Vielleicht benutze ich einfach das Rahmen-Textil. Lassen Sie mich diesen einfach schließen und einen Textrahmen erstellen. Wir werden es nur eine Sekunde anpassen. Ich werde einen Fülltext einfügen, und dieser Typ muss roboto verdichtet, roboto verdichtet, fett. Und machen wir es vielleicht etwas kleiner, wie 18. Lassen Sie uns es nach links ausrichten und ändern Sie die Zeilenhöhe auf etwas wie 24 vielleicht Arm von sogar 20. Und lasst uns diesen Kerl runterbringen. Natürlich können Sie, wenn Sie möchten, wenn Sie möchten, zwei Zeilen vom Text direkt hier haben, oder wir können sogar eine Textzeile suchen, genau so, dass Sie einfach schnell verkleinern. Ich denke, dass die nur eine Textzeile tatsächlich ein bisschen besser aussehen wird, also stellen wir jetzt sicher, dass wir all diese gut bekommen. Der Abstand zwischen der Kante ist gut, richtig, also lasst uns schnell sehen, wie 2 25 er aussehen wird, wenn es nicht zu viel sein wird. Ich denke, die 25 werden nur ein bisschen zu viel sein. Gehen wir also mit 12 für die Bewegung der Y-Achse und auch für die X-Achse Bewegung. Nun greifen wir diesen Rahmentext und lassen Sie uns ihn so in die vorherige Prahlerei verschieben. Und lassen Sie es uns jetzt nach unten ziehen, sagen wir, 12. Genau so und mal sehen, wie es aussieht. Natürlich könnten wir mit den verschiedenen Messungen versuchen, verschiedene Möglichkeiten, diese Jungs zu positionieren. Vielleicht bringen wir diesen Kerl ein bisschen runter, genau wie so viel, das vielleicht wieder ein bisschen zu viel sein könnte. Eso Lassen Sie uns versuchen, versuchen wir es tatsächlich minus 12. Aber lassen Sie uns etwas wie 20 hinzufügen und sehen wir jetzt, wie es aussieht. Ich denke, das sollte gut sein. Wir könnten immer vorschlagen, statt zu versuchen, das Richtige herauszufinden. Das Management ist der richtige Abstand zwischen all diesen Jungs. Gehen Sie einfach voran und schnappen Sie sich beide Typen und stellen Sie sicher, dass diese Textstücke genau in der Mitte von diesem gut Container genau hier sind , weil denken Sie daran, dass vielleicht, wenn wir das ein bisschen haben. Nun, der Text ist etwas länger oder ein bisschen größer. Wenn wir nur den Füllstoff Text ändern, könnten einige Dinge anders aussehen, aber wenn wir beide diese Jungs genau in der Mitte haben, sollten sie sich in den Behälter aufnehmen und immer noch in der Mitte von unserer bleiben über, wo wird Container. Also im Moment können wir einfach Rampe wachsen Diese, äh, das wird Navigation. Nun, Box. Nennen wir es so, und wir können es nach rechts bewegen. Natürlich nicht klonen, sondern verschieben Sie es nach rechts. Ich denke, das sollte gut sein. Um unsere Arbeit zu erleichtern, können wir einfach all diese Elemente greifen. Und wir können einfach die Werkzeugleiste verwenden, um alles horizontal zu spiegeln. Aber natürlich, wie Sie sehen können, haben wir diesen Text auch in gewisser Weise umgedreht. Nun, das heißt, du weißt schon, , es macht den Text unlesbar. Aber bevor ich mich um den Text kümmere, werde ich dieses Bild greifen und ich werde es löschen. Ich füge einen anderen hinzu. Also lassen Sie uns vielleicht das Kuchenbild Kopf und machen es wieder deutlich kleiner. So vielleicht ein bisschen nach links genau so. Und jetzt, wenn wir diese Kerle nochmal schnappen und sie nach links drehen, haben wir den richtigen Text. Die Steuer wird richtig geschrieben, oder? Aber es gibt immer noch eine Sache, die wir tun müssen. Ich meine, wenn wir nur einen Freund Textil packten und dieses Stück Text packen, können wir es nach rechts ausrichten und wir können einfach diesen vorherigen Text wie so greifen, und wir können ihn nach rechts verschieben und auch nach rechts ausrichten, denn gerade jetzt, wenn wir diesen Text ändern , wird es von der Vorschau auf die nächste ändern. Mir ist aufgefallen, dass sich der Text sozusagen zu seinem rechten, rechten Ankerpasst rechten, rechten Anker . Also müssen wir jetzt nichts ändern. Aber natürlich könnten wir diesen Fülltext ändern, um ihn mit einem anderen Block zu verknüpfen . Die meisten einfach so. Und da gehen wir. Wir kamen zu der erstellten Navigation, also werden wir einfach die einfachen Rechtecke verwenden, einige Fotos, quadratische Fotos hinzugefügt und dann etwas Text hinzugefügt. Und dann haben wir einfach den Ball Cologne gedreht und diese Navigationsbox nach rechts und dann einfach ein paar Tricks gemacht, um es Luca richtig zu machen. Also das nächste Stück Design, das wir erstellen werden, ist dieses verwandte rühmt, wie eine Anzeige von Beiträgen hier unten. Also lasst uns das im nächsten Video machen. 85. 32Lets Füge die entsprechenden Beiträge hinzu: die entsprechenden Beiträge Abschnitt unserer Seite. Also zuerst, lassen Sie mich vielleicht schnell etwas von den Vermögenswerten ausleihen, die wir bereits haben, einige werden dieses Etikett und dieses erste Bild schnappen, und dann werde ich versuchen, es auf die richtige Ebene einzufügen, genau so und ich werde es trainieren. Lassen Sie mich einfach hineinzoomen. Das sollte kämpfen. Und natürlich werde ich es um 50 Pixel senken. Und natürlich wollen wir nicht, dass es Anzeigen sagen, die wir ähnliche Angebote speichern wollten, einige werden dies als nächstes schnell ändern. Und dann werde ich einfach dieses Rechteck greifen und es genau so nach rechts bringen, du weißt schon und wie man das macht. Vielleicht werde ich zuerst nachsehen. Wenn dieser Abstand zwischen diesen Jungs ist 50 oder 25 sollte 25 sein, also sind wir gut zu gehen. Also lassen Sie uns mit dem Original überprüfen, wie es aussehen soll. Nun, wie Sie dieses Ah sehen können, ist dieses Bild hier eher ein Quadrat, eher ein Rechteck, dann ist es ein Quadrat, aber natürlich ist es nur meine Design-Präferenz. Nur meine Designwahl. Wenn Sie wollen, kann es sein, es kann ein Brunnen sein, ein Rechteck. Also werde ich dieses Bild schnell entfernen einfach so, so dass ich dieses Rechteck einfach hier anpassen kann . Also werde ich mit 2 70 vielleicht um 200 einfach so gehen und ich werde ein Bild hinzufügen. Mal sehen, vielleicht dieses Weihnachtsbild, warum nicht? Und lass es uns kleiner machen. Es hat das Bild kleiner gemacht. Denken Sie daran, dass Wenn Sie nur das Bild vom Mittelpunkt möchten. Halten Sie einfach die Steuerungstaste einfach so. So können wir jetzt auf den Textblock Post Titel und das Lesen Mehr Taxi von Nicht falsch hinzufügen? Ja, genau. Dieser Typ hier. Also verstehe ich, ich werde das Rechteck-Werkzeug greifen, den rechten Punkt unten links rechts hier finden und ein Rechteck auf 70 mal 100 erstellen. Das sollte gut sein. Natürlich. Ich möchte die Farbe Zehe weiß und wieder ändern und greifen Sie den Rahmen Text Hocker. Erstellen Sie einen Rahmen, der mit einigen Füllungstext an der linken Roboto komprimiert fett gefüllt wird , ist völlig in Ordnung. Gehen wir mit zwei Textzeilen und bewegen wir den Kerl nach links und legen ihn hier. Und jetzt lassen Sie uns überprüfen, was es tun würde, es mit dem aussehen würde, wenn es 25 Pixel, Lücken rund um ihn herum. Also zuerst werde ich es machen, um den Ursprung der Transformation Ursprung in der Mitte zu etablieren , und ich werde es schaffen. Ich werde es um 50 Pixel kleiner machen, also minus 15 genau so, und ich werde es auch um 25 runterdrücken. Da gehen wir. So können wir jetzt einfach das künstlerische Textil greifen und mehr einfach so eintippen. Also lasst uns es von regelmäßig zu fett ändern. Und lass es uns kleiner machen. Versuchen wir 14 und gehen wir mit dieser grünen Farbe wie so, und lassen Sie uns sehen, wie es aussehen würde, wenn wir es um 25 Pixel von unten und von der richtigen Schule verschieben könnten , die tatsächlich begonnen hat, die Transformation von unten. Also lassen Sie es uns um 25 nach links bewegen und bewegen wir es um 25 nach oben, genau so könnte es nur ein bisschen zu groß sein und könnte es vielleicht auch ein bisschen kleiner machen. Das könnte C 10 tatsächlich sein. Könnte ganz in Ordnung sein. Aber lassen Sie uns den Kerl dann runterziehen und ihn nach oben bewegen. 25 könnte nur ein bisschen zu viel sein. Ich glaube, es ist. Ich denke, es ist viel zu viel. Also lassen Sie es uns nach unten bewegen. Lassen Sie uns zwei subtrahieren, Sagen wir 10. Nun, es ist fügt hinzu, so gemacht, das sollte gut sein. Lassen wir es uns lassen. Lass es uns so lassen. Jetzt werde ich natürlich dieses ganze Fragment hier schnappen natürlich . Und vielleicht lassen Sie uns das Gitter einfach so einschalten. Also, jetzt können wir diesen Kerl einmal nach rechts bewegen und dann einfach die Steuerung j drücken, um ihn nach rechts zu verschieben oder ihn noch einmal nach rechts zu klonen. Jetzt können wir dieses Bild einfach so ändern. Vielleicht mal sehen, vielleicht das Katzenbild. Lass es uns kleiner machen. Ändern wir diesen Füllstoff Text so, und lassen Sie uns das letzte Bild von Weihnachten in etwas anderes ändern, Natürlich. War sicher in der Auswahl. Ja, gehen wir mit dem Sandwich so und da gehen wir. Natürlich, wenn Sie wollen, können Sie diesen Container vielleicht etwas größer machen. Also eigentlich, diese Größe ist diese Lücke genau hier gut ist auch 25. Also haben wir hier die gleiche Lücke und die gleiche Lücke hier. Also vielleicht lass uns das wirklich machen. Und lasst uns das in einer Charge machen. Also werde ich all diese Kerle hochbringen, und dann nur und dann einfach hier anzeigen. 52 ihre Höhe, 25 nicht 50. Das wäre ein bisschen zu viel. 25. Genau so. So können wir diese Art von einem Sie beziehen sich rühmten Abschnitt erstellen. Lassen Sie mich einfach das Gitter ausschalten. Schalten Sie die Panels aus. Also gehen wir hin. So sieht es jetzt aus. Also haben wir das vorgestellte Bild bekommen. Wir haben auf den Text den Block Post bekommen. Wir haben diese vorherige nächste Post Navigation. Wir haben die entsprechenden Beiträge. Und das Letzte, was wir noch tun müssen, ist dieser Kommentarbereich hier. Lassen Sie uns also überprüfen, wie Sie diesen Abschnitt im nächsten Video erstellen 86. 33Lass uns mit der Erstellung der Kommentare: Lassen Sie uns also anfangen, den gemeinsamen Abschnitt zu erstellen, indem wir dieses Kunstwerk nur ein bisschen größer machen, denn ich denke, dass wir bald der Platz hier ausgehen werden. Also gehe ich zum Kunstabbruch, schnappte die Kunst der Bretter zu und bringe diesen Kerl ganz deutlich zu irgendwo hier runter . Dann schnappen wir uns einfach unser Essen oder lassen Sie mich es einfach schnell irgendwo finden. Das ist dieser Typ hier und wir können einfach nur lassen wir es mich einfach richtig schnappen und schwächen. Bringen Sie es runter, um es zu hören, einfach so. Also, jetzt gehen wir zurück zum richtigen Spieler und leihen uns dieses Label aus. In diesem Zusammenhang stehen Etiketten zur Verfügung. Ich werde Basen vorne kopieren, es herunterbringen und wieder zu Standard 50 Pixel hinzufügen wie so als nächstes. Was ich tun werde, ist, dass ich das Rechteck-Werkzeug greifen und einen Container für unsere Kommentare erstellen werde . Aber ich werde die Sichtbarkeit aus dem Netz auf Turnier zurücksetzen und einfach einen Container erstellen , der ziemlich groß sein wird, ziemlich erzählt, und ich werde ihn um 25 so verschieben. Also, wenn Sie einen Blick auf das Original werfen. Das erste, was wir tun müssen, ist natürlich, natürlich, ändern Sie das Label hier und fügen Sie dann dem Bild den Avatar und dann etwas Text hinzu. Das Datum Der Name der Person, die den Antwort-Button hier kommentiert hat und dann schwächt , wird den Vorgang mit diesem wiederholen, äh, nun, mit dieser Antwort und hier unten. Also zuerst werde ich ändern, dass verwandte rühmt sich Label zu Kommentaren. Dann Brendas Führer nach links. Das wird gut sein. Also lassen Sie uns jetzt ihren ersten Avatar erstellen. Das ist ein Bettler. Wird das Rechteck dieses Quadrat und diese Person hier? Also, natürlich werden wir damit beginnen, den Ellipse-Shop so zu packen, und lasst es uns rosa machen. Also, um den Körper aus unserem Avatar zu erstellen, lasst uns dieses abgerundete Rechteck-Werkzeug greifen. Das ist dieser Typ hier. Und lassen Sie uns schnell ein abgerundetes Rechteck erstellen, das so etwas aussehen wird. Ich werde die Zehe abziehen. Klicken Sie hier auf die Option für den einzelnen Radius, und ich werde Null für die untere linke und untere Fahrt eingeben. Richtig. Werte genau hier. Null für diesen Kerl so, wie Sie sehen können, haben wir einfach schnell erstellt diese um es Rechteck von wie 1/2 abgerundeten Rechteck transformiert . Und alles, was wir jetzt tun müssen, ist, dass wir einfach ein bisschen herumspielen müssen, auch mit den anderen Werten, um es so aussehen zu lassen, wie wir wollen. Also lassen Sie es uns vielleicht ein bisschen hochbringen. Und natürlich können wir diesen Radius immer noch größer machen, wenn wir wollen. Versuchen wir es 35. Das ist McNish, Allders, sogar 35 Seen. Also ich denke, das sieht aus, ich denke, das sieht in Ordnung aus. Natürlich können wir immer nur gruppieren, diese Jungs machen sie kleiner, machen sie größer. Wir können mit diesen Jungs machen, was immer Sie wollen, und lassen Sie mich schnell einen Blick auf das Original werfen. Es ist gegen dieses dunkle Quadrat gesetzt. Einige werden das dunkle Quadrat einwickeln, und vielleicht werde ich einfach die eingefügte hinter Auswahloption verwenden, um ein Quadrat wie so zu erstellen und ein Schwarz zu machen und es ein bisschen kleiner zu machen, so etwas Und lass uns wissen, eine Linie. All diese Elemente zusammen einfach so. Also lasst uns jetzt einfach schnell diesen Kerl duplizieren, damit wir es nicht in einer Sekunde wieder tun müssen . Und lasst uns Ah, geben wir diesen Jungs richtige Farben. Lasst uns sie dunkel machen. Und lassen Sie uns diesen Hintergrund rosa wie Salsa machen. Und jetzt haben wir beide Avatare erstellt. Also im nächsten Video, werden wir tatsächlich beginnen, diese Stücke aus Text und diese Stücke von Text zu erstellen. Aziz. Nun, also kommen unsere Kommentare, die so aussehen, als wären sie wirklich, also bleiben Sie dran. 87. 34Let's erstellen die Texte für die Kommentare: Wenn Sie einen Blick auf das Original werfen, können Sie feststellen, dass die Polsterung in diesem gemeinsamen Abschnitt ist viel, viel größer als die Ränder, die wir normalerweise erstellen. Ich denke, es sind mehr als 50 Pixel, und das wird getan, um,wissen Sie, nicht alles symmetrisch zu machen. mehr als 50 Pixel, und das wird getan, um,wissen Sie, wissen Sie, Aber um dem Design etwas Dynamik hinzuzufügen, müssen Sie es nicht gut tun, in dem gemeinsamen Abschnitt wie diesem, wenn Sie es erstellen,wissen Sie, wenn es wissen Sie, ein handgefertigter Brauch ist, einen gemeinsamen Abschnitt, können Sie ein wenig verrückter als Wind mit den anderen Elementen. in diesem Fall einen Blick darauf werfen, Lassen Sie unsin diesem Fall einen Blick darauf werfen,wie unsere Kommentare aussehen werden, wenn sie mehr Platz um sie herum haben . Also das erste, was ich tun werde, das einfach wieder herauszoomen wird, ist, dass ich diesen Avatar als meine Art wie einen Anker für andere Designstücke verwenden werde, die ich in nur einer Sekunde erstellen werde. Aber ich denke, dass ich es nur ein bisschen kleiner machen werde. Lassen Sie uns überprüfen 48 natürlich, lassen Sie uns sicherstellen, dass wir alles verknüpfen, dass dies eine Gruppe ist und dass wir seine Größe einfach so verknüpfen . Also lasst uns mit 48. Ich denke, 48 wird gut sein und ich werde es hier oben links platzieren, genau so. Und jetzt werde ich es um 100 Spuren nach rechts verschieben. Check 100, ich werde es auch um 100 runterziehen. So wie so. Also, jetzt werde ich einfach erstellen gut besteuert wird Text aus dem Kommentar. Also werde ich mir das künstlerische Textil schnappen und ein Date erstellen. Es wird Rippe Otto sein. Ich denke, wir gehen normalerweise mit Metallic. Lass uns mit 14 gehen. Lassen Sie uns das Datum eingeben und vielleicht lassen Sie es uns noch kleiner machen. 10 sollte in Ordnung sein. Weißt du was? Vielleicht werde ich diesen Hintergrund hier sperren, damit wir ihn nicht versehentlich vermasseln. Also, jetzt können wir diesen Oktober bewegen, Lassen Sie uns sagen, durch getan, und vielleicht nur ein bisschen nach unten, so lassen Sie uns einfach einen kurzen Blick auf das Original werfen, wie es in der ursprünglichen Version aussieht. Es ist so etwas. Ich schätze, das können wir. Wir können es so lassen, damit wir es einfach wissen können, Kerl ausdrucken und ihn um zehn runterbringen. Und lassen Sie uns das ein Datum in einen Namen ändern und dieser Typ wird grün in allen Kappen sein und machen es nur ein bisschen größer. Und nun fügen wir den nächsten Rahmen so hinzu, und was wir tun können, ist, dass wir Großbritannien diesen Text von ganz nach rechts, wie wir es normalerweise tun, und wir können ihn kleiner machen. Also lassen Sie uns 100 so verfolgen, und füllen wir es mit einigen mit etwas Füllstoff Text, der Roboto regulär 16 sein wird . Natürlich, wie Sie sehen können, die manchmal müssen Sie nur noch einmal klicken, um tatsächlich wählen Sie die Steuer weil passen in Designer manchmal einfach nicht zu kooperieren, wenn es darum geht, in den Text zu ändern , um Sie gut, müssen anscheinend den spezifischen Text ausgewählt haben. Sie können einfach den Textrahmen manipulieren, was ein bisschen schade ist, also ist es vielleicht nur ein bisschen oben. Lassen Sie mich einfach einen schnellen, schnellen Blick nehmen und lassen Sie uns diese Gruppe irgendwo hier hinunterschieben, weil wir immer noch die Wörter „gewelltes Wort antworten“ eingeben müssen . Lassen Sie uns es nach unten durch Lassen Sie uns sehen 15 und lässt aus klicken Sie auf diese alte Caps Option. Machen wir es aber kleiner bis 10. Und lasst uns antworten. Und ich denke, dass wir es vielleicht nach rechts verschieben wollen, weil ich denke, es wäre einfacher für Leute zu klicken, wenn es gut auf der rechten Seite platziert wäre. Es ist also nur eine leichte Modifikation. Nehmen wir an, dass jemand tatsächlich geantwortet hat und lassen Sie uns diesen bösen Jungen runterlegen. Mal sehen 15 und wir können dieses Stück Text, dieses Stück Text, dieses Stück Text und dieses Stück Text klonen es nach unten und verschieben es nach rechts. Ich glaube, es war 10 und nicht. Und da gehen wir hin. Vielleicht lasst uns auch den Namen dieser Person ändern , John. Und natürlich, lassen Sie uns diesen Texas-Rahmen kleiner machen, noch kleiner wie so. Und lassen Sie uns diesen geantworteten Text nach links bringen, genau so. Also das nächste, was wir tun würden, ist, dass wir nur dieses Formular für die Kommentare erstellen würden, dieser verlassen Antwort Abschnitt hier unten, Also lasst uns das im nächsten Video tun 88. 35Letter wird die Kommentarfelder für den Beitrag erstellen: also bevor wir das Formular für die Commons erstellen. Also lassen Sie uns einfach schnell ein Problem beheben, das wir hier haben. Ich habe nur nicht die Größe von diesem Avatar geändert. Dieser Kerl ist kleiner ist es 48 Pixel mit dem breiten, aber dieser Kerl ist nicht so Es ist schnell beheben dieses ein, Also ist es Typ in 48. Und natürlich müssen wir diese Jungs nach rechts bringen und diesen ganzen Rahmen um 10 Pixel kleiner machen. Nun, gehen wir mit minus 10. Genau so. Also, jetzt werde ich nur eine die Kommentare erstellen, die das Formular für die Commons. Aber lassen Sie mich dieses Ding einfach nur ein bisschen größer machen. Also werde ich mit dem Hinzufügen des Textes beginnen, der sagen wird, Hinterlasse eine Antwort. Einige greifen das künstlerische Textwerkzeug, beginnen irgendwo hier und geben Sie eine Antwort ein, Oder vielleicht hinterlassen Sie einen Kommentar und lassen Sie uns es rosa machen. Lass es uns schaffen. Machen wir es fett, nicht kursiv, und machen wir es kleiner. Vielleicht nicht so klein. Das sollte gut sein. Bringen wir es auf, und natürlich könnten wir es. könnten vielleicht versuchen, diesen Kerl nach rechts zu bewegen, um es mit dem Antworttext genau hier zu passen und jetzt konnten wir es nach unten um 50 verschieben, so bewegte dieser Kerl nach links und schiebe es nach rechts um 50, genau wie einige. Wenn wir also jetzt einen Blick auf das Original werfen, können wir sehen, dass wir dieses Kommentarfeld direkt hier bekommen haben. Hier würden Leute den eigentlichen Kommentar eingeben. Wir haben den Namen für die Leute, für die Person, die seine E-Mail kommentiert, und natürlich den Boden hier unten. Wir könnten vielleicht zwei Zustände angeben, wenn die Leute über den Knopf schweben. Es ist also ein normaler Zustand. Es ist Leerlauf, und natürlich, es ist Ah, Schwebezustände. Also könnten wir in der ersten einen grünen Knopf erstellen und dann diesen rosa Boden erstellen, um anzuzeigen und was dieser Boden, wie sein Hintergrund aussehen sollte, wenn Menschen schweben darüber. Aber fangen wir mit der Arena der Boxen an, den Elementen aus unserer Form. Also mit dem Rechteck-Werkzeug werde ich ein Rechteck erstellen. Ich werde es über diesen Container strecken und dann werde ich einfach 50 so subtrahieren , und ich werde es nach unten bewegen. Mal sehen 50. Ich denke, das wäre gut und ich werde es weiß machen. Oder vielleicht Grace. Wir können es tatsächlich sehen. Und dann werde ich mir das künstlerische Steuerwerkzeug holen. Vergrößern Sie einfach und ich werde einen Kommentar eingeben. Und ich wollte über eine reguläre, vielleicht 10. Lassen Sie uns dieses großartige Auto geben, ich werde es runterbringen und dann werde ich es mit etwa 10 Pixeln so heraufbringen etwa . Wir können mich einfach diesen Kerl erschaffen lassen, dein Bett runter. Und jetzt können wir einfach beide Elemente greifen, sie nach unten bewegen und sie dann herunterbringen. Lasst uns 25 überprüfen. 25 zu sein, sollte in Ordnung sein. Und lasst uns den Kommentar ändern, ich glaube, es war Name und lasst uns diesen Kerl beten. Machen wir es 50. Bixel ist hoch und lass uns nach links ausbreiten. Bringen wir den Kerl nach rechts. Natürlich halte ich die Steuerungstaste gedrückt, um sie zu klonen. Und lasst uns den Namen in E-Mail ändern, Natürlich, Wir brauchen etwas Platz zwischen diesen beiden Rechtecken, also werde ich schnell ein Rechteck erstellen, das 25 Pixel breit sein wird. Lassen Sie uns seine Farbe ändern. Und wir konnten diese Elemente nicht schnell vereinen. Brendas Typ oben. Legen wir es vor. Lassen Sie uns sicherstellen, dass sie richtig ausgerichtet sind, um dissenter, und wir können gerade jetzt, mit der Symbolleiste. Wir können es einfach so subtrahieren, es sei denn, wir bringen den Kerl einfach nach rechts. Das wird gut. Also das einzige, was zu halten ist, wie ich sagte, dieser Beitrag Kommentar Beitrag gemeinsame Zehe Nun, Knopf. Also gehen wir zurück. Und soweit ich mich erinnere, waren das 50 Pixel. Ja, es waren 50 Pixel so schnell, einfach das Rechteck-Werkzeug ergriffen und Rechteck zu erstellen, das 50 Pixel hoch sein wird , genau wie so. Und ich werde es um 25 runterziehen. Also möchte ich, dass dies meine primären Schaltflächen sind, diejenige, die Leute sehen, wenn sie gerade einen Kommentar posten, einige werden es so grün machen. Und ich werde das künstlerische Textil nochmal schnappen und Post Kommentar eingeben. Ich werde es von normal zu fett ändern, und ich werde es kleiner machen, vielleicht sogar kleiner, und ich werde es weiß machen. Braten Sie es auf. Bringen wir es auf 18 und ich werde sie richtig ausrichten. Und jetzt werde ich diese beiden Elemente schnappen und sie runterbringen und sie dann um 25 wieder herunterbringen . Jetzt kann ich diesen Kerl einfach in einen roten Knopf verwandeln. Also kann ich diesem Entwickler einfach zeigen, dass, wenn jemand über diesen Knopf schwebt , ich rot drehen wollte. Und wenn Sie nicht wollen, wenn Sie diese große Lücke nicht brauchen, können Sie sie einfach kleiner machen. Also lassen Sie uns vielleicht einfach statt 25 gehen wir einfach mit 10 genau so und lassen Sie uns verkleinern . Also jetzt können wir diesen Kerl genau so heraufbringen und so unsere Standard-50 Pixel zu seiner Höhe hinzufügen . Also wirklich, das letzte, was zu tun ist, wäre, einfach die Fußzeile wieder nach oben zu bringen, einige gehen, um es auszuwählen es und fügen Sie dann, Mal sehen, 25 oder 15 vielleicht 50. Wir brauchen dieses Kunstbrett nicht mehr so groß zu sein. Und natürlich, schalten wir Big Red aus. Also gehen wir hin. Wir haben eine einzelne Block-Beiträge Seite erstellt, so dass wir dem vorgestellten ein viel anstelle des Schiebereglers hinzugefügt. Und dann haben wir hinzugefügt, dass gut, der Hauptinhalt für unsere Blockbögen, die der Text war. Wir haben auch einige Bilder hinzugefügt. Dann haben wir zu ihren Social-Media-Symbolen die vorherige und nächste Postnavigation hinzugefügt. Sie sind verwandte Post Abschnitt und dann auf der Commons Abschnitt. Und natürlich haben wir einige Teile von unserem Hauptbild ferngehalten. Nun, wo unser Hauptdesign, das war der Header, der Cyber und der Footer. Ich hoffe, dass Ihnen dieses Design gefallen wird und dass Sie Ihre eigenen Designs teilen werden. Vielleicht inspiriert von diesem Design mit unserer Community und auf jeden Fall, wenn sie gut, Ich ermutige Sie, Ihre eigenen Designs zu kreieren, wenn Sie kommen mit ihnen nicht unbedingt inspiriert von diesem Design. Aber vielleicht verwenden Sie nichts zum Designer, um eine Waffe wird Website für einen Kunden zu entwerfen. Das wäre großartig, wenn du es mit uns teilen würdest, also habe ich bis zum nächsten Mal bis zum nächsten Malein schönes Design