5.1 HTML Images Made Simple
Creating a web document with HTML can often turn out a little bland. So, as a new web designer how can you use HTML to make a web document more exciting? With the addition of photos! Adding images to any web page can not only make for an aesthetically pleasing website, but it can add a deeper understanding of your content that words cannot. So if creating a website from HTML is all letters and symbols, how can you add images to your site? Through the incredibly resourceful videos titled HTML Images and Figures by J. David Eisenburg and Linkedin Learning, you are gently guided through the basics of adding images to a site through HTML. While adding images to a webpage through HTML is a fairly simple process, these videos and exercises can be overwhelming and too fast-paced for a beginner like myself. This is why I sought to find a resource that was even more simple and easy to scroll through when you are learning about how to add images with HTML.
From a website called GeeksforGeeks, I found an article titled HTML | Images, where the author (Shubrodeep Banerjee) gives a simple guide to adding images to your website. In this article, Banerjee gives all the information we learned from the Linkedin Learning videos and more! In addition to the basic info, you can learn how to add a GIF file, add a title to an image, and add an image as a link for your web document. The information that’s in this article is well organized into short, straight-forward explanations of how you can add and manipulate images using HTML coding. Plus, after each brief explanation of the different HTML image processes, there is a code you can copy and paste straight from the website to help save you time on typing. Also included is a visual example of what each code should look like after you’re finished coding for you to be able to check your work.
As amazing as this resource is, nothing is perfect, and I do have some critiques for this article in particular. For one thing, the article could have been designed better because it was very hard to distinguish where one explanation ended and where another started. It would’ve been very easy for the author to simply put separator lines between each different process or just enlarge the title of each new process. Either of those options would have made this article more legible and easier to scroll through quickly. Another thing that seemed off was that there were ads in the middle of the article, which I am used to, but in some places where the author typed “Example:” there would be an ad right below it making me think that the ad was the example the author intended to reference. I don’t know if the author has any control over ad placement, so this may be a critique of the site in general and it’s ad placement protocols. On the bright side, these two seemingly annoying aspects of this article have caused me to reflect on my blog posts and have heightened my awareness of the legibility and potential ad placements of my site moving forward.
Overall, GeekforGeeks.org proved to be a resourceful site for all things HTML, especially with the article on adding images. I learned more about each process of adding images to HTML and have come away with more knowledge than I started with. For me, this is always the goal when searching for great sources on the web. Having read the article from GeeksforGeeks, what was your biggest takeaway? Did you spot any problems with this resource that I didn’t catch?
**NOTE: This chapter is a revised version of a blog post titled HTML Images Made Simple on Journey to the Center of the Web blog.
