Introductory To Coding Editors and NotePad++ - How To Create a Website With HTML and CSS #3
programming·@robinhaney·
0.000 HBDIntroductory To Coding Editors and NotePad++ - How To Create a Website With HTML and CSS #3
Hello! Welcome to tutorial number <em>#3</em> of this <strong>How To Create a Website With HTML and CSS</strong> Tutorial. If you missed the previous lessons you can grab them below: <ul> <li><a href="http://freewebprogrammingtutorials.com/html/how-to-create-a-website-with-html-and-css-1-introduction-to-the-course/">Lesson 1 - Introductory to our project</a></li> <li><a href="http://freewebprogrammingtutorials.com/html/how-to-create-your-very-first-webpage/">Lesson 2 - How To Create Your First Webpage</a></li> </ul> You can watch the video version of this lesson below: https://www.youtube.com/watch?v=FpwvtxlFn_4 <strong>P.S</strong> - <em>Sorry about the images being blurry the video quality for some reason wasn't that great when I rendered it awhile back!</em> <h2>Introductory To Coding Editors</h2> You've probably noticed already that coding in Notepad can be a little bit sore on the eyes. Luckily for us, there are coding editing programs that can allow us to program our websites a lot easier. The example that I'm going to be using is called Notepad++. This coding editor is free, and you can download it from their website, as I'm about to show you here. Once you have Notepad++ installed on your computer, we can begin to edit our webpages by right clicking them and selecting "edit" with Notepad++. <img class="alignnone size-full wp-image-466" src="http://freewebprogrammingtutorials.com/wp-content/uploads/2017/08/intorductory-to-coding-editors-1.png" alt="" width="825" height="380" /> Doesn't that look a little bit easier to read? Let's try to add a few more headline elements just to add a little bit more code to our webpage. Let's add a H2 element and an H3 element as well. As you might have already guessed, an H2 is smaller than an H1, and an H3 is smaller than an H2. <img class="alignnone size-full wp-image-467" src="http://freewebprogrammingtutorials.com/wp-content/uploads/2017/08/intorductory-to-coding-editors-2.png" alt="" width="411" height="305" /> As you're writing out your elements, be sure to add an opening tag and a closing tag as well. Let's go ahead and save our webpage and see how this looks visually in our web browser. As we can see, our H1 is the largest, and our H3 has the smallest text on the page. <img class="alignnone size-full wp-image-468" src="http://freewebprogrammingtutorials.com/wp-content/uploads/2017/08/intorductory-to-coding-editors-3.png" alt="" width="485" height="337" /> There are paid options for coding editors that you can look at later, but for now, coding with Notepad++ will work just fine for us. That's the end of today's lesson, if you would like to skip ahead you can do so by grabbing the free course by <a href="http://learnhowtobecomeafreelancewebdeveloper.teachable.com/p/how-to-create-your-very-first-website-with-html-and-css1/">clicking here.</a>
👍 nikhilr, crypto-oracle, liberosist, meerkat, dunia, pharesim, vcelier, burnedpixel, arconite, awesomianist, revelim, locikll, ananiani, gandalf, oleg326756, leongkhan, jznsamuel, rohitrana7, jeanramos, cryptostache, cybertiger, steemerhrn, rdchaudhari, mrtech, ragnartheking, jfuenmayor96, thepsychguide, adore-eu, moonliightartist, bilalhaider, flatman, jesus2, mandible, mooen, robinhaney, sequentialvibe, ghasemkiani,