There are many online tools, web browser extensions, and add-ons to help you evaluate and test web pages. We will be talking about web page validation later, but you can use these tools now to become familiar with such tools and how to integrate them into your web browser.
Most browser-integration tools are browser specific, compared to online tools which sit in web pages, accessible through any browser. Browser-integration tools include extensions, add-ons, and bookmarklets.
How to Add an Extension or Add-on to Your Web Browser
To add an extension or add-on tool to your browser:
Go to the page or site for your browser’s extensions or add-ons:
Follow the instructions.
Posted in Web Design, WordPress Under the Hood |
Tagged browser bookmarklets, browser extensions, browser testing, browsers, chrome, code, css, debug, debug web pages, debugging, debugging web pages, evaluate web pages, firefox, HTML, html inspection, html inspector, inspector, testing, testing web pages, valid code, valid css, valid html, validation, web accessibility, writing code |
The following video contains useful web browser tips to help you speed you your browsing, WordPress, and web design work.
Basic Web Browser Tips by Lorelle VanFossen for Clark College from Lorelle VanFossen
Please note that the video refers to the Windows keyboard shortcuts using the CTRL key. This is the equivalent to the CMD key on Mac.
For mobile devices, long presses usually activate the equivalent of keyboard shortcuts and right clicks, though not all of them may be available in the apps you are using.
Here are some of the specific tips covered in the video.
Editing (just like in a word processor)
CTRL+C = Copy
CTRL+X = Cut
CTRL+V = Paste
CTRL+Z = Undo
CTRL+T = Open New Tab
F5 = Reload/Refresh Page
Zoom in and out of a web page (magnify): CTRL+Plus and CTRL+Minus
Right click on links on the page brings up the right click menu to access link specific options and features.
Right click on blank or empty spaces on a web page brings up the right click menu for page specific options and features.
Learn to open web pages in tabs not windows. This saves on computer memory issues and speeds up your browser process.
Use Mouse and Keyboard shortcuts: CTRL + Left Click on Link = Opens Linked Page in New Tab
Fast Navigation through Browser Tabs
CTRL+T = Opens New Tab
CTRL+1 = Goes to Tab #1
CTRL+ 2, 3, 4, etc. goes to that tab number
CTRL+Arrow = moves focus to next and previous tab
Working on web page design or WordPress? Refresh and you don’t see changes? You need to clear the cache and do a "hard" clearing page reload. F5 or SHIFT+F5 OR do a Cache Refresh
CTRL+F5 (Firefox and Chrome)
CTRL + R (Chrome)
(You may have to repeat a couple times)
To view the source code of a web page: Right Click > View Page Source
Web Developer Tools
Posted in Web Design, WordPress, wordpress tips |
Tagged browser, chrome, firebug, firefox, firefox extensions, how to use a browser, HTML, speed blogging, tutorial, video, web browser, Web Design, web developer, web programming |