Click here to Skip to main content
13,294,516 members (62,194 online)
Click here to Skip to main content
Add your own
alternative version


8 bookmarked
Posted 28 Dec 2012

Web Page Capturing

, 29 Dec 2012
Rate this:
Please Sign up or sign in to vote.
Windows Forms application for capturing or thumbnailing a web page


This is a Windows Forms application for taking a snapshot of a web page. It has many uses (example: Alexa and Google search).


I used WebBrowser in code behind to load the page and then took a snapshot of it. The output image will be shown in a picture box in the main window.

Using the Code

There is just one class WebPageCapture that handles everything. After filing the forms and clicking on save button, checking that the size property has been set properly, the output image format has been chosen and the path where to save the image will happen first and then the webBrowser will navigate to the specified URL.

There are two different sizing mechanisms. The first one is to take a snapshot of the whole page, which is the default option, and that can be done by ticking the Full page check box. The second one is to set the size manually which can be done by unchecking the Full page check box option and typing the required size.

The most important part is using the DrawToBitmap method which takes a Bitmap object and Rectangle object. However, most people ask why the output is an empty white image. The reason is that the page hasn't been loaded completely. So, I used DocumentCompleted property.

// wait till the loading finishes
webB.DocumentCompleted += 
	new WebBrowserDocumentCompletedEventHandler(WebBrowser_DocumentCompleted); 
while (webB.ReadyState != WebBrowserReadyState.Complete)
    if (webB.IsDisposed)

The WebBrowser_DocumentCompleted method will take the preferred size and set it to the size of the browser. Then, it will create the Bitmap object and the Rectangle object to pass it to the most important method DrawToBitmap.

// creating the Bitmap
Bitmap bitmap = new Bitmap(weidth, height);
Rectangle bitmapRect = new Rectangle(0, 0, bitmap.Width, bitmap.Height);
// the most important method which will save an image 
// of the web page with the a specific size
webB.DrawToBitmap(bitmap, bitmapRect); 
System.Drawing.Image origImage = bitmap; 

After that, a thumbnail of the output image will be created to be shown in the pictureBox in the main window.

//creating a thumbnail to show it in a picture box 
//in the main user interface and setting some property
System.Drawing.Image origThumbnail = new Bitmap(400, 400, origImage.PixelFormat);
Graphics GraphicT = Graphics.FromImage(origThumbnail);
GraphicT.CompositingQuality = CompositingQuality.HighQuality;
GraphicT.SmoothingMode = SmoothingMode.HighQuality;
GraphicT.InterpolationMode = InterpolationMode.HighQualityBicubic;
Rectangle RectangleT = new Rectangle(0, 0, 400, 400);
GraphicT.DrawImage(origImage, RectangleT); 
// setting the image to be shown in the picture box in the main user interface
pictureBox1.Image = null;
pictureBox1.SizeMode = PictureBoxSizeMode.CenterImage;
pictureBox1.BackgroundImage = origThumbnail; 

The last part is to save the output image to the specified path taken from saveFileDialog.

Point of Interest

I have faced some problems of getting image of some pages like Google. I tried to increase the size and decrease it, but with no result. Finally, I read that the reason for this is because of using JavaScript and some script that can't be viewed by WebBrowser control.



This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Abdullah Altokhais
Saudi Arabia Saudi Arabia
No Biography provided

You may also be interested in...

Comments and Discussions

GeneralMy vote of 5 Pin
Carsten V2.01-Jan-13 0:23
memberCarsten V2.01-Jan-13 0:23 
GeneralRe: My vote of 5 Pin
Abdullah Altokhais1-Jan-13 0:29
memberAbdullah Altokhais1-Jan-13 0:29 
Thanks , appreciate it Smile | :)
QuestionCan We do this with Pin
Barış Akpunar28-Dec-12 10:54
memberBarış Akpunar28-Dec-12 10:54 
AnswerRe: Can We do this with Pin
Abdullah Altokhais28-Dec-12 10:56
memberAbdullah Altokhais28-Dec-12 10:56 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.171207.1 | Last Updated 30 Dec 2012
Article Copyright 2012 by Abdullah Altokhais
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid