Updating Old HTML Webpages
|

Updating Old HTML Webpages

Byrichard

Most websites are simple. They have five to ten pages at most but usually a single page is enough. Most pages are about one specific thing, whether it’s a CV inspired page to find new clients or a simple page with a few products. Most are usually about a single topic. 


This makes website maintenance and design simple, because one theme fits every page. My website is different. It has articles about the Romans, Geography, Environmental Studies, old student newspaper articles, Media studies pages and more. In effect it is several websites rolled into one. 


The challenge with updating this website is in the size of the website. Since 1996 I have been adding pages, until about 2003 when I switched to wordpress- The website still has a thousand or more individual pages. Every time I update I have to update hundreds of pages. 


Recently I converted the surfing the World Wide Waves section to PHP, including one php page where I put the articles into arrays, and individual pages that load the title, content, navigation and more. The Surfing the World Wide Waves session is now a simple to edit set of PHP pages, rather than 50 individual pages. I can edit the navigation in a single place, rather than for each article. 


For the sake of consolidating my knowledge I was watching a learning path about HT and I saw that one challenge was to take an old HTML page, and improve it, to be a semantically correct web page. This is a process that I have done several hundred times over the years. 


I created style sheets, one for the Romans section, another for the Surfing The World Wide Waves Section and one or two other CSS files, where one CSS file is used by multiple pages. It helps to make the website uniform. 


Removing Tables and Inline formatting


Front Page 2000 and other website editor software added a lot of code, inline, which, today is not needed. Part of the process of going through the old pages is to strip out old code and replace it with modern code. I replace tables with divs, strong, and other tags with headers and more. I make it so that the website uses less code. 


Old pages sometimes have the font, font size, strong and other tags for each p tag. That’s a lot of code, for a page where CSS does the same thing, just once per tag, header etc. 


A Quick Tip


If and when you’re working on an old page you may find and other tags. In VS Code you can search and find and use find and replace to review every individual use individually and it automatically moves on to the next instance. 


I converted some long blocks of text from html to php within an echo tag and I had to escape a lot of ‘. I did this by selecting “‘“ and using find and replace with “\’” to go through every occurrence individually before moving it to an echo tag. I saved time and effort. 


List Items


