Also in main. The index page is where you'll create your homepage or your only page, if you're going for a simple one-pager. If you open the index page in a browser, you'll see a single line of text. But looking into the HTML reveals a lot more hiding in the code. The rest of the HTML on the index page includes information for web apps, notifications for old browsers, and useful JavaScripts. When you're getting started, you shouldn't need to mess with any of this. Having them already pre-populated, however, is a good way to make sure that your site is prepared to get the most out of HTML5.
Here's some basic information that I'll add about myself:. Want to create more pages? Create copies of this file and rename them so you don't have to copy and paste all of the HTML over.
Then add your content. If you'd like to customize your page, just modify the HTML file. Not sure what to put on your page? Check out these great page design examples. If you don't have one yet, you'll need to create one. You can use an online favicon generator or design your own. Just make sure that it's 16 x 16 pixels and has the. It's a good idea to put some thought into your favicon.
Use these famous favicons to guide your brainstorming. Make sure that when you add the new favicon it's called favicon. You may notice that there are three other images in the root directory of your site: icon.
What are these for? This text is shown in the browser's title bar. External script tags will be placed just before the ending body tag. This is where you can link your external JavaScript code.
This starter code contains important information like the doctype, metadata, external stylesheets and script tags. If you read this far, tweet to the author to show them you care. Tweet a thanks. Learn to code for free.
Get started. Forum Donate. Jessica Wilkins. The final script element is for Google Analytics, this can be removed, but if you do use it simply add your own Google Analytics code. This will give an introduction to what the site is about, good for SEO. Note also that all links are relative in this document, and so you may need to change them to root-relative or absolute links if you start nesting web pages in folders.
Also, it is good practice to add comments if you make any major changes to the HTML. So when you come back you can remind yourself of what changes were made. This is the reset document that ensures all browsers start on a level playing field when it comes to your website. By contrast, main. Everything here is fair game for updating, although carefully consider whether you should do so.
There's an area set aside for the author's custom styles ie, yours or you could create an entirely separate CSS document and attach that to your HTML as well. Whatever your choice, be mindful of how you'll deal with subsequent updates to HTML5 Boilerplate itself. If you edit any of the default main.
Therefore, again make use of comments for any changes, thereby making later comparisons much easier. Once you gain experience, it's worth considering a custom build using Initializr , retaining the components you need and ditching those you don't.
These downloads and services are all free, so you can check out and experiment with them at your leisure. Still, whatever you do, a little work and investigation now should save you a whole lot of time later, when you just pull out your boilerplate safely stashed away in cloud storage to get cracking on a new website.
Craig Grannell.
0コメント