Vergrößern Sie dein Side Hustle; Branding und Design für Ihre Squarespace Website

1. Einführung: Hi, ich bin Rosanna. Willkommen zu wachsen Ihre Seite Hustle, Branding und Design für Ihre Squarespace Website heute werden wir einen Blick auf, wie Ihre eigenen persönlichen Markenrichtlinien für Sie, Ihre Website und letztlich Ihre Seite Hektik entwickeln . Und dann schauen wir uns an, wie Sie das in Ihre Website übersetzen und das Design und das Gefühl auf jeder Seite Ihrer Website erhalten . Dies ist eine Anfängerklasse, so dass keine Vorkenntnisse über Squarespace erforderlich sind, aber es wird helfen, wenn Sie bereits Ihren Squarespace-Website-Build haben. Also, wenn Sie nicht bereits meine andere Klasse überprüft haben, wie Sie Ihre erste Website erstellen und hier zurück und lasst uns loslegen. 2. Forschung und Inspiration: Okay, lassen Sie uns bei der Gestaltung Ihrer Website Dieb springen. Der erste Ort, um für mich mit einem neuen Projekt zu beginnen, ist immer mit Forschung und Inspiration. Das wird besonders wichtig sein, wenn du baust. Diese Website ist Teil Ihrer Seite Hustle. Mit einem soliden Fundament von Forschung und Inspiration wird Ihnen Richtung und Fokus geben wenn Sie mitten in allem, um sich auf die Forschungsphase zu konzentrieren. Werfen wir einen Blick auf das Klassenprojekt. Der erste Abschnitt ist, ein Bild von Ihrer Inspiration mit ein paar Aufzählungspunkten zu teilen erklären, was Sie daran mögen. Zunächst einmal möchten wir mit einem breiten Blick auf verschiedene Inspirationspotenziale wie Pinterest-Magazine, Websites oder Plakate beginnen wie Pinterest-Magazine, . Stellen Sie sich den Prozess wie einen Trichter vor. Beginnen Sie an der Spitze mit dem breitesten Spektrum der Inspiration und verfeinern Sie sich dann nach unten und unten bis Sie Ihre gewählten Inspirationen haben. Pinterest ist ein großartiger Ort, um alles zusammen zu sammeln, da es eine visuelle Suchmaschine ist, nach der Sie suchen und dann Ihre gewählten Inspirationsbilder speichern können. Hier ist mein letztes Inspo Board. Ich habe hier nur meine Favoriten in Bezug auf Schriftarten gespeichert, Farben, Bilder und Stile, so wie ich einen Ort habe, haben kuratierte Inspiration gesammelt, die ich zurückverweisen kann und die Dinge einfach zu halten. Wir werden sehen, wie dieses Inspiration Board mein Design informiert, während wir durch die Klasse für den ersten Teil unseres Klassenprojekts gehen , stellen Sie sicher, dass Sie einen Screenshot Ihrer Wahl und Inspirationsbilder teilen und ein paar Punkte darüber hinzufügen , was Sie wie. Stellen Sie nur sicher, dass die endgültige Sammlung ist nur Ihre absoluten Favoriten höchstens, drei von jedem aus der Auswahl von Schriftarten, Farben, Bildern im Vertrieb. Wenn du dich überwältigt fühlst, gibt es einen Link zu meinem Pinterest-Board im Klassenprojekt sind unten für die Bühne, ein breites Element der Forschung, so dass du einen Blick haben und sehen könntest, ob es etwas gibt , das du dich gerne bekommst angefangen. Achten Sie darauf, Ihre Inspo-Aufnahme in das unten stehende Klassenprojekt zu speichern und zu teilen, was Sie daran lieben . Also, um Lektion eins abzurunden und zu beenden, forschen und, was am wichtigsten ist, versuchen Sie, diese Bühne zu genießen. Sie suchen nach Dingen, die Sie lieben und emulieren möchten. Wie lustig mit ihm und offen sein. Inspiration kann von überall kommen 3. Branding: Jetzt, da Sie Ihre kuratierte Forschungs- und Inspirationssammlung haben, ist es an der Zeit, diese zu Ihrem persönlichen Branding zu entwickeln. Für Ihre eigene Squarespace-Website habe ich eine PDF-Branding Richtlinien Checkliste für Sie zum Download auf beiden drucken aus auf Ihrem Computer verwendet werden erstellt . Dies wird wirklich nützlich sein, um den Überblick zu behalten, wo Sie auf einer Reise sind, vor allem, wenn Ihre Seite quälend und müssen dieses Projekt ablegen und wieder abholen . Später finden Sie die Pdf Brendan Richtlinien Download in ihrem Projektabschnitt für die Unterrichtsinformationen unten. Ich weiß, dass der Begriff Branding wie eine überwältigende Aufgabe erscheinen kann, etwas, das nur für Grafikdesigner und Profis reserviert ist. Aber ich verwende meine Erfahrung und mein Wissen, um dies auf einem angenehmen und dauerhaften Teil Ihrer Website Design Reise zu machen. Die Checkliste für das Branding ist so konzipiert, dass sie Schritt für Schritt von oben nach unten ausgefüllt werden kann . Indem wir Ihre gesamte Marke in diese acht Schritte unterteilen, haben wir einen überschaubaren Prozess und können jeden Schritt einzeln durchführen. Werfen wir gemeinsam einen Blick auf meine Inspirationskollektion in meine Markenrichtlinien, da diese Klasse ein Nachfolger aus meiner vorherigen Klasse ist. Starten Sie Ihre Seite Hektik. Wie Sie Ihre erstklassige basierte Website erstellen. Ich werde die Website weiterentwickeln, die ich in dieser Klasse erstellt habe. Wenn Sie noch keine Chance hatten, die Grundlagen für Ihre Website zu bauen, würde ich vorschlagen, mit dieser Klasse zu beginnen, damit Sie Ihre Website erstellen und dann zurück hier für das Design und Branding. So konnte ich bereits den Beginn meiner Marken-Checkliste mit meinem Namen für meine Website oder Marke ausfüllen . Ich habe keinen Slogan, aber ich habe das Leitbild aufgenommen, das wir in der letzten Klasse geschrieben haben, wie Sie Ihre erste Squarespace-Website erstellen können . Ich werde die nächsten Schritte mit Ihnen durchlaufen, damit Sie meinen Prozess sehen können. Ich habe geöffnet, es gibt pdf in der Vorschau auf meinem Mac, und ich werde es nur hier als die einfachste, schnellste, einfachste Option bearbeiten schnellste, . Ich werde jeden Schritt mit ihnen diese Bearbeitung in der Vorschau ausfüllen, damit ich alles an einem Ort zusammenhalten kann . Wenn Sie in der Lage sind, dies zu tun oder ein neues leeres Dokument zu starten und alles in das zu legen, könnte es wirklich nützlich sein, alle Ihre Markenelemente an einem Ort zu sehen, um sicherzustellen, dass sie zusammenhängend sind und die allgemeine Stimmung und das Gefühl, dass Sie suchen. Da wir in der Forschungsphase so gute Arbeit geleistet haben, sollte es ziemlich einfach sein, unsere Branding Checkliste auszufüllen. Ich werde meine zwei Dokumente setzen, also habe ich mein Pinterest-Board mit der Website-Design-Inspiration. Das ist also nur die beliebtesten Dinge, die ich für die Website-Inspiration ausgewählt habe . Und ich habe diese Seite an Seite mit der Vorschauversion von meiner Checkliste für meine Brendan-Richtlinien. Also habe ich bei Nummer vier angefangen, da ich bereits eins und drei ausgefüllt habe, und ich brauche nicht Schritt zwei. Ich werde meine vordere Auswahl von diesem Pin über moderne Fondspaare für Squarespace . Also schauen wir uns das an. Also, das war nur etwas, was ich auf Pinterest aufgeschaut habe. Andere Leute haben diese Sammlungen erstellt, was eine großartige Sache zu nutzen ist, und das sind alles Mittel, die auf quadratischem Raum sind, also wissen wir, dass sie irgendwie sicher nützlich sind, , zu schauen und für meine Titelfront, Ich mag die Kühnheit von diesem und Bevis New Grenze wirklich. Das ist es, was ich wählen werde, um meine Titelfront zu sein. Also, während wir hier sind, werde ich diese Front ändern, um die richtige zu sein, damit wir anfangen können zu sehen, wie es aussieht um die hier oben auch zu ändern. Also wieder, wir können sehen, dass es unter mehr Umständen verwendet wird und beginnen, eine Vorstellung von dem Feld zu bekommen, dann für den Körperfonds. Obwohl der Stift hat PT Sands als die Körperjagd zusammen mit Bavis neu zu verwenden, werde ich tatsächlich die Brandon Front von unten unten hier wählen, und ich mag dieses hier wirklich. Ich bevorzuge es, wie klar und leicht zu lesen ist. Also nochmal, wir werden das auf ah Brendan Checklisten hinzufügen, damit wir alles zusammen an einem Ort wachsen und wir beginnen können zu sehen wie alles aussieht, wenn es zusammen saß. Dann werde ich das ändern, um die richtige Option zu sein. Sie sehen, es ist sehr sauber, sehr leicht zu lesen und für die Karosseriefront auf der Website. Also, wenn wir irgendwelche Blockposts oder solche Dinge haben, wird es wirklich einfach und wirklich einfach aussehen. Schön auf der Website. Ändern Sie das auch auf Das ist schon Brendan. So gehen sie, so können Sie beginnen zu sehen, wie die gut Seite an Seite aussehen. Weiter oben ist Farben haben empfohlen, betrügen 3 bis 5 Farboptionen für Ihre Marke, da mehr als fünf könnte ein bisschen viel sein, und Sie gehen, um verschiedene Farben zu erzwingen, nur um sie in Ihrer Website zu verwenden. Versuchen Sie also, innerhalb von 3 bis 5 Farboptionen zu bleiben, wenn Sie können, nur um es einfacher für sich weiter unten auf der Linie zu halten. Zurück zu meinem Pinterest-Board für das Website-Design Inspiration. Ich habe hier zwei Bilder oder zwei Stifte für Farbinspiration gespeichert. Ich werde diese heute wählen, weil ich wirklich liebe die kühne Art von fast primären Stil Farben, und ich denke, sie werden wirklich gut funktionieren. Also werde ich nur ein paar Kreise über die Branding Checkliste machen, damit ich diese Farben in meine Checkliste bekommen kann . Okay, also haben wir fünf Kreise bereit, mit den Farben auszufüllen, die ich verwenden möchte. Also ich, beginnend am Anfang und auf meinem Vorschau-Editor Besuch sehr nützliches Werkzeug in der Farbauswahloption bin ich. Ich kann dieses Pipettenwerkzeug hier aufnehmen und mit dem Mauszeiger über die Farbe bewegen, die ich in der Pin möchte und es auswählen. Es wird auf den Bryant Mischrichtlinien die Farbe, die ich verwenden möchte, ausfüllen. Da haben wir also die erste Farbe. Also werde ich nur auf Einträge die fünf Farben aus diesem Bild auf Pinterest als meine Farbpalette für meine Brendan Richtlinien zu verwenden fortsetzen . Ok, da gehen wir. Ich habe meine fünf Farboptionen gibt, und ich denke, das sieht wirklich cool Sache, dass sie wirklich gut zusammen aussehen. Und auch, ich kann beginnen zu sehen, wie sie neben den lustigen Spuren aussehen, die ich gemacht habe und vor allem mit diesem Baby ist neue Front. Ich denke, es wird wirklich mutig und stark sein, und deshalb bin ich sehr aufgeregt darüber. Eso Diese Farbe Augentropfer Option ist wirklich nützlich. Es ist wirklich praktisch Trick, weil es bedeutet, dass Sie sich keine Gedanken über Farbcodes machen müssen oder woher Ihre Farbinspiration kommt. Wenn ein Bild Ihre Aufmerksamkeit erregt, können Sie die Kohlen daraus auswählen und einfach auf den Kopf knacken. Wenn Sie also bereits einen kleinen Blick auf die Einstellung von Farben und Squarespace hatten, wissen Sie, dass wir eine Baumzelle oder RGB-Farbcodes benötigen, um den genauen Farbbezug auf unsere Website zu erhalten . Und Aber keine Sorge, ich habe einen praktischen Trick, um Farbcodes für Websites zu bekommen, also fürchte dich nicht zu, wird das entscheidende Detail hier am Ende dieser Lektion bekommen. Okay, erster Schritt sieben da. Dies ist ein bisschen eine Bonus-Option, aber es kann wirklich helfen, die Stimmung und das Gefühl Ihrer Marke zu definieren, um einige Muster, Stockbilder oder Texturen enthalten . Dies befindet sich unter dem Stilbereich unserer ursprünglichen Forschung. Andi, wenn wir zu meinem Pinterest-Board gehen, , siehst du,dass da ein paar Pins drauf sind, auf die ich noch nicht verwiesen habe. Das sind also meine Bonusoptionen für Schritt sieben. Ich liebe die schlichte und kühne Ästhetik des Gentlewoman-Magazins. Ich fühle, dass die Farbpalette der Tabletts und zusammen mit der neuen Titelfront des Babys reflektiert, ist wirklich gut. Ich habe auch zwei Bilder von einem Produkt unter Poster von Dita Rams Design gespeichert. Auch hier haben wir diese starke, mutige und einfache Verwendung von Farbe zusammen mit einfachen Formen. Ich werde diese für den letzten Schritt im Hinterkopf behalten. Nummer acht, mein Logo. In der nächsten Lektion werden wir uns näher mit dem Logo-Build beschäftigen. Also habe ich diese Pins auf meinem Brett bereit für sie. Jetzt habe ich meine Checkliste auf meinem Pinterest-Board. Ich habe das Gefühl, dass dies alles in die richtige Richtung mit dem allgemeinen Gefühl, das ich für diese Website möchte . Also nur der letzte kleine Trick, um diese Farbcodes für unsere Farbpalette zu bekommen. Gehen Sie einfach zum Farbcode-Picker dot com. Nun, Sie können,wissen Sie, Tabletts und Bild hochladen wissen Sie, , um die Farben aus dieser Farbpalette auszuwählen. Also, das ist eine wirklich nützliche Website neben Pinterest zu verwenden, weil wir mit der rechten Maustaste auf das Pinterest-Bild klicken können , nur um das Bild und den Download-Ordner zu speichern. Und dann können wir diesen Zahnfarbcode hochladen, größere Website und Erfolg auf. Dann können wir durch den Prozess des Schwebens über die jeder der fünf einzelnen Farben . Onda, wir können notieren gut, das gibt uns die RGB das Hex gut auf den A-Meißel Code, also wenn du sie alle wissen willst. Aber ja, noch einmal, eine super einfache Möglichkeit, die Farbcodes von einem Bild zu finden, war nicht so. Das ist großartig. Sieh mal, wie weit wir gekommen sind. Wir haben im Grunde unsere eigenen persönlichen Branding Richtlinien gemacht und bereit, auf unserer Website zu verwenden , um es wirklich zu unserem eigenen eso zu machen. der nächsten Lektion werden wir uns mit der Gestaltung und Erstellung unseres eigenen Logos im Squarespace beschäftigen. 4. Squarespace Logo: Jetzt, da wir unsere Markenrichtlinien unten haben, ist es an der Zeit, ein Logo für unsere Website zu erstellen. Wie bei den Markenrichtlinien, werden wir dies einfach und erreichbar halten, indem wir den eingebauten quadratischen Logo-Builder verwenden. Dies ist ein großartiges Werkzeug, das Weltraum ist. Bietet on ermöglicht es Einsteigern innerhalb von Täufern, leicht ein Logo für ihre Website zu erstellen , ohne einen Grafikdesigner zu benötigen. Wenn Sie ein Squarespace-Konto haben, können Sie das endgültige Logo kostenlos herunterladen, damit es anderswo verwendet werden kann. Also gehen wir auf unsere Squarespace-Website und navigieren zum Designbereich oben hier. Wir haben im Moment ein Logo auf dem Titel. Wir haben gerade unseren Website-Namen in den Website-Titel-Abschnitt geschrieben. Aber wenn wir nach unten scrollen und ein neues Logo erstellen auswählen, wird es uns zu einer neuen Seite für den Squares-basierten Logo-Builder führen. Cool. Also, was für ein toller Willkommensbildschirm. Das ist genau das, was wir suchen. Logo ist einfach gemacht. Ich werde meinen Website-Namen hier eingeben. Es ist schon das, und das führt uns durch die zahnige Design Page, die verspricht, nach einem Symbol und nach unserem Logo zu suchen, so dass ich nur für eine Sekunde klicken und lassen Sie uns einen Blick um. Wir haben den Website-Namen vorne und Mitte im Design-Panel hier, die sich auf diesem Gitterhintergrund befindet. Das wäre also super nützlich, um Sachen unten anzubringen. Hier unten zeigt uns Squarespace einige Mock Ups von realen Nutzungen unseres Logos. Also wieder, das wird wirklich nützlich sein, um uns zu helfen, zu visualisieren, wie das Logo im wirklichen Leben aussehen wird . Wir können den Bildschirm mit diesen Stunden erweitern. Hier bin ich auf ein paar der Einstellungen hier oben zu ändern. Ich bin eine Rückkehr auf, Snap to grid on. Gehen Sie zurück zum Bildschirm hier. Wir haben hier den Namen der Website, und dieser muss nicht im Logo enthalten sein. Wir könnten nur ein Symbol haben, aber ich werde es vorerst hier drin behalten und sehen, wie wir gehen. Wenn ich den Website-Titel auswähle, können Sie sehen, dass wir einige zusätzliche Optionen erhalten, um die Frontfamilie ändern zu können. Die Frontfarbe, das Frontgewicht auf der Vorderseite abgestanden. Also eine Sache zu beachten, er ist, wenn wir in der vorderen Familie Auswahl suchen, dass es eine viel begrenztere Geldauswahl in der Logo-Builder als auf tatsächlichen Squarespace selbst an der Titelfront, dass ich wählte, dass Babys neu. Es ist eigentlich nicht in dieser Liste der Fronten hier, was bedeutet, dass ich wahrscheinlich nicht halten werde, dass der Text Teil der Logo-Rechnungen ist, denn ich möchte wirklich an meine Markenrichtlinien halten und dieses kühne, starke Aussehen und Gefühl schaffen von meinem Inspirationstafel. Also werde ich einfach den Titel löschen, so ausgewählt es und drücken Sie Löschen, und dann werde ich mich nur auf das Symbol als mein Logo konzentrieren. Ich habe an eine Arbeit gedacht, um den Website-Titel in der Front zu bekommen. Ich möchte neben meinem Logo auf der Website, also schauen wir uns das später in der Klasse für mein Logo-Icon an. Ich möchte etwas finden, das mein Website-Leitbild darstellt. Ich wollte auch in meine Markenrichtlinien und Inspiration Board passen, um mutig, einfach und klar zu sein . Also hier drüben auf dem Suchfeld, schwächen Sie den Typ in einer Weise, um nach Symbolen zu suchen, die darstellen könnten, was wir wollen, unser Logo zu sein . Also schauen wir zuerst nach Bäumen. Sinas. Das ist eine meiner Fotokategorien auf der Website. Wir haben eine Auswahl an Baumsymbolen hier, die Sie sehen können, kommen im Fenster. Ich liebe keins davon, besonders ich habe nicht das Gefühl, dass sie die Gesamtdarstellung des Leitbildes geben , das ich wollte. Also lasst uns etwas anderes versuchen. Schauen wir uns stattdessen Berge an. Okay, cool. Also scrollen wir nach unten. Hier gibt es eine gute Auswahl an Berg-Ikonen. Insgesamt fühle ich mich, dass es mehr von diesem Landschaftsgefühl abgibt, was meinem Missionszustand entspricht. denke nur zurück zu meiner Forschung auf Inspiration Board hier und nur Blick auf die saubere, starke, einfache Linien und die Formen, die wir von diesen Details Gramm Designs hier hatten. Ich denke, ich werde für diesen hier gehen, der in einem Kreis ist. Es passt gut zu den kräftigen, starken Linien und das Kreiselement bindet sich von meiner Inspiration auf diese Detailgramme hier . Wenn wir das Symbol schwächen auswählen, verschieben Sie es in die Mitte des Bildschirms und es ist so eingestellt, dass es auf das Raster einrastet, was ohnehin nützlich ist. Aber wenn wir etwas anderes hier drin hätten, wäre es nützlich, das in der Lage zu sein. Wir können es ziehen, um es auch ein bisschen größer zu machen, was glücklich sein wird zu sehen, womit wir arbeiten. Und Squarespace ist bereits die Live-Beispiele hier unten aktualisiert, so dass wir sehen können, wie es in einer Visitenkarte auf einer Website und sogar auf einem T-Shirt aussehen würde , was ziemlich cool ist. Also, wenn wir das Logo auswählen, kommt es auch mit dieser Farboption hier, so dass wir ihre Farbe von Schwarz zu einer unserer Markenfarbe ändern können . Genau das wollen wir alles im Einklang mit unseren Markenrichtlinien halten. Also, wenn, was Sie mussten, entweder die Farbe könnte eine Website auswählen. Wenn Sie immer noch das öffnen und mit Ihrem hochgeladenen Bild, Sie können auf die Farbe klicken und es bringt Sie den RGB, den Hex-Code und den Alter l-Code. Der Hex-Code wird also symbolisiert, indem er diesen Hashtag davor hat. Also könnten wir das einfach von dort nehmen das kopieren. Andi, lass es hier rein. Da gehen wir. Also, wenn wir haben die Farbe könnte eine Website dann wählen. Das ist ziemlich einfach, den Code des Farbcodes in den Squarespace-Logo-Builder hier zu bekommen. Okay, jetzt wissen wir, wie wir unsere Ex-Codes bekommen, nur ein paar der anderen Farben ausprobieren, nur um zu sehen, wie sie aussehen. Also denke ich, jetzt werde ich mit dieser roten Farbe gehen. Dann sieht es in den folgenden Beispielen ziemlich cool aus, und es passt gut zu dieser mutigen Ästhetik, nach der ich gesucht habe. Also, um das zu speichern, lassen Sie uns gehen, um das Logo hier unten zu speichern. Und es sagt uns jetzt, dass wir unser Logo kostenlos herunterladen können. Und weil ich ein Squarespace-Konto habe, kann ich es kostenlos herunterladen. Also klicken wir auf Download. Und so haben wir jetzt die Möglichkeit, in Farbe schwarze Linien oder weiße Linien herunterladen zu können . Das ist wirklich cool, da es eine Chance gibt, dass Sie Ihr Logo in Schwarz oder Weiß an verschiedenen Orten verwenden müssen . Das ist also ein wirklich praktischer Tipp, und ich würde raten, alle drei herunterzuladen, wenn Sie kommen, um Ihr Logo herunterzuladen, nur so dass Sie sie dort haben, also wird es uns einen Download Gewalt von PNG geben, die noch eine wirklich nützliche Sache, die ich bin. Das bedeutet also nur, dass es keinen Hintergrund für das Logo geben wird. Es werden nur die Linien sein, wie wir sie hier sehen. Das ist also sehr nützlich für die Verwendung auf der Website oder an anderen Orten, weil wir das Logo auf einen anderen Hintergrund setzen, was uns nicht viele coole Optionen geben könnte Weiter unten in der Zeile ist es eingestellt, um eine Dateigröße von 2000 Pixel x 2000 Pixel, und wenn wir hier unten klicken, sehen Sie, wir haben Optionen, um mehr als das oder weniger als das zu gehen, je nachdem, was wir brauchen. Und so 2000 Pixel breit sind mehr als genug für jetzt, werde ich dabei bleiben. Ich werde nur die Farboption für jetzt herunterladen. Und aber wie gesagt, wenn Sie kommen, um Ihr Logo herunterzuladen, lade ich alle drei herunter und dann haben Sie sie dort. Und wenn du zurückgehen willst, weißt du, dass er hier klickt, um das Logo zu bearbeiten und es dann erneut herunterzuladen. Also hier ist mein Logo P und G. Download hier unten und das wird in meinem Downloads-Ordner sein. Ich bekomme auch eine E-Mail von Squarespace mit einem Link zu meinem Logo. Das ist also wieder super nützlich für die Zukunft. Das bedeutet, dass wir immer unser Logo finden können. Wir müssen uns keine Sorgen machen, dieses Fenster zu schließen, weil wir die E-Mail erhalten. Als nächstes möchte ich mein Logo neben meinen Markenrichtlinien und Inspirationstafeln hinzufügen, um sicherzustellen , dass es in den Gesamtlook passt, den ich für mein Branding gemacht habe. Es wird eigentlich am schnellsten und einfachsten sein, einen Pin aus meinem heruntergeladenen Logo zu erstellen. Datei S. Also das ist mein Vorstand hier. Also, wenn ich einfach zum Plus gehe, eine Pin erstellen und aus Downloads das Logo hinzufügen, das ich dort will, und ich muss mich nicht darum kümmern, etwas darüber zu schreiben, weil dies nur für mich ist und es auf der richtigen Tafel veröffentlicht wird . Also werde ich nur zu veröffentlichen drücken. Das ist also das Logo saß jetzt mit dem Rest meiner Freundschaft. Und wenn wir das Dokument der Markenrichtlinien wieder nebeneinander bringen, also haben wir diesen geteilten Bildschirm, dann können wir sehen, wie alles zusammengesetzt aussieht. Wenn Sie Ihre Markenrichtlinien in einem neuen Dokument erstellt haben, ist das großartig. Sie können dort Ihr Logo hinzufügen. Ich versuche nur, dies einfach zu halten und es ist einfach wie möglich, also ist es für jeden zugänglich. Indem ich also eine Kombination von Pinterest auf meiner Branding-Checkliste verwende, habe ich Referenzen für meine eigene persönliche Marke. Richtlinien zum Logo. Nun, äh, also können wir dort wirklich sehen, wie alles zusammenhängt und wie es auf der Website aussehen könnte. Er ist diese tolle Farbpalette hier und ein netter starker Fonds und hält alles sehr einfach und referenziert einige Kreise im Logo und mutige, starke, klare Linien. Also bin ich wirklich glücklich darüber, wie alles zusammenkommt. Eso Hoffentlich bist du in Andi. Sie können sich jetzt Zeit nehmen, um Ihr eigenes Logo zu erstellen. Andi, arbeiten Sie das in Ihre Branding Richtlinien, um Ihre eigene persönliche Marke zu beenden, und das ist ein wirklich großartiger Start, um Ihre eigene Website mit Squarespace zu entwerfen 5. Welche Squarespace Version?: bevor wir uns in Squarespace begeben, um uns den Logo-Builder anzusehen. Nur ein Hinweis auf die verschiedenen Squarespace-Versionen. Squarespace hat vor kurzem ein jungfräuliches 7.1 ab Januar 2020 gestartet. Also, wenn Sie Ihr Konto nach dieser Zeit eröffnet haben, sind die Chancen, dass Sie automatisch in eine squarespace 7.1 Version Website gesetzt werden. Und so ist meine Klasse hier alle auf einem Squarespace 7.0. Und so, um zu überprüfen, welche Version Ihre Websites auf. Wenn Sie in Ihren Website-Builder gehen und helfen mussten, dann können Sie dort sehen, ob Sie in Version 7.0 oder 7.1 sind. Also, wie ich meine Klassen auf Version 7.0 sagte, wenn Sie also eine Website gestartet haben, die Andi nicht zu weit gekommen ist, dann ist es vielleicht am besten, Ihre Website in Version sieben Punkte zu wiederholen. Sie können dies tun, indem Sie dem Link in der Klassenbeschreibung folgen und das führt Sie zum Vorlagenspeicher für Version sieben Punkt. Oh, aber wenn Sie ziemlich weit auf Ihrem Website-Build haben und Sie mit 7.1 weitermachen wollen und ich werde in Zukunft eine Klasse dafür machen. Aber während sie immer noch Dinge herausfinden, haben 7.1 Andi Änderungen daran vorgenommen? Ich bleibe bei 7.0, und im Moment, und ich glaube, dass das die bessere Option für jetzt ist. Also entweder knacken, wie Sie sind, oder Sie können einen Schritt zurück machen und mit 7.0 hier neu aufbauen, wenn Sie Fragen haben, oder wenn Sie mit etwas mit 7.1 stecken. Ich habe in gebaut ein paar Websites damit verwendet, so dass ich in der Lage sein könnte zu helfen. Und wenn Sie eine Frage im Diskussionsbereich hier fallen lassen, kann ich Ihnen dabei helfen. Andernfalls lassen Sie uns mit dem Aufbau unseres Logos aufknacken. 6. Workflow Hack: Jetzt werden wir uns ein bisschen einen Workflow-Hack ansehen. Ich verspreche, wir kommen als Nächstes in den Squarespace. Aber wie bei den meisten kreativen Dingen geht es oft um die Vorbereitung. Bevor wir uns in den Squarespace begeben, wollen wir sicherstellen, dass wir alle Enten hintereinander haben. Wir haben unsere persönlichen Markenrichtlinien und unsere Research on Inspiration kuratierte Kollektion auf Pinterest. Wir haben unser Logo, also wollen wir so viel wie möglich in einen leicht zu finden einen Ort einreichen, bevor wir squarespace mussten . Also, wenn wurden tief in der Gestaltung unserer Website begraben. Wir haben alles, was wir brauchen, schreibt eine Hand oft in der quadratischen Raumplattform. Wenn Sie nach einem Bild suchen, das Sie hinzufügen oder kopieren möchten, kann es etwas frustrierend sein, zu finden, was Sie wollen. Also habe ich gerne einen Ordner auf meinem Desktop. Ich bin in die Branding-Informationen organisiert, alle Bilder, die ich auf jeder Kopie möchte, die ich vor dem Schreiben in Squarespace geschrieben habe. Sie sagen, Sie beginnen, einen großen Blockpost im Squarespace zu schreiben und es stürzt ab. Du wirst potenziell verlieren, was du geschrieben hast. Also versuche ich immer gerne offline in Wort oder Seiten zu schreiben. Und dann kann ich es kopieren und in Squarespace einfügen, wenn ich auf der Website und online bin und es ist bereit zu gehen. Also in Bildern habe ich gerade im Moment die Bäume, die wir in den Baumbereich hochgeladen haben . Andi im Branding haben wir unsere Brendan Guideline Checkliste auf unserem Logo einsatzbereit. Also werde ich ein bisschen mehr in meine Kopie Abschnitt auf meinem Bildbereich hinzufügen, und ich werde Sie in weniger und fünf sehen, wenn wir in squarespace beginnen werden, um unsere Website unsere Straße zu machen . 7. Site: Okay, also werden wir jetzt auf unsere Squarespace-Website gehen und im Designbereich des Website-Builders arbeiten , damit wir anfangen können, unsere Website wirklich zu unserer eigenen zu machen. Wenn wir vom Startbildschirm in den Designbereich klicken, können wir sehen, dass es ein Menü von Optionen jetzt auf der linken Seite gibt. Wir haben bereits den Logo- und Titelbereich besucht, um unser eigenes Logo zu erstellen. Also lasst uns wieder dorthin gehen, damit wir das auf unserer Website installieren können. Wenn wir also hier zum Logo-Bild gehen und klicken, um ein Logo hinzuzufügen, wenn wir uns in der letzten Lektion erinnern, richten wir unser Ordnersystem so ein, dass wir ah Website-Ordner auf unserem Desktop haben. Schön und leicht zu finden und wir können sofort in das Branding navigieren und in das Logo , das wir heruntergeladen haben und in dieser letzten Klasse. Ok, cool. Also haben wir hochgeladen PNG Farbe des Logos I m. Also, wenn wir drücken speichern und wir sehen, dass das Logo, wie hier erklärt wird und das Logo ersetzt thes Website-Titel auf der Website, so dass Symbol jetzt in anstelle von ärgerlichen Fotografie entlang es gegangen s Wenn Sie sich erinnern, als wir das Logo im Squarespace-Logo-Builder gebaut haben, war ich nicht in der Lage, den Website-Namen in der Front aufzunehmen. Ich wollte als Teil aus dem vollen Logo. So arbeiten sie um, dass jetzt ist, die Slogline-Option hier entlang der Seite, das Logo-Symbol zu verwenden . Also, wenn ich kopieren und einfügen in ihre und drücken Sie einfach speichern, so müssen wir die Mittel in der Farbe aktualisieren und so weiter. Aber Sie können sehen, dass wir jetzt unser Symbol neben unserem Website-Titel haben und wir werden in der Lage sein, das in die Front zu setzen, die wir als Teil unserer Markenrichtlinien gewählt haben, die der Babys neue Fonds dort war. Also, das ist nur ein bisschen eine Arbeit da herum. Wenn Ihnen das Gleiche passiert, dass die Vorderseite nicht im Logo Squarespace Logo-Builder verfügbar ist und Sie es als Teil des Slogons dort verwenden können, um immer noch Ihren Website-Titel auf der Website zu haben , weil die Verwendung des Symbols den Website-Titel ersetzt und Das ist also völlig individuell. Es ist möglicherweise nicht notwendig für Sie in Ihrer Website oder es könnte etwas, das Sie nicht sicher sind , ob Sie den tatsächlichen Titel neben dem Symbol haben möchten, so haben Sie ein Spiel um. , Weißt du, ich habe es nicht abgenommen und gesehen, was du denkst. Wenn du den Zeh kämpfst, entscheide, was du magst. Ich finde es oft hilft, nur ein wenig vom Bildschirm weg zu treten und später mit frischen Augen darauf zurückzukommen und zu sehen, wie Sie sich fühlen, wenn Sie den Bildschirm wieder öffnen. Und was deine unmittelbare Reaktion ist, hilft oft zu entscheiden, ob du etwas magst oder nicht. Okay, also haben wir das Logo-Symbol in Sicht. Titel. Heck, eso Jetzt ist Zeit, um mit der Größe zu spielen und die Vorderseite rechts auf diesem Logo zu bekommen. Slogan! Hier müssen wir den Kopf aus dem Logo-Berechtigungsbereich und in Seiten Geschichten zurück im Design-Menü. Wenn Sie bereits in diesen Abschnitt des Website-Builders gewagt haben, könnte es sein, wo Sie am meisten frustriert oder verwirrt gelandet sind. Ich weiß, dass ich das war, als ich hier ankam. So bedeutet Site-Styles einfach nur die Stile innerhalb Ihrer Website. So können Sie von hier aus alles wählen, von den Farben der Fronten und dem Hintergrund Ihrer Website bis hin zur Dimensionierung der Dinge. Wenn es nach links oder rechts rechtfertigt, wissen Sie, dass alles so ist, wie die Elemente mit jeder Website aussehen, es ist hier entschieden, so kann es ein ziemlich Gebäude zu beginnen scheinen. Aber ich werde diesen Abschnitt vereinfachen, von der Zeit, die ich in diesem verbracht habe, ist es Tails Menü. Es gibt wirklich nur zwei Hauptwege, um Sites Geschichten zu nähern. Also Option One ist mit dem vollständigen Menü hier, um oben in diesem Seitenmenü zu beginnen und Ihren Weg durch jede Option nacheinander zu arbeiten . So zum Beispiel können wir zum Beispieldie Farbe und die Hintergrundfarbe der Website ändern. Das ist die erste Option, die wir hier bekommen, und Sie können weiter unten die Speisekarte, ändern Sie die Dinge einzeln, während Sie nach unten gehen und sehen, wie das aussieht. Dies ist eine gute Option für Einfachheit. Weißt du, du hast die Spitze angefangen, deinen Weg runter zu arbeiten. Aber wenn Sie einen bestimmten Teil der Website haben, von dem Sie wissen, dass Sie anfangen möchten und wo Sie das Styling ändern möchten, wird es ein bisschen frustrierend sein, alle anderen Entscheidungen zuerst durchzuarbeiten , bis Sie zu dem Teil kommen, mit dem Sie tatsächlich beginnen möchten und ändern möchten. Also, wenn wir nur abgebrochen und verwerfen diese Änderungen und gehen zurück, wo wir, wie wir es hatten und die andere Möglichkeit, Websites zu nähern Geschichten ist die Verwendung der Hover Auswahloption. Also, wenn wir mit der Maus auf Dheim für über den Bereich der Website, die wir ändern wollen , so wollen wir mit dem Logo hier beginnen, weil das ist, was wir gerade in gesetzt haben, und wir wissen, dass es noch nicht ganz richtig ist. Dann sehen Sie eine blaue Box erscheint um den Bereich, in dem unsere Massen schweben. Wenn ich also hier schwebe und die Menüoptionen auf der linken Seite sammle, ändere nur die Variablen, die für diesen Abschnitt zur Bearbeitung verfügbar sind. Alles, was ich jetzt sehen kann, ist nur das, was hier oben relevant sein wird. Das ist also nur eine andere Möglichkeit, das Menü auf der linken Seite zu fokussieren, um Ihnen nur das zu zeigen, was Sie sehen müssen . Wenn Sie zurückkehren möchten, um alles zu betrachten, können Sie klicken, alle anzeigen oder zurück zu hier und alles ändern, wenn ein blaues Feld erscheint. Dann können Sie klicken und es wird Ihnen die Sehenswürdigkeiten Geschichten geben, die für den Abschnitt relevant sind, den Sie gerade ausgewählt haben. Durch die Auswahl dieses oberen Abschnitts hier, es ist uns gegeben, die Seiten Schwänze für den Website-Header. Also fangen wir an, uns durch diese viel kürzere Liste hier jetzt von oben nach unten zu arbeiten. Sobald Sie sich mit Website-Stilen vertraut gemacht haben, ist es einfacher, die Abschnitte, die Sie ändern möchten, ein- und auszuschalten. Aber für den Anfang empfehle ich, die Menüs für jeden Abschnitt von oben nach unten zu durchlaufen, besonders für einen. Wir stehen am Anfang des Aufbaus unserer Website. Wir wollen alles aufstellen. Wir müssen jede Option überprüfen, um sicherzustellen, dass sie so ist, wie wir es wollen. Also sind wir auf der Website Leiter der Sektion. Ich beginne an der Spitze mit Logo-Bildgröße, so dass wir nur mit der Pixelgröße für unser Logo herumspielen können. Also einfach zu tun ist rein mit Auge und Gefühl zu sehen, was ich mag. Site-Titel hier. Wenn wir uns erinnern, hat das Logo-Symbol den Seitentitel ersetzt. Also gibt es keinen Sinn für mich, in diese Menüoption zu gehen, weil mein Website-Titel nicht sichtbar ist , aber für Sie könnte es sein, dass , Sie vielleicht kein Nikon-Feel-Logo haben, also könnte dies sein, wo Sie hingehen und Sie fügen Ihre Gelder und Farben und Dinge wie dieser Trio-Website-Titel. Also haben wir den Website-Untertitel, weil das unsere Arbeit war, um den Website-Namen zu bekommen . Also, wenn wir hier reingehen, können wir unsere Front wählen, die wir als Teil unserer Markenrichtlinien ausgewählt haben, und gehen einfach durch jede Option und überprüfen, was verfügbar ist. Und wenn es etwas ist, das Sie ändern möchten und wenn Sie nicht sicher sind, was das Ding tut, spielen Sie einfach ein Spiel und bewegen Sie den Schieberegler und sehen, was passiert. Und ich fand, dass das der einfachste Weg ist, um herauszufinden, was los ist und sich nicht zu sehr darum zu kümmern , was die Menüoption bedeutet. Nehmen Sie einfach einige Änderungen vor und sehen Sie, was passiert. Ich will, dass das im Einklang mit dem Rand des Kreises steht, und dann ging ich zu Ihnen zurück hierher, um das wieder da drin zu haben. Verbreiten Sie das ein wenig mehr, damit Sie auf der linken Seite der Menüoptionen sehen können. Wenn wir eine Änderung vorgenommen haben, gibt es einen großen Kreis neben dem Menüpunkt, wo wir eine Änderung vorgenommen haben. Das ist also nur eine gute Sache zu beachten, um zu sehen, wo Sie Bean haben und zu sehen, woran Sie eine Änderung vorgenommen haben . Es hilft nur. In diesem großen Menü haben Sie sich hier nicht verloren. Also möchte ich hier die Farbe ändern. Also werde ich auf unsere Markenrichtlinien zurückverweisen und in dieses blaue Element ändern. Also, das ist die Notiz, die ich in, als wir unsere pdf gemacht haben, und Sie können einfach über das tippen, um RGB zu sein. Und dann lösche ich das einfach. Und jetzt ist der Name eines Site-Titels in der Farbe, in der wir sein wollten. Nur das ist ein bisschen zentraler, so dass Sie sehen können, wie Sie die Kopfzeilenausrichtung ihr Flusslogo ändern . Unser Untertitel auf unserer Speisekarte zu Central macht einen Unterschied dazu, wie sich die Website anfühlt. Wir können es auch ändern, um richtig zu sein, gerechtfertigt, was nicht für mich ist. Also denke ich an einen Stock mit Zentrum. Ich bin schon so, wie mutig das ist. Vielleicht gehe ich sogar wieder rein. Drücken Sie einfach die Größe auf, dass ein bisschen mehr. Nur so. Es ist wirklich eine starke Wirkung, wie wir von unserem Inspirationstafel hier hatten. Es ist alles sehr mutig und ein bisschen im Gesicht und das bis zu Max. So ist es leicht zu lesen. Ja, das ist abgekühlt. Lassen Sie das ausgewählte großartig. Also haben wir jede der Menüoptionen für den Leiter des Abschnitts dort durchlaufen, was nicht zu lange dauerte und relativ einfach war. Sobald wir das ausgewählt hatten und wir wussten, wo wir arbeiteten, fühlen sich das Gefühl, dass es wirklich anfängt persönlicher für mich und meine Marke auszusehen, was großartig ist, selbst ihre kleinen Änderungen machen schon einen großen Unterschied. Also, um sicherzustellen, dass Sie diese Änderungen nicht verlieren, nur drücken Sie speichern hier oben. Und sonst könnten wir es. Es würde wieder so zurückkehren, wie wir es vorher hatten. Es gibt große Kreise sind von dort als auch gegangen, weil wir diese neuesten Änderungen bei jedem Klick zurück gespeichert haben, um alles zu zeigen, was wir haben die vollständige Menüoption wieder. Drei. Scrollen Sie nach unten durch die vollständige Menüoption. Wir können das sehen, wenn unsere Maus über die vielen Optionen hier unten schwebt. Ein blaues Kästchen wird ebenfalls im Website-Fenster angezeigt. Das ist also nur eine andere Möglichkeit, dass Squarespace uns hilft zu sehen, welche Seiten Geschichten sich beziehen und was sich ändern wird, wenn wir anfangen, um unser Logo zu klicken, ist richtig und ist dies. Es ist ein Anfang unserer Website, die jetzt von oben nach unten arbeitet, um unsere Markenrichtlinien für unsere Farbcodes und unsere Gelder auf unserem Pinterest-Board zu verweisen und einfach ein Spiel damit zu spielen, wie Sie möchten, dass die Dinge aussehen. Es gibt kein Richtiges oder Falsches, und es könnte auch später geändert werden. Wenn Sie sich entscheiden, dass etwas, das Sie nicht mögen, Wenn Sie in Ihren Augen Stile sind und Sie eine Änderung vornehmen und Sie sind immer noch da drin, Sie haben immer noch großen Punkt und Sie entscheiden, dass Sie es nicht mögen. Sie können dort oben drücken, rückgängig machen, und das wird die Änderung loswerden, ohne sich um die Speicher- oder Abbruchoption oben kümmern zu müssen . Das ist also nur eine weitere nützliche Sache, die Sie sich merken sollten, ist, dass Sie auf Rückgängig drücken können, um dorthin zurückzukehren, also werde ich meinen Weg durch die Websites arbeiten, erzählt, auf meine Markenrichtlinien in meinem Pinterest-Board verweise und sicherstellen, dass ich alles in , die ich will. Die wichtigsten Dinge, die in diesem Alter eingerichtet werden müssen, sind, was wir in unserer Branding Checkliste haben. Also unsere Fonds die Titelfront in der Karosserie vorne und knallen in den Farben, wo immer wir sie wollen , dass wir bereits unser Logo in haben. Und im Moment halte ich es einfach. Ich benutze keine Texturen oder Muster, aber das können wir später hinzufügen. Aber das Wichtigste für jetzt ist es, es in Fronten und Farben zu bekommen und einfach ein bisschen ein Spiel zu haben . Haben Sie ein bisschen Spaß und sehen Sie, wie die Dinge aussehen. Ok, großartig. Ich freue mich vorerst darüber, wie alles da drin aussieht, und wir haben noch jede Menge Inhalt. Es ist also nicht und einige der Änderungen, die wir noch unnötig ganz relevant gemacht haben. Aber zum Beispiel ändere ich den Text, um nur schwarz zu sein, wenn und wenn es ein Link ist, wenn Sie den Mauszeiger darüber bewegen , dann geht es zu der blauen Farbe, die ich sehr mag, und wir haben alles ist in unseren Fonds, so wirklich schön und leicht zu lesen Körper vorne und dann eine große starke, mutige Titelfront, die großartig ist. Ich bin so nur etwas zu beachten, dass tatsächlich auf der Website navigieren. Sie können das nicht tun, während Sie in Sichtstile sind, weil es nur denkt, dass Sie sind, wenn Sie klicken, es denkt nur, dass Sie wollen, um diese Websites Verkäufe auf, dass ändern. Wenn Sie also auf der Website navigieren möchten, müssen Sie nur zurück zum Design-Menü klicken, und dann konnten Sie nicht zu jeder Seite gehen und sehen, wie alles aussieht. Also werde ich es vorerst dabei belassen. Andi, Sie mit dem nächsten Schritt in unserer nächsten Lektion fort, die sich mit dem Seitendesign und dem Layout der Squarespace-Bücher befasst. 8. Content: Okay, also sind wir in den letzten Schritt, dem letzten Teil des Puzzles, um Ihre eigene Squarespace-Website zu gestalten und es zu Ihrer eigenen zu machen . In dieser Lektion betrachten wir die Verwendung der Blöcke auf jeder Seite, um ein benutzerdefiniertes Layout und Design für Ihre Website zu erstellen . In unserer ersten Klasse, in der wir unsere Squarespace-Website aufgebaut haben, haben wir Inhaltsblöcke angefasst. Nur um dies zu aktualisieren, sind die Bausteine für Ihre Website, so dass Sie leicht auf eine Seite fallen. Verschiedene Arten von Inhalten haben ein Design und Layout, das für Sie einzigartig ist. Also, wenn wir nie zurück zum Home-Menü aus dem Design-Bereich und wählen Sie Seiten die mit der Homepage hier kleben, sehen Sie, wenn ich den Mauszeiger über den Hauptbereich der Homepage, erhalten wir dieses Dialogfeld mit der Option zu bearbeiten. Wenn wir also darauf klicken, sind wir jetzt im Seiteneditor Fenster. Der Inhalt, den wir hier bereits haben, kann verschoben oder gelöscht werden, oder wir könnten einen neuen Block in die Homepage einfügen. Um dies zu tun, müssen wir den Mauszeiger über die linke Seite der Seite bewegen, um das Regentropfen-Symbol zu erhalten. Wenn wir auf den Regentropfen klicken, dann öffnet es ein Menü mit allen verschiedenen Arten von Inhaltsblöcken. Das Symbol für jeden Inhaltsblock gibt einen guten Hinweis darauf, was er ist und wie er aussehen wird . Aber Sie müssen auch mit den verschiedenen Blöcken herumspielen, um zu sehen, wie sie mit Ihrem eigenen Inhalt und Design aussehen . Auf meiner Homepage hier möchte ich noch ein paar Bilder hinzufügen. Also werde ich diesen Hauptbildblock löschen, weil das nur ein Bild ist. einfach den Mauszeiger über selektierte Elite und klicken Sie auf Ja, um dann das Regentropfen-Symbol wieder zu aktivieren, Wählen Sie einen neuen Block. Daher möchte ich aus dem Galerieabschnitt von Blöcken wählen, da diese Option mehrere Bilder angezeigt werden können. Also werde ich die Diashow-Option auswählen. Mein erster Plan für diese Website ist immer, die Bilder in voller Breite auf der Titelseite der Website zu haben . Ich habe jetzt die Möglichkeit, entweder neue Bilder für die Galerie Oregon Link aus der bestehenden Galerie hochladen . Auf einer anderen Seite ist dies eine ziemlich nützliche Option. Andi ermöglicht es Ihnen, eine bestimmte Galerie auf Ihrer Homepage zu zeigen. Wenn das etwas ist, das Sie tun wollten, werde ich ein paar neue Bilder hochladen. Ich habe sie bereits in meiner Ordnerstruktur gespeichert. Gehen, um diese voll auswählen und sehen, wie wir weiterkommen. wir also beim Hochladen in den Design-Tab oben klicken, Wennwir also beim Hochladen in den Design-Tab oben klicken,können wir sehen, dass es viele verschiedene Optionen gibt, mit denen wir unsere Diashow anpassen können. Okay, jetzt sind sie hochgeladen. Wenn wir nur klicken, anwenden Onda hatte erscheinen klicken Sie auf Speichern. Wir können sehen, wie das aussieht. Wir können einfach den Bildschirm dort erweitern, um eine Vorstellung davon zu bekommen, wie die Homepage aussieht, nachdem wir diese Diashow hinzugefügt haben. Also gefällt mir, dass sie groß sind. Aber das gefällt mir nicht wirklich. Wenn Sie zum ersten Mal geben würde die Website eingeben. Sie können das vollständige Bild nicht sehen. Du siehst nur ein bisschen davon. Es sieht ein bisschen aus, ich bin Spender, etwas klobig. Also gehe ich einfach zurück und bearbeite die Seite erneut. Und wenn ich zurückgehe, um es zu bearbeiten und klickte darauf, die Galerie kann ich tatsächlich das Design in eine andere Art von Inhalt Blut in der Design-Wanne ändern . Also haben wir These Lichtshow Option zuerst aus den Regentropfen-Inhaltsblöcken ausgewählt, die vorher kamen . Und aber wir können jetzt auch ein Karussell, ein Gitter oder gestapelt verwenden . Und vor allem jetzt, wo die Bilder hochgeladen werden, können wir ziemlich schnell sehen, wie es aussehen könnte Übergang zwischen diesen verschiedenen. Also schauen wir uns mal an. Ein Gitter. Wir werden auf ein 1 zu 1 Quadrat zuschneiden, vier Bilder. Okay, lass uns mal sehen. Ok? Ja, Much Nieto. Ich mag den Hauptbildschirm wirklich. Nun, wenn Sie sich vorstellen, jemand London auf Ihrer Website landet auf dieser Homepage, das ist das erste, was sie sehen würden, wird ziemlich viel mehr Auswirkungen haben, da der Betrachter in der Lage, mehrere Bilder in voller Höhe auf einmal zu sehen. Ich könnte auch eine kleine Katze haben, die diesen Inhalt Blut unten hier in dieser Zeile darunter verlässt ? Ja. So ist es wieder sauberer. Also kommt jemand auf meine Website. Das ist, was sie landen und sie können für meine Lieblingsbilder entlang der Spitze hier sehen, und sie können das Menü sofort sehen, um zu sehen, was andere Arten von Inhalten, die sein könnten, und sie können mein Logo vorne und in der Mitte sehen. Und wenn sie dann nach unten scrollen, dann sind sie in der Lage, ein bisschen mehr über meine Argumentation hinter, warum ich diese Website gestartet habe zu sehen . Was mein Leitbild ist. Ja, obwohl mein erster Plan war, ein Vollbild-Bild auf der Homepage zu haben, wegen der anderen Design-Entscheidungen, die ich getroffen habe, einschließlich des großen Logos oben hier im Menü. Diese Idee funktioniert nicht mehr so gut, aber das ist okay. Es ist gut, während des gesamten Entwurfsprozesses flexibel zu sein, da Sie nicht immer vorhersagen können, wie etwas nach Arbeit suchen wird, wenn Sie Brainstorming. Also hast du gerade Teoh auch vorbereitet. Sobald Sie in Squarespace kommen, dass eine Idee, die Sie hatten, vielleicht nicht ganz so ist, wie Sie es wollen. Möglicherweise müssen Sie sich anpassen und die Idee ändern, während Sie weitergehen, aber das ist völlig in Ordnung. Du weißt, es gibt kein Recht oder Unrecht und keine Regeln. Es ist das Ihre Website, und Sie müssen damit zufrieden sein. Also habe ich das Leitbild nach unten auf der Seite verschoben, umdie , um Bilder abheben zu lassen und dem Betrachter eine Bestätigung darüber zu geben, worum es bei der Seite geht , wenn sie nach unten scrollen. Und ich werde nur den Funt dafür optimieren, weil es ein bisschen viel aussieht, in den Hauptstädten und im Titelfonds zu sein , wie dieser hier erscheint. Wenn wir also zurück zu Design- und Website-Geschichten gehen und ich das schön und schnell machen kann, muss ich nicht alle diese Optionen durchscannen. Mein Mauszeiger über diese Linie, ich bekomme die Beschnittbox, und wenn ich klicke, gibt es mir die Gestaltungsmöglichkeiten für genau das, Überschrift dorthin, so dass ich hier klicken kann und ich werde es ändern. Toothy Audie Fonds, dass wir Trailer gleich am Anfang. Und ja, ja, das sieht schon besser aus. Ähm, es ist in der richtigen Farbe, die ich speichern möchte. Gehen Sie zurück zum Startmenü Vollbild und ja, das sieht ein bisschen schöner aus. Es war ein bisschen sheltie vorher mit den Hauptstädten, also als Homepage. Ich bin jetzt wirklich glücklich damit, und es hat diese vollen Tonbilder, und wenn die Zuschauer nach unten scrollen, werden sie nicht geschrien, aber sie können mein Leitbild dort unten sehen. Also es ist schön und einfach eso Bevor wir auf die nächste Seite Layout Design gehen, Ich möchte Ihnen eine andere coole Sache zeigen, die wir mit diesen Bildern hier auf dem Home-Bildschirm tun können. Wir können sie tatsächlich in einen anklickbaren Link durch zu irgendwo anders auf der Website verwandeln. Also, wenn wir gehen zurück, um den Seiteninhalt zu bearbeiten, Andi, bearbeiten Sie den Galerie-Inhaltsblock, wählen Sie durch die Registerkarte Design und scrollen Sie nach unten nach unten. Wir können diese Auktion hier sehen, um Links in neuem Fenster zu öffnen, so dass Bilder mit Links in einem neuen Fenster geöffnet werden. Jeder. Wählen Sie das aus, und kehren Sie zur Registerkarte „Inhalt“ zurück. Wenn wir den Mauszeiger über das Bild , bekommen wir diese zusätzliche bewegen, bekommen wir diese zusätzliche Menüoption hier oben. Ich bin damit wir das Bild biegen können. Wir können Bild bearbeiten oder in die Bildeinstellungen schauen, und hier unten können wir Zehe klicken, fügen Sie eine URL. Wenn wir also auf den Euro geklickt haben, haben wir drei Optionen, einen externen Link zu etwas zu einer anderen Website und eine Datei oder ein anderes Stück Inhalt innerhalb der Website, so dass wir tatsächlich wählen können, um auf die Blutseite zu verlinken, die für diese Website. Der Moment ist derzeit eine nicht verknüpfte Seite, so dass sie hier nicht im Hauptmenü angezeigt wird. Nun, wir können auf eine Galerie-Seite verlinken, einen unserer Hügel, Flüsse oder Bäume, Galerie-Seiten. Alles, was wir auf die über Seite verlinken können und wenn wir irgendwelche anderen Seiten da drin hatten und sie würden auch hier auftauchen. Also, wenn ich Bäume auswähle, weil das Bild einige Bäume enthält, so zumindest das relevant ist und klicken, speichern und anwenden und speichern. Siehst du, dass du die Maus über die Bilder bewegst? Und jetzt, wenn wir dieses Bild bewegen, das einen Link zu ihm hat, ändert sich die Maus und wir können sehen, dass es nicht anklickbar ist. Und wenn wir darauf klicken, dauert es eine gerade durch die Baumgalerie, so dass wir zurück zur Homepage gehen können, indem wir auf das Logo oben klicken. Und das ist nur ein weiterer interessanter Weg. Ich wollte Ihnen zeigen, wie Sie die Navigation rund um Ihre Website gestalten und Besucher zum Durchklicken ermutigen können. Und wenn Sie auf diese Bilder klicken, kann es mehr ermutigt werden, in Ihre Website einzutauchen, als wenn sie nur vielleicht die Worte an der Spitze sehen würden . Okay, es gibt also einen endgültigen Design- und Layout-Trick mit Squarespace, den ich Ihnen zeigen möchte. Und dafür werden wir zahnartig über Seite gehen. Unsere Info Seite ist also eine weitere leere Seite, die wir eingerichtet und erstellt haben, indem wir unsere eigenen Bücher für meine eigenen Inhalte hinzufügen. Und so habe ich hier einen Bildblock auf dem Textblock. Nehmen wir an, ich möchte einen anderen Inhalt hinzufügen. Schauen Sie auf diese Seite. Das ist ein zusammenfassender Block mit Links zu, sagen wir, einigen meiner Blutposten. Also gehen wir in die Bearbeitung. Ah, wir können sehen, dass wir hier in der Zusammenfassung Zusammenfassungen haben. Blöcke sind ein weiteres nützliches Tool, um zu sehen, was sonst auf Ihrer Website ist, ohne tatsächlich durch irgendwelche Menüs klicken zu helfen . Sie sind wie eine Werbung für den Rest Ihrer Inhalte, und so werde ich einen Blick werfen, eine Karussell Zusammenfassung Blut, und wir haben die Möglichkeit, Inhalte entweder von der Blutseite, alle Galerie-Seiten, die ich Ich werde blawg auswählen, und der Zusammenfassungsblock verwendet den Platzhalterinhalt, der mit unserem Squarespace-Design geliefert wurde um den Titel der Blutpreisbilder am Datum anzuzeigen. Also, sobald wir herumkommen, um es, können wir diesen Inhalt durch unseren eigenen Blutgehalt ersetzen, der in diesem zusammenfassenden Block hier aktualisiert wird . Aber im Moment bin ich glücklich, nur den Squarespace-Füller-Inhalt verwendet werden zu lassen, damit ich sehen kann, wie es aussehen wird , bis ich Ihnen dies und schließlich Trick zeigen kann . Wenn wir also auf die Layout-Registerkarte gehen, können wir sehen, dass es hier Optionen gibt, wie der Zusammenfassungsblock aussehen wird. Seitenverhältnis Elemente, Perot-Textgröße, Dinge wie diese. Wir können auch die verschiedenen Arten von Zusammenfassungsblock auswählen, um zu sehen, wie sie aussehen könnten als wir den Galerieblock auf der letzten Seite und drei auf der Klinge Wanne hatten. Wir können mehr Einstellungen anpassen, um zu entscheiden, welche Informationen als Teil des Blocks angezeigt werden, und diese Einstellung ändern. Also haben wir gerade den Nagel von der Blutpost auf dem Titel bekommen, also werde ich es einfach dabei lassen, und das ist etwas, wo wieder, es liegt an und das ist etwas, wo wieder, dir, mit den verschiedenen Einstellungen herumzuspielen , es zu deinem eigenen Geschmack und stellen Sie sicher, dass es zu Ihnen und Ihrer Website passt. Eso. Was ich Ihnen zeigen wollte, ist, wie man das Layout von den Blöcken innerhalb der Seite steuert und weil, wie Sie sehen können, wir, wie wir mit der Maus bewegen, bekommen wir dieses Hand-Symbol, was bedeutet, dass wir ziehen können Inhalt aussehen. Aber zu wissen, wohin wir es ziehen und wo es auf der Seite sitzen wird, kann ein bisschen knifflig sein , wenn Sie nicht diesen kleinen Trick haben, den ich ausgearbeitet habe. Die Blöcke sind also alle reaktionsschnell, und sie werden Form und Größe ändern, je nachdem, wo sie sich auf der Seite befinden. Das ist also ein wirklich cooles Feature von Squarespace. Es kann frustrierend sein, wenn Sie nicht herausgefunden haben, wie es funktioniert. Also haben wir unsere drei Blöcke. Wir haben unser Bild, unseren Text und unseren Zusammenfassungsblock hier und so schweben über den Rand des Blocks, um das Handsymbol zu erhalten . Das bedeutet, dass ich jetzt den Block aufnehmen kann und ihn an eine neue Position um die Seite ziehen kann . Also, wenn ich es aufheben und anfangen, es zu bewegen, und können Sie sehen, dass verschiedene Linien erscheinen, je nachdem, wo ich den Block verschoben habe. Diese Zeilen zeigen also an, wohin der Block gehen wird, sobald ich die Maus losgelassen habe. Diese Linie war also oberhalb des Bildblocks. Und jetzt, da ich das Buch dort abgelegt habe, saß es nur in diesem Raum. Also, wenn ich es wieder ziehen und sehen, die Zeile ist Dieb volle Breite der Seite und wenn ich das Buch dort ablegen , ändert es sich, um die volle Breite der Seite zu sein. Und um es wieder dorthin zu bringen, wo wir es vorher hatten, möchte ich nur die kurze Linie unter dem Bild jedes unterhalb des Textfeldes, und es lässt sie an den Ort zurück, an dem wir angefangen haben. Ich kann es auch auf diese Weise ziehen. AM über das Textfeld. Andi, da gehen wir. Ich bekomme die kurze Zeile neben den Lehrbüchern und sie sitzen tatsächlich zwischen den drei. Also habe ich immer eine dreispaltige Seite mit Bildzusammenfassung Andi-Text. also wissen, wo Ihre Blöcke enden werden, ist es besonders nützlich, wenn Sie anfangen, Abstandshalter-Blöcke zu verwenden, um das Layout zu manipulieren. Also lasst uns das wieder auf die Bindung setzen. Das war's. Und lasst uns einen Regentropfen holen, um einen Abstandshalter zu bekommen. Das ist also Teil unserer grundlegenden Inhalts-Looks. Es ist wie Abstandshalter. , Sie können sehen,dass wir die Größe des Abstandshalters ändern können, also gibt es diesen Abstandshalter. Blöcke sind wirklich nützlich. Sobald Sie Ihre anderen Inhaltsblöcke in haben, können Sie diese verwenden, um Füllungen um Sie herum hinzuzufügen, Inhalte, um ihm mehr Platz und sauberere, einfachere Ästhetik zu geben . Aber wieder, zu wissen, wo sie fallen werden und wie man sie manipuliert, ist die Art von letztem Teil des Puzzles für mich, wie man die Website wirklich aussehen lässt, wie Sie es wollen. Also, wenn ich das nach oben ziehe und ich die Zeile über den oberen Rand der Seite bekomme und loslasse, sitzt dieser Block jetzt am ganzen oberen Rand der Seite, so dass alles um diesen Betrag gestoßen wurde. Ich kann es noch mehr runterstoßen. Wir nehmen es wieder hoch. Wenn ich also den Raum einen Block an das Ende des Textblocks ziehe, um diese kurze Zeile zu erhalten und dort abzulegen,können Sie sehen, dass dort abzulegen, er nur neben dem Textblock dort hineingestoßen ist, oberhalb des Zusammenfassungsblocks bin ich, und wieder Ich kann das ziehen und es wird das nach unten drücken und es wird meinem kleinen Autotext geben, dass sie ein bisschen mehr Platz haben. Sie können auch den Raum des Looks auf diese Weise ziehen und die Größe davon in beide Richtungen ändern. Es ist also nicht nur behoben. Sobald Sie es fallen lassen, können Sie weitere Verbesserungen vornehmen. Das war es, was ich dir zeigen wollte. Ich möchte nur wiederholen, wenn Sie Blöcke bewegen, stellen Sie sicher, dass die Platzierungslinie, die angezeigt wird, an der Stelle ist, an der der Block irgendwann enden soll . Denn so sagt Ihnen Squarespace, wo Ihr Inhaltsblock fallen wird. Und wenn Sie einen Block verwenden, um einen anderen Inhaltsblock zu beeinflussen, stellen Sie sicher, dass die Platzierungslinie die Größe außerhalb des Blocks hat, den Sie beeinflussen möchten. Also, zum Beispiel, wenn ich in einem anderen Raum einen Block hinzufügen wollte, aber ich wollte neben diesem zusammenfassenden Block hier sitzen, die Samos , was ich oben oben getan habe, ein Drogen-Thepians des Buches und stellen Sie sicher, dass ich die kurze Linie dort bekomme. Sehen Sie, wenn ich weiter gehe, bekomme ich eine lange Linie, und das bedeutet, dass die gesamte Länge der Seite den Platz einen Block darauf haben wird, wenn ich sie jetzt dort ablege. Aber ich möchte nur, dass der Raum des Aussehens diesen Zusammenfassungsblock hier bewirkt. Also habe ich die kurze Schlange da. Lassen Sie los. Und da gehen wir. Der Raum des Blocks ist mit Summary Block verknüpft. Da saß daneben, Andi, wie der da oben, und da wollte ich ihn fallen lassen. Ich wusste, dass es wegen der Platzierungslinie dort landen würde, und ich weiß, dass es eine neue ist, dass es nicht die ganze Seite beeinflussen würde, weil es nicht die eine lange Zeile war . Also der wichtige Punkt, den ich versuche zu machen und zu machen, ist, dass, wenn Sie wissen, wie die Blöcke funktionieren und was Sie mit ihnen tun können, was Sie mit dem Raum von Blöcken tun können, Sie wirklich in der Lage sind, ein benutzerdefiniertes Layout auf Ihren Seiten mit eigenen Inhalten zu erstellen und machen Sie Ihre Web einzigartig für Sie. Okay, so können wir diese Squarespace-Inhaltsblöcke verwenden, um ein Website-Layout zu entwerfen und zu erstellen, das für uns einzigartig ist. Jetzt ist es vorbei, dass Sie durch Ihre Branding Checkliste arbeiten und Ihre eigene einzigartige Website erstellen . Stellen Sie sicher, dass Sie Ihre fertige Website im Kostenprojekt teilen und lassen Sie uns wissen, wie Sie darüber wie immer denken. Wenn Sie Fragen haben oder irgendetwas anderes, das Sie von mir sprechen möchten, lassen Sie es mich im Diskussions-Tab Bilow wissen. 9. Outro / Abmoderation: Okay, wir haben viel in dieser Klasse durchgemacht. Wir haben Recherchen durchgeführt, um es uns zu ermöglichen, eigene persönliche Markenrichtlinien zu entwickeln. Wir haben unser eigenes Logo in Squarespace erstellt, und wir haben gelernt, wie wir die Tools nutzen können, die uns squarespace in Sicht Styles und Inhalts-Blog's gibt , damit wir wirklich eine Website erstellen können, die für uns einzigartig ist. Ich hoffe, Sie fanden das hilfreich. Andi hat die Klasse genossen und es erlaubt Ihnen, Ihre Seite zu wachsen, Hektik und wirklich entwickeln Ihre Website. Ich vergesse, Ihr auf Inspiration Bild auf der Ziel-Website in das Klassenprojekt unten auf Daz hinzuzufügen . Wenn Sie irgendwelche Fragen oder Probleme überhaupt mit Squarespace haben, stelle ich sie in der Diskussion oben nach unten. Ich werde mich sicher bei Ihnen melden. Danke fürs Zuschauen.