Sun 11 Oct |
|
Some tips to make the remote design easier for your web designer.BrowsersAlways use Firefox web browser. It is the most standards compatible and enables us to use some very useful plugins that go with it. If you haven’t got it, it’s a free download from here and can happily be installed along side Internet Explorer and your Favorites (Bookmarks) etc can be easily imported during the installation. After the design is finished all display problems in Internet Explorer 7 & 8 will be corrected. If you still want to use Internet Explorer make sure you have the latest version (as of now Internet Explorer 8). You can download/upgrade here. I do not support Internet Explorer 6, it is now 9 years old, totally incompatible with modern web technology, very insecure, no longer supported by Microsoft and very buggy. If you require your site to display bug free in Internet Explorer 6 then the extra time and coding involved will be charged for. Be warned that some web technologies (Java Script, AJAX etc) will never work correctly in this browser. Web Page width sizeThis is measured in pixels and is a relative size, the page will always look bigger on a larger display than a smaller. The smallest modern screen size that is available now days is 1024 pixels wide (many are larger) but we design to this size as this is the smallest we will generally have to display to. To ensure it is all viewable with borders and scrollbars etc, we design to a width of 940 pixels. Of course this size is controllable by the user, in Firefox for example if you hold Ctrl and type + the display size will increase , type – and it decreases, type 0 and it returns to your default size Useful add-ons (plugins) for Firefox - ColourWhen discussing colour in web design, every shade has a hex code in the format #000000. #000000 is black, #ffffff is white and every other shade is something in between. A sort of greenie orange colour is meaningless to your designer! To measure the exact shade of colour install the plugin “ColorZilla “, go to this web address Colorzilla in your Firefox browser. Click on the large Install button  You will normally get this message so click on “OK” then “Allow”  You will get another popup where you need to click on “Install”   The install will complete and you need to re-start your browser. When re-started look in the left lower corner (Status Bar) of Firefox .If you can’t see your status bar enable it by the following.. There will now be a new icon so -->   Click once on this and your cursor will become a set of cross hairs which as you drag across the web page , shows the colour hex in the status bar.When you click on a colour then this colour is stored by ColorZilla. You can access this information by right clicking on the ColorZilla Symbol and copy the value. This is then on your clipboard ready to paste into an email to me with your colour change!  There are also many other useful options within ColorZilla to find the colours you want, for example , right click on the icon and then choose “Pallette Browser”This window will open where you can find an infinite number of shades.  Sizes in Web DesignAll sizes in Web Design are measured in pixels, any other measurement (inches, mm etc) are meaningless because they are totally dependent on the size of the display you are using. Especially meaningless is "a little bit more" ! A pixel is one unit on your Computer Screen which you can see if you look closely at your display. If you want to know how large a photo is or move some text left by a certain amount then we need some way of measuring the pixels directly, no matter what size of display we are using. To do this we install another Firefox plugin MeasureIt. With Firefox go to MeasureIt and click on the “Add to Firefox”  Follow the same installation process as with ColorZilla. When installed you will have another icon in the status bar.   When click on it your display will “grey out” slightly and you will be able to click-hold and drag out boxes on your screen which will report the exact size in pixels.To disable it just click the icon again. Fonts in Web DesignThere are only a small number of fonts that can be used in Web Design for text. By text I mean texts that are sent to your browser by your website to be displayed in your browser with html. It is possible to code other non-standard fonts but the vast majority will not see them because they are not installed on their computer, therefore they will just see the browser default font, normally Arial. All other non-standard fonts that you may see are actually images, i.e. pictures of text that have been manually produced in a graphics editor (Photoshop etc.) This can give very attractive results but has a large number of disadvantages. 1. Any editing of the text is very time consuming and therefore expensive. Every edit has to be remade in a graphics editor and uploaded to the web server. 2. The size is always static and will often break the web page layout if the user has there browser set on a higher viewing size. (i.e. Ctrl +) 3. The text is completely invisible to Google and all other search machines. They can only see html text, not images. This will really hurt your search engine rankings. 4. Negates the whole purpose of Content Management Systems (CMS) as none of the text is editable. Below is a list of the fonts that can be used in Web Design Common fonts to all versions of Windows & Mac equivalents.  |
| Last Updated on Tuesday, 20 October 2009 09:08 |