1. NOTETAB

Top of the Page







































____________________________________________________________________________________________________________________________

2. Zubrag

Zubrag 3/03/2012

Zubrag utility to protect HTML pages
Protects by encoding pages with a password which cannot be
retrieved. Files are:
zubrag_1c.html + zubrag.gif + zu_style2.css

Local copy:
file://F:\BackUpDriveH\kes\zubrag_1c.html and also file://F:\BackUpDriveH\kes\zubrag_ss.html

Super secure:
file://F:\BackUpDriveH\kes\zubrag_ss.html

Disk: F:\BackUpDriveH\KES
URL: http://ancasta.net/security/zubrag_1c.html and also http://ancasta.net/security/zubrag_ss.html

Protected files with _vb (=Victorian ballad): T1htc,Irao2ys~[VB]:{_^_}
Protected files with _dsp (= simple duck phrase): Be kind to your webfooted friends
----------------------------------------------------------------------------------------

Zubrag Notes on understanding the algorithm:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Located in: file://F:\BackUpDriveH\KESDON\toolkit\zubrag.doc
file://F:\BackUpDriveH\KES\zubrag.doc
file://F:\BackUpDriveH\KESDON\toolkit\zubrag.pdf






____________________________________________________________________________________________________________________________

3. Email

Email 10/6/2012

O_AmrMeHg,0waH4? http://outlook.com
kesland@hushmail.com Full Ducks!
kes_mog@hush.com Full ducks wih punctuation

kes@topmail.co.uk }
kesmog@topmail.co.uk } pw: All at K_B***************!
kes.mog@topmail.co.uk } http://topmail.co.uk
kesdon@topnail.co.uk }

kesmog@gmail.com h*****_***_7d7
kesmog@yahoo.co.uk h*****_***_7d7

prof.mikehart@
googlemail.com 59*******61

Email accounts
==============
ancasta@lavabit.com
basura@fusemail.net
belgarum@mailanyone.net
jetable@fusemail.net
jetable2@fusemail.net
kes@fusemail.com
kes@fusemail.net
kesmog@lavabit.com
Mike.Rowsoft@fusemail.net
ne_mail@fusemail.net
vanus@fusemail.net
x_mail@fusemail.net
xmail@fusemail.net
xsmail@fusemail.net

K_Bk2ywff,4admbsg!

[FastMail Aliases]
basura@emailuser.net --> basura
jetable@emailuser.net --> jetable
xmail@emailuser.net --> xmail
basura@xsmail.com --> xsmail

[Fusemail Aliases - part]
basura@mailanyone.net --> basura
Mike.Rowsoft@fusemail.net -->Mike.Rowsoft

(Following not tested but probably in the Rules]
ne_mail@fusemail.net --> ne_mail
xmail@fusemail.net --> xmail
x_mail@fusemail.net --> x_mail
vanus@fusemail.net --> vanus
jetable@fusemail.net --> jetable
kes@fusmail.net --> kes
basura@fusemail.net --> basura
jetable2@fusemail.net --> jetable
belgarum@mailanyone.net --> belgarum
xsmail@fusemail.net --> xsmail
basura@mailanyone.net --> basura




____________________________________________________________________________________________________________________________

4. Password_gen

[Password Generator] 24/05/2012

Online password generator:
http://kesland.info/mch_pw_gen.html

Also stored in a second location:
http://ancasta.net/computing/mch_pw_gen.html

http://stackoverflow.com/questions/2772014/is-sha-1-secure-for-password-storage

NB:F1TsE4k{s}0g@MnSlDmV

OFFLINE password generator (MD5/SHA1 for Apache .htpasswd file)

file://F:\BackUpDriveH\APACHE\htpassword.html
(NB needs the three .js files to work: javacrypt.js md5.js sha1.js)

Here is the file to ascertain the decoding of WS_FTP passwords from the .ini file:
file://F:\BackUpDriveH\APACHE\WS_FTP_Decode.html

Range of password generators (hashes from MD5 -->Whirlpool)
http://kesdon.info/sha1f.php

Apache password generators here:
http://www.askapache.com/online-tools/htpasswd-generator/


Updated?
http://aspirine.org/htpasswd_en.html

F1tse4KesMog(Mn:Sl:DmV.)









____________________________________________________________________________________________________________________________

5. PHP_Password