If you’re working on a list of items you often have to write the same code for each list item and this takes time. With VS Code you can option select the front to each individual item and type

  • just once. With the closing tag you do the same, except that it will auto-complete the tag so that’s even easier than expected. This saves time. 


    Re-working an entire website is slow and repetitive but that repetition is good for two reasons. The first is that it gives me time to think about what I am doing, and to understand why I am doing it. The second is to develop work flows that increase efficiency. 


    I read, assess, clean up and then re-format individual pages so that they’re template friendly. My Surfing the World Wide Waves section is now like a blog, where I have the bare bones code on each page, and the content in a centralised place. If I took one more step then it would be a one page website. As I gain experience I can take that last step. 


    I am now focused on putting what I have learned to practice. I am consolidating what I have learned and finding solutions to practical challenges I encounter while working on my website. 

    • Working Towards a Goal

    Working Towards a Goal

    Byrichard

    I am currently working towards a goal and I am struggling. I am struggling to stay focused when I follow online courses because I find that my mind strays. I am also struggling because the topic is so broad that there are hundreds of things you can learn but you need to be focused.


    I am also struggling because although many people live in denial about the pandemic it is still thriving. The positivity check, for a disease, to be considered under control is less than five percent. COVID, after five years is still at ten or more percent. This gets in the way of going to conferences, meetups and other networking opportunities.


    Out of pandemic I would volunteer for many events for two reasons. The first is that I’m shy, and by volunteering I force myself to go to events. The second reason is price. If you volunteer you pay for the train or parking but nothing else. This is a good way of going to conferences, meeting people, and coming across interesting ideas.


    If I felt comfortable with what I am learning at the moment I would spend four or more hours a day on it. I would spend two hours in the morning and two hours in the afternoon.


    Recently my progress keeps stalling because I don’t have the solitude that I need to be at my most productive. I sit down, start to focus and then noise interrupts what I am working on and I stall.


    This isn’t an uncommon problem. Usually writers complain about this but I am not a writer.


    What I find hard with this situation is that I am a good worker, when I am in contract. The problem is that contracts are hard to find and they end after six to nine months, and finding the next one is a struggle. That’s why I’m working on changing career. That’s why I try to write at least a few lines of code every day. At the moment I am working on being at ease with Laravel and PHP and it’s progressing.


    The progress is not as fast as I’d like, because I don’t have as much solitude as I would like to make good progress.


    I am close to reaching my goal.

    Learning By Writing despite GPT

    Learning By Writing despite GPT

    Byrichard

    I am old enough to remember a teacher writing on a board or piece of plastic for an overhead projector. “Why don’t you just give us photocopies of what you’re writing instead of asking us to copy down what you’re writing. “Because you will remember it better if you write it down.”


    At the time this seemed stupid and a waste of time. Years later I think that we could have been taught to take summarised notes rather than literal notes but that isn’t the point. The point is that learning is as much about writing as it is about understanding the material Every day for weeks in a row I have taken the time to write a 300 word post and it’s difficult. Not only do you need to come up with an idea but you need to develop it into something that is at least three hundred words long.


    In my opinion chatGPT is going to lower the quality of people’s ability to write, by doing the writing for them. The process in and of itself is the learning experience. You don’t learn by typing a term in a search engine and reading. You learn by thinking of something, and then putting it into words. You learn by trying to write, finding that you have knowledge gaps, and then reading more, before returning to the document you are working on.


    The notion that you can get AI to write essays. academic papers, articles and more, is destructive.It is destructive because writing is a skill that is learned through practice. Writing requires us to learn how to think, elaborate, and then make clear. Writing is about elaborating ideas, and rewriting, to make those ideas clear to understand.


    Writing is a conversation that you can have with yourself. There is a lot to be gained by writing, rather than getting AI to write.


    I love technology, and I love when it can replace boring repetitive tasks, such as entering data into a database and more. I like when it takes data from a form, and places it into a database.


    What I hate about tech like chatGPT is that it is designed to replace human beings with artificial intellgence. It is about generating revenue for shareholders, without thinking of the humanity that is lost by doing away with human writers.


    One of the reasons I don’t like YouTube, blog farms, Buzzfeed and other sources of “news” is that they have clickbait headlines and rubbish content. We need humans to write content that we read because human written articles are personal. AI is cold.


    Recently tech giants, that doubled their profits from one year to the next, with billions of dollars in cash, or at least savings, fired thousands of people, not because they were running out of cash, or struggling to survive, but because they had to maximise profit, not for the human staff, but for the shareholders.
    It didn’t end there. Even the execs are taking pay cuts. We live in an age where companies are making billions, or even trillions in profit, and yet the money only flows one way. If a company is profitable it should be investing in staff, giving them better conditions and making sure they stay.


    Instead companies are making record profits, to pay dividends, rather than staff.


    We are living in affluent times, but the wealthy benefit whilst the rest of society lives in insecurity. That’s why technology like chatGPT worries me. We live in an age of enormous wealth, but it is being funnelled out of society, into offshore accounts, never to be seen again.


    And Finally


    Remember “The medium is the message” and “The manufacturing of consent”. If AI, rather than individuals write what we read, then those who control the technology control how we think. Read Mindf*ck and look at how FaceBook played with our emotions. Look at who has bought into chatGPT and you will see why I do not like or trust this technology.


    I love tech, when it is developed and controlled by moral, rather than corrupt people.

    Laravel and Context

    Laravel and Context

    Byrichard

    There is value in studying Laravel and context. By this I mean that over a year ago I wanted to study Angular but after feeling lost in Javascript I decided to take a step back, to study JavaScript. I studied two or more courses over a period of months. I could have followed a single course and claimed that I knew and understood JavaScript but that would have been misleading.


    The value in studying two, three or more courses is that each teacher, and each course takes a different approach, and each approach fills in gaps that are left open by others. By studying three or more courses on JavaScript I gained a better contextual understanding of what JavaScript can do, as well as how it works.


    Eventually I did return to JavaScript but I encountered another challenge. I don’t understand the error messages yet, because I haven’t come across them. That’s when I decided to circle around and study PHP from the ground up and that’s where I found comfort. I like PHP because errors are clear. They are usually literal. There is an error at this line and it’s easy to debug.


    After becoming more confident with PHP I started to rework my personal website so that pages went from being basic html pages that were decades old, with css added recently, they were php pages. Eventually I felt confident enough to step into the world or Laravel.


    I began by experimenting with one laravel tutorial on the laravel website, before following the tutorial but changing certain names. It worked well. I was able to create website sections and update content and more. I did get stuck when I wanted to make content visible to non logged in users.


    That’s when I decided to follow a course. The course is “Let’s Learn Laravel” by Brad Schiff. It is a comprehensive course, over fourteen and a half hours that teaches you how to create pages, users, models, use middleware, policies, how to create chat rooms and more. On the topic of chat rooms I find it interesting.


    He often says “this is outside the scope of the course so I won’t go into the details” but I have already been into depth by following Vanilla JavaScript courses. I would struggle to write the code from scratch, but if I see the code in front of me then I do understand what it does, to some degree. On this specific topic he also points us to node.js packages that do most of the work for us.


    The reason I follow Udemy coures, that I buy at 9.99 or 11USD, when they’re on sale, rather than follow hours of courses on YouTube is that they’re comprehensive. They also have to adhere to a certain standard. I also use Linkedin Learning for courses.


    My website is decades old, and it has gone from html, to html with CSS, to static php. By learning to use Laravel it will become dynamic. It will serve to prove that I understand what I am doing. It will help to build up my confidence, and my portfolio.

    Learning and Consolidation
    |

    Learning and Consolidation

    Byrichard

    Learning and Consolidation are important to me. Over a year ago I wanted to learn Laravel and Angular but when I started to study them I felt lost. I felt that I didn’t understand the topics well enough. I went back to the basics. I followed several courses about JavaScript and how it works. I typed out all of the lesson codes, and debugged it until it worked. Some bugs took three or four hours to fix, but eventually I got there


    As I followed two or more courses on the topic there was quite a bit of repetition. Another word for repetition is consolidation. By studying the same topics, taught by different people I consolidated my knowledge. I filled in the knowledge gaps and eventually I began to understand how the code works, even if I can’t write it from scratch yet.


    The aim isn’t necessarily to be able to write a web app from scratch. The aim is to understand how all the elements work individually, as well as how they work together in an app.


    Today for example in the Let’s Learn Laravel course I followed the lesson on form validation, with mention of Bcrypt and Node.js. This feels good, because I see how frameworks help to save time. For years I was happy to use WordPress as a user, because it works well as a blog and CMS. Now I have studied enough to build my own, although my greatest concern is safety. I want to migrate the static part of my website to Laravel, but I want to do so when I feel confident that it will not be hacked. I also want to do this without destroying the rest of the site in the process.


    That’s where the current course comes in. I need help in understanding the process and the steps for setting up a project in Laravel, taking advantage of the tasks that it does for me. When the effort is ready I will deploy it to a web server and see how well it works.


    One of the reasons to follow courses, even if they are filled with plenty of repetition, is to learn about concepts. I knew about include but I didn’t know about layout. By understanding layout you can prepare a template, where the elements that change are individual pages, and the layout does the rest, to keep the entire site looking the same. This will become my “portfolio”.

    Learning About Laravel and PHP
    |

    Learning About Laravel and PHP

    Byrichard

    Today I started to follow a course where someone turns a static html page into a Laravel blog. I experimented with home.blade and one or two other features and I got two pages to load, and the login to work, without more than that.


    What makes today’s learning and experimenting interesting is that the time I spent creating PHP arrays for my website content is now easy to transfer to json files for use with dynamic websites. What this means is that content that was stuck on individual pages is now organised by website section. I am now free to do more.


    The primary goal is to convert the static part of my website into a flexible content management system as well as to possibly swallow up the WordPress powered blogs. For at least a year I have disliked that Wordpress uses react, so if I can replace WordPress with Laravel then I will be happy. All websites that use React look the same to me, and I don’t want to use technology that was developed by Facebook, no matter how popular.


    Having a website is not just about writing blog posts and creating content. It is also about playing with technology and learning new skills. I want to understand how laravel works, and to have a way to demonstrate that I have learned relevant skills for future job applications. This website isn’t small. It has quite a few sections, topics, content and more. It’s worth working on and improving this website.


    And Finally


    I am curious about playing with ActivityPub. It is still in early days but if and when it is ready, it will be a more advanced of interactive RSS. I want to see what possibilities it will open up.

    Conservation and PHP

    Byrichard

    Today I have struggled with PHP. I struggled because I want to recreate the same table using loops with PHP as I did formatting with HTML. If I wasn’t up for a challenge I would let PHP loops format it according the default and I’d be done. In the end I did get the table to display as I wanted but not using for loops. I created a table page, laid it out using the data file I’ve been using for this section, and then using include to add that content where I wanted it to be on the page.


    It works, and it’s elegant. I want it to be done by a loop. This is important to me because it requires me to learn more about how to use nested loops and this is an important element of programming. It’s a skill worth having.


    Before : intermediate : After


    Above you can see before css was added, the website looked simple. When CSS was added it looked better, and once it became php it looks similar but the code needed is much less, as data is with included files. The footer and the nav bar are always the same, and for most pages the usual loops are enough to display content on all pages.


    With PHP you can just echo html and the page will display as you want it to. With variables and includes you can display the information you want to display automatically, rather than manually.


    In most cases you can use “Title”, and “content” and use HTML to format all the data as you want it to be. By doing this the conservation page would be done within minutes but the content would be less flexible. By creating arrays within arrays I make things more modular. I can remove or add sections and it will just change that part of the site without affecting other parts.


    The point with PHP, frameworks and javascript is to set everything up so that when changes are made they can be as small or as big as we want, in a modular manner. That’s why my struggling to get things to work today is important. Once I learn how to do this, I will be more confident with future challenges.

    On Whether I Prefer Vanilla JavaScript or Frameworks?
    |

    On Whether I Prefer Vanilla JavaScript or Frameworks?

    Byrichard

    Today someone on twitter asked this question, and rather than be reply: 320 of 10,000, I chose to write a blog post about it. The TLDR answer is Vanilla JS because if you learn how it works without the help of a framework you understand the language. This doesn’t mean that I don’t have an interest in learning to take full advantage of frameworks.


    As I listen to JavaScript Jabber one thing is clear. Whereas if we listen to courses and twitter discussions we are tricked into thinking that we should either use React or Angular we see, through JavaScript Jabber that frameworks are as diverse as they are flexible. One app will be excellent for one type of task and another will be awesome for something else. If you spend time learning Vanilla JavaScript, and then you learn about the diverse choice of frameworks then you can either write concise and effective code that does what you need with little to no bloat.


    I don’t want to just learn a framework and be inflexible. I want to learn how it works, behind the scenes. Before WordPress, I was learning about navigation using Server Side Includes and other such tricks. When I played with PhpBoards, WordPress, Drupal, Joomla, wiki software, and more I managed to use them as a user, and they did want I wanted, but I never looked behind the curtains so I could use WordPress, but I couldn’t create my own themes, etc, and to some degree, I still can’t.


    I have spent time trying to make it so that I can share my instagram archive on my website without using Instagram, and I managed with WordPress. Recently I tried using Vanilla Javascript and I found manipulating the DOM to be challenging. This is precisely why learning to code with Vanilla JS is so important. It shows you the complexities, and with time you learn how things work together.


    One of the jokes is that if you get stuck you should RTFM and with frameworks that’s often quite easy. With Vanilla JavaScript RTFM doesn’t mean read just one manual. It means read about a variety of concepts until you understand enough to get it to work by yourself.


    So far I can show a random post after each reload, or show the ten most recent posts and their caption. The next three challenges are:


    1. Go through the posts at a time
    2. Add crud capability using JavaScript. At first I will try with an empty json file, and then move on. CRUD requires understanding of the fs library (I need to double check the term)
    3. Add the ability to transfer data from the json to an SQL or NoSQL database.
    4. Experiment with Houdini and responsive design with a wall of pictures.


    We’ll see what else I can think of. The point of this is to take skills I learn in courses and apply them to a project without having someone else provide me with the list of necessary steps.


    That’s it for now.

    Become A JavaScript Developer Completed and GeoJSON

    Become A JavaScript Developer Completed and GeoJSON

    Byrichard

    We’re in a pandemic, and it makes sense to invest time in learning. I completed the Become a JavaScript Developer course last night and today I played around with some code to see if it worked for what I wanted. It didn’t. I also listened to a live stream which discussed geojson, smapshot and other projects. I like the idea of geotagged data, and an open API to allow for the data to be shared more easily


    I could see this as especially useful for climbing, hiking, archeology and other activities. This reminds me of photosynth, mixed in with photogrammetry and other technologies. When images are taken they are geo-tagged but another layer is added, by detecting the angle the picture was taken at. Whether it was looking down, up or in another direction. In other words in three, rather than two dimensions. This is great for modelling, but also for helping people get a sense of the images that they’re looking at. Climbing pictures, where we can see the upward or downward angle would be interesting.


    It would also be fun to write a blog post, find the api information, and include that within a geojson file, to provide location info, angle, and other data. This data could then be ported from a photo app, to a hiking app, to a website and more. With more images 3d models become possible. Imagine gathering Via ferrata images and documenting the route.


    Of course they can also use this for mapping glacier progress, or regression, coastal erosion and a multitude of other topics. I found this talk really interesting, and I see plenty of uses for such data.

    Trying To Read Nested Data From a JSON File

    Byrichard

    Over the last two evenings I have been attempting to read nested data. I have tried to parse the data and other methods but without success. I have browsed the web to try to find solutions but for now I am getting stuck. Learning is also about trial and error, and knowing where to find the right information. For now I am lost. At the end of this process I will be more self-sufficient.


    Learning by watching courses is good, and we do make progress, but it doesn’t require us to think about problems in the same way. We learn to follow instructions but not problem solve, and that’s what I want to learn. So far I have spent two hours on this specific problem, and I could easily remove a few lines and it would no longer be nested. I will persevere.


    Playing with Comments


    Since I am trying and failing to accomplish what I am trying to accomplish I am now using comments to mark what I still need to achieve, whilst looking for solutions and ideas.


    Prototypes and CSS


    I have also continued studying prototypes, factories and more. I see some overlap between this topic and CSS. For those with experience and time both allow for more depth and complexity than is comfortable when you are starting out. The short version is that with prototypes and factories you can cut down on the lines of code in a project, making it easier to read, and lighter.


    The Pandemic Continues


    It is now the weekend but the pandemic is still alive and well. Governments are deciding not to do anything to stop the spread, preferring to tell people that for vaccinated people it’s no worse than the flu, whilst ignoring the fact that children from 0-18 have not been vaccinated. There is a certain degree of indifference by governments that is hard to observe. They expect the next few weeks to be difficult, and that’s as far as their sense of responsibility goes. It is a challenge not to be disappointed by this attitude.