Master Template

Website Designer tools of the trade.

Full Stack Developer - O'reilly copy and paste book

One of the funniest meme’s I’ve seen. Yet, for a website developer, heartening to see you’re not alone questioning just how much you’re copy & pasting. I hope you find something useful to copy & paste from this website. See more frivolity on the Master Template website designer fun page 😆

(emojis in your website - see html entity code for emojis on Master Template code snippets)

👉 In Japanese, the plural version of emoji is emoji. In written English, Merriam-Webster and Dictionary.com note that emoji and emojis are both commonly used as acceptable plurals of the word “emoji”.

Please share if you find the content useful - thank you

Firefox

The website designers browser

Currently my preferred browser is Firefox as it seems to conform most closely with W3C recommendations, making the initial design of a website a solid base to start from. (Accommodations can be made upon completion of a design for other browsers). To me, this seems like a sensible order of working.

Recent versions of this excellent browser have shipped with the default set to show “trimmed” urls in the search bar. Therefore it now hides from view “http://www” & “https://www”. I understand this from a general user interaction. Joe public doesn’t need to see the delivery style of the site. However, as developers this can be useful information.

Show full url’s in Firefox search bar

Open Firefox. You’ll need to open up Firefox’s configuration. You will be presented with a warning asking you if you are sure that you know what you’re doing? None of us can be that sure ;-) so click “I accept the risk” and continue.

in the url address bar type: browser:config
Press Return
Accept the risk as we need to get things done

Search for “trimURLs”

Locate the following…
browserurlbars trimURLs
if true click it to toggle it to ‘false’

Now your url address bar will show the full url for each website.

Website Designer Essential Firefox Tools

Firefox has a powerful set of web developer tools at your disposal most noteably the Inspector tool press the key combination ⌥ ⌘ and c key

Firefox web developer tools

Website Designer Essential Firefox Browser Recommended Add-ons

Viewport 1.1 by Kameron Add-on

Viewport 1.1 by Kameron.
Neat, unobtrusive and the information you want from your browser window. Highly recommended.

As you resize your browser window a readout appears in the top right of your browser window for a few seconds. Enough for you to make a note of the current browser window dimensions. It looks something like this…

Resize your browser window now to see the x and y pixel co-ordinates change ;-)

Website Designer Essential Browser Recommended Toolbar Bookmarks

Useful Apps & Services for website production and checking.

Production

Checking

HTML (php) Checker
The W3C Markup Validation Service

CSS Checker
The W3C CSS Validation Service

SSL Certificate Verify
SSL Checker - SSL Certificate Verify

Master Template World

Contact

Master Template Forum Robot

FORUM

Have a comment or something to say?
Say it here…

[privacy policy]