PHP_Password 28/05/2012

The original password protection file is to be found at http://www.zubrag.com/scripts/password-protect.php
where instructions to use/install are also found
^^^^^^^^^^^
Procedure is as follows
(i) Put original file into webspace and run it with a help paramater e.g. password-protect.php?help.
If you add a password only, make sure setting in line 58 is set to 'false' (to turn it off)
(ii) Take the first line and add to first line of to-be-protected file (which you turn into a .php file)
(iii) Add the user or user+password lines in the Settings section (Lines 47-72)
(iv) MCH additions: Add line 135 to turn password into a hashed version (Whirlpool in error_log6.php)
(v) Rename file to something like error_log.php to help disguise its functions (to resist intrudors)
(vi) Test file is: http://kesland.info/apache_pw.php (NB note .php extension). The original (on disk) is to be found at:
F:\BackUpDriveH\ANCASTA\php_pass\sha1e.php

Various development versions (all in F:\BackUpDriveH\NOTETAB) as follows:
error_log.php Original version renamed from password-protect.php
error_log2.php User:mch_system pw:{Ducks!} added in
error_log3.php Version which uses password only (not user+password)
error_log4.php SHA1 version (Ducks!)
error_log5.php SHA1 version (Ducks! in words)
error_log6.php Whirlpool version (Ducks! in words)
error_log7.php Whirlpool version + salt (Ducks in words!)

USE this method if you suspect that javascript-protected version might not work
Use this password hashmaker: http://ancasta.net/egg/sha1e.php




6. Fusemail

Fusemail 3/03/2012

fusemail.com
login: kes@fusemail.com
pw: FM_Bk2ywff,4admbsg!
Use Webmail as follows:

URL: https://webmail.mailanyone.net

New URL: https://wm.fusemail.com/



















____________________________________________________________________________________________________________________________



7. Safe-Mail

Safe-Mail 4/03/2012

Safe-mail.net
Message is sent to the server internally. The email recipient is sent a password so that they can read the secure email on the safe-mail server
User:kesland@safemail.net pw: S_Bk2ywff,4admbsg!

URL: http://safe-mail.net

Apple iMac 21.5-inch Desktop (Intel Core i5 2.8 GHz, 8 GB RAM, 1 TB, Intel Iris Pro 6200, OS X) - Silver - 2015




















____________________________________________________________________________________________________________________________

8. Lockbin

Lockbin 8/03/2012

Lockbin.com
is a mail encryption (secure email) facility that uses 256-bit encryption if both sender/recipient know the key. Very good but captcha can be a bit problematic and there is no visual cue that your message has actually gone!

URL: http://lockbin.com





















____________________________________________________________________________________________________________________________

9. PDFOnline

PDFonline 11/3/2012

pdfonline.com/convert-pdf
An excellent source for producing .pdf files from .doc files. This utility produces a file approx 40% smaller than the original e.g. cv_socsc.doc=93k,cv_socsc.pdf=41k
Converted file is available in the Downloads folder

URL: http://pdfonline.com/convert-pdf

Better one (i.e. more compact, available in browser)
URL: http://docupub.com/pdfconvert/

HTML->PDF Converter 27/10/2012
===================

URL: http://www.html-to-pdf.net/free-online-pdf-converter.aspx

Source file : http://kesdon.info/notetab/nt.html 27,957 bytes
PDF saved as: http://kesdon.info/notetab/nt.pdf 63.462 bytes

But probably best of all, try
http://document.online-convert.com

PDF->Word Converter 26/03/2013 {updated for scanned .pdf on 8/04/2013}
===================
URL: http://www.cometdocs.com
Registerd under email address/password (Ducks!) Registered users: 15 files per week

See also for online conversion of scanned .pdf files (credit bought in both cases)

URL: http://www.onlineocr.net/
URL: http://www.abbyyonline.com/default/Account/LogOn




____________________________________________________________________________________________________________________________

10. Layout-3

Layout-3 20/3/2012

3 side-by-side divs
The secret is to have a wrapper that contains everything with a width=960;margin 0 auto construction
NB It is crucial to have an overflow:auto to prevent the table divs (left,mid.right) from ‘popping out’ of the container. Adjust the left margin of the middle div to give a good aesthetic appearance

Disk: file://F:\BackUpDriveH\CSS\gen_fixed_3.html



















