Copy the following code and paste it in a new document to see what I have created. It may need some more styling.
<!doctype html>
<html>
<head>
<base href="/">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Untitled Document</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous" />
</head>
<body is="dmx-app" id="test">
<main>
<div class="container">
<div class="row mb-4">
<div class="col">
<h1 class="h4 text-uppercase fw-bold">Engineering</h1>
</div>
</div>
<div class="row nb-4">
<div class="col text-center">
<h2 class="h4 text-uppercase fw-bold">Projects Delivered</h2>
<p class="fst-italic">I have a wide range of practical skills in <span class="fw-bold">electronics, mechanical </span>engineering and <span class="fw-bold">software </span> from design to production, test and delivery.</p>
</div>
</div>
<div class="row mb-2">
<div class="col">
<h3 class="h6 fst-italic fw-bold">Robotics</h3>
<ul>
<li> Walking robot (1st year degree team project). Transistor controlled, wired PC interface, mechanical design.</li>
<li>Walking robot (BEng project). 12 DOF robot with servo controlled legs, ultrasound range-finding, digital compass, autonomous navigation, RF remote controller. Awarded UK Tektronics Engineering Prize</li>
<li>Line following robot mouse. PIC microcontroller controlled, IR and colour sensors, featured on local BBC News as part of a schools competition.</li>
<li>Robot football. Mobile robots that represented the UK internationally. I re-designed and miniaturised the motor, sensor and comms. boards using surface-mount components.</li>
<li>Maze solving robot. PIC microcontroller controlled, sensors, motor controller. Developed as a commercial kit for schools.</li>
<li>Robotic survey vessel to survey UK coastal waters. With onboard side-scan sonar, GPS, Wireless WAN, chemical sensor pod and winch.</li>
<li> Development of lunar rovers for the <span class="text-decoration-underline">Surrey Space Centre</span></li>
</ul>
</div>
</div>
<div class="row">
<div class="col">
<h3 class="h6 fst-italic fw-bold">Medical</h3>
<ul>
<li>Implant controller and wireless power transmitter for a bone distractor implant</li>
<li> 16-channel electro-tactile stimulator. PC controlled FES stimulator with array of sensory stimulation electrodes</li>
<li>Vibration feedback device. For haptic feedback, potentially for stroke patients</li>
<li>Real-time gait analysis software. The first biomechanical application using real-time data from the Qualysis motion capture system</li>
<li>Dynamic Vestibular Acuity Test for Guy's and St Thomas' Physiotherapy Department</li>
<li>WiiFit Balance Assessment Widget, for Guy's and St Thomas' Physiotherapy Department</li>
<li>Direct cable input for neonatal ABR test, for the St George's Hospital Newborn hearing screening programme</li>
<li>Thermoluminescent dosimeter prototype for <span class="text-decoration-underline">TRUEInvivo Ltd</span></li>
</ul>
</div>
</div>
<div class="row mb-4">
<div class="col">
<h3 class="h6 fst-italic fw-bold">Other</h3>
<ul>
<li>Air quality measurement system for the <span class="text-decoration-underline">Global Centre for Clearn Air Research</span>, UniS</li>
<li>Logic Tutor for the Department of Electrical and Electronic Engineering, UniS</li>
<li>Reaction time box for School of Psychology, UniS</li>
<li>Wind Tunnel development of the <span class="text-decoration-underline">aerothermal and environmental flow tunnels</span></li>
<li>Electric ducted fan development for the <span class="text-decoration-underline">Centre for Aerodynamics and Flow</span></li>
<li>Design of lunar surface tribology, orbital assembly and planetary rover labs. for the UK Fair-Space Programme in collaboration with <span class="text-decoration-underline">3|10 studios</span></li>
<li>Software: Data aquisition, EMG, metronomes, filtering and gap filling apps. for various MSc/PhD students</li>
</ul>
</div>
</div>
<div class="row">
<div class="col text-center">
<h2 class="h4 text-uppercase fw-bold">Skills</h2>
<p class="fst-italic">I am mostly self-taught and will pick up and learn any tool needed for the task, whether it's a new piece of software, technical widget or a JCB</p>
</div>
</div>
<div class="row">
<div class="col">
<h3 class="h6"><span class="fst-italic fw-bold">Software and Programming Skills</span><span class="text-body-secondary"> in rough order of proficiency</span>
</h3>
<ul>
<li>Windows (from v 2.1 to date)</li>
<li>Microsoft tools (Word, Excel, Outlook, Powerpoint, Visio, Access, Onenote)</li>
<li>LabVIEW (from v 7.1 to 2020) - preferred high-level language</li>
<li>Embedded C compilers for PIC and Atmel microcontroller families</li>
<li>Assembly languages for PIC and Atmel microcontroller families</li>
<li>Proteus Virtual System Modelling, Electronics Workbench and Autodesk Eagle (Electronics CAD)</li>
<li>Visual3D and Qualisys Track Manager (Motion analysis and biomechanical modelling)</li>
<li>GitHub, VPNs, VNC and other general networking tools like wireshark etc</li>
<li>Case tools, Endnote Reference Manager</li>
<li>Matlab (Simulink and Stateflow)</li>
<li>Microsoft C, Ada, Basic, Python, HTML</li>
<li>MathCad, Derive and SPSS (maths and stats packages)</li>
<li>LINUX and DOS</li>
<li>AutoCAD and ProDesktop (Mechanical CAD)</li>
<li>Currently learning Dreamweaver for web design - needs practice!</li>
</ul>
</div>
</div>
<div class="row">
<div class="col">
<h3 class="h6 fst-italic fw-bold">Electronics Design, Development and Repair Skills</h3>
<ul>
<li>Analogue and Digital circuit design - more confidence with digital</li>
<li>Microcontroller systems design (PIC, Atmel, 68000, 8051, Arduino, Raspberry Pi)</li>
<li>Bluetooth, RF, RS232, SCI, I2C, TCP/IP, DC and stepper motor control, wireless power transmission, real-time data logging</li>
<li>Medical instrumentation, design for electromagnetic compatibility, GUI design and human-computer interaction</li>
<li>PCB Design: Through-hole, surface mount and multi-layer board design with Proteus or Eagle</li>
<li>PCB Printing: Wet etching with FeCl, milling and drilling, lacquers</li>
<li>PCB Assembly: Very confident soldering, de-soldering, use of heat guns, ovens, pick and place</li>
<li>PCB testing: Own PC-based oscilloscope, familiar with current clamps etc</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-12 col-lg-7">
<h3 class="h6"><span class="fst-italic fw-bold">Mechanical Craft Skills</span><span class="text-body-secondary"> gained from a traditional toolmakers apprentice</span></h3>
<ul>
<li>Turning and milling (mannual and CNC)</li>
<li>Mechanical fitting incl agricultural machinery</li>
<li>Sheet metal work, bending and welding (oxyacetylene and arc)</li>
<li>Surface treatments (anodising, poweder coating)</li>
<li>Grinding, Jig boring and Gear-cutting</li>
<li>Heat Treatments (hardening etc)</li>
<li>Laser sheet metal cutting</li>
<li>Conventional and NC/CNC planning and operation</li>
<li>Forging (dabbled)</li>
</ul>
</div>
<div class="col text-lg-center">
<p>Soldering surface mount LEDs onto a prototype logic demonstrator board</p>
<embed src="content/papers/surface-mount-soldering.mp4" type="video/mp4">
</div>
</div>
<div class="row">
<div class="col">
<h3 class="h6 fw-bold fst-italic">Craft and DIY Skills</h3>
<ul>
<li>Woodworking, residential plumbing, mains electrical installation</li>
<li>PAT Testing and the management of PAT testing systems</li>
<li>Ground work</li>
<li>Painting, decorating</li>
</ul>
</div>
</div>
<div class="row">
<div class="col">
<h3 class="h6 fw-bold fst-italic">Space Design</h3>
<ul>
<li>Workshop, office and laboratory layout and design</li>
<li>Project management using the RIBA Plan of Work (Royal Institiute of British Architects). For example</li>
</ul>
</div>
</div>
<div class="row mb-lg-4">
<div class="col">
<a href="content/papers/fairpsacelabs.png"><img src="content/papers/jpg.jpg" width="31" height="48" alt="[This is required]" loading="lazy"></a>
<a href="content/papers/enflo_layout.png"><img src="content/papers/jpg.png" width="31" height="48" alt="[This is required]" loading="lazy"></a>
</div>
</div>
</div>
</main>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
</body>
</html>
Notes:
This page uses Bootstrap 5.3.3
A main element has been introduced to make it easier for assistive technology and search engines to find the main content
A heading (H tags) hierarchy has been used to create a proper document outline
CSS has been used to convert capiltalised words. Capitals in the code are a no-no for assistive technology
Filenames should not contain spaces. Hence I have replaced spaces with a dash (-)
Consistantly use lower case for image extensions. I have done so in the above code
This is what a mobile view looks like
I hope this helps.
... View more