Dans ce tutoriel,  nous n’avons pas l’intention d’apprendre des méthodes de programmation et d’entrer dans des sujets spécialisés ou techniques, mais nous voulons examiner la manière et la méthode de conception d’un site Web d’un point de vue général et vous fournir un modèle mental de ce travail, après avoir lu Avec ce tutoriel, vous pouvez trouver votre chemin et apprendre les compétences nécessaires pour gérer un site Web.

Avant d’entrer dans la discussion principale, jetons un coup d’œil à l’histoire des premiers sites Web et voyons à quoi ressemblent les ancêtres des sites Web d’aujourd’hui.

Histoire du premier site Web au monde

comment créer un site en avant? La technologie Internet et les sites Web ne durent pas longtemps. La première page Web au monde a été créée en 1991 par  Tim Berners-Lee  et était accessible au public. Le site Web était très simple et ne comprenait que quelques textes et plusieurs liens. Il est intéressant de savoir que cette page est toujours disponible à cette adresse !

Maintenant que nous connaissons un peu l’histoire du Web et comment créer les premiers sites Web, il est temps d’entrer dans les détails principaux et de voir comment créer un site Web.

La condition préalable la plus importante pour entrer dans le monde de la conception et de la programmation de sites Web est une connaissance relativement bonne de l’anglais, car de nombreuses ressources excellentes sont disponibles en anglais, en particulier dans le domaine des vers et de la technologie, et vous pouvez connaître l’anglais avant tout le monde. Obtenez de la qualité, alors essayez d’améliorer votre anglais en premier lieu!

Où commençons-nous à concevoir un site Web?

Bien que dans le passé, nous étions confrontés à des sites complètement simples et monotones, aujourd’hui, grâce aux technologies de conception Web (que nous apprendrons plus tard), les pages Web ont une beauté étonnante et l’utilisateur peut facilement interagir avec elles.

Sites aujourd’hui de deux Frantand (extrémité avant) et  back – end (fin arrière)  faisait partie d’un site vu par les utilisateurs du navigateur Elle apparaîtra Frantand nom et la partie qui se rapporte au côté serveur de traitement au back – end appel .

Étape 1
Apprentissage du HTML

L’apparence d’un site Web, ou frontal, est créée à l’aide du langage de balisage HTML . En fait, HTML agit comme le squelette et les cadres d’un site Web. Peu importe le programme de programmation côté serveur que vous utilisez, vous devez de toute façon le connaître. Avoir un langage HTML relativement complet, pas de site Web sans HTML!

Ne vous inquiétez pas d’apprendre cette langue, car si vous essayez vraiment, il vous faudra environ une semaine pour vous familiariser avec les principes généraux de cette langue et pouvoir créer votre première page Web. Si vous apprenez cette langue, vous pouvez commencer à apprendre les bases du HTML en apprenant cette langue .

Étape 2
Apprentissage de CSS

Bien que le HTML soit très important, il ne peut à lui seul donner une belle apparence à un site Web et ne vous permettra en fin de compte que de créer un site comme la première page Web de l’histoire, nous utilisons la technologie CSS pour embellir les pages Web  .

Le langage Siasas est un peu plus compliqué, mais l’apprendre sera relativement facile, car lorsque vous écrivez votre premier code et voyez comment il peut aider à rendre votre site Web beau, vous êtes sûr de le suivre avec plus d’intérêt et de motivation. Cela prendra environ 1 à 2 semaines.

Étape 3
Apprenez JavaScript

Jusqu’à présent, vous avez beaucoup appris sur la conception Web et vous pouvez utiliser vos connaissances pour concevoir des pages relativement bonnes ou modifier et personnaliser les pages de votre blog à votre guise, mais si vous voulez plus de fonctionnalités comme diverses animations, l’historique et Ajoutez une horloge, un curseur et. À votre site. Vous devez apprendre une langue appelée JavaScript .

Contrairement au HTML et au CSS, qui étaient des langages de balisage, JavaScript est un langage de script, et son apprentissage prendra un certain temps.

Maintenant que vous savez comment créer la structure d’un site, vous pouvez implémenter et implémenter un aperçu des idées que vous avez en tête, mais familiarisons-nous un peu avec les outils et technologies utilisés dans la conception d’un site. Pour voir comment les concepteurs professionnels préparent l’apparence d’un site, nous devons nous familiariser avec quelques termes au préalable.

Qu’est-ce que Framework?

Framework, ou «framework», est un ensemble de classes, de codes et de fonctions de programmation prêts à l’emploi qui sont présentés sous la forme d’un package et sont conçus par des programmeurs pour concevoir des projets logiciels.

