The text editor is an essential tool for any developer, as it allows you to write website code into an HTML file. By default, the Windows and Mac operating systems both contain a text editor. The Windows one is called Notepad, while the Mac text editor is called TextEdit. These text editors are fairly low-quality, but they work. To create an HTML file in TextEdit, save your file as a Web Page(.html) format. You can then either change the HTML code directly, or change the HTML output. Which view you use can be adjusted in the preferences. Of course, many other text editors can be found. I've heard of some like Fireworks and Sublime, but my personal favorite is Adobe Dreamweaver. This is a full website design application whose capabilities include: a live preview of what your code will look like; code coloration to easily distinguish code elements; a file-put system to save files to your server; and the ability to create a dozen different types of files, including HTML, PHP, JS, CSS, SVG, LESS, JSON, XML, and SCSS.
The Inspector is a neat tool provided by your browser. To access the inspector, you can select 'Inspect Element' by right-clicking an element, or use the shortcut command-option-I for Safari. The Inspector has several tabs, the most meaningful of which are Elements, Console, Sources, Network, and Timeline. The Elements tab shows the HTML structure of the current page, as well as the CSS of the current element. An extremely cool feature is that by double-clicking an item, you can edit its value. These changes, however, are lost when the page is reloaded. An interesting exception, though, is its use on my bio to create CSS effects. The edited portion is saved as a form, thus saving my changes. The Console tab displays JavaScript output. It is usually not very useful unless the console.log command has been used. Logging data in the console can help verify that the data is the correct value. The next tab is the Sources tab. It displays every file used in the page except some PHP files exclusively on the server side. The Sources tab allows local overrides, which allow you to edit a file and see what happens when you reload the page. Local overrides, however, are purely local. The Network tab displays every network made by the page since it was loaded. The Timeline logs every event run when the page is reloaded, except the PHP code run. The Inspector can be used to examine techniques used by other developers to help you find out how to make something work. Further, the Inspector shows the relationship between most files used by the page.
The next part will begin the HTML discussion with the <p>, <a>, <br>, and <hr> elements, as well as the style elements and headings.
This was a short section, but it's all for now!
__RESOURCES__
http://www.minecaptain.com—This isn't really a resource, but it is one of the only places to contact me.
A blank HTML starter file— will be linked to in every post.
Well, that's all for now!
Comments