background preloader

Les bons outils pour commencer à intégrer votre site web

Les bons outils pour commencer à intégrer votre site web
Introduction Pour débuter dans la création de pages web, vous aurez besoin de mettre en oeuvre deux langages : HTML et CSS, qui seront rédigés à l'aide d'un logiciel nommé éditeur de code source et sauvegardés sous forme de fichiers possédant les extensions .html et .css. Ceux-ci seront envoyés via un logiciel FTP qui permet de publier les fichiers depuis votre ordinateur vers le serveur web où ils seront stockés et mis à disposition des visiteurs. Les langages HTML et CSS Ces deux langages se complètent, l'un pose le squelette du site alors que l'autre le met en forme. HyperText Markup Language (ou Langage de balisage hypertexte) HTML, né en 1994, est le langage du Web par excellence. Les médias (images, sons, vidéos, fichiers téléchargeables) ne sont pas intégrés directement au sein de la page HTML, mais sont "appelés" par celle-ci. Cascading Style Sheets (ou Feuilles de styles en cascades) Le langage CSS (né en 1996) met en forme le HTML mais ne structure pas la page web. Chrome Safari

Logiciels & Sites utilisés pour l’intégration HTML/CSS sous Mac OS X Voici la liste des programmes et sites web que j’utilise au quotidien, en tant qu’Intégrateur / Développeur Front-End. Ce ne sont probablement pas les meilleurs, mais ils facilitent énormément mon travail. Sites web pour l’intégrateur SpriteCow Permet d’extraire les positions & tailles des images d’un sprite.CSSLisible Permet de réindenter et de réorganiser du CSS. #autopromoGTmetrix Permet d’analyser les performances d’une page web. Logiciels pour l’intégrateur TextExpander (34.95$) Gérer des snippets dans n’importe quel logiciel.Sublime Text (45€) Editeur de code léger, configurable, avec des tonnes de plugins pratiques.Google Chrome (Gratuit) Un navigateur rapide et efficace, doublé d’un inspecteur de code.MAMP (Gratuit) Apache, MySQL, PHP. Autres logiciels Et vous, quels sont vos logiciels et sites préférés pour l’intégration ou le développement front sur Mac ? Tags : front-end, integration, logiciel

Five Things You Should Know About HTML5 You are here: Home Dive Into HTML5 1. It’s not one big thing You may well ask: “How can I start using HTML5 if older browsers don’t support it?” But the question itself is misleading. You may think of HTML as tags and angle brackets. Chapter 2 and Appendix A will teach you how to properly detect support for each new HTML5 feature. 2. Love it or hate it, you can’t deny that HTML 4 is the most successful markup format ever. Now, if you want to improve your web applications, you’ve come to the right place. Read all the gory details about HTML5 forms in Chapter 9. 3. “Upgrading” to HTML5 can be as simple as changing your doctype. Upgrading to the HTML5 doctype won’t break your existing markup, because obsolete elements previously defined in HTML 4 will still render in HTML5. 4. Whether you want to draw on a canvas, play video, design better forms, or build web applications that work offline, you’ll find that HTML5 is already well-supported. 5. HTML5 is here to stay.

Débuter avec HTML + CSS Ce court tutoriel est destiné à ceux qui commencent à utiliser CSS et n'ont jamais écrit de feuille de style CSS. Il n'explique pas CSS en profondeur. Il explique comment créer un fichier HTML, un fichier CSS et comment les faire fonctionner ensemble. Après cela, vous pourrez lire d'autres tutoriels afin d'ajouter plus de caractéristiques à vos fichiers HTML et CSS. Ou bien vous pouvez utiliser un éditeur HTML ou CSS afin de mettre en place des sites complexes. A la fin de ce tutoriel, vous aurez fait un fichier HTML qui ressemble à cela: Page HTML résultante, couleurs et disposition effectuées avec CSS. Notez que je ne prétends pas que c'est joli :) Voici un exemple de section optionelle. Etape 1: Le langage HTML Pour ce tutoriel, je vous recommande d'utiliser des outils simples comme Blocnote (Windows), TextEdit (Mac) ou KEdit (KDE). <! En fait, vous n'avez pas à le taper: vous pouvez le copier et coller depuis cette page Web dans votre éditeur. Etape 2: Ajouter de la couleur <! En savoir plus