En fait, lorsque vous utilisez des frameworks, le code est pré-écrit et prêt, et il vous suffit de rassembler les codes et de les utiliser selon certaines règles (les frameworks de ce framework).

Nous utilisons généralement des frameworks pour accélérer et améliorer les performances dans les projets de conception standard.Les frameworks les plus populaires pour HTML et CSS sont Bootstrap .

Avec des frameworks prêts à l’emploi, vous pouvez rapidement développer votre propre code et créer une page web.Il est intéressant de savoir que les professionnels ne conçoivent et n’implémentent l’aspect général d’un site qu’en quelques heures en utilisant les frameworks existants!

Nous vous recommandons fortement de ne pas utiliser du tout de cadres prêts à l’emploi si vous êtes nouveau, car pour les utiliser, vous devez d’abord être familiarisé avec les principes généraux du travail. L’utilisation de cadres au début non seulement vous déroutera davantage mais vous empêchera également d’apprendre. Vous pourrez également acquérir une compétence et devenir compétent après avoir appris les bases du travail avec HTML et CSS.

Bien sûr, si vous souhaitez créer un site unique, il n’est pas recommandé d’utiliser des frameworks, car de nombreuses personnes les utilisent, ce qui a conduit à des sites avec une apparence uniforme et répétitive dans l’espace Web.

Qu’est-ce qu’une bibliothèque?

En termes simples, le concept de bibliothèque est quelque peu similaire à Framework. (Plusieurs bibliothèques peuvent ensemble créer un cadre)

En fait, les bibliothèques de programmation sont une collection de classes et de fonctions prêtes à l’emploi qui sont assemblées et utilisées par les programmeurs. La bibliothèque la plus populaire disponible pour JavaScript est jQuery , qui vous permet d’accéder à une grande variété de fonctions JavaScript. Et utilisez-les sur votre site Web.

En général, divers cadres et bibliothèques ont été développés pour améliorer le processus de conception et de programmation et accélérer le processus, bien que, comme nous l’avons dit précédemment, vous devriez d’abord essayer de vous familiariser avec les concepts généraux de la conception Web, puis l’utiliser. Faites attention à ces choses.

Jusqu’à présent , presque tous les principes généraux de la conception Frantand un site bien connu, nous savons que les cas mentionnés ci – dessus vous presque en mesure de concevoir tout type de site static’ll être, si vous regardez attentivement le mot statique utilisé, une autre catégorie qui peut être utilisé pour Un site Web l’a considéré comme statique et dynamique .

Différences entre les sites statiques et dynamiques

Fondamentalement, les sites Web qui n’ont pas besoin de beaucoup de changements, et généralement tous leurs éléments constitutifs sont fixes et ne sont pas constamment mis à jour, sont appelés sites Web statiques  ou statiques.

Par exemple, des sites Web d’une page, certaines pages de destination, des pages simples et, en général, tous les sites qui contiennent un contenu cohérent qui ne nécessitent pas beaucoup de modifications peuvent être créés de manière statique. Jusqu’à présent, nous avons appris qu’ils peuvent être mis en œuvre et mis en œuvre.

Mais d’autres sites Web, tels que les sites basés sur le contenu, les réseaux sociaux, les forums, etc., qui sont constamment mis à jour et modifiés, sont appelés sites dynamiques . Il est presque impossible de mettre à jour ces sites Web à l’aide de sites Web statiques.

C’est pourquoi les systèmes conçus pour fournir des travaux d’édition et de mise à jour au propriétaire du site via un panneau d’administration sont presque tous les sites Web dynamiques que nous traitons aujourd’hui.

La conception et la création de cette partie du site (Backend) nécessite l’utilisation d’outils et de langages de programmation spéciaux, dont nous en apprendrons plus sur ce qui suit. En fait, ce sont la suite des étapes précédentes dont nous avons discuté précédemment.

Étape 4
Sélectionnez le langage de programmation

Comme mentionné ci-dessus, pour créer un site Web, nous devons choisir un langage de programmation côté serveur, c’est-à-dire le langage que nous utilisons pour paginer dynamiquement notre site.

À cette fin, de nombreuses options s’offrent à vous, l’un des langages de programmation Web les plus populaires étant PHP . À ce jour, plus de 80% des sites Web du monde ont été créés à l’aide d’un langage de programmation, dont les plus célèbres sont Facebook et Wikipedia.

Dans notre pays, la majorité des entreprises privées sur les traces de la langue de vue, si bien, apprendre les possibilités d’emploi progressent bien vous, une connaissance préalable de la langue de formation l’introduction de PHP plus tôt en symbiose IT a publié Allons-y.

Bien sûr, il existe de nombreux langages pour programmer un site Web, tels que ASP, Python, Node JS, Java, etc., que vous pouvez utiliser si vous le souhaitez.

