There are just one or 2 minor changes today.
1. I noticed that on a recent post, the character limit left it in the middle of a picture, I didn't mind this too much, but it meant that the unfinished link swallowed the ... and made the link point to the picture. I added in an empty link before the ... to prevent this. It does not affect any others.
2. I decided to change the email me link to an email form rather than just a mailto.
3. There are now icons at the top right for the Email page and to twitter.
4. I changed the banner so that it is a link to the home page, that seems to be a thing that websites do.
4. The travel blog now has a pins in a map page.
Unfortunately I have no exciting coding adventures to share this time. I'm as disappointed as you are.
I think the website is done, but I thought that when I first made it.
Friday 14 February 2014
Friday 7 February 2014
Life as a div
I just can't seem to leave this website alone, I keep seeing things and changing my mind about what should go where.
I am so glad that I split my pages as it makes it so much easier to maintain.
The changes ordered by when they were made will follow in a numbered list:
1. The losing time clock now has digits rather than spots and a colourful table now exists at the bottom
2. The RSS feed links now float vertically at the right of the page rather than sitting horizontally at the top.
3. The post tables on the main page now have the title field in black with white text and links along with an icon on the right indicating where the post was made.
I like to list the changes at the start of the post, that way its more likely to fit within the character limit on the homepage and I can just ramble aimlessly in the rest of the post, hidden from view unless the post is opened.
Rambling begins now...
I first came across divs while writing in the travel blog, I marvelled at the way the pictures I added sat there letting the text wrap around them, in much the same way as they wouldn't if you just added them in line with the text.
I first actually used them in work though, at work, we have a Sharepoint Intranet site, which is a good way to allow people to modify their own pages etc. I believe the installed program is much better, but the online editing tools we do have access to can be quite... frustrating. Its quite hard to position things and when you come to adding images, links and so on, it does have a tendency to get confused and throw in mysterious additional line breaks and so on. Unsurprisingly, it doesn't take long for me to jump into the html of the part I'm looking at, where everything makes sense and you can remove the mysterious additional line breaks yourself.
There were some sections added to the home page with button links to various web programs or important information, which at some point I had call to add a link in myself, this was when I realised how it had been made - It was in a table, with the row containing the icons and the next row containing the names of the names. I could understand how this made sense when creating this from the GUI point of view, but it was extremely messy when trying to edit the html as I came to do as html is sorted in a very specific way with the table row coming first then all the table cells coming individually until you come to the end of the row, then you start the next one with your 2nd table row and all the table cells. So all the icons were listed, then all the names were separate, so if I wanted to add a new icon in the middle, I had to be careful to make sure I got it into the same position in the 2nd part. What if I forgot? All the icons would go askew from their counterpart name... I could not stand this, the first thing I did was to remove the 2nd row and to simply but a line break between the 2 sections - Things were starting to make a lot more sense already.
Shortly afterwards, with the increasing need for icons as I came to add another one, the inevitable happened - We reached the end of the area they fitted into in the screen and a decision had to be made about how to deal with the extra icons, would they stretch on to infinity and stretch people screens? Would we have to shrink the icons widths down to fit more in? Or perhaps most sensibly break onto a new line? Obviously the breaking onto a new line option was chosen, so we did. Initially this was done within the existing table, it wasn't perfect, the end and subsequent start of the next rows would have to be moved if new ones were added in (or removed) but it worked and it looked ok... Until I saw someone accessing it on a wider screen, it looked ridiculous, why did the line break 2 thirds of the way across? We could not live with that, things had to change - I took it upon myself to make that change, it seemed the best way to change it was to use those magical divs, if I put every icon inside a div of a fixed height and floated them to the left, they would just sit next to each other and they would just sit next to each other until the reached the end of the line, where they would automatically break onto the next one, wouldn't they?...
Yes. That is exactly what they do now, its beautiful. I have shown others how to edit them, but it seems I'm the only one that does add to them now, I think it might now be part of my job...
I decided to use the same div effect on this website when creating the pictures page so that I could show all 20 items on one page quite easily with one quick line of code.
Then I decided the other day I decided to move the box of RSS links, it seemed that having them horizontally across the top made it look like they were links to sections within the website rather than an optional subscribey bit, I thought it would be better vertically on the right hand side. Initially I was going to just put them into the next table column, but that wasn't quite right, it shrank the middle section in a bit too much, so I thought if I floated it over the existing grey space it would look better, then by giving it a fixed position it could follow you up and down the page. I liked it now, the only drawback being if you zoom in it overlaps the rest of the page... I thought in its new position, it would work quite well on all the pages, so I put it in the top part of the page.
Next while altering the post tables, I decided to add the icon to the right hand side, I thought, hey those divs work quite well, I can just float them on the right hand side, but no, if there was more than one line of text it would fall to the right of the next row, I tried to mess around, push it up etc, I didn't want to have to move the div to the start of the row as that would either mean repeating the if functions or putting all of the information in the header into the if function. So then I just put it into another table, which worked great. Sometimes you just have to pick the right tools for the job
I am so glad that I split my pages as it makes it so much easier to maintain.
The changes ordered by when they were made will follow in a numbered list:
1. The losing time clock now has digits rather than spots and a colourful table now exists at the bottom
2. The RSS feed links now float vertically at the right of the page rather than sitting horizontally at the top.
3. The post tables on the main page now have the title field in black with white text and links along with an icon on the right indicating where the post was made.
I like to list the changes at the start of the post, that way its more likely to fit within the character limit on the homepage and I can just ramble aimlessly in the rest of the post, hidden from view unless the post is opened.
Rambling begins now...
I first came across divs while writing in the travel blog, I marvelled at the way the pictures I added sat there letting the text wrap around them, in much the same way as they wouldn't if you just added them in line with the text.
I first actually used them in work though, at work, we have a Sharepoint Intranet site, which is a good way to allow people to modify their own pages etc. I believe the installed program is much better, but the online editing tools we do have access to can be quite... frustrating. Its quite hard to position things and when you come to adding images, links and so on, it does have a tendency to get confused and throw in mysterious additional line breaks and so on. Unsurprisingly, it doesn't take long for me to jump into the html of the part I'm looking at, where everything makes sense and you can remove the mysterious additional line breaks yourself.
There were some sections added to the home page with button links to various web programs or important information, which at some point I had call to add a link in myself, this was when I realised how it had been made - It was in a table, with the row containing the icons and the next row containing the names of the names. I could understand how this made sense when creating this from the GUI point of view, but it was extremely messy when trying to edit the html as I came to do as html is sorted in a very specific way with the table row coming first then all the table cells coming individually until you come to the end of the row, then you start the next one with your 2nd table row and all the table cells. So all the icons were listed, then all the names were separate, so if I wanted to add a new icon in the middle, I had to be careful to make sure I got it into the same position in the 2nd part. What if I forgot? All the icons would go askew from their counterpart name... I could not stand this, the first thing I did was to remove the 2nd row and to simply but a line break between the 2 sections - Things were starting to make a lot more sense already.
Shortly afterwards, with the increasing need for icons as I came to add another one, the inevitable happened - We reached the end of the area they fitted into in the screen and a decision had to be made about how to deal with the extra icons, would they stretch on to infinity and stretch people screens? Would we have to shrink the icons widths down to fit more in? Or perhaps most sensibly break onto a new line? Obviously the breaking onto a new line option was chosen, so we did. Initially this was done within the existing table, it wasn't perfect, the end and subsequent start of the next rows would have to be moved if new ones were added in (or removed) but it worked and it looked ok... Until I saw someone accessing it on a wider screen, it looked ridiculous, why did the line break 2 thirds of the way across? We could not live with that, things had to change - I took it upon myself to make that change, it seemed the best way to change it was to use those magical divs, if I put every icon inside a div of a fixed height and floated them to the left, they would just sit next to each other and they would just sit next to each other until the reached the end of the line, where they would automatically break onto the next one, wouldn't they?...
Yes. That is exactly what they do now, its beautiful. I have shown others how to edit them, but it seems I'm the only one that does add to them now, I think it might now be part of my job...
I decided to use the same div effect on this website when creating the pictures page so that I could show all 20 items on one page quite easily with one quick line of code.
Then I decided the other day I decided to move the box of RSS links, it seemed that having them horizontally across the top made it look like they were links to sections within the website rather than an optional subscribey bit, I thought it would be better vertically on the right hand side. Initially I was going to just put them into the next table column, but that wasn't quite right, it shrank the middle section in a bit too much, so I thought if I floated it over the existing grey space it would look better, then by giving it a fixed position it could follow you up and down the page. I liked it now, the only drawback being if you zoom in it overlaps the rest of the page... I thought in its new position, it would work quite well on all the pages, so I put it in the top part of the page.
Next while altering the post tables, I decided to add the icon to the right hand side, I thought, hey those divs work quite well, I can just float them on the right hand side, but no, if there was more than one line of text it would fall to the right of the next row, I tried to mess around, push it up etc, I didn't want to have to move the div to the start of the row as that would either mean repeating the if functions or putting all of the information in the header into the if function. So then I just put it into another table, which worked great. Sometimes you just have to pick the right tools for the job
Subscribe to:
Posts (Atom)