Transcription
1. Introduction: Salut et bienvenue pour commencer votre coté Comment construire votre premier site Squarespace. Je suis Rosanna et je suis un designer de produits et de meubles du Royaume-Uni J'ai construit plusieurs sites Web pour différents projets et appris beaucoup de trucs et astuces en cours de route. Et maintenant je veux les partager avec vous pour que vous puissiez construire votre propre coin d'Internet. Donc vous pourriez penser, pourquoi un bousculement secondaire ? Eh bien, je crois que lorsque vous commencez quelque chose pour vous-même, même si vous continuez à travailler votre travail de jour, vous vous sentez habilité et vous gagnez en confiance. Vous créez des opportunités et de la sécurité pour vous-même. Alors je commence à penser à ce que ton coté pourrait faire pour toi et où ça pourrait t'emmener. Mais vous pourriez penser, Hey, mon Instagram ? Je partage ce que je fais dans mes passions à travers cette plateforme. Mais nos plateformes de médias sociaux ne nous appartiennent pas vraiment. Ils pourraient changer à tout moment. Et nous n'avons pas le contrôle du pouce avec un site web. Nous pouvons fabriquer, sculpter et garder le contrôle de notre propre coin d'Internet. Pourquoi squarespace ? Eh bien, j'ai essayé beaucoup des différents constructeurs de sites Web qui sont là-bas, et j'ai trouvé squarespace pour être le plus facile à utiliser, aucun codage requis et il est entièrement réactif. Ainsi, il fonctionne sur l'iPad mobile et le bureau sans que vous ayez à vous soucier de quoi que ce soit. Ils ont également récemment lancé une nouvelle application pour que vous puissiez la télécharger sur votre téléphone. Imaginez même lorsque vous êtes sur votre trajet pour travailler, vous pourriez travailler de votre côté pour éditer un poste de sang ou poster une image sur votre site Web afin que cela vous donne un niveau supplémentaire de liberté et la possibilité de travailler de votre
côté . Entraînez-vous quand vous voulez tout au long de cette classe de débutants. Avant d'accéder à un site Web pleinement opérationnel, nous allons suivre ces étapes une recherche à la recherche d'inspiration. Il est donc aussi facile que possible lorsque nous venons de construire notre propre site Web à l'énoncé de mission. Ce sera la lumière qui guidera notre coté trois. Suite à travers mon flux de 10 étapes squarespace qui va nous amener d'aucun site Web à site Web et complet. Maintenant que nous avons notre site Web, nous allons travailler sur la structure, assurant que les pages qu'il contient sont faciles à naviguer. À la fin de ce cours, vous aurez un site Web, et la partie la plus difficile est de commencer et vous l'avez déjà fait si bien fait. Maintenant, nous allons nous bousculer
2. Recherche: donc vous pourriez penser, pourquoi devons-nous arrêter avec la recherche ? Eh bien, on est tous occupés. C' est notre coté après tout. Et nous voulons être en mesure de prendre rapidement des décisions efficaces lorsqu'il s'agit de construire un site Web afin que nous puissions passer à la partie amusante de partager des querelles extérieures avec d'autres et créer du contenu. Et en comprenant ce que nous aimons sur d'autres sites, nous pouvons appliquer les mêmes principes à notre propre site Web pour nous assurer qu'il est professionnel, facile et agréable à utiliser pour nos visiteurs. Notre projet de classe aujourd'hui est de partager une capture d'écran d'un site web qui vous inspire ainsi quelques puces sur vos observations. Rappelez-vous, nous l'analysons selon la structure. Donc, comment vous naviguez sur le site Web et où les pages se trouvent. Par exemple, d'autres clics sont nécessaires pour accéder à la page souhaitée par un menu, ou est-il relativement facile de trouver la page que vous recherchez ? Oh, le schéma de couleurs. Les couleurs sont-elles complémentaires ? Est-ce qu'ils vous excitent ou vous font vous sentir détendu ? Ou la mise en page comment et où le contenu est positionné et présenté sur la page et comment cela vous arrive. Jetons donc un coup d'oeil sur le site Inspiration pour mon projet de classe. J' ai choisi le styliste de la marque dot com comme site d'inspiration, et comme vous pouvez le voir tout de suite ici, c'est un site très propre et clair à regarder. Si nous regardons un peu plus en détail la structure du site, nous pouvons voir tout de suite sur la page d'accueil. Les options de menu sont le long du haut ici de chaque côté du logo donc immédiatement nous pouvons voir quelles pages il y a dans le site, mais aussi ce que le site sur le styliste de la marque est en fait tout au sujet. Parfois, vous pouvez avoir un menu sur la gauche ici, un menu de hamburgers. Ça s'appelle, hum, où toutes les pages sont cachées là-dedans qui peuvent avoir des avantages et des inconvénients. Mais pour ici, cela pourrait être un peu négatif, parce que comme nous pouvons voir la styliste de la marque comme des cours en ligne, qui tout de suite vous en dit plus sur elle ? Mais si cela était caché dans un menu, vous pourriez ne pas savoir à ce sujet et peut-être ne pas réaliser que le schéma de couleurs du site Web est également très agréable. Je trouve cela très relaxant et ils ont un peu de calme très, très pâle, léger rose à l'arrière-plan. Le texte noir fort et
clair est vraiment, vraiment très facile à lire et très clair sur le logo lui-même a un peu d'effet métallique à elle, ce qui apporte un élément supplémentaire de luxe. Et si nous regardons le site web de la vie lui-même et regardons la mise en page, nous pouvons voir que c'est un site de défilement complet sur tous. Le contenu a beaucoup d'espace autour d'elle. Donc, c'est de nouveau à ce style propre et clair où vous pouvez tout voir très facilement avec le texte noir sur les images lumineuses et beaucoup d'espace et très facile à naviguer et se déplacer. Donc, si nous regardons mon propre site Web et comment j'ai utilisé mon inspiration du
styliste de marque dot com et l'ai appliquée à mon propre site, vous pouvez voir qu'il a obtenu le menu en haut ici pour cette même structure claire, le schéma de couleurs. J' ai essayé de créer leur atmosphère apaisante avec le schéma de couleurs aussi. Andi. Le contenu a beaucoup d'espace et est très clairement disposé de sorte que tout est facile à voir, donc c'est la leçon à finir. Bien joué. Nous avons abordé le projet de classe là-bas, trouvant un site d'inspiration que nous pouvons analyser pour sa structure, sa palette de couleurs ou sa mise en page. Nous avons examiné comment nous pouvons appliquer cela à notre propre site Web pour le rendre plus facile lorsque nous arrivons à Squarespace. Alors n'oubliez pas de déposer une capture d'écran de votre site préféré dans le projet de classe avec
quelques puces sur vos observations quant à sa structure,
sa couleurs ou sa mise en page.
3. Déclaration de mission: la deuxième et dernière étape de notre section de recherche sera l'élaboration de notre
énoncé de mission . Mais qu'est-ce qu'un énoncé de mission ? Alors que l'énoncé de mission est une courte phrase, résumant pourquoi vous faites ce que vous faites pour quel est votre objectif ? Ce sera votre guide pour vous garder concentré et motivé lorsque la vie entrera
en jeu. Mais quel est mon énoncé de mission ? Eh bien, mon énoncé de mission pour mon propre blawg personnel est de partager mes expériences et mes aventures en défiant ce qui est attendu de nous dans l'espoir que je pourrais encourager les autres à se demander pourquoi. Ok, alors comment peut-on générer un énoncé de mission ? Eh bien, pour moi, la meilleure façon de le faire est de faire une carte mentale. Alors commencez avec un morceau de papier vierge et un stylo, ou même offrez-vous un nouveau livre et un nouveau stylo. Parce que tout le monde aime la nouvelle papeterie et vous commencez un rôle de côté coté gauche. Donc, au milieu de votre carte mentale, commencez par votre agitation latérale afin que cela puisse être de la photographie, puis ayez quelques branches qui
sortent de là, alors nous voulons juste nous concentrer sur ce que vous faites, pourquoi vous le faites et quels sont vos objectifs. Une fois que vous avez quelques branches venant de quoi, pourquoi, dans les buts, vous pouvez résumer les en une courte phrase, peut-être juste sur un post il note, et le coller quelque part ou juste à l'avant de votre ordinateur portable . Ou tapez-le et imprimez-le. Mais mettez ceci quelque part grand et audacieux pour vous rappeler pourquoi vous faites ce que vous faites et quel est votre objectif. Par exemple, adhérant au thème de la photographie, le Y pourrait être de partager un amour du plein air, et l'objectif pourrait être d'encourager plus de gens à sortir. Donc, une phrase simple pour résumer cet énoncé de mission pourrait être de partager la beauté de la
nature à travers la photographie de paysage pour encourager les autres à aller à l'extérieur. C' est la leçon 3 terminée. Nous avons regardé, une mission,
des déclarations, des déclarations, ce qu'elles sont, pourquoi nous en avons besoin et comment en faire une. Alors, nous allons chercher notre site Web inspo, obtenir nos énoncés de mission et nous allons construire notre site Web Squarespace
4. Quelle version Squarespace ?: avant de nous lancer dans la construction de notre site web à squarespace. Juste une note rapide sur les versions du site Squarespace. Si vous venez de vous inscrire à Squarespace depuis janvier 2020, vous
serez automatiquement mis à la création d'un site web dans la version 7.1. Donc, pour changer cela, parce que ma classe ici est exécutée sur la version sept point. Oh donc pour vous assurer que vous êtes dans la même version, dirigez-vous vers le lien dans la classe à propos de la page ici et cela vous emmènera le magasin de
modèles originaux pour squarespace version 7.0 et donc toute ma classe sur la classe suivante de ceci est utilisant squarespace 7.0, et Squarespace met toujours à jour cette version et prend toujours en charge cette version et a indiqué que cela se poursuivra. Ce sont toujours des modifications apportées à la version 7.1. changement Onda en 7.1 est tout à fait différent, donc je vais créer une nouvelle classe à l'avenir quand 7.1 s'est installé. Et pour l'instant, ces cours sur sept points de l'OEA, c'est, je crois, la meilleure option pour l'instant. Donc, si vous voulez vérifier deux fois si vous avez déjà créé votre site, Si vous voulez vérifier deux fois ? Marche sur quelle version tu es. Vous pouvez vous diriger dans votre un constructeur de site Web ici et cliquez sur l'aide, puis vous pouvez voir en
bas . Là, il est dit la version sept point. Oh, et ça dit aussi, quelle famille de modèles nous sommes en ce moment. Donc c'est juste comme ça que vous pouvez vérifier cet eso Continuons avec la classe Maintenant que nous
savons tous que nous allons être dans 7.0 Andi, construisez notre site Web.
5. Flux squarespace squarespace en 10 étapes: Commençons maintenant avec Squarespace. Nous allons utiliser mon flux squarespace en 10 étapes, qui est disponible en téléchargement dans la section ressource de classe. Je vous recommande de télécharger et d'imprimer ceci afin que vous puissiez garder une trace de vos progrès. Et si vous devez vous éloigner à mi-chemin du flux, vous pouvez marquer où vous avez eu Teoh. J' ai également ajouté un espace où vous pouvez prendre des notes. Donc, pendant que nous analysons certains des modèles sur squarespace, si vous voulez prendre des notes contre eux, si vous le faites sur le document, alors il conserve tout en un seul endroit. Andi, j'ai ajouté une case à cocher contre chaque étape parce que ça fait toujours du bien quand on enlève quelque chose. Alors prenez votre énoncé de mission et l'inspiration de votre site Web. Et allons vers Squarespace dot com. Si vous voulez jeter un oeil autour de squarespace dot com. Si vous n'avez pas visité le site Web auparavant, faites-le maintenant. Mais nous allons aller tout droit avec le bouton Démarrer pour commencer notre essai gratuit. Lorsque vous cliquez sur le bouton Démarrer, il vous amène à cette page où, si vous le souhaitez, vous pouvez taper l'objectif de votre site Web. Mais vu que nous l'avons déjà fait dans nos recherches, nous allons aller directement et passer aux modèles. Saisir ce que votre objectif est pour votre site Web ici peut être utile. Mais alors Squarespace vous emmène à travers et limite les modèles que vous pouvez voir et voir comme nous l'avons déjà fait pour que nous sachions quel est l'objectif de notre site Web. On n'a pas besoin de faire ça. Nous pouvons aller directement aux modèles afin d'utiliser les catégories existantes que Squarespace nous a donné ici et aussi, crucialement, inspiration de
notre site Web. Nous allons prendre un peu de temps pour analyser les gabarits, jeter un coup d'œil, cliquer sur les différentes options et simplement nous familiariser avec ce que Squarespace nous offre moyen de modèles. Si nous jetons un oeil plus en détail à la section de la photographie, alors nous pouvons voir qu'il nous donne une sélection de modèles visant à montrer les images, sorte que l'image est un grand sur l'écran. Ils occupent la majeure partie de l'espace, donc il n'y a pas beaucoup de place pour le texte, et il s'agit de montrer ces photos. Rappelez-vous également à ce stade pour vous référer à votre site d'inspiration. Donc, j'ai fait un écran partagé ici où j'ai le site Inspiration sur la
gauche sur l' espace Dsquared avec ses différents modèles spécifiquement sur la photographie. Pour cet exemple sur le côté droit afin que nous puissions voir il y a quelques modèles que j'ai un peu de similitudes avec e site d'inspiration et mais j'aime le look de ceci ici qui parle d'avoir un carrousel plein de purge pour les images. Donc, pour avoir un peu plus d'une idée, si nous nous référons au site d'inspiration affaiblir, voir, c'est le look qui obtiendra si nous avons une image pleine de saignement. Donc, cela signifie juste avoir une image qui passe toute la largeur de l'écran. Donc, il est assez impactant sur l'aspect du carrousel signifie juste que vous pouvez faire défiler diverses images différentes sur ce fond de fond perdu. Ok, alors débarrassons-nous du site d'inspiration. Je crois qu'on en a trouvé un qui me plaît. Um, si vous passez le curseur sur l'image que vous pouvez voir, vous pouvez cliquer sur Aperçu pour obtenir un aperçu de plus près du modèle que vous aimez le regard off afin que
vous puissiez vous déplacer sur le site Web dans cet aperçu, utiliser les boutons et les liens comme il fonctionnerait dans la vraie vie pour vous donner une meilleure idée de ce que
ça va ressembler. Prenez un peu de temps ici pour regarder autour des modèles, ouvrir l'aperçu, cuisiner autour et voir ce que vous pensez, et regarder beaucoup de différents modèles dans les différentes catégories. n'y a pas de précipitation ici. Il est bon de le faire correctement à ce stade, renvoyant à la fois à votre énoncé de mission et à votre site Web d'inspiration. Vous pouvez modifier les modèles ultérieurement avec Squarespace. Cela vous aide à le faire, mais c'est un peu douloureux. Crois-moi, je l'ai fait. Ainsi, lorsque vous êtes dans la section d'aperçu d'un modèle, si vous aimez son apparence, vous pouvez aller voir la démo, ce qui vous donne un aperçu plus immersif. Donc ça ouvre ce site web. Démo a un plein écran, donc vous pouvez vraiment avoir une idée de comment ça va fonctionner en ligne pour que vous puissiez voir ici. Les images sont vraiment le point focal de ce site web. Ils sont grands, clairs et brillants sur la page de sang. Encore une fois, il y a de la place pour le texte et l'écriture, mais il s'agit surtout des images. Donc, c'est juste un bon moyen d'avoir une idée de si les modèles vont correspondre avec votre site inspo et votre énoncé de mission et comment vous voulez que votre site Web regarde plus tard dans la ligne, si possible, essayons de choisir un modèle qui correspond le plus étroitement à ce que nous voulons. Beaucoup de choses sur squarespace peuvent être changées, mais moins nous devons changer maintenant, plus nous pouvons aller sur la partie amusante de partager notre coté. Une fois que vous avez trouvé un modèle qui vous satisfait, nous pouvons revenir dans l'aperçu squarespace et aller en haut à droite. Commencez par cette conception. À ce stade, vous devez créer un compte avec squarespace ou vous connecter si vous en avez déjà un. Cela signifie que la base des carrés sera en mesure de se souvenir de ce que vous avez fait. Il sera capable de sauver tout votre travail en temps réel, et vous pourrez y revenir à tout moment. Donc, la bonne nouvelle est maintenant que vous avez un essai de 14 jours avec Squarespace gratuitement. Donc vous avez votre site web. Bienvenue sur votre nouveau site squarespace et nous pouvons commencer à entrer dans le minutieux de l'
édition des pages et de la création du contenu. Voilà donc, votre nouveau site Squarespace. Donc, sur la droite ici, vous pouvez voir la sensation de fenêtre d'aperçu. Site de Squarespace sur la gauche. Voici les options de menu où nous allons pouvoir entrer et éditer tout ce qui a trait à notre propre site Web. La modification peut changer autant ou aussi peu que vous le souhaitez. Dans la leçon suivante, nous allons commencer par la structure de votre site Web en utilisant la
section pages . Aussi, vous pouvez espérer voir là-bas. Comment faire ça ? recherche initiale pour trouver notre site Web d'inspiration et élaborer notre énoncé de mission peut vraiment aider à accélérer le processus afin que nous puissions y aller directement et
commencer le site Web , obtenir le montage et faire toutes les parties amusantes de notre activité secondaire. Donc c'est la leçon pour fini. Bien joué pour l'instant. Oui, tu as un site web démarré. Alors faites une pause,
prenez une tasse de thé et partons. Mais la leçon suivante
6. Structure Wesbite: sur la structure du site Web de la leçon 5. Commençons à construire nos sites Web à partir de mon expérience. Il est préférable de commencer ici avec la structure de votre site Web. Donc, tout d'abord, nous devons réfléchir aux pages que nous voulons avoir en vue. Il pourrait être plus facile à ce stade de prendre un stylo et du papier ou votre nouveau carnet et de noter quelques idées. Commençons par les pages au milieu d'une carte mentale normalement et environ. La page est une excellente idée, et c'est souvent le premier endroit que j'ai dû faire lorsque j'ai visité un nouveau site Web. Ah, la page d'accueil peut aussi être une bonne idée car elle aide à naviguer autour du site comme vous
savez toujours comment revenir à la maison. Et ensuite, c'est à votre côté de l'agitation spécifique. Souvenez-vous de votre énoncé de mission et de ce que vous êtes formé pour faire. Donc, pour notre exemple de photographie, notre mission était de partager la beauté de la nature à travers la photographie de paysage. Encourager les autres à aller à l'extérieur se concentre sur la nature, l'extérieur et ces images. Donc, si nous divisons cela en sections, nous pourrions choisir orteil avoir trois pages séparées, se concentrant sur les aspects individuels que nous aimons de la nature tels que les arbres, collines et les rivières Retour à Squarespace. Andi, pour commencer, vérifions simplement sur notre site Web que nous pouvons voir que notre site est toujours privé, donc personne d'autre ne peut voir notre site web mais il n'a pas été lancé parce que nous sommes toujours dans l'essai gratuit. Nous pouvons faire tout notre montage, mais le site n'est pas en direct. Donc, lorsque nous sommes prêts, nous pouvons mettre à niveau pour publier et nous pouvons le rendre public afin que tout le monde puisse voir le site. Mais pour l'instant, nous
seuls pouvons le voir. Nous allons commencer par des pages pour construire notre structure de site Web. Donc, je n'ai pas vu sous la navigation principale. Ici, nous avons les en-têtes de menu qui correspondent au haut du site en face ici. Donc, nous avons les dernières ascensions mortem sur blogué. Donc, à partir de notre carte d'esprit rapide sur les pages que nous voulons dans notre site Web, nous savons que nous voulons certainement sur la page à propos de sorte que nous pouvons utiliser la page existante qui est juste en mode démo pour le moment. Donc, si on clique sur, on peut voir le photographe fictif John et sa page à propos. Donc, nous pourrions aussi bien utiliser ça si nous avons pris le temps de travailler. J' ai été gracié modèle basé pour vraiment correspondre à l'inspiration de notre site Web et notre
énoncé de mission . Ensuite, c'est une bonne idée d'utiliser autant que
possible les pages qui sont déjà dans le modèle . Il suffit de réécrire le contenu. Donc, nous sommes toujours en mode démo pour le moment ici, donc nous avons juste besoin de cliquer sur le rouage des paramètres sur le côté. Cela amène à propos de la page pour les paramètres ici, et nous pouvons voir que la version de démonstration a disparu d'ici. Donc, nous savons que la page fait maintenant partie de notre propre site Web, donc nous pouvons simplement enregistrer cela là. Donc, si nous cliquons sur le titre du site qui est lié à la page d'accueil du moment. Donc la page d'accueil était la prochaine chose que nous voulions avoir comme une page de notre site Web afin que nous puissions voir sur la gauche ici. L' icône d'accueil se trouve actuellement à côté de la page intitulée Dernier, qui est une page de galerie, sorte que ces icônes se trouvent le long du menu. Navigation signifie quelque chose, Donc l'icône ici est pour une galerie. Ceci est juste pour une page blanche, et c'est pour une page bloquée. Donc, pour le moment, la page d'accueil est une page de galerie, alors commençons une nouvelle page et avons une nouvelle page d'accueil pour notre site Web. Donc, en utilisant le plus en haut ici, nous pouvons créer une nouvelle page. Donc, ici, nous avons tous les différents types de pages que nous pouvons créer ont déjà vu. Nous avons déjà une page de sang dans une page de galerie. On va juste faire une nouvelle page blanche qu'on peut appeler à la maison. Et cela est ensuite ajouté à la navigation principale le long du haut ici. Donc, dès que cette page est vide, qui est génial, vous savez, nous pouvons commencer par elle et ajouter notre propre contenu et notre propre mise en page quand nous y arriverons. Donc, pour faire de la page d'accueil la page d'accueil, nous avons juste besoin de cliquer sur le rouage des paramètres là, faites défiler vers le bas et définir sa page d'accueil. On y va. Donc, nous avons la maison est maintenant notre page d'accueil. Mais ce site a également une page bloquée, qui ne fait pas actuellement partie de notre plan de structure de site Web, donc plutôt la supprimer. Je vais juste faire glisser ça vers le bas pour être un roi non lié. La page de sang signifie que nous sommes toujours en mesure de voir la disposition là-bas, ce qui pourrait être utile pour l'avenir si jamais nous voulons un point de référence pour ramener dans un bloc toe notre site Web. Mais pour le moment, ça ne va pas être dissocié, donc ça veut juste dire, mais ça ne fait plus partie de la tête et du menu là-bas. Mais la page existe toujours. Nous ne l'avons pas complètement supprimé. Enfin, nous voulons trois pages de galerie pour nos arbres, collines et nos rivières. Il y a déjà deux pages de galerie ici, alors pourquoi ne pas simplement réutiliser la première pour être nos arbres et nos collines et nous pouvons ajouter une dernière page de galerie pour nos rivières ? Donc, si nous cliquons sur, nous pouvons voir qu'il nous dit que c'est un exemple de page. Vous pouvez soit le copier et ajouter du contenu, soit le supprimer. Donc, dans ce cas, nous voulons le copier afin que nous puissions l'utiliser pour nous-mêmes à l'avenir. Mais nous sommes également en mesure de l'utiliser pour obtenir une indication de ce à quoi ressemblera la page lorsque nous remplissons avec notre propre contenu. Donc, nous ne voulons pas appeler celui-ci le plus récent, alors nous allons cliquer sur le rouage des paramètres et changer le nom en traités. Modifiez les limaces d'URL afin qu'il soit pertinent pour le nom de la page et modifiez le titre de la page et cliquez
simplement sur Enregistrer. Donc là, nous avons le long de la maison supérieure et les arbres ne retournent jamais et faire la même chose pour l'option des
stands Motema , et nous allons juste la page de copie des pieds. Utilisez le rouage des paramètres et changez ceci en pilules B. On ne va pas trop s'inquiéter de ce qu'il y a d'autre dans ce panel. En ce moment. On gardera ça pour plus tard. Donc, enfin, nous voulons ajouter une page de galerie supplémentaire. Donc, nous allons juste sur le bouton de page là-bas et cliquez sur la galerie, et nous allons appeler celui-ci Rivers et nous pouvons voir que c'est vide par rapport aux autres pages où nous avons réaffecté le contenu. Donc, c'est prêt pour notre propre contenu là-bas. Donc, au moment où Rivers est en panne, on peut juste traîner ça ici, et ça va réaligner les arbres, collines, les rivières et environ. Et nous allons juste traîner vers le haut parce que, comme nous l'avons discuté dans la page, planification est une page importante, et nous voulons que ce soit à côté d'une maison là-bas. Nous avons notre structure en place. Nous avons notre page d'accueil sur les arbres, les collines et les rivières. C' est moins et cinq fois fini. Bien joué. On y est presque. Nous avons notre site Web avec la structure de notre site Web en place, il est
donc prêt à le remplir avec notre propre contenu. Ensuite, nous allons jeter un oeil sur la façon de le faire. Comment ajouter certaines de nos propres images sur notre propre texte.
7. Contenu site Web: dans notre dernière leçon sur le contenu du site Web, nous allons envisager de remplir la structure que nous avons déjà mise en place avec notre propre contenu. Donc, nos propres images et nos propres mots là-bas, nous avons notre structure en place. Nous avons notre page d'accueil sur les arbres, les collines et les rivières. Maintenant, faisons quelque chose sur cette page d'accueil vide que nous avons créée. Comme vous pouvez le voir lorsque vous passez la souris sur la fenêtre d'aperçu, ces baignoires viennent que, disons, modifier et les paramètres. Si nous survolons le titre, il nous indique que c'est le titre du site et il nous donne l'option d'édition. Et si nous survolons ici, il nous dit que c'est la navigation et cela nous donne l'option d'édition. Donc, pour l'instant, sur notre page d'accueil parce que cette page est vide, nous voulons juste commencer à l'éditer et ajouter un peu de contenu. Donc, si nous cliquons sur éditer, cela nous amène à cette page d'édition en plein écran. Donc, ici, nous avons un point d'insertion. J' aime l'appeler une goutte de pluie, donc si nous survolons la goutte de pluie que nous voyons, nous obtenons une ligne toute la largeur de la page de sorte qu'une fois que nous cliquons dessus et que nous voyons ces blocs de contenu, ces blocs de contenu rempliront la taille complète de la page. Donc, les blocs de contenu disponibles pour nous. Nous en avons des basiques ici, comme du texte ou de l'image. Nous avons ici quelques options pour différentes façons d'afficher une image. Nous avons quelques options de galerie ici, quelques options de résumé et quelques autres filtres et listes, graphiques de
commerce, livres
sociaux et ensuite premium, que vous devez payer. Et donc le Christ beaucoup d'options là-haut. Mais tout ce dont vous avez besoin de façon réaliste est de base ou potentiellement une mise en page d'image, une galerie
ou un résumé. Donc, sur cette première page ici qui s'ouvre. Donc, sur notre page d'accueil, allons insérer une image comme notre première chose parce que rappelez-vous où un
site de photographie de paysage et il est tout au sujet de ces images télécharger gratuitement une image. Il vous emmène à votre dossier de documents, et je vais utiliser cette image, qui est une photo que j'ai prise lors d'un récent voyage au Japon, a des arbres et une rivière dedans, donc ça va prendre des boîtes pour cette page de photographie particulière. Nous pouvons aussi ajouter un nom, ce qui n'est pas comme il est dit ici. C' est facultatif, mais c'est une bonne pratique à cela dans Appelons juste cette image de la maison et ça va là-bas . Donc, si nous cliquons, postons et revenons en haut ici pour enregistrer cela, alors nous pouvons voir que notre page d'accueil a maintenant une grande image dessus, ce qui est brillant. Nous pouvons également cliquer sur cette flèche pour nous donner un aperçu en plein écran de notre site Web. C' est comme ça que la page aurait l'air bien. Nous avons notre image sur la page d'accueil. Je pense qu'il serait bon à l'énoncé de mission le long du sommet aussi. Donc, si nous revenons à éditer sur cette page, Andi, trouver un de ces points de pluie insérer et plein écran pour avec ainsi nos blocs que nous pouvons ajouter. Je vais ajouter ceci comme un bloc de texte afin que nous puissions voir que nous commençons à écrire qui l'
ajoutera . Notre énoncé de mission est donc d'encourager les autres à sortir des portes. C' est donc notre énoncé de mission. Et vous voyez, nous avons quelques options de texte ici, Teoh peut le modifier pour qu'elle le mette en gras. Il se distingue donc et nous pouvons le centraliser également. Et puis il y a quelques autres options ici, mais nous n'avons pas vraiment besoin de nous en soucier. Donc, si vous cliquez sur ça, nous pouvons voir que c'est là. Et donc une autre chose qui est très utile. Un autre bloc qui est utile pour être en mesure d'ajouter est un espace un livre. C' est ainsi que vous créeriez la mise en page visuelle que vous souhaitez pour votre site Web. Rendez-vous sur les blocs de texte d'image et les nouveaux espaces pour créer de l'espace autour d'eux afin qu'ils soient assis là où vous voulez qu'ils soient assis. L' icône de la main apparaît au-dessus de l'entretoise, ce qui signifie que vous pouvez la faire glisser partout où vous voulez qu'elle aille. Et si vous voyez si vous le faites glisser sur le côté ici, une ligne apparaît sur le côté droit, ce qui signifie que l'espace va s'asseoir à droite plutôt que sur la longue ligne qui
traverse le haut. Il ajoute dans une colonne, et nous pouvons rendre cet espaceur l'avoir plus petit et puis si nous en avons fait un autre de l'autre côté et juste le faire glisser quand la ligne vient là-bas sur la gauche et le rendre un petit peu
plus petit afin que nous puissions utiliser les espaces pour assurez-vous que les textes. C' est exactement là qu'on veut qu'il s'assiette. Donc juste là, au centre, je pense que ça a l'air assez bon. Et puis une dernière touche, Um, je juste que je n'ai pas aligné bloc, sorte que juste apporte littéralement une ligne qui aidera à séparer et peut juste Parfois j'ai eu ce petit peu de finition un peu de polonais Teoh Page. Donc, nous cliquons, sauvegardons et puis nous pouvons voir si nous revenons en plein écran. C' est comme ça que ça regarde pour le moment. Donc, évidemment, le titre de votre site n'est pas le nom de notre site Web. Donc, si nous survolons le titre du site, nous obtenons l'option d'édition qui nous amène à être en mesure de modifier ceci. Donc, sur l'écran à gauche, nous pouvons voir que nous avons le titre du site et le slogan. Donc, pour le moment, nous avons juste une citatah, ce que nous voulons que ce soit non plus. Le nom de notre site Web ou notre propre nom. Et donc je vais juste l'appeler la photographie présentée pour l'instant. Et si nous avons ah, logo, alors nous pouvons ajouter ça ici. Je vais juste utiliser le fait qu'on a cette belle, grande et
audacieuse face à sauver. Donc, nous allons juste revenir à la conception et revenir aux pages et faire ce plein écran et nous
pouvons voir que nous avons maintenant une page d'accueil avec notre nom dessus avec notre navigation de menu, notre structure de pages a défini comment nous voulons. On a un énoncé de mission à l'avant du centre pour dire à tout le monde de quoi on parle. Et nous avons une belle grande image sur la première page pour renforcer l'
aspect photographie de paysage du site Web. Jetons un coup d'oeil à la page, parce que actuellement c'est toujours sur John, le photographe fictif. Donc, si nous survolons ici à nouveau, nous voyons le contenu de la page et cela nous donne une option d'édition. Nous pouvons éditer l'image et nous pouvons éditer le texte. Donc, allons juste entrer et éditer ceci à nouveau, en utilisant ce qui était déjà là et juste mettre un peu sur nous, et je vais juste enlever ça pour l'instant. Donc, évidemment, votre page sur sera un peu plus élaborée et en dire un peu plus sur vous
et votre énoncé de mission à nouveau et ce que vous êtes en train de faire, Andi, allons dans l'image inchangée parce que je ne suis pas John. Donc nous revenons à éditer. Et donc j'ai John ici. Donc, si nous le supprimons et cliquez sur télécharger une image, cela nous ramène à nos documents. Et je viens juste d'avoir une photo de moi à Edimbourg, ils dio. Donc, si nous pouvions appliquer Andi save revenir à leur vue plein écran, vous verrez qu'il serait regarder plus pour voir un peu mieux avec plus de texte là-bas. Mais pour l'instant, si tu le devais, à propos de toi capable de voir une photo de moi, Andi, prête un peu plus sur moi. Euh, mais à la page d'accueil et j'ai décidé de ne pas financer à quoi ça ressemble. Donc, je vais revenir en arrière et éditer ceci, et je pense que je vais supprimer ces blocs d'espacement, ce qui est très simple. Tu viens juste de passer la souris dessus. Il nous dit que c'est un espaceur, et on a frappé. Supprimer. Oui. Qui a gardé ça, et je pense que ça a l'air juste un peu propre. On a l'énoncé de mission en haut. Là, nous pourrions naviguer et voir à quoi tout ressemble. Je suis là, et tout ce qu'il reste à faire dans nos arbres, collines et nos rivières, c'est d'ajouter certaines de nos propres photos. Si nous voulons ajouter quelques-unes de nos propres images à notre page de galerie d'arbres et prendre les
photos de John , nous pouvons aller dans les arbres ici, qui fait apparaître la boîte d'édition de la galerie d'art de ce côté. Je vais juste sélectionner tous et supprimer ceux parce que nous ne voulons pas de photos de drones, et donc maintenant c'est nous dire que la collection est vide. Cliquez ici et il vous ramène dans vos livres de documents. Donc je viens de faire un dossier ici appelé Trees. Donc sélectionné tous ces orteils Adam en une seule fois, je vais télécharger ces images dans notre galerie de photos arbres. Maintenant nos images d'arbre téléchargées, et nous pouvons les voir dans la galerie ici. Donc c'est le carrousel de saignement complet. Nous pouvons également faire glisser lorsque nous survolons l'image. Ici. Nous pouvons faire glisser les images pour les réorganiser si vous voulez changer l'ordre de pouce de sorte que juste rafraîchit dans la fenêtre d'aperçu. Et si nous allons en plein écran, nous pouvons voir à quoi ressemblera notre galerie quand quelqu'un vient visiter notre site Web. Donc, notre site Web il commence à sembler assez bon. Nous avons une page d'accueil que nous avons créée. Bip Andi. Nous avons une de nos pages de galerie avec quelques images dans une chose qui a été vraiment utile pour ajouter le contenu au site Web. J' avais toutes les images à portée de main pour que lorsque nous cliquons sur le bouton de téléchargement , il faut un droit
dans un dossier où nous avons déjà décidé quelles photos allaient avoir sur notre site. Donc, même si vous ne faites pas un site Web basé sur une image, mais que vous avez blogué des pages ou des blocs de beaucoup de texte, c'est une bonne idée et des meilleures pratiques d'écrire cela avant de l'intégrer sur le site Web . Donc, soit dans le document Word ou dans les pages, et puis vous pouvez simplement copier et coller cela à travers. De cette façon, c'est sûr. Vous pouvez même l'écrire hors ligne alors,
aussi, aussi, parce que vous ne pouvez éditer que dans squarespace ici que lorsque vous êtes en ligne et que vous y trouverez notre site Web. Tout ce qu'il resterait à faire maintenant serait d'ajouter des images à notre
section collines et rivières , puis continuer à créer ce contenu et à l'ajouter dans ma prochaine
classe complète de partage de compétences sur squarespace, nous allons regarder dans un peu plus détail sur la conception de notre site Web. Donc, en regardant les sites, les styles, les couleurs
funt, choses comme ça et aussi avoir un peu d'un coup d'oeil à Logo. Alors assurez-vous de me suivre sur le partage de compétences afin que vous soyez averti dès que cette classe devient vie. La leçon 6 est terminée Bien joué. Nous avons maintenant notre propre site Web avec notre propre structure, avec les pages que nous avons décidées et que nous avons créées. Nous avons commencé à le remplir avec nos propres images sur nos propres mots. Nous devons donc continuer à le faire maintenant. Nous pouvons regarder plus en détail plus tard sur le style des sites Web et regarder une esthétique. Mais pour l'instant, célébrons que nous avons notre propre site web
8. Résumé: là que nous l'avons. La fin de la première classe, et maintenant vous avez votre propre site web. Ensuite, nous allons nous concentrer sur l'apparence et le style de votre site Web, alors assurez-vous de me suivre pour être averti dès que la vie de classe. N' oubliez pas d'ajouter votre projet de classe avec vos observations. Quant à sa structure, couleur, schéma ou sa mise en page, je serai disponible pour toutes les questions que vous pourriez avoir.