Il est important de noter que pour commencer la programmation, vous devez être un peu familier avec la façon d’écrire un algorithme afin de pouvoir facilement analyser votre programme.

Comme nous l’avons dit, nous utilisons des langages de programmation pour créer des sections dynamiques du site, nous devons donc stocker les informations saisies sur le site Web de manière à y avoir accès à l’avenir, donc en plus du langage de programmation, nous avons besoin d’une base de données (base de données). ) Créez également pour votre site.

Étape 5
Sélectionnez la base de données

Pour expliquer le cas précédent, nous avons besoin d’une base de données pour stocker les informations. L’une des bases de données les plus populaires au monde, bien compatible avec PHP, s’appelle MySQL , car elle est disponible gratuitement et est très populaire. Nous vous recommandons de l’utiliser dans votre projet.

Jusqu’à présent, nous connaissons presque tous les composants d’un site Web. En apprenant ces choses, vous pouvez concevoir et implémenter un site Web complet, donc si vous voulez simplement apprendre à créer un site Web, vous pouvez sauter la lecture. Vous devez savoir qu’il y a d’autres choses impliquées dans la création et la maintenance de sites Web, dont nous discuterons ci-dessous, donc si vous voulez en savoir plus sur la création et la maintenance d’un site Web, restez à l’écoute pour en savoir plus.

Qu’est-ce que le référencement?

Le SEO mot signifie S de E Ngine  O les moyens Ptimization optimisation du site pour les moteurs de recherche, nous tous les termes que les moteurs de recherche comme Google ou Bing utiliseront, la vérité est que les moteurs de recherche sont juste un robot, pas un humain Par conséquent, nous devons utiliser certains principes pour leur rendre le contenu de notre site Web compréhensible et essayer d’être au sommet des résultats de recherche en utilisant diverses techniques.

En tant que concepteur et programmeur de sites Web, vous devez utiliser des balises HTML et d’autres éléments qui rendent le contenu du site compréhensible pour les moteurs de recherche. Si vous le souhaitez, vous pouvez obtenir plus d’informations avec une recherche simple ( SEO sur la page).

Qu’est-ce que le Responsive Design?

Il y a encore quelques années, les smartphones et les tablettes n’étaient pas répandus, et les gens naviguaient simplement sur Internet à l’aide de leurs ordinateurs, mais aujourd’hui, un grand nombre de visiteurs de sites Web naviguent sur Internet.

Par conséquent, votre site Web doit être conçu de manière à ce que l’utilisateur puisse facilement visualiser le contenu sur des appareils avec des écrans plus petits, l’une des façons dont vous pouvez activer cette fonctionnalité sur les pages de votre site est d’utiliser une conception Web réactive ou réactive.

Dans cette technique, les pages Web sont redimensionnées en fonction de la taille de l’écran de l’appareil et affichées de manière à ce que le contenu du site soit bien visible et utilisable. Récemment, nous avons publié quelques conseils sur l’ optimisation du site sur mobile que vous pouvez lire.

La conception d’un site réactif, en plus d’améliorer la beauté et la convivialité du site, aura également un effet très positif sur le référencement du site. En apprenant les bases de CSS 3, vous serez en mesure de concevoir vos pages de site de manière responsable, et des frameworks tels que Bootstrap prendront en charge cette fonctionnalité par défaut.

Étape 6
Achetez des hôtes et des domaines

Pour qu’un site Web du monde entier soit toujours disponible, vous devez le conserver dans un environnement sur Internet, sur un ordinateur qui est toujours allumé et, si nécessaire, télécharger des informations et des fichiers depuis votre site et les afficher aux utilisateurs. Nous appelons toujours cet ordinateur un serveur. Les serveurs sont toujours des ordinateurs brillants dans l’environnement Internet qui traitent les pages Web des utilisateurs à tout moment et les affichent à l’utilisateur. Vous devez maintenir votre site dans l’environnement Internet sur un serveur ou un espace. Vous aurez besoin d’hébergement.

Qu’est-ce qu’un hôte?

Autrement dit, un hôte est un espace sur un serveur où vous pouvez télécharger et stocker des informations sur les informations et les fichiers de votre site. Les hôtes doivent être mis à jour mensuellement ou annuellement (selon la société fournisseur) et si vous ne payez pas. Votre accès à l’hôte sera coupé et les autres utilisateurs ne pourront pas voir votre site.

Il existe de nombreuses sociétés qui proposent des services d’hébergement en Iran, par exemple l’une de ces sociétés, qui fournit de bons services et une assistance dans ce domaine, est la société TMDHosting et Hostinger  . Vous pouvez obtenir l’hébergement requis pour votre site Web auprès de cette société.

Qu’est-ce que le domaine?

Lorsque vous souhaitez afficher un site, tapez simplement l’URL dans votre navigateur, cela s’appelle un domaine, par exemple, Google.com est le domaine du site Web de Google, et Hamyarit.com est le domaine d’un site partenaire , en fait, le domaine de l’identité. Et une marque est un site Web, il est donc préférable de choisir le bon domaine pour votre site et de choisir le bon nom pour votre site.

Vous devrez également payer des frais annuels pour le domaine, qui varient en fonction du type d’extension de domaine (par exemple, les domaines ir sont beaucoup moins chers que les domaines com ) . Les fournisseurs de services d’hébergement proposent généralement des domaines, donc à acheter. Vous pouvez également postuler auprès de la même entreprise que vous achetez.

Avec ces 6 étapes , vous pouvez propre site Web pour concevoir, mettre en œuvre, mais il était un autre sens qu’il n’y a pas mauvais, il est aussi connu, plus de 30% des sites web dans le monde de la CMS et prêt comme WordPress (WordPress) utilisez!

Cela signifie que sans avoir à passer par l’une des étapes de 1 à 5, ils peuvent rapidement configurer et rendre leur site disponible. Avec WordPress, vous pouvez presque créer une variété de sites d’actualités, magasins, entreprises, musique, téléchargements, etc. sans avoir besoin de codage!

Conception de sites Web sans codage! Vérité ou mensonge?

De nos jours, Internet regorge de codes pour la conception de sites sans codage! Bien que cela soit possible dans une certaine mesure avec l’aide de systèmes de gestion de contenu tels que WordPress  , mais vous devez savoir qu’en utilisant des systèmes prêts à l’emploi, vous ne deviendrez jamais concepteur de site!

Bien que vous puissiez utiliser WordPress pour exécuter toutes sortes de sites, vous devrez éventuellement avoir une relativement bonne connaissance du codage pour personnaliser votre site et ajouter des fonctionnalités supplémentaires, sinon vous ne pouvez configurer qu’un site normal. Donc, si vous n’avez qu’un seul site Web petit et compact, vous pourrez lancer votre site en moins de 5 minutes, mais si vous voulez avoir un site professionnel ou choisir une conception de site comme travail, vous devez le faire. Et les étapes 1 à 5 ou S’il vous plaît!

Si vous souhaitez en savoir plus sur WordPress et son fonctionnement, lisez la suite.

Qu’est-ce que WordPress?

Dans WordPress en langage simple est un système de gestion de contenu ( C ontenu M estion S ystème) source libre et ouvert qui est facilement utilisé par quiconque à utiliser et personnaliser est, grâce aux milliers de modèles et plugins pour ce système a été créé , vous pouvez presque tout type Concevez et gérez un site de votre choix, sans avoir besoin de codage et de conception personnalisée.

Cependant, si vous souhaitez avoir une fonctionnalité spéciale sur votre site ou ajouter une fonctionnalité spéciale à votre site qui n’est pas trouvée par défaut dans WordPress et ses plugins, vous devez payer et demander à un spécialiste d’ajouter cette section à votre site (ou d’écrire votre propre programme).

Comme nous l’avons mentionné, vous pouvez créer presque n’importe quel type de site avec WordPress, alors que ce CMS a un référencement acceptable et aussi avec l’aide des plugins qu’il a à cet effet, sa puissance peut être augmentée, bien que ce système soit très puissant et flexible, mais Dans des circonstances spéciales et pour la mise en place de sites spéciaux dotés de fonctionnalités et de capacités entièrement dédiées, l’utilisation de WordPress n’est généralement pas recommandée, et il est préférable de concevoir et de mettre en œuvre le site de 0 à 100 de manière spéciale.

Le monde du Web et d’Internet est vaste, profond, mais fascinant et doux, et bien que nous ayons expliqué toutes les bases de la conception d’un site Web pour vous, vous pouvez toujours en trouver de nouveaux.

Par exemple, si vous voulez en savoir plus sur certaines activités d’un site Web, lisez ces articles  » qu’est-ce que la construction de site web «   et lisez-le. Le monde des vers est si vaste et complexe que Étudiez-le et il vous surprendra à nouveau!

Le facteur le plus important qui peut vous faire réussir dans ce domaine est l’intérêt, vous réussirez certainement dans tout ce que vous faites, donc si vous sentez que vous êtes intéressé par le monde d’Internet ainsi que par la conception et le développement de sites Web, suivez ce métier.

Enfin, si vous avez une expérience dans ce domaine ou si vous avez des questions sur ce didacticiel, veuillez le partager avec nous et les autres utilisateurs de l’assistant informatique dans la section commentaires de cet article afin que d’autres et vous puissiez profiter de vos expériences. Obtenez des réponses à vos questions.