Ok I know I have skipped another blog post for last weeks lesson, but I had a good excuse – there was road trip to Amsterdam at stake! I did take notes though so I will cover that in a bit….
First I need to make an admission.
I have come to the realisation that in my career as a marketeer, I may have underestimated the technical skills and patience required by programmers - even to use programs like Dreamweaver. And, <big admission here>, the time it takes to code a site to a clients exact specifications.
Not just developers though – designers too! Although today’s Photoshop tutorial came a bit more naturally than the Dreamweaver course – I am definitely a pictures person, so to speak.
I know probably at some point it must just be natural for them, but in these early stages it matches the frustration of a small child trying to count and not knowing what the next number is – even though they have been told a thousand times.
Although when I reflect on this – that is not actually the way the course is taught (as in wrote learning numbers), which is somewhat frustrating. I very much want someone to help me put together a “kit-home” style website, so I can better see how the pieces interact.
The course very much explains a concept, discusses why it is or isn’t important, and encourages experimentation – which takes a lot more time than I have been devoting to the course so far.
I am a bit ahead of myself today, last week we covered positioning and <div> tags, this week navigation menus. Trying to match the functionality I imagined in my head (and from the design I discussed in the last posts) required engaging spry widgets which require a solid understanding (at least) of what has been covered on HTML and CSS in the last 6 weeks.
I need to take stock. I am taking it back to the beginning – and going to experiment a little bit with just putting HTML and copy on a page and see what happens.
<Dear Reader – here it gets very very boring and rambles through my code experimentation… best stop now>
Got the basics of headers and even a table.
I get to a certain point where I have text and an image – but I want to show more than one image and I don’t want it to take up too much space… I do a Google search and come up with this code – which I have altered to rotate 3 images of mine – from locations on the Internet…. It would be easy to just link them to Flickr… but Pat said today that unless there is a good reason for it, we should embed all the video and images on the site – the only good reason is that I don’t know how to do it. Here is the code I have now, below the </head tag> anyway:
<script type="text/javascript">
function checkImg(){
img = document.getElementById('myImage');
imgOrig = "http://farm1.static.flickr.com/132/332028269_5d285610de_o.jpg";
imgNew = "http://farm1.static.flickr.com/154/332028434_4a4c5cdd4f_o.jpg";
(img.src==imgOrig)?img.src=imgNew:img.src=imgOrig;
}
setInterval("checkImg()",10000);
</script>
</head>
<body>
<img id="myImage" src="images/riodejaneiro2.jpg" width="800" height="600" alt="corvoda" /><img src="images/riodejaneiro1.jpg" width="800" height="600" alt="rio" />
</body>
</html>
function checkImg(){
img = document.getElementById('myImage');
imgOrig = "http://farm1.static.flickr.com/132/332028269_5d285610de_o.jpg";
imgNew = "http://farm1.static.flickr.com/154/332028434_4a4c5cdd4f_o.jpg";
(img.src==imgOrig)?img.src=imgNew:img.src=imgOrig;
}
setInterval("checkImg()",10000);
</script>
</head>
<body>
<img id="myImage" src="images/riodejaneiro2.jpg" width="800" height="600" alt="corvoda" /><img src="images/riodejaneiro1.jpg" width="800" height="600" alt="rio" />
</body>
</html>
This next lot of code does not work, I think it has something to do with the <body> tag positioning:
<body>
<script type="text/javascript">
function checkImg(){
img = document.getElementById('myImage');
imgOrig = <img id="myImage" src="images/riodejaneiro1.jpg" width="800" height="600" alt="corvoda" /><img ;
imgNew = <img id="myImage" src="images/riodejaneiro3.jpg" width="800" height="600" alt="corvoda" /><img ;
(img.src==imgOrig)?img.src=imgNew:img.src=imgOrig;
}
setInterval("checkImg()",10000);
</script>
</head>
<img id="myImage" src="images/riodejaneiro2.jpg" width="800" height="600" alt="corvoda" /><img
</body>
<script type="text/javascript">
function checkImg(){
img = document.getElementById('myImage');
imgOrig = <img id="myImage" src="images/riodejaneiro1.jpg" width="800" height="600" alt="corvoda" /><img ;
imgNew = <img id="myImage" src="images/riodejaneiro3.jpg" width="800" height="600" alt="corvoda" /><img ;
(img.src==imgOrig)?img.src=imgNew:img.src=imgOrig;
}
setInterval("checkImg()",10000);
</script>
</head>
<img id="myImage" src="images/riodejaneiro2.jpg" width="800" height="600" alt="corvoda" /><img
</body>
For now I conclude that that is a test and that is enough for now. I am not going to get hung up on Javascript – yet!
What I think it does illustrate is that I am already bored without CSS and fancy stuff. No wonder we talk about an “old school” style of 90’s webpages when we only had HTML and tables at our disposal – if only I had of started learning this stuff back then.
No comments:
Post a Comment