____________________________________________________________________________________________________________________________



11. Wrapper

Wrapper 28/03/2012

Wrapper
-------

A typical usage is
body {background-color:white;
font: bold 12px/15px “Verdana”, sans-serif;
}
# wrapper {
width:960px; Typical screen port
margin:0 auto; LHS and RHS margins auto
margin-top:20px; Little bit of top space
background-color: #eeffff; Set to very light cyan
padding: 0 20px; padding 0 top,bottom,
20px each side
border: 1px solid black; thin black border
}














____________________________________________________________________________________________________________________________

12. Berea

Berea 2/04/2012

Berea layout models
~~~~~~~~~~~~~~~~~~~
Good general layout models of 2 and 3 column layouts with menus. fixed central columns, equal length columns.
See, in particular. The ’456bereastreet.com’ website contains an excellent commentary as to how the layout is constructed which has been turned into a .doc file and saved below: ?
Disk: F:\BackUpDriveH\WEBSITES\barea.doc

URL (mch):
http://mikehart.org.uk/berea_2
http://mikehart.org.uk/berea_3

URL: http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

Look in f:\BackUpDriveH\MENU2 and also at
file://F:/BackUpDriveH/CSS/berea_2.html

berea_a.html (Capbells header, 'Lorem ipsum' text)
berea_b.html (Just the same?)
berea_c.html (Catbells masthead+LH column + 'Lorem ipsum' text)
berea_d.html (with index 'database' included)
berea_e.html (as above but with the table removed to an external file ndex_page.html)
berea_lhs.html (side bar including buttons on left hand side)
berea_rhs.html (side bar including buttons on right hand side. Calls data base file 'ndex_page.html' ?)
menu2_b.html (experiments with 1400px wide screen (for the MAC)

A really simple (but effective) 2 column layout
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
developed from berea is located at: simple2_a







____________________________________________________________________________________________________________________________

13. Paint

Paint 3/04/2012

Paint programs
~~~~~~~~~~~~~~
(a) Web-based paint program - sumopaint.com
Username: kesmog pw: halcon_gato_7d7

(b) Box drawing programs + Word Art in TextMaker

(c) Screen capture: Capture 7 (on desktop) or, better
still,use the Snipping Tool (desktop)

(d)pixlr.com is a very useful tool also

URL: http://sumopaint.com

URL: http://pixlr.com














____________________________________________________________________________________________________________________________

14. Colour

Colour 5/04/2012

Very useful websites
http://tagindex.net/color/color_name.html

http://tagindex.net/color/background

See also
http://www.colorcodehex.com/html-color-names.html

http://www.htmlcolorname.com/

as well as

file://F:\BackUpDriveH\kesdon\colours.html

file://F:\BackUpDriveH\KESDON\HTML_colour_names.html

file://F:/BackUpDriveH\KESDON\colour_names.html
















____________________________________________________________________________________________________________________________

15. HomePage

HomePage 8/04/2012

New mikehart website is located at
http://m-hart.com F:\BackUpDriveH\MENUS\menus_mh.html {where all development files are located}

Basic Framework
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
- Bodywidth of 960px with auto margins
- Sidebar (for menus) 200px + 10 RHS padding
- Main (main output) 750px + 0 padding {750 +210 = 960}

Header
¯¯¯¯¯¯
- Header div holds text {"Mike hart's Home Page"} {#header2 with height 45px;top-margin 10px}
- Header photograph (width of 960, height of 200)
- Header caption (italic, 0.8em,floated right)

Inner div
¯¯¯¯¯¯¯¯¯
- width of 960px, over-flow:hidden
To act as a 'container' for sidebar+main (helps to ensure that sidebar stretches to foot of menu column)

Sidebar
¯¯¯¯¯¯¯
Contains a menu with an example from http://www.cssportal.com/vertical-menus
One gif used (menu8.gif) of 200px but another has been constructed (menu8a.gif) of 150px
http://pixlr.com is very useful in resizing this gif correctly

Sidebar has padding-bottom: 32767; margin-bottom:-32767 in order to extend columns

The gif contains 3 coloured bars (arranged vertically so that ''hover' and 'active' select appropriate bar
(-32px,- 64px}
Advantages Only one gif is loaded Can be recoloured using http://sumopaint.com
~~~~~~~~~~

Main div
¯¯¯¯¯¯¯¯
At the top of the main div are a series of 'tabbed' menus. These are provided by Paul O'Briens website at
http://www.pmob.co.uk/pob/rollovers.htm

These menus make use of a couple of gifs, loaded in the background, one of which is made transparent on hover (rollover2.gif) to reveal the other (rollover.gif) When selected, the rolloff2.gif is selected and then made transparent so that the default (light grey rollover2.gif) shows through...

This is clever! Also, can be resized in browser without breaking.

Boxed in Main div gives outline shape

Colours in Main div
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Background - floralwhite {parchmenty look} Text: darkslategray (pale black?} Subheadings: black

Email address is 'javscripted' to defeat spammers!
¯¯¯¯¯¯¯¯¯¯¯¯¯

Footer
¯¯¯¯¯¯
- made 958px wide so that border of 1px makes it exactly 960px
- margin-top Pushed up by -0.8em so as to avoid the double line
- 8 nbsp + ¦ character makes division between items
- Update for date put in a <span> to keep it all on one line

Layout model
¯¯¯¯¯¯¯¯¯¯¯¯
Can be found here...
css_box_mch

Latest version of a homepage
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
See: http://kesdon.info/mch/equal_mh3.html for the latest trial version of a homepage








____________________________________________________________________________________________________________________________

16. Menus

Menus 9/04/2012

[m-hart.com] points to http://kesland.info/mch

2ya.com is accessed with: username: mikehart pw: santiago

http://former.m-hart.com points to http://kesdon.info/mch_old
http://menus-151.m-hart.com points to http://kesdon.info/mch/menus_151.html
http://menus-201.m-hart.com points to http://kesdon.info/mch/menus_201.html

menus_150.html is a generic (i.e. empty) shell of menus_mch.html. 150 refers to 150px sidepanel
¯¯¯¯¯¯¯¯¯¯¯¯¯¯
menus_151.html is the above file but with the CSS removed into the file css_150.css
¯¯¯¯¯¯¯¯¯¯¯¯¯¯
menus_200.html is a generic (i.e. empty) shell of menus_mch.html. 200 refers to 150px sidepanel
¯¯¯¯¯¯¯¯¯¯¯¯¯¯
menus_201.html is the above file but with the CSS removed into the file css_200.css
¯¯¯¯¯¯¯¯¯¯¯¯¯¯
NB1 For some reason, the BODY formatting has to be put into the main body of the file
---

NB2 Some minute adjustment of margin-top is necessary so that the tabbled menus sit nicely on the top of the
--- containing frame

NB3 In 2ya.com names, prefix needs to be hyphen!
---

NB4 Blank.html used as a demo blank file to test menus
---









____________________________________________________________________________________________________________________________

17. Banner_Top

Banner_Top 10/04/2012

Developing a photograph 'banner top' to enliven a website
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Ideal is 960px wide by 200px high. This means that any existing photos will need to be cropped (eventually)
- Mountains and lakes make a good, natural subject
- Typically, the Lake District mountains can be gloomy so a neutral or blue sky is ideal

Procedure
¯¯¯¯¯¯¯¯¯
1. Find a photograph of a suitable subject (e.g. using 'Photographs of derwentwater' as a search term in Google)

2. Save the whole photo on local computer
(I had actually tried to do a crop and then a resize to 960px/200px. and the other way around.
This does not produce the sharpest picture)

3. Use inbuilt software ('Windows Live Photo Gallery') to crop photos. You can resize later.

Variants
¯¯¯¯¯¯¯¯
This is an a website with all five versions on it (menus_mh.html)+ 2 '150px' and 2 '200px' ones.
Also, display_2.html shows all Derwentwater photos at the appropriate resolution (960px x.200px)
See: http://m-hart.com/variants.html as well as
http://kesdon.info/mch/equal_mh3.html for the latest trial version of a homepage








____________________________________________________________________________________________________________________________

18. Directory_List

Directory_List 11/04/2012

Various directory listing programs have been rounded up and put into F:\BackUpDriveH\DIRPHP

They are
- ft_mch.php
- dir_list.php
- webadmin.php
- webadmin2.php

See, for example: http://dirlist.kesland.info


















____________________________________________________________________________________________________________________________

19. Rankings

Rankings 14/04/2012

Updated 'rankings' webpage
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Use Google with search terms such as 'Guardian Higher Education League tables' to get data published in May each year.

- Use last year's file as a model for this years (e.g. F:\BackUpDriveH\RANKINGS\rankings-2012.doc)

- Put Guardian file into 'Print Preview' mode and then copy over the relevant lines of data into this year's file.
It is a good idea to highlight (in yellow) and then embolden the UoW data. Check headings when stitching in.

- Convert .doc file into .pdf file using PDFonline

File: file://F:\BackUpDriveH\kac-business\kac_business.html in: http://uwin.org.uk -> http://business-kac.co.uk

Direct link at: http://uwin.org.uk/rankings













____________________________________________________________________________________________________________________________

20. Fluid

Fluid 15/04/2012

Full fluid version of menu implemented

The final development version
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯

Final development version: F:\BackUpDriveH\MENU2\menu2_c.html
Final 'fixed' version: F:\BackUpDriveH\MENU2\menu4.html

These require 2 large .jpg files as follows
(i) For header banner: catbells_2_h.jpg (in #head)
(ii) For vertical LHS: catbells_2_v.jpg (in #left)

Operation: header (banner)+footer+LHS+foot pinned in position by absolute references. Then the central panel can scroll as much as needed

Menus <dt> and <dd> format utilised












____________________________________________________________________________________________________________________________

21. Screen_Resolution

Screen_Resolution 21/04/2012

Screen resolution experiments
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1024 x 768 does not translate into the browser-width ( or 'free canvas') because of 'browser chrome' (toolbars etc.)

1. 960 seems to be a very common pattern and I have now decided to standardise upon it.
See F:\BackUpDriveH\MENUS\menus_mh_960.html which has become the template for my new home page
(http://m-hart.com)

The basic pattern of the website is described by clicking Layout on the footer. This calls an .html holding
program(css_box_mch.html) which holds a .gif captured by using the snapping tool (bottom toolbar) on the
Print Preview of F:\BackUpDriveH\CSS\css_Box_mch.doc) and then saving it as a gif (css_box_mch.gif)

See below for more details on diagram construction

2. To make menubar space slightly larger, you can up the screenwidth to 980px (works on an iPad!) or even 1000px
(does not work on an iPad without some truncation)
Hence decided to stick with 960px as a 'safe' option

3. Diagram construction
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
all in Object->New Drawing->rectangle part of TextMaker (see bullet points)

* Object - New Drawing - rectangle {inserts a box}
* New Text Frame {place holder for Text}
* Manipulate using red handles... put Text Frame within rectangle
* Colour in by selecting rectangle Object ->Properties ->Filling {select color}

Further thoughts on 960px screen resolution
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
I suspect that its now very popular because
- slightly conservative
- 960px is divisible by 2..64 and professional designers can use a pixel grid
- basic screen model can be seen here /BackUpDriveH/MENUS/css_box_mch

Parameters in /BackUpDriveH/MENUS/menus_mh_960
line 6 body 960px
line 39 #inner 960px
line 41 #main 830px
line 52 #sidebar 127px (padding: 10px 3px 0 0) = 130px
line 111 #footer 958px + 2 from border:1px solid black

Screen resolutions
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Technical information on viewports is stitched into http://kesdon.net
and can be accessed here
(i) screen widths (http://kesdon.info/toolkit/w_screen.html]
(ii) screen widths2 (http://responsejs.com/labs/dimensions)






____________________________________________________________________________________________________________________________

22. Optiview

Optiview 25/04/2012

http://optiview.com is an online facility which:

(a) optimises .gifs by stripping out unnecessary colours from the .gif palette

(b) optimises .jpg files in such a way that no discernible difference can be seen between the original and the
optimised image

http://m-hart.com/dw27a.jpg and http://m-hart.com/dw27aa.jpg

(c) A test file has been written and is available at http://m-hart.com/compare_jpg.html

If this doesn't work, try this
http://www.jpeg-optimizer.com/


















____________________________________________________________________________________________________________________________

23. Compacting

Compacting 25/04/2012

1. Take the file to be compressed (e.g. F:\BackUpDriveH\MENUS\menus_mh_961.html)and then
- copy into Clipboard
- enter into http://smartgb.com/free_encrypthtml.php
- take output (compressed) ans use NoteTab Pro to copy into a file such as mh_e1.html (Test this out)

2. Take entire script (between <SCRIPT> and </SCRIPT> and save it as an external file such as 'external.js'

3. Cut out all javescript and ensure that mh_e1.html now reads in <SCRIPT>
src="external.js" at start, charset="ISO-8859-1" at end. Test that this works

4. Feed 'external.js' into http://scriptingmagic.com/Topics/Compression/JavaScript%20Compressor
and then save resultant file as 'external2.js' into mh_e1.html Test out and then put onto thr web

5. Or try this: http://jscompress.com/















____________________________________________________________________________________________________________________________

24. GetFoldersize

GetFoldersize 29/04/2012

This is an installed utility

To use (assume F:\BackUpDriveH is selected)

1. Scan using Scan button on top row (Takes about 40 seconds)

2. Right click on Name in FOLDERS to get a sort

3. Choose NOTETAB (for example)

4. Right click on File Name to sort
(NB Extension does this as well - a bug?)


¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Folder Size
¯¯¯¯¯¯¯¯¯¯¯
Installed utility
This seems more intuitive, faster, prettier etc.
use Green SCAN button on top row




:






____________________________________________________________________________________________________________________________

25. Test_Sites

Test_Sites 29/04/2012

Test sites to try out e.g. PHP programs are available at
(i) http://mch-net.info/test
(ii) http://kesland.info/test
(iii) http://kesdon.info/test























____________________________________________________________________________________________________________________________

26. Old-Fogies

Old-Fogies 30/04/2012

http://old-fogies.net (which points to http://kesdon.info/net-old) is a page which chooses between
Old-fogies, Winchester and Old-Fogies, De Montfort University

The name old-fogies.net is a name bought through heartinternet.co.uk






















____________________________________________________________________________________________________________________________

27. TreePad Lite

TreePad Lite 30/05/2012

Seems to work just like NoteTab!

Hints

1. To navigate, thenm highlight link and use Navigate->Follow Hyperlink
Quicker is to highlight and then CTRL-H
e.g. http://treepad.com

2. Help->Manual brings up a second TreePad containing the manual

3. Navigating to an internal file: (1) Use Insert->Hyperlink {Navigate to file - will add file: and put inside square brackets)
(2) Navigate ->Follow Hyperlink
(3) e.g. file://F:\BackUpDriveH\CSS\gen_fixed_3.html























____________________________________________________________________________________________________________________________

28. NoteTab_Guide

NoteTab_Guide 9/05/2012

General Information
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
NoteTab Pro v 4.95 has been updated to NotePad Pro v. 6.2. Also the free version of NoteTab has been downloaded, installed on the system and then uninstalled. These three versions are all stored in
F:\BackUpDriveH\NOTETAB\Sources

Instruction for Use
¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯¯
Sample skeleton follows:

= V4 Outline MultiLine NoSorting TabWidth=30

Note that putting the heading in square brackets [Documents] creates a clickable link but at the top of a document, it can serve as a heading

NB The NoSorting parameter keeps items in their original (i.e. entered) order.
¯¯¯ Make a new file with this removed to get a sorted list (or just take out the No?)
---------------------------------------------------------------------------------

Ctrl+Shift+A: Adds a heading
Ctrl+Shift+R: Removes a heading
Ctrl+Shift+B: {after highlighted word} Makes a heading

Ctrl+Alt+Down: Move Next
Ctrl+Alt+Up: Move Previous
Ctrl+Alt+Home: Move First
Ctrl+Alt+End: Move End

Summarised under Document->Outline Headings

Right-click on the Headings pane (coloured light green/light yellow) to get the following
- Add Heading
- Make Heading
- Remove Heading
- Edit Heading
- Sort Heading [NB Save under a new title immediately afterwards!]

- Add from Clipboard
- Copy to Clipboard
- Headings to Clipboard

- Font
- Background Color
- Show headings [copies to output screen]

Add Documents to Favourites: Shift+Ctrl+D

Hints
¯¯¯¯¯

1. Put headings as a clickable link at the top of each output screen e.g. Zubrag to double as a heading
(because links are in blue) and will ALWAYS be found in a Search. Underline with the = character

2. Right click on Headings and then Sort (but this sorts the whole file - be careful NOT to save
unless you immediately save under a different title e.g. webfile_s.otl

3. Add file:// in front of a file stored on disk to make a clickable link

Maximum File size: 2 GB
See also Manual at: file://F:\BackUpDriveH\NOTETAB\NoteTab-Manual.pdf










____________________________________________________________________________________________________________________________

29. WS_FTP

WS_FTP

Copy this line into 'Search' Box and then double click WS_FTP.ini when found (first page is blank!)

C:\Users\kesmog\AppData\Local\VirtualStore\Program Files (x86)\WS_FTP\WS_FTP.ini

Then decode with:

file://F:\BackUpDriveH\APACHE\WS_FTP_Decode.html























____________________________________________________________________________________________________________________________

30. Frames/iFrames

Frames/iFrames 3/06/2012

Traditional Frames
~~~~~~~~~~~~~~~~~~
It is possible to turn Notepad .otl files into a fully functional equivalent using frames although this approach is now somewhat out-of-favour.
However, it works very well but does require 4 files in total as follows
file://F:\BackUpDriveH\FRAMES\web_frames.html which is a containing file for the frames
file://F:\BackUpDriveH\FRAMES\titlebar.html which is the header
file://F:\BackUpDriveH\FRAMES\sidebar.html which is the LHS navigation panel and
file://F:\BackUpDriveH\NOTETAB\mycontent.html which is the file derived from Notepad's Modify->Document to HTML->With Paragraph Tages
(Some judicious editing of this may have to take place for tidying up purposes - once created, it can be 'added to' quite easily.)

iframes
~~~~~~~
This approach is newer and more consistent with current standards. The approach rests in one file which has a Left Navigation panel and then a
WebPages panel, both using traditional floats and careful calculation of pixels - see comment at end of file for figures.
The main exemplar is file://F:\BackUpDriveH\NOTETAB\f2css.html and this can be used as a basic model. Note that the 'guts' is a one line
of HTML in the contents section as follows:

<iframe style="position:absolute;top:50px;left:20px;width:1120px;height:88%;border:1px solid black;" name="iframed" id="iframed" src="start.html"></iframe>

These parameters are obvious i.e. position from the top, left,width and height, border and a name.
The simple file file://F:\BackUpDriveH\NOTETAB\start.html is just a way of getting simple instructions into the output pane by default.

Notice also how the Navigation (list items) call this e.g. <li>11. <A HREF="mycontent.html#A11" target='iframed'>Paint</A>
(Some previous development versions are file://F:\BackUpDriveH\NOTETAB\f2css4.html and file://F:\BackUpDriveH\NOTETAB\f2css3.html (better!)
The file file://F:\BackUpDriveH\NOTETAB\mycontent.html is fed into to supply the results to the output pane.

Two versions are written : a universal 960px (webframes_960.html) and a maximum 1344 version (webframes_max.html), as well as protected counterparts with a p suffix

Treepad (free) version will accept NoteTab .otl files after conversion and the paid for version (Trepad Safe)
will write (kludgey!) framework files after conversion. They use the files F:\BackUpFriveH\NOTETAB\TREEPAD\w_page.hjt (free version)
and F:\BackUpFriveH\NOTETAB\TREEPAD\web_page.hjt

The finished article is on the web at http://kesland.info/mch/web_frames.html (pw: Come ........,Maud!)

Footnote: 'One complete file' version is now to to be found at: F://BackUpDriveH/NOTETAB/webframes_mx2.html

A definitive article(and code) is here
http://www.dev-explorer.com/articles/full-page-iframe







____________________________________________________________________________________________________________________________

31. Footer (Sticky)

Footer(sticky) 9/06/2012

This is the definitive URL
http://www.htmltutorialsandtips.com/css-sticky-footer/

and the crucial bits of code (made specific to F://BackUpDriveH\MENU2\berea_m.html are:

html, body{height: 100%; width: 100%;}
div#wrapper{min-height: 100%; width: 960px; margin: 0px auto; position: relative;}
div#main{padding-bottom: 150px;}
div#footer{width: 960px; height: 150px; position: absolute; bottom: 0px;}

and this is the critical explanation of how it works:

[Why it Works]
'If we hadn’t set the wrapper’s positioning to relative then it would snap to the browser window instead. If that were the case then your content would go behind the footer if it was longer than the browser window. This way if the content doesn’t fill the browser window the footer snaps to the bottom of the wrapper, which we have stretching at minimum to the bottom of the window. If the content is longer, the wrapper will stretch to contain it, and the footer will stay at the bottom of the wrapper.'

It has been applied to all of the files which constitute the 'bouncy' website.
See: F://BackUpDriveH\MCH-NET\bouncy\bouncy_2.html













____________________________________________________________________________________________________________________________

32. Compress PDF & js

Compress PDF & js 15/10/2012

This appears to be of the most professional and versatile websites. You can use maximum compression (without loss of quality) for text files:

http://convert.neevia.com/pdfcompress

Sample compression as follows
F:\BackUpDriveH\REVIEWS\scanner.pdf 360KB -> 271 KB (Maximum compression)

To compress Javascript use
http://jscompress.com/
NB original source code is in F:\BackUpDriveH\WEB-DESIGN\utils.html
and has hours augmented by '+1' to cope with BST rather than GMT!























____________________________________________________________________________________________________________________________

33. Blogs

Blogs 20/10/2012

1. Probably the best
http://mikehart2012.wordpress.com mikehart2012 Ducks!

2. Or this one
http://mikehart01.blogspot.co.uk/

access via blogger.com Username: email pw: Ducks!

3. Historic
http://typepad.com fastmail 59*******61

4. Demo one
http://mog.kesland.info fastmail Ducks!


























____________________________________________________________________________________________________________________________

34. URL shorteners

URL shorteners 25/08/2014

Publicly available ones are
v.gd is.gd po.st bit.ly tinyurl.com
The advantage of the first two of these is that with the addition of a trailing hyphen (-), you are taken to a confirmtion screen which
ensures you are in the right place e.g. http://is.gd/abswork- Look at http://kesdon.eu/url or http://mhart.eu/url

However, it was quite easy to write a 'domestic' url shortener using .htaccess directives (example below)
__________________________________________________________________________________________________________________________
Options +FollowSymlinks
RewriteEngine on
rewriterule ^url$ http://mch-design.org.uk/po-st.html$1 [r=301,nc]
rewriterule ^short$ http://mch-design.org.uk/short_url.html$1 [r=301,nc]
rewriterule ^BMI$ http://health.mch-net.info/workout.html$1 [r=301,nc]
rewriterule ^WEBCOL$ http://mch-design.org.uk/web-table.html$1 [r=301,nc]
rewriterule ^mch$ http://m-hart.com$1 [r=301,nc]
rewriterule ^pubs http://mh-lectures.co.uk/pubs/papers.html
rewriterule ^fence http://kesdon.co.uk/fence
rewriterule ^help http://kesdon.net/urllist.html

# Previous more comprehensive version
# Options +FollowSymlinks
# RewriteEngine on
# rewriterule ^url(.*)$ http://mch-design.org.uk/po-st.html$1 [r=302,nc]
# rewriterule ^short(.*)$ http://mch-design.org.uk/short_url.html$1 [r=302,nc]
# rewriterule ^BMI(.*)$ http://health.mch-net.info/workout.html$1 [r=302,nc]
# rewriterule ^WEBCOL(.*)$ http://mch-design.org.uk/web-table.html$1 [r,nc]
____________________________________________________________________________________________________________________________

The two 'domestic' ones are
F:\BackupDriveH\kesdon\toolkit\kesdon-eu.html {on the web at http://kesdon.info/toolkit with the name http://kesdon.eu & http://kesdon.net
F:\BackupDriveH\statstore\mhart-eu\mhart-eu.html {on the web at http://mch-net.info/mhart-eu with the name http://mhart.eu


35. i-code.co.uk

i-code.co.uk 20/09/2014

Excellent utilities at
http://i-code.co.uk

12 February 2007 : Random Password Generator
1 June 2005 : JavaScript Blowfish HTML Encryption
3 March 2005 : JavaScript Select Option Navigation Menu
6 February 2005 : JavaScript Photo Album Viewer
30 January 2005 : JavaScript Decrypting Text Effect
19 January 2005 : JavaScript Firefox Redirect
16 January 2005 : JavaScript/DHTML Image Navigator Script
15 January 2005 : JavaScript Sliding Text Navigation Menu
11 January 2005 : JavaScript Random Password Generator
10 January 2005 : JavaScript In-line Image Viewer
9 January 2005 : JavaScript Redirection

See also http://kesdon.net (Row 1, column 6)















____________________________________________________________________________________________________________________________