Tutoriels XHTML, CSS, Accessibilité, JavaScript - Alsacréations Proposez votre tutoriel Niveaux : Débutant Confirmé Expert Langages hypertexte (HTML, HTML5, XHTML), balises, structure des pages web et validation W3C Feuilles de style CSS (Cascading Style Sheet) Accessibilité Accessibilité des sites internet, bonnes pratiques, ergonomie, utilisabilité Javascript Langage de script pour le web dynamique exécuté par le navigateur Développement Langages et technologies du web tels que PHP, MySQL, Ajax Responsive web design Tout pour smartphones et tablettes Design Design et graphisme pour le web Formats, encodage, XML Formats variés, XML et microformats, sémantique Web Le monde du web et d'internet en général Web-designers, 10 applications HTML et CSS sur Mac OS X Il y a peu de doute que OS X soit une plate-forme populaire pour les concepteurs de sites Web, offrant une vaste gamme de logiciels pour la conception, la gestion, le développement et la publication de sites Web. En tant que designer freelance, vous vous devez d’être au top des technologies ; cela signifie qu’il est nécessaire d’avoir la plupart des meilleurs outils à votre disposition. Sans ces outils essentiels, la vie en tant que designer indépendant pourrait devenir beaucoup plus difficile que ce que vous aviez prévu. C’est ainsi que j’ai regroupé ci-dessous une grande liste de dix applications qui pourraient vous « sauver la vie », et ainsi vous rendre les choses plus facile en tant que Web-designer et développeurs. Avant de poursuivre la lecture de cet article je vous propose également de lire celui-ci : Top 10 des plugins de Firefox pour les développeurs Web L’objectif principal de CSSEdit concerne la création et la gestion de vos feuilles de styles.

Introduction à l’HTML5 Cet article est destiné aux débutants en HTML5, et à tous ceux qui souhaitent en savoir un peu plus sur cette nouvelle technologie qui agite le web et le monde mobile. Si vous vous intéressez aux technologies du web, vous avez probablement déjà entendu parler de l’HTML5 aux cours des dernières années. Cette introduction va vous donner un premier aperçu de ce qui se cache derrière le terme HTML5, vous présentera le contexte dans lequel évolue cette technologie, et nous verrons un bon nombre de nouvelles fonctionnalités qu’il apporte. Sommaire : L’HTML5 c’est quoi ? L’HTML5 n’est pas… Tout d’abord, je suis convaincu que parmi vous certains se disent : L’HTML5, c’est un nouveau langage ? Ou encore : Je débute, j’ai envie d’apprendre l’HTML5 directement, ça a l’air mieux que l’HTML d’avant. Voire : Pfff, moi qui venait d’apprendre l’HTML, je vais devoir tout réapprendre… Il est grand temps de clarifier les choses : L’HTML5 n’est pas un nouveau langage. L’HTML5 est… Le W3C et le WHATWG On y arrive !

HTML5 se dévoile Le brouillon officiel (working draft) de HTML5 a été publié officiellement le 23 avril 2009 et depuis de nombreuses avancées ont été accomplies, les navigateurs supportant toujours plus de fonctionnalités et de nouveautés. La nouvelle génération du langage de balisage HTML remplacera à long terme HTML 4, XHTML 1.x et XHTML 2 qui a été abandonné. Profitons de cette occasion pour faire un tour d'horizon de cette nouvelle version de HTML. Consultez également toutes nos autres ressources HTML5 Qu'est-ce que c'est HTML5 ? Comme son nom l'indique, HTML 5 est le successeur de HTML 4. Le W3C c'est quoi déjà ? Le World Wide Web Consortium, abrégé W3C, est un organisme de standardisation à but non-lucratif, fondé en octobre 1994 comme un consortium chargé de promouvoir la compatibilité des technologies du World Wide Web telles que HTML, XHTML, XML, RDF, CSS, PNG, SVG et SOAP. Quelles sont les nouveautés ? <aside> Welcome! Les balises principales Doctype Le doctype est simplifié : Section Article Aside Nav

//BUILD/ Html 5 vs Silverlight : La confusion enfin dissipée Read this article in your language IT | EN | DE | ES Le BUILD est en train de se dérouler aux USA, la Keynote est tout juste terminée et on sait maintenant exactement à quoi s’en tenir. Enfin, dirais-je ! Et ce qui ressort des 3h30 de présentation est que, en dehors des nouveautés de Windows 8, tout le monde s’est trompé sur le match HTML 5 vs Silverlight ! Windows 8, rien que Windows 8 Il faut bien comprendre une chose : Microsoft n’a parlé que de Windows 8, rien que de Windows 8. Cette nouvelle version est pleine d’idées intéressantes et propose de nouvelles approches, tant du point de vue de l’interface utilisateur que de la façon de faire des applications pour Windows. Mais revenons à ce qui m’intéresse ici. Oui, on parle bien ici de fabriquer des applications pour Windows et non pour autre chose... La grande confusion prend fin Finalement là est l’important. Quand on parlait développement Windows, on parlait C et C++, les langages vraiment “natifs”. HTML 5 pour développer sous Windows

Related: