Outils de base pour la conception Web

Vous n'avez pas besoin de beaucoup de logiciels pour démarrer en tant que développeur Web

Table des matièresDévelopper

• Éditeur de texte/HTML
• Navigateurs Web
• Éditeur graphique
• Client FTP

Mis à part un ordinateur et une connexion Internet, la plupart des outils dont vous avez besoin pour créer un site Web sont logiciels , dont certains se trouvent peut-être déjà sur votre ordinateur. Vous avez besoin d'un éditeur de texte ou HTML, d'un éditeur graphique, de navigateurs Web et d'un client FTP pour télécharger des fichiers sur votre serveur Web.

Choisir un texte de base ou un éditeur HTML

Vous pouvez écrire du HTML dans un éditeur de texte brut tel que Bloc-notes sous Windows 10, TexteModifier et Sublime Text sur un Mac, ou Vi ou Emacs sous Linux. Vous créez le codage HTML de la page, enregistrez le document en tant que fichier Web et ouvrez-le dans un navigateur pour vous assurer qu'il ressemble à ce qu'il est censé faire.

Si vous voulez plus de fonctionnalités qu'un éditeur de texte brut n'offre, utilisez plutôt un éditeur HTML. Les éditeurs HTML reconnaissent le code et sont capables d'identifier les erreurs de codage avant de lancer le fichier. Ils peuvent également ajouter des balises de fermeture que vous oubliez et mettre en surbrillance cassé liens . Ils reconnaissent et acceptent d'autres langages de codage tels que CSS, PHP et JavaScript.

Les nombreux éditeurs HTML sur le marché varient du niveau de base au niveau professionnel. Si vous débutez dans la rédaction de pages Web, l'un des WYSIWYG (Ce que vous voyez est ce que vous obtenez) Les éditeurs pourraient vous convenir le mieux. Certains éditeurs affichent uniquement le code, mais certains vous permettent de basculer entre les vues de codage et les vues visuelles. Voici quelques-uns des nombreux éditeurs Web HTML disponibles :

IDÉE Komodoet son interface conviviale conviennent aux développeurs Web débutants et avancés. La fonction de saisie semi-automatique de Komodo IDE est particulièrement pratique lorsque vous écrivez du code pour des éléments communs tels que des liens. Le logiciel prend en charge le codage couleur de différents langages de codage tels que HTML, CSS et bien d'autres. Komodo IDE fonctionne sur Windows, Mac et Linux .

Fil de vie

Éditeur HTML CoffeeCupest particulièrement utile pour les nouveaux développeurs qui sont plus intéressés par l'apprentissage du code que par une interface visuelle. Cet éditeur robuste est livré avec des modèles et des vérificateurs de validation pour vous aider à garder votre code exempt d'erreurs. Il inclut la complétion de code et prend en charge d'autres langages de codage vous pouvez utiliser en conjonction avec HTML. Le logiciel met en évidence les erreurs, explique pourquoi elles sont apparues et vous indique comment les corriger. L'éditeur HTML de CoffeeCup fonctionne sous Windows.

Fil de vie

Mobiliserest un éditeur HTML pour les personnes qui ne veulent pas s'impliquer dans le code. Le tout est de choisir un thème puis en faisant glisser et en déposant des éléments sur la page. Ajoutez du texte comme vous le feriez dans un éditeur de texte classique et insérez des images, des vidéos ou des icônes, le tout sans écrire de code ; Mobirise s'en charge pour vous. Mobirise est disponible pour Windows et Mac, et il est gratuit.

Fil de vie

Navigateurs Web

Les sites Web peuvent avoir une apparence différente d'un navigateur à l'autre, il est donc crucial de tester vos pages Web pour vous assurer qu'elles s'affichent et fonctionnent comme prévu. Chrome, Firefox, Safari (Mac), Opéra , et Edge (Windows) sont les navigateurs les plus populaires.

Vous devez également tester l'apparence et le fonctionnement de vos pages dans les navigateurs mobiles. La plupart des navigateurs de bureau offrent la possibilité d'afficher des sites Web dans des fenêtres de différentes tailles. Par exemple, une multitude d'outils de test sont disponibles dans Google Chrome à l'adresse Voir > Développeur > Outils de développement . Sélectionnez l'icône du smartphone dans le coin supérieur gauche de la fenêtre du développeur pour afficher n'importe quelle page dans des fenêtres de tailles différentes et des systèmes d'exploitation mobiles.

Fil de vie

Éditeur graphique

Le type d'éditeur graphique dont vous avez besoin dépend de votre site Web. Adobe Photoshop est la référence, mais vous n'aurez peut-être pas besoin d'autant de puissance. De plus, vous aurez peut-être besoin d'un programme de graphisme vectoriel pour le travail de logo et d'illustration. Voici quelques éditeurs graphiques à considérer pour le développement Web de base :

GIMPest un programme de retouche photo gratuit et open source qui offre de nombreuses fonctionnalités de ses concurrents les plus chers. Comme logiciels open source , il est disponible pour Windows, Mac et Linux.

Fil de vie

Éléments Photoshoppour Mac et PC est une version allégée de son homonyme mais possède de nombreuses fonctionnalités.Corel PaintShop Propour PC a presque tous les outils que vous trouvez dans Photoshop dans une interface facile à utiliser.Inkscapepour Windows, Mac et Linux est un éditeur de graphiques vectoriels gratuit. Cette alternative à Adobe Illustrator, plus coûteux, dispose de capacités plus que suffisantes pour les travaux de conception simples et les graphiques Web.

Client FTP

Vous avez besoin d'un client FTP (protocole de transfert de fichiers) pour transférer vos fichiers HTML et les images et graphiques de support vers votre serveur Web. FTP est disponible via la ligne de commande sous Windows, Macintosh et Linux, mais un client FTP dédié est beaucoup plus facile à utiliser. Haut Client FTP comprendre:

FichierZilla(gratuit) est disponible pour Windows, Mac et Linux. Il prend en charge les transferts de fichiers par glisser-déposer et dispose d'une fonction de pause et de reprise pour le téléchargement de fichiers volumineux.

Lifewire / Richard Saville

Cybercanardest un logiciel gratuit, open source et multiplateforme connu pour son intégration transparente avec des éditeurs externes et son interface utilisateur attrayante.FTP gratuitet FTP direct sont fabriqués par la même entreprise. Free FTP est un client minimaliste qui répond aux besoins de base en matière de transfert de fichiers. Direct FTP est une version premium qui offre des fonctionnalités avancées. Les deux versions sont prises en charge par Windows 7, 8 et Vista, mais seul Direct FTP convient à Windows 10.

Fil de vie

Transmettreest un client FTP premium pour Mac uniquement. Il facilite les transferts exceptionnellement rapides et prend en charge Amazon CloudFront.FTP mignonest un puissant client FTP premium que vous pouvez utiliser pour effectuer jusqu'à 100 transferts en même temps. Il est considéré comme l'un des clients FTP les plus sécurisés disponibles.