Skip to content

Latest commit

 

History

History
103 lines (57 loc) · 4.5 KB

web_browsers.md

File metadata and controls

103 lines (57 loc) · 4.5 KB

#Web Browsers

##Note to parents / guardians:

While it would be preferable to have all students using the same web browser, such as Google Chrome, in order to make it easier to spot problems and make sure everything works as expected, we understand that this is not always possible.

We do, however, ask that you help your student upgrade whichever browser they are using to the latest version if it's not already up to date. In most cases, this won't be necessary as the four major modern browsers should now all automatically update themselves to save you the trouble.

###Instructions for updating browsers:

###Official Browser Homepages:


##Web Developer Tools One of the best tools available to students trying to learn about web technologies and how they work in the browser is the web development toolkit built in to each of the four major browsers. Our volunteers will frequently make use of these tools while instructing and assisting students.

###Instructions are provided below on how to access these tools in each browser:

Steps for accessing the Web Developer Tools in:

  1. Google Chrome
  2. Mozilla Firefox
  3. Microsoft Internet Explorer
  4. Apple Safari

###Google Chrome

Steps for accessing the Web Developer Tools:

Official Instructions from Google

####Mac OS X

The Chrome developer tools may be accessed by pressing COMMAND+OPTION+I, or clicking the "hamburger" menu in the far right of Chrome's toolbar, selecting Tools, and then selecting Developer Tools.

####Windows

The Chrome developer tools may be accessed by pressing CTRL+SHIFT+I, or clicking the "hamburger" menu in the far right of Chrome's toolbar, selecting Tools, and then selecting Developer Tools.


###Mozilla Firefox

Steps for accessing the Web Developer Tools:

Official Mozilla documentation ####Mac OS X

The Firefox developer tools may be accessed by pressing COMMAND+OPTION+I, or clicking the Tools menu in the system menu bar, selecting Web Developer, and then selecting Toggle Tools.

####Windows

The Firefox developer tools may be accessed by pressing COMMAND+OPTION+I, or clicking the Tools menu in the system menu bar, selecting Web Developer, and then selecting Toggle Tools.


###Microsoft Internet Explorer

Steps for accessing the Web Developer Tools:

Microsoft Developers Network guide to the F12 Developer Tools

####Windows

The Internet Explorer developer tools may be accessed by pressing F12, or clicking the "gear" menu in the far right of Internet Explorer's toolbar, and selecting Developer Tools.


###Apple Safari

Steps for accessing the Web Developer Tools:

Apple documentation on Safari's Developer Tools

####Mac OS X

The Safari developer tools aren't turned on by default. To reach them, you must first open Safari's preferences by pressing COMMAND+, or going to Safari in the menu bar, then selecting Preferences.

Once the Preferences window is open, click on the large gear labeled Advanced on the far right of the toolbar. Look for the checkbox near the bottom of this screen which reads "Show Develop menu in menu bar", and make sure that it is checked.

Once this has been done, you can access the developer tools by pressing COMMAND+OPTION+I, or clicking the Develop menu in the system menu bar, and selecting Show Web Inspector.


###Back to CoderDojo McDonough website

Author: Jaron R. Hendrix
Edited: 9:43 AM - Mar 12, 2014