
Description:
How to Display Recent Post Titles in Blogger.. How to Create Printable Web Pages.. Review: Caribbean Web Development.. Default User ID and Password for Various Routers..
Contents:
How to Display Recent Post Titles in Blogger
Most blogs display the last few posts on the home page, and Technically Easy is no exception. I like to display the last five posts that I have written so that visitors have a choice. If a visitor doesn't visit the home page, but rather is redirected to a post, I wanted to display the last five posts in the sidebar. For those with Blogger blogs, it is very easy to display the last few posts you have published to your blog. The Feed WidgetThere are several widgets that you can add to your blog. One of the widgets is called "Feed", which simply retrieves and displays the last few posts from an RSS feed. This is the one we will be using to display the last few posts of your blog. The following steps walk you through how to do this: - Log into Blogger and then click the Layout link for the blog you want to change. You should now see the template layout for the blog.
- Click the Add a Page Element in the location you want to include the recent post list. Blogger's Choose a New Page Element window opens.
- Scroll through the list of widgets until you find Feed. Click the Add to Blog button.
- In the new window, enter the URL of your blog's feed.
- Click Continue to move to the next step.
- In the next window you are now prompted to configure what the widget will look like. Enter a title, and select the number of posts you want to show. You can see your changes in the preview.
- When you are done, click the Save Changes button. The feed widget should now be added to your blog.
You can also use this widget to display the most recent posts for other blogs, provided you know the blog's feed URL. SummaryMany author's provide a small list of the most recent posts to visitors to their blog. This post provided step-by-step instructions to displaying the most recent posts for your blog in a widget. You can also use the widget to display the most recent posts for other blogs as well. Related PostsHow to Create Static-Like Pages in Blogger
How to Create Printable Web Pages
When I started Technically Easy the one thing that I wanted to do was make sure that my posts were printable. By this I mean I wanted the printed pages to not include the menubar and sidebars, only the content. Those who are just starting out in Web development may just create a second copy of the current page, and then create a text link to this page for printing. I wanted a more simple solution and realized the same task can be done easily with CSS. CSS FilesI have talked briefly about CSS in a previous post title Introduction to Cascading Stylesheets. In a nutshell, a Cascading Stylesheet (CSS) is a separate text file that controls the look and feel of your web pages. If you need to change the look of your web pages, you only need to change the CSS file. For most Web developers, they use CSS files to control the look of a web page in a browser only. CSS files also allow you to control the look of the web pages when they are printed as well. Implementing this feature is as simple as creating a second CSS file and referencing that file in your web pages. The next section will show you how. Controlling Printing with CSSAs mentioned previously, CSS files are separate text files that are referenced in the HTML of a web page, as such: <link rel="stylesheet" href=[location of CSS file] type="text/css"/> This will apply the styles included in the CSS file to the web page, for both displaying in a browser, and when the web page is printed. What we want to do is define a separate CSS file for the browser and the printer. To accomplish this we include the media attribute in the HTML. To define a CSS file for the browser: <link rel="stylesheet" href=[location of CSS file] type="text/css" media="screen"/> To define a CSS file for printing: <link rel="stylesheet" href=[location of CSS file] type="text/css" media="print"/> As you can see the above two definitions now include the media attribute that defines when the CSS file should be used. Both statements need to be added to your HTML files for this to work. Let's take a look at an example of how to use the two CSS files. Defining a Screen and Print LayoutThe easiest way to create the two CSS files is to first concentrate on the screen version. Once you have the web site the way you like it, you can then copy the CSS file and modify it to make the print version. Let's look at a simple example. Suppose you have a Web page with a header and menubar, a content section on the left, and a single sidebar on the right. You want the header and content to print, but not the menubar and sidebar. After all, the visitor can't click the links on the printed page, so you want as much of the page to contain the content. A stripped down screen CSS file may look like: #container { width: 900px; } #header { width: 100%; } #menubar { width: 100%; } #content { width: 700px; } #sidebar { width: 200px; } The above CSS definitions are missing a lot of other attributes, but for this example this is all we need. The above simply defines a container 900 pixels wide, with a header and menubar that match the width. The content is 700 pixels wide with the sidebar taking up the remaining 200 pixels. In this case, these definitions would be located in the screen version of the CSS file. Now, when the screen version is complete, we would make a copy of it to start the print version. This means that the same definitions will be located in both CSS files. As mentioned earlier, we don't want the menubar and sidebar to be displayed when the web page is printed. We also want as much of the page to contain the content as possible. To accomplish this, we modify the print version to the following: #container { width: 100%; } #header { width: 100%; } #menubar { display: none; } #content { width: 100%; } #sidebar { display: none; } You now notice that we stretched the content section to fill 100% of the page. We have also hid the menubar and sidebar by using the display attribute with the value none. This will prevent those two elements from showing on the printed page. Once you have the printed version of the CSS files, you can now include them both in your HTML web page as explained above. To watch the two files in action, open your web page in a browser to see the screen version. To view the print version simply select Print Preview in the browser. SummaryThis post provided a quick method of creating a printable version of a web page using a separate CSS file. Using CSS files, you can control what your web pages will look like in a web browser, as well as how they will look when they are printed. Since this method uses CSS files, any author of a web site or blog can easily implement this feature. Related PostsIntroduction to Cascading Stylesheets Designing Web Pages: Tables or CSS
Review: Caribbean Web Development
There are many technology blogs on the Web today, such as my blog - Technically Easy. I haven't reviewed many blogs that are focused on technology, and most blogs, such as this week's review, are focused on the Web. This week I take a look at a technology Web blog that is described by the author as helping to "improve the skills of Caribbean Web professionals. Web Site: Caribbean Web Development Description: Aims to provide tips, tutorials, hints and other resources that will help to develop, enhance and improve the skills of Caribbean web professionals. Design  The design of Caribbean Web Development is the strongest aspect of this blog. I like the design, from the content to the navigational sidebars. Everything is as it should be in a blog. To start, there is a content section on the left and two navigation sidebars on the right. The font size and type chosen for the content makes it very easy to read the posts. There is some whitespace between the posts that differentiates one post from the other. The two sidebars are as easy to read as the content. On the left is the navigational links that includes recent posts, categories, archives, and an admin section. Neatly organized and easy to use. The right side of the sidebars features the RSS subscription link and form, followed by the about text and then some sponsors. I like how the author has limited the advertising to the far right side so a visitor isn't bombarded by advertising. I like the colours that author has chosen. The header is in red, the content in white (except for one sidebar which is gray), and the footer is black. The colours complement each other very nicely without one colour overpowering another. Overall the design of the blog is top-notch, which makes it easy to read the posts and navigate through the pages in the blog. Focus  The focus of the blog seems to be geared towards helping Web development in the Caribbean. The blog certainly focuses on the Web, however, it seems to be less focused on the Caribbean. Many of the posts can be read and used by everyone interested in Web development, regardless of where they may reside. I was looking for Caribbean specific Web development, such as local classes, but had trouble finding information specific to that area of the world. From the information in the archives, the blog is still young, so the author may yet provide information for those in the Caribbean who are interested in Web development. Content  The posts on the blog are focused on the Web and provide different Web sites, and tips to help those interested in Web development. The posts are not too long, so those that like short posts may enjoy reading this blog. The author includes one image in each post that is appropriate for the topic discussed. This is both a good and bad thing. The good is that the images are appropriate for the topic, and that they are high-quality. The bad is that the images can sometimes be large. For those with slower connections, you may experience longer load times. The content is well-done, however, the images can be quite large and take some time to download especially when there are several on one page. Spelling and Grammar  While the design of the blog is the strongest aspect, the spelling and grammar is by far the weakest. There are many instances of spelling and grammar mistakes that caused me to reread a sentence to understand what the author was attempting to say. Some visitors may also find it difficult to read at times. If the spelling and grammar doesn't make it difficult, the long run-on sentences may. At times an entire paragraph of five to ten lines was one long sentence. By the time I was finished reading the sentence I lost the point of the sentence. The spelling, grammar and long sentences would need to be corrected to make this good blog a great blog. Overall  The design of this blog, from the content to the sidebars, is really well organized. The content is very easy to read, and the navigation links are well organized and easy to find. The content is nicely done with short posts, and high-quality graphics. The only problem is that those high-quality graphics can be quite large, which increases the download time. A clean up of the spelling and grammar errors should be done, as they are numerous and takes away from the readability of the blog. Correcting those mistakes will make this good blog a great blog.
Default User ID and Password for Various Routers
I have received a few e-mails regarding the default user ID and password for different routers. Most people that ask for this information usually have reset their router back to the factory default, but can't seem to find the instructions to the router. I have decided to begin compiling a list of default user IDs and passwords for various routers. This is by no means a complete list, but I will add to it as time goes by. The following sections provided the default user ID and password for different routers. For the values that are listed as (blank), simply leave that field empty. Linksys| Model | User ID | Password |
|---|
| BEFSR41 | admin | admin | | BEFW11S4 | (blank) | admin | | WAG54G | admin | admin | | WAP54G | (blank) | admin | | WET11 | (blank) | admin | | WET54G | (blank) | admin | | WRT54G | (blank) | admin | | WRT54GS | (blank) | admin | | WRT54GL | (blank) | admin |
D-Link| Model | User ID | Password |
|---|
| DI Models (eg. DI-524) | admin | (blank) | | DIR Models (eg. DIR-625) | admin | (blank) |
It is important that you change these values in your router configuration to secure your router. Never leave these values as the default. If you have a router that you would like added to the above lists, then send me an e-mail or leave a comment and I will add it. The router can be from any manufacturer, not just Linksys or D-Link. Related PostsSecuring the Linksys WRT54G Wireless Router Securing the D-Link DI-524 Wireless Router Securing a Wireless Network Creating Secure Passwords
Photoshop GIF Settings
I have recently wrote a post titled Photoshop JPEG Settings where I described the various settings for a JPEG image in Photoshop. The settings were available via the Save for Web option in the File menu. In this post I will discuss the settings that you can change when saving an image as a GIF. There are more options available for a GIF file, mainly because of the limited colours (256) that can be saved in a GIF image file. GIF SettingsThere are many options that can be changed when saving a GIF file. I will not discuss all the optoins, but will touch on the more common ones. The GIF settings are as follows: 
- Preset This dropdown list provides several quick settings that you can use to apply to your image. There are several JPEG settings listed that include some default options for GIF.
- File Type The dropdown list below and to the left of the Presets list provides a list of all file types that you can save your file as. Selecting GIF will display settings for GIF files.
- Colour Reduction Below the File Type dropdown is a list of options for reducing the amount of colours in the image. The options include:
- Perceptual This option reduces colours by including the colours that are more sensitive to the human eye. The human eye is sensitive to shades of green, so more green will be included if the image contains various shades of green.
- Selective Reduces the number of colours by giving preference to the predominant areas of colour. For example, if you have a picture with a lot of blue sky, and a few trees of green, using this option will include more shades of blue than green.
- Adaptive Unlike the two previous settings, this one chooses most of the colours that closely matches the colours in the original image. If the image contains no pinks or purples, then the colour palette won't contain these colours.
- Restrictive (Web) There are 216 colours that are considered Web-safe, meaning no dithering will occur when these colours are displayed. Selecting this option will reduce the colours to these 216 colours.
- Dithering Below the Colour Reduction option is the dithering option dropdown. Dithering is the process of concealing the reality that there are fewer colours by displaying colours close together where they meld together to look like a different colour. There are several options in the dropdown for dithering.
- No Dither Does just what it says, doesn't attempt to blend the colours using dithering. You could end up with a banded image with this option.
- Diffusion The most common, and preferred method of dithering. With this method there is no pattern since the colours chosen to create the missing colour are scattered in the image.
- Pattern This type of dithering has a small impact on file size, in that it makes files smaller. The problem is that it uses a pattern to dither a missing colour, and won't look as nice as the diffusion dither.
- Noise When you select this option, the dithering is accomplished by creating noise in the image. You may end up with ugly clumps of colours in the image with this option.
- Transparency GIF images have a unique ability to make one colour in the image transparent, meaning the background colour will show through. You also have the option to select the type of dithering to perform to ensure that the transparency blends nicely with the background colour. This option is set in the dropdown below the Transparency checkbox.
- Interlaced This option instructs a Web browser to download the full image in multiple passes. Don't bother enabling this option as it increases the file size, and makes no difference with the connection speeds in use today.
- Lossy Most people know that the GIF file format is a losseless format, meaning no data is lost when the image is saved. Adobe has included a lossy option that removes additional colours when the image is saved, in addition to those you have removed. Don't bother with this option as it will affect the quality of your image even more.
- Colors This is where you can select the total number of colours available in the image, from 2 to 256. Some images may not need all 256 colours, so you can decrease the number until you are satisfied with the file size and image. As you decrease the colours you will see the number of colours in the colour table below decrease to represent the remaining colours in the image.
- Dither This option specifies the amount of dither that will be used in the image.
- Matte If you create an image with a specific background colour, and then set that colour transparent the colours will blend to the original background colour. If you want to blend a different background colour, then you can choose it with this option.
- Web Snap The Web-safe colours were briefly mentioned above, and this option is also associated with them. This option determines the percentage of colours in the image that are pushed towards the Web-safe colours.
- Colour Table This table displays a list of all colours included in the image. If you double-click a colour you can select another colour that will replace the selected colour. Below the colours are several options that you can use on the selected colour, such as making the colour transparent, shifting the colour to a Web-safe colour, and locking the colour.
- Image size If you click on the Image Size tab you can resize the image. The options provided here are the same ones provided by Image->Image Size from the Photoshop menu.
SummaryThat is all the options available for creating GIF images with the Save for Web option. The best way to find the optimal image is to open up four images. Modify the images with different settings to see what works for your image. Related PostsPhotoshop JPEG Settings When to Use GIF and JPEG Format Overview of Various Image File Formats Converting Digital Photos for E-mail or the Web
Review: Angelika
There are thousands of blogs on the Internet today, and a vast majority of them are under the category of personal. For personal blogs, the authors write about the events that happen in their lives. Many people enjoy reading these types of blogs since they may read about someone sharing the same experiences. This week I review a personal blog about a single mother who enjoys writing in her blog on more than a daily basis. Web Site: Angelika Description: Personal blog by a single mother living in the southern Unites States suffering from Multiple Sclerosis, Insomnia & a Hugh Laurie addiction. Design  Personal blogs usually have one thing in common: they usually contain many widgets about anything and everything. Angelika is definitely in that category. This blog contains two navigational sidebars one each on the left and the right side, and with the content in the middle. Both sidebars contain many different widgets, links, and images (if you are a House fan, there are images of Hugh Laurie on the left). Unfortunately, it makes the two sidebars look unorganized, which makes it hard to find anything. I would rather see the blog's navigational links at the top of one sidebar, and then all the other secondary links, and images below. The colours chosen by the author are different than I have seen on a blog before. There are three different colours chosen for the background, with each having a textured look to them. The author has chosen textures that don't distract from the blog and provide easy reading of the content. The font and font sizes used on the blog are easy to read. The light background and dark font colour add enough contrast so you don't have trouble reading the content. Overall, the design was simple and not distracting, however, reorganizing the two sidebars will go along way to improving the design of the blog. Focus  It is always difficult to rate the focus of a personal blog, mainly because there really isn't one. A personal blog is about the life of the author, which isn't limited to a single focus. In this case I will rate the focus of the blog on what the author has provided in the description, which the author in this case has done. Content  There is no lack of content in this blog. The author updates on more than a regular basis. Looking at the archives (at the bottom on the left) indicates that the blog is even updated more than once a day, and since 2006. This is a good sign of a dedicated blogger. As I was reading the posts, I was having trouble following some of the story. Since I was reading the blog for the first time, I became very much confused as to the names of the people she was mentioning. After reading a few posts, however, some became more clear to me. The author does tend to have long run-on sentences at times, which does impact readability. I had to reread a few sentences to understand what the author was trying to say. She does write in a manner more like a diary then your typical blog. Many of the posts also include at least one image that is appropriate for the subject of the post. Overall, the content is good with the exception of those run-on sentences and few grammatical and spelling mistakes. Spelling and Grammar  As mentioned in the Content section, there are a few spelling and grammatical sentences that do take away from the readability of the blog. At times the author as purposely (or it seems to appear) misspelled words. This is probably the author's humour so I didn't include those words in my assessment. Overall  It is apparent that the author enjoys writing in her blog, as it is evident in the number of posts. The content is one of the strong points to this blog. The design, however, is the weakest part as the unorganized sidebars make it difficult to navigate around the blog. If you do enjoy ready personal blogs, especially those written more like a diary, then you should check out Angelika.
Photoshop JPEG Settings
I have written several posts in the past relating to digital photos, and more specifically JPEG files. I have talked about the differences between JPEG and RAW files. In one post I also compare JPEG and GIF files, and provided examples to illustrate when to use a particular file type. The JPEG and GIF post also listed the settings I used to get the resulting image in Photoshop. When you save an image you are provided with many options to optimize your image for size and appearance. In this post I will describe each of the features associated with JPEG files to hopefully help you make a better decision. Save for WebFor those that use Photoshop, or are thinking of starting to use it, there are many ways to edit and save an image. One of the methods involves simply pressing CTRL+S to use the Save dialog and select JPEG. You can then set a few options, such as compression and then you are done. I use this method when saving digital photos, and set the compression to the best quality, which is 12. For Web images, however, I like to use the Save for Web item under the File menu. This allows me finer control over an image, and even allows me to choose three separate settings that I can then use to compare to the original. When you use the Save for Web feature you are presented with several options on the right side of the screen. For JPEG files, the options looks like the image below and to the right. The next section will discuss the options in more detail. JPEG SettingsThe JPEG settings are as follows: 
- Preset This dropdown list provides several quick settings that you can use to apply to your image. There are several JPEG settings listed that include some default settings for a JPEG image.
- File Type The dropdown list below and to the left of the Preset list provides a list of all file types that you can save your file as. Selecting JPEG will display settings for JPEG files.
- Quality Settings Below the File Type dropdown is a list of quality settings for JPEG files. Selecting one of the items in the list will change the Quality setting on the right.
- Progressive This option creates an image that streams to the visitor's browser, showing a more refined image while the data is sent until the last of the data is sent and the final image appears. Most images on the Web are not progressive images, and as such I don't enable this feature.
- ICC Profile This option embeds the colour profile into the JPEG image. This increases the file size by about 3KB, which you don't want for a Web image. You will probably be dealing with the sRGB colour profile which is standard for Web images so you don't need to embed the profile.
- Optimized When this option is checked, Photoshop will optimize the image, which should make it smaller. I usually leave this checked as I like smaller images for my Web images. I haven't found any problems with browsers displaying the images with this setting checked.
- Quality You specify the quality of the image here. When this option is set to 100, you have the best quality image with little compression. Adjust this value while keeping an eye on the changes to choose an image that is good quality with a low file size. I usually find anywhere between 40-60 is a nice balance of image quality and size.
- Blur The compression used by JPEG files is better at compressing soft transitions than hard edges. This means blurry images compress better than sharp images. You specify the amount of blur to apply to the image to produce a smaller file. The downside is that you lose detail in the image, which you probably don't want. I usually don't blur my JPEG images as I like them to be as sharp as possible.
- Matte This is one option I have never used in JPEG files. According to the tooltip, this option "Defines color to blend transparent pixels against." You don't need to worry about this setting.
- Image size Since JPEG files are full colour, the colour table is not populated. If you click on the Image Size tab you can resize the image. The options provided here are the same ones provided by Image->Image Size from the Photoshop menu.
SummaryThat is all the options available for creating JPEG images with the Save for Web option. The best way to find the optimal image is to open up four images, and modify the images with different settings to see what works for your image. Related PostsPhotoshop GIF Settings When to Use GIF and JPEG Format Overview of Various Image File Formats Converting Digital Photos for E-mail or the Web
Fix: Internet Explorer Opens a Blank Window
I recently was informed of someone having an issue with Internet Explorer. The problem happened when they clicked on a link that opened a new browser window. Once the new window was opened, the new Web page was not requested and the browser window remained blank. After some quick searching, I came across a fix that was easy to perform and fixed the issue. I explain how to perform the fix in this post. Fixing the Blank Internet Explorer WindowMany times when an application stops working properly it is the result of a file or registry key missing. In the case of this issue it was some missing registry keys. The good news, however, was that we didn't need to manually go into the registry and add those keys, there was a more simple approach. To fix the blank Internet Explorer window, use the following steps: - Press Windows Key+R to open a Run dialog box.
- In the dialog box type regsvr32 urlmon.dll. This will re-register the DLL file and recreate the registry keys it needs to work.
- A confirmation window should appear. Press the OK button to continue.
- Open up Internet Explorer and click a link that opens a new window. If you can't find one simply right-click a link and select Open in New Window.
Hopefully a new window will open with the requested Web page without problems. SummaryYou may experience a problem where Internet Explorer displays a blank window you click a link that opens a new window. If you do, then following the steps outlined above may fix the issue.
Review: AndroidGuys
All the blogs I have reviewed up until this point in time have been mainly authored by one individual. Although for most blogs having one author is the norm, this week I review a blog that seems to go beyond that norm. From the design to the focus of this week's blog, you will see that this isn't your ordinary blog. This week I review AndroidGuys. Web Site: AndroidGuys Description: A site dedicated to Google Android and the Open Handset Alliance. We cover the 34 companies involved in Android including Motorola, Samsung, Intel, T-Mobile, etc. Run by a handful of guys with a love of smartphones and gadgets. Design  When I first viewed the blog I noticed one thing straight away: the design and layout is not what I am accustomed to in a blog. While there is a menu bar at the top, and a side navigational bar on the right, the content section is much different than that of a standard blog. Within the content section the authors have chosen to include a featured article at the top, some recent headlines on the left, and an editorial and opinion section to the right. This introduces visitors with many articles to read, while focusing one main article at the top. I like this format as it definitely looks professional. The only problem I saw with the design appears in Internet Explorer. It appears the browser can't find some images in the recent headline articles, so it displays the usual square with the red "X". This is the only serious issue I found. The menu bar at the top provides some nice links including Podcasts, information on members of the Open Handset Alliance (OHA), the about and contact pages, and other secondary links. The navigation sidebar is nicely ordered with links to similar posts, archives, and categories all easy to find and use. Some may have trouble reading the categories list as there isn't much contrast between the link colour and the background colour. I really like the design of AndroidGuys as it is much different than most blogs online today. Focus  For those that are having trouble determining the focus, it is about the Open Handset Alliance and Android. It seems most of the posts are regarding one of these two subjects. I don't know much about OHA or Android, but I'll read the posts to find out. Content  The posts of AndroidGuys are really well-written, with very little spelling mistakes. There aren't many images that go along with each post, however, the posts are not too long so an image isn't necessary to add colour to the text. There are times when the posts reference a published article on another site. The authors have chosen to write about the article in their own words, and at times quote a few sentences from the article. They have also included a link to the referenced article. For those that like to use published content on your blog, take note: this is the professional way of referencing published content from another site. The content of AndroidGuys is some of the best content I have seen on a blog, with well-written and professional posts. Spelling and Grammar  I read a few posts and found no spelling or grammar mistakes, at least none that took away from the readability of the post. Overall  If you are interested in the Open Handset Alliance or Android then you should definitely check out AndroidGuys. This site has probably compiled the most information on these two subjects. For those that aren't interested in those subjects, you should check out the blog anyway to see how a professional blog is authored.
Windows Key Shortcuts
In many previous posts I provided step-by-step instructions for performing certain tasks. At times I mentioned several methods of accomplishing one of the steps, and usually it involved using the Windows key on your keyboard. This key provides many shortcuts for commonly used functions within Windows. I have decided to compile a list of the various functions that the Windows key can accomplish for future reference. They are listed within this post. The Windows KeyThe Windows key is located, usually, between the left CONTROL and ALT keys on the keyboard. You use the key the same way you use the other keys, simply by pressing and holding it down and typing another key. The following table provides a listing of the various key combinations and the action they perform. | Combination | Action |
|---|
| Windows Key | Opens the Start menu. | | Windows Key+D | Minimizes all open windows and shows the desktop. | | Windows Key+E | Opens Windows Explorer. | | Windows Key+F | Displays the Find files or folders dialog. | | CTRL+Windows Key+F | Finds a computer on the network. | | Windows Key+M | Minimizes all windows. | | SHIFT+Windows Key+M | Undo Minimize all windows. | | Windows Key+R | Opens the Run dialog box. | | Windows Key+F1 | Displays the Help window. | | CTRL+Windows Key+TAB | Cycle through the Taskbar buttons. | | CTRL+Windows Key+TAB | Moves focus from Start, to the Quick Launch toolbar, to the system tray (use RIGHT ARROW or LEFT ARROW to move focus to items on the Quick Launch toolbar and the system tray). | | Windows Key+BREAK | Displays the System Properties window. |
SummaryThis post has provided the shortcuts associated with the Windows key on the keyboard. There are more, however, you need the Intellitype software installed. In the future I may create a listing of the most common keyboard shortcuts for your reference.
How to Get the IP Address of Your Router
I have written various posts about connecting your computer to the Internet, including how to connect using two different routers (Linksys's WRT54G and D-Link's DI-524), as well as various configurations. One topic I haven't discussed is how to retrieve the IP address of your router. You may not know the IP address if, for instance, someone has configured your router and changed the default address. I will show you how to get it in this post. IP AddressesBefore I explain how to get the IP address of your router, I will provide a quick overview of an IP address. An IP address is a series of four numbers separated by dots that is unique to every machine and device on a network. This allows you to connect to any device by simply specifying the IP address of that device. Since each device has a unique IP address, your computer, and router each have their own IP address. The address of your router is assigned by your ISP, and the address of your computer is assigned by your router. Your router will also have an IP address assigned by itself so it can connect to your local area network (LAN) and the Internet. Now that you have have an idea what an IP address is, let's take a look at retrieving the IP address of your router. Retrieving the Router's IP AddressWhen your computer connects to your router, it must know the IP address of the router, or it can't connect. Since it must know the IP address of the router, you can easily retrieve it using a simple DOS command called ipconfig. To retrieve the IP address of your router, use the following steps: - Click Start->Run to open a Run dialog box. Alternatively, you can press Windows Key+R.
- In the box beside Open type cmd. A DOS window will appear.
- At the prompt, type ipconfig. Some information about your current networks will be displayed on the screen.
- Look for the entry labelled Default Gateway. This is the IP address of your router. A gateway is a device that acts as an entrance to a network. In this case the router acts as an entrance into your local network from the Internet.
Now you can type that IP address into your browser to access the router's administrative Web pages, or use it to setup your network manually. SummaryThere may be times when someone has setup a network and changed the default IP address of the router. You can easily retrieve the IP address of your router by simply running ipconfig from a DOS prompt. The IP address of your router will be listed beside Default Gateway in the response of ipconfig. Related PostsConnecting Multiple Computers to Broadband Different Methods of Connecting Multiple Computers Network Glossary of Terms Securing the Linksys WRT54G Wireless Router Securing the D-Link DI-524 Wireless Router
Review: Upcoming Technologies
I enjoy technology, which is evident in the fact that I am the author of a technology blog. Since I have started writing free reviews, I haven't really reviewed many technology-related blog. This week I will look at a blog that actually has a very long title, but I will shorten it to Upcoming Technolgies. In case you are curious, the full title I was given was "Upcoming Technologies,Current Technologies,Reviews,News,Info and more!" Web Site: Upcoming Technologies Description: Explore the "most" interesting stuff of today and tomorrow! Design  The design of Upcoming Technologies consists of a content section on the left and a single navigation sidebar on the right. The content section is well designed in that the text is very easy to read and the many posts are easily recognized and distinct. The content section is the best part of the blog, and the sidebar the weakest. The sidebar of a blog is traditionally used for navigation and advertising. In this case, it is used more for the latter, which makes it more difficult to navigate around the blog. The author has chosen to only include archive links of the blog posts as a means of navigating. The remaining portions of the sidebar is a mismatch of various advertising units and widgets. Some of the widgets seem out of place in a technology blog, such as an online dictionary, word of the day, and quote of the day widgets. These widgets not only take up valuable real estate, but they also slow the loading of the blog. If the author were to include more navigation links, such as categories, a smaller version of the archives, and an about me page link, it would definitely make the blog much better. Focus  The focus is specific to technology of all forms, and each post appears to provide technology related news. A visitor reading the blog for the first time will easily determine the focus of the blog. Content  As I read through the various posts on the blog, I was impressed with the author's writing style. There were a few spelling mistakes, but overall the blog was well written, and I thought the author knew how to write great posts. This was until I looked a little deeper. Many of the news related posts are simply copies of articles from various news sources. While I definitely hate a blogger copying other's work, the author does site the source (a link to an online article) at the end of each article. I would rather have had the author simply write a brief introduction or outline of the article, and then provide the link to the actual article. This allows the author to have unique content, that isn't copied, and also provides a visitor with more information in the linked article. For many of the posts, the author has included various images that are related to the topic of the post. This helps add colour to both the blog and the post. Keep in mind that some of the images are also copied from the new source as well. I feel the author should copy less from articles and provide more of their own work, since I frown upon copying. Spelling and Grammar  I found the spelling and grammar mistakes in the posts very interesting. Many of the mistakes I found were in articles that were copied from various news sources. I didn't read the actual articles closely from the news source, but the ones I did read also contained the mistake on both sites. I find it interesting that an article can be published twice and still have the same spelling and grammar mistakes. Overall  The design is not as good as it could be because of the disorder in the sidebar. Cleaning up the navigation links on the sidebar, and removing unnecessary widgets should be the first step to fixing the design. Much of the content is copied directly, images included, from a trusted news source. The author, however, has provided a link to the original article. For the articles, the author should have written a brief overview, or introduction to the article instead of copying the entire article in a post. This blog overall could be better, but has potential if the author puts a bit more effort into managing Upcoming Technologies.
Developing a Blog Process
For many individuals blogging is like a full-time job, in fact there are many who have made a career from blogging. They rely on their blog for their financial stability and livelihood. For those that are in this category, updating the design of a blog can sometimes be a headache if something goes wrong, as potential new visitors are turned away. I have changed Technically Easy many times in the past year, and each time it could have been difficult, except for the fact that I have developed a process. This process involves using two blogs to help ensure updates to the design of the one blog goes smoothly. Developing a ProcessIn the business world, the IT department is run, hopefully, by processes. These processes dictate how something is changed in production to reduce the impact on clients. In the blogging world, processes can also be used to ensure visitors aren't impacted by a change to your blog. In the case of your blog, you can develop a simple process that allows you to easily, and efficiently update your blog. The process involves developing in one blog, and then moving the changes to your main or production blog. A simple process such as this can be done on any blogging platform, including both Wordpress and Blogger. Not only will this work for design changes, but it can also be used for testing posts to ensure they have been spell and grammar checked, and that they appear correctly. In the next section I will go into more detail how you can accomplish this. The Development EnvironmentTo begin creating and managing the process, you will first need to create a second blog. This new blog will be your development environment where you can test changes to your actual blog without impacting visitors. Once you create the blog, you can change it at will without affecting your production blog. Then when you change something that you like, and you have determined that it works properly, you can eventually copy it to your production blog. The one thing that you need to keep in mind with the development blog is the search engines. Unlike your production blog, you wouldn't want the development blog to be listed in search engine results. This is especially true if you have the same posts published in both blogs. Many platforms let you prevent search engines from indexing your blog, and for your development blog you should enable this feature. That is the basic overview of your development environment. You can create a test blog as well, to make it more true to how businesses usually deal with production changes. You may want to keep it simple with just a development and production blog. The Updating ProcessIn order to make use of both your development and production blogs, you will need to develop a process that works for you. As mentioned above, you can also incorporate a testing blog as well, but it isn't necessary. Two processes (one for design changes, and one for posting) is outlined below. Managing Blog Design Changes - Start with a copy of the production blog. Simply copy the template from production into your development environment. This will help you to track the necessary changes to update your production blog.
- Next, make the needed changes in the development environment. Always remember to view the changes in multiple browsers (Internet Explorer, Firefox, Opera, Safari) to ensure that the blog is displaying properly.
- Copy some of your production posts to your development blog to ensure that your tables, text, and images all appear as they should. You want to ensure the look and feel of your blog stays uniform throughout your posts. Keep in mind that you prevented the search engines from indexing your development blog, so you shouldn't have any issues with duplicate posts in the search engine results.
- Once you are satisified with your changes, you can then schedule a date to upload the changes to your production blog. I wouldn't update your production blog right away. You should ensure that you know what needs to be changed to reduce the amount of errors that could occur. Take a few days to continue to test your changes, and then update.
- Once the production blog is updated, open it up in a browser and read through some of your posts. While you do this, look for design flaws, and at your widgets to ensure everything is correct. If it is then you are finished. If not you will need to make the necessary changes.
Managing your Blog Posts - Write your blog posts offline, outside of your blog. I find a simple text editor is much easier to use than the editor in a blog platform.
- Once your post is written, copy it into a wordprocessor for spelling and grammar check. It may not catch all mistakes, but it will find some of the mistakes. Make the corrections in your text editor.
- After the initial check, copy the corrected post to your development blog. Publish the post so you can see it in your development blog.
- Navigate to your development blog and read your post. Check for spelling and grammar as well as for any design issues, such as the wrong font, an image that is not in the correct location and that the text is positioned correctly. Make any corrections in the editor within the development blog.
- When you are satisfied with the post, copy the post from the development blog to the production blog, and when it is time, publish the post.
You have now spell and grammar checked the post, as well as checked for any design flaws before your visitors had an opportunity to find the mistakes. SummaryIn this post I have outlined a simple process that you can use to ensure you prevent design and post flaws from reaching your visitors. I currently use the above methods with Technically Easy. I am curious to know about any process you use for updating your blog. Let me know in the comments. Related PostsBlog Designing Tips for New Bloggers What to Avoid When Designing Web Sites Web Site Design Tips
Performing Searches in Google
I recently wrote a post titled Using Google Alerts to Track Copies of Your Web Content. In that post I mentioned using Google search results to watch for duplicate copies of your work showing up on other Web sites. The example I used was a common Google search term used by probably many webmasters, but may not be known by the general public. In this post I will explain some of the search terms that you can use in Google that can give you interesting results outside of just simple keyword searches. Webmaster SearchesMost people perform a simple keyword search, which basically involves searching for a specific word or phase in a Web page. Since most, if not all, people online know how to perform this search, I won't discuss it in this post. In this section I will concentrate on searches that could help a webmaster find specific information about their site in Google. If you use the Webmaster Tools within Google, you can easily perform these searches as they are hyperlinked in the Webmaster Tools. - site:
Use this operator followed by the URL to see all the pages for the URL that are included in the index. For example, site:www.technicallyeasy.net will display all pages in the Google index for Technically Easy. - link:
This operator will return all pages in the Google index that link to a specific site. For example, to show all the pages linked to Technically Easy, I would use link:www.technicallyeasy.net. - cache:
Google caches a version of your Web site that you can view when you click the Cached link in the search results. You can easily view the cache by including this operator followed by your URL in the search. - info:
Including this operator in the Google search bar followed by the URL will return all information Google has about the site. - related:
When you use this operator, Google will return pages that are similar to yours. To view pages that are similar to Technically Easy, I would input related:www.technicallyeasy.net in the Google search bar.
The search operators shown above are useful to webmasters, and can be used from Google's Webmaster Tools. In the next few sections I will show some other search examples that may be of some interest to you. Finding DefinitionsIn addition to search for specific keywords, Google also has the ability to display definitions of words. It does this by searching various web sites for the definitions and then displays them in the search results. As with the webmaster searches defined above, finding definitions is a matter of using a specific operator. To find definitions you use the define: operator. For example, if I wanted to find a definition for the word "technical", I would enter define:technical in the Google search bar. Google will then display the definitions from various web sites, as well as provide the links to those sites. If I wanted to go even further and find the definition for "technical analysis" I would enter define:technical analysis in the search bar. This will provide the definitions for that word combination. You can enclose the words "technical analysis" in quotes, such as define:"technical analysis" if you wish. The same definitions will be returned for either example. The next time you need a definition of a word, and you don't have a dictionary handy, you can use Google to find the definition. ConversionsThe last search type I will show you is the conversion searches. These searches allow you to easily convert a unit of measurement to another unit of measurement. The conversion appears at the top of search results (Google also provides search results for the measurements as well). For example, to convert 1 foot to centimeteres, you can enter 1ft to cm or 1ft to centimeter. You can use either short or long form for the measurement units. You can also convert temperatures, such as 20C to F. This will convert 20 Celsius to Fahrenheit (68 degrees). If you attempt to convert incompatible measurements, such as 1ft to oz (feet to ounces) you won't get a conversion, just the search results. SummaryThis post provided several search types that you can perform in Google. Search terms for webmasters, definitions, and conversions were explained. There are many more searches that you can perform in Google, which I may share with you in a future post.
Review: Tetsujin's Blog
I have read many personal blogs. These are the blogs that don't have any true focus since the posts are what the author has felt like writing at a specific time. I enjoy reading some personal blogs as they can provide quite a break from reality. This week I review a personal blog, that is geared more towards the college crowd. Web Site: Tetsujin's Blog Description: It is about college life, general life on the internet, and random technology, it is a lot of personal blogging fun. Design  When I read the e-mail requesting the review I never clued in that I have seen this blog before. When I viewed the blog I instantly recognized the image in the header of the blog. The header takes up quite a lot of real estate on the blog, but the image will be associated with this blog. Below the image is a menu consisting of links to a forum, suggestions, the "about me" and "contact me" pages, and a "One Buck Review" page. More on the "One Buck Review" later. The actual content portion of the blog is split into three columns. The left column contains the Entrecard card, the BlogCatalog and MyBlogLog widgets, and recent posts from other blogs. The content is in the middle with another navigation bar on the right. The right navigation bar contains the subscription link, sponsors and category links, favourites, archives, a calendar of post dates and other personal links. The columns should be switched, with the blog related links on the left so the visitors can easily navigate the blogs. The BlogCatalog and MyBlogLog widgets, as well as the advertising should be moved to the right navigation bar. The personal links could be placed below the links on the left to make the left navigation bar a one stop shop for the links. I'm not a fan of the green coloured text, especially against the light background. A darker colour would make it easier to read, especially if the text was also larger. The design could use a few modifications to make the blog better to allow visitors to easily navigate and read the blog. Focus  It is always difficult to rate the focus of a personal blog because there usually isn't one. That is true in this case. There is no true focus of Tetsujin's Blog but it seems to be more geared towards college life. Content  The content of Tetsujin's Blog ranges from long posts to relatively short posts. The author doesn't post on a regular basis and can sometimes leave large gaps of time between posts. The author does include some appropriate pictures to enhance the point of a post. Some images, however, can be quite large and take some time to download. For the most part the images are small and download quickly. In the top menu there is a link for "One Buck Reviews", which I'm guessing means you buy a review from the author for one dollar. The reviews are small (about three paragraphs), but for one dollar it is a good investment if you want a backlink. I did enjoy reading some of the content, which has a college feel to it. If you do like reading these types of blogs, then you may like reading this one. Spelling and Grammar  There are a few spelling and grammar mistakes that did cause me to reread sentences a few times. All posts don't contains sentences like this, but those that do definitely take away from the readability of the post. A spelling and grammar checker would help in such cases. Overall  Tetsujin's Blog is a standard personal blog in which the author writes about anything they are thinking about at the time. There are several issues with the design of the blog that could make it difficult for visitors to navigate or read. The focus of the blog, like many personal blogs, is almost non-existent, but the content is interesting. It would be better if the author wrote on a more regular basis as large gaps between posts could stop people from subscribing to the blog. A spelling and grammar checker would help correct some of the errors that appear in some of the posts. Overall the blog is a good blog with a few minor flaws that could be easy to fix.
How to Create Static-Like Pages in Blogger
For many blog authors, Wordpress is the management system of choice. It provides the most flexibility and options for managing blogs. For those that are not using Wordpress, Blogger is a good, free option. Blogger, however, is not nearly as flexible to use as Wordpress. There are fewer options and templates for that system. The one drawback of using Blogger is the inability of uploading, and using static HTML pages. There is a simple workaround that you can use to create pages in your Blogger blog that will mimic static pages. I will discuss how to create and use those pages in this post. Creating Posts as Static PagesThe only option, at the time of this post, to creating static HTML pages in a Blogger blog is by using posts. Now you can easily create an HTML page on another server and then link to it from your blog, but it is much easier to use posts as they will include your template. When creating the static pages, there are a few things that I would like to point out: - The static pages should not appear in your RSS feeds to your subscribers. They will not be used as posts, so they shouldn't be included.
- The date published shouldn't be included.
- Comments for the page aren't needed.
I will now show you how to accomplish the above points easily within Blogger. We will be creating a post that will act like a static page on your Blogger blog. - Start a new post in Blogger.
- Enter the information that you would like displayed on the page in the Blogger editor.
- Once you have entered the content, click the Post Options link.
- Now we will satisfy two of the points above. Below Reader Comments select the Don't allow option to disable the comments for the page.
- Below Post date and time, enter a date that occurs in the past. For my pages I use June 23, 2007 since that is the first day of Technically Easy. This should prevent the post from being sent to your subscribers as an update.
- When everything is ready to be published, click the Publish Post button.
Now we have a new post that has a past date and doesn't allow comments. The next steps will prevent the post date from being displayed. - Click the Layout tab to display your blog's layout.
- Click the Edit HTML link to display the layout in HTML.
- Check the Expand Widget Templates checkbox to display the Blogger code for each widget.
- Search for the location where the post date is displayed. For blogs that use version 2, search for <data:post.dateHeader/>.
- Before that line include the following:
<b:if cond='data:post.allowComments'> - After the post date line include:
</b:if> This tells Blogger to only display the post date if comments are allowed for the post. Since we disabled comments, the post date won't be displayed.
Now load up the new page to see if it is displayed as you would like. You can now link to that page from anywhere on your blog, or another Web site. SummaryBlogger doesn't have the ability to add static HTML pages to your blog. To mimic static HTML pages, you can simply create a past-dated post and link to it as if it were a static HTML page. This post also showed how you can prevent the post date from being displayed to make it look even more like a static page instead of a post. Related PostsGrouping Posts By Categories in Blogger Blog Designing Tips for New Bloggers What to Avoid When Designing Web Sites
How To Track Outgoing Links with Google Analytics
I use Google Analytics to monitor the traffic on Technically Easy. It is a popular, free tool that provides a wealth of information about the visitors to your web site. The problem that I find with Google Analytics is that it doesn't track outgoing links to my blog. I would be interested to know how many of my visitors click on some of the provided outgoing links, such as my RSS subscription link. I recently found the answer to my problem, and how I can use Google Analytics to not only track links to other pages in Technically Easy, but also the outgoing links to other sites. Set Yourself some GoalsWithin Google Analytics you can setup conversion goals for each of your web sites. Goals are web pages that your visitors reach once they have completed a transaction or a desired action on your site. For example, on shopping sites a goal would be defined as a "Thank You" or "Confirmation" page once a visitor completes an order. When you setup a goal, Google Analytics will track various metrics against that goal. In the case of an outgoing link, I would like to see the number of visitors that clicked on that link. Let's have a look at how we can accomplish this task. Note: Signing up and using Google Analytics is beyond the scope of this post. If you need help with either of these two topics, there is much information online regarding how to accomplish them. Creating a Goal to Track Outgoing Link ClicksI will now provide instructions on setting up a goal to track the number of visitors that click on an outgoing link. - Navigate to Google Analytics so you can see all your web site profiles.
- Next to the web site that contains the outgoing link you want to monitor, click the Edit link. You should now see the Profile Settings for the web site.
- Look for the Conversion Goals and Funnel section on the web page. All the current goals for your web site should be listed there, unless you don't have any defined. Beside one of the empty goals (one that says Goal not configured), click the Edit link.
- The Goal Settings page should now be displayed. We will use the following values for our goal:
Active Goal: On Match Type: Head Match Goal URL: A virtual name to an address. For my RSS subscription link I chose "/outgoing/rssfeed". Remember this name as you will be using it shortly. Goal Name: A name that will help you to determine what the goal is for. - Once you have defined your goal settings, scroll to the bottom of the page and click the Save Changes button.
- Now you will need to edit the link on your web site. Open up the page containing the outgoing link in an editor and find the link. Once you have found the link, change it to look like the following:
<a href=[the outgoing link] onClick='javascript: pageTracker._trackPageview("[the name you created above]");'> - Since the link calls the "_trackPageview()" JavaScript function, you will now need to move the Google tracking code before the call.
It could take 24-48 hours to display the results of the goal, but when they are displayed you should see them under the Goals section in Google Analytics. SummaryThis post provided a method of monitoring the outgoing links on your site. By using conversion goals, you can now determine the number of visitors that clicked on a specific outgoing link on your site. Related PostsFree Web Site Statistics
Review: F1-ToGo
When viewing blogs I like original blogs. It seems most blogs today discuss the saturated topic of making money online, or SEO (Search Engine Optimization). When I see a blog that is not focused on one of those two topics, it is like a breath of fresh air. This week I look at a sports related blog, specifically F1 racing. I am not a F1 racing fan, but this is definitely one of the best blogs I have seen. Lots of content, a specific topic, with a great design. Web Site: F1-ToGo Description: Dedicated to the fast paced world of F1 racing. Featured are original content news stories, opinions, and a bit of controversy along the way. Design  The design of F1-ToGo is well done. It is a standard design with the content on the left and two navigation sidebars on the right. There is also a menu bar at the top of the blog for easy access to important pages. First let's have a look at the content section. The titles are nice and large and easy to read. The font and font size chosen for the content is also nice and large. Anyone should have no trouble reading the posts. The sidebars on the right are neatly organized, which is unusual considering the amount of information the author has provided. There are ads at the top, however, they don't drown out the actual navigation links. There are a few ads on the right side of the sidebar, while the navigational links are on the left. There are many categories in the sidebars with each one having a well-defined header. The categories, recent posts, and favourite posts are near the top of the left side of the sidebars. This allows visitors to find the posts without having to scroll down the page. The only issue I found with the design was with IE7. When I viewed the sidebars in IE7 the "Recent Viewers" widget from BlogCatalog stretch from the left side to the right side. The overall design of the blog is well done, and shows how a great blog should look. Focus  The focus of F1-ToGo is simply F1. Every post is related to F1 racing, and includes discussions on tracks, results, drivers, teams, and rumours. The focus is clear and well-defined. No problems with the focus on this blog. Content  The design and and the focus are top-notch, and the content is also in that category. After reading some of the posts, I am amazed at how well each post is written. Most of the posts discuss drivers, teams and upcoming races. For race results, the author includes the placing of all drivers as well as the fastest laps. The content of F1-ToGo shows the author's passion for the sport without a question. Spelling and Grammar  I found that the posts are well written and contain very few spelling and grammar mistakes. For those posts that do have a mistake, the mistake doesn't reduce the readability, or distract from the point the author is trying to make. Overall  This is one of the best designed and written blogs that I have reviewed. I'm not a fan of F1 but I still read many of the posts on F1-ToGo mainly because they are very well-written. The sidebars are well organized, and the fonts and sizes chosen make the blog very easy to read. If you are a fan of F1, then you should definitely check out this blog. If you aren't you should still check out this blog and see what a great blog looks like.
Using Google Alerts to Track Copies of Your Web Content
In my last post I wrote about What to Avoid When Designing Web Sites. I mentioned various points that you should not do when designing a Web site. One of the points talked about copying the work of others and posting it on your site as your own. It was then mentioned in the comments about monitoring such copying of your own work. In this post I will look at one easy-to-use method of monitoring Google results for duplicate work of yours, which you can then use to take the appropriate action. What is Google Alerts? Google Alerts are simply e-mails sent to you when a specific set of criteria you setup is found. The search criteria are a set of search terms against the Google index, and when there are new items for those search terms an e-mail is sent to you. An alert can be setup for searches against News, Web, Blogs, Video and Groups. You can easily setup Google Alerts by visiting the Google Alerts home page and enter your search criteria on the form provided. You can then manage your alerts from your Google account. Using Google Alerts to Monitor Your ContentNow that you have an idea of what Google Alerts actually is, let's see how we can use that to monitor your Web content. Keep in mind that this isn't 100% foolproof, but it can help you find those who duplicate your content. Within my posts I try to link to other posts within my blog. This helps to provide more information to my visitors, but it can also help to monitor my pages with Google Alerts. Here is how I do that: - I navigate to the Google Alerts home page. This is where I will create a new alert.
- Since my posts usually contain a link to another post on Technically Easy, I will use that as a search term. Beside Search Items I will enter link:www.technicallyeasy.net. This will alert me when another site contains a link to my blog.
- Beside Type I select Comprehensive.
- For How often, I select once a day as I don't need more alerts than that.
- I then enter my e-mail address to receive the alerts, and then click Create Alert.
- You should now receive a confirmation e-mail. You will need to click the link in the e-mail to activate your alert.
You can use any search terms you would like to use to monitor the Google search results. The search criteria above won't work if someone were to change the location of the links, or if a post doesn't contain another link to your blog or Web site. You can always come up with your own method of keeping track of your hard work. As a side note, the above alert will also inform you of who has linked to your blog or Web site. SummaryThis post provided a brief overview of Google Alerts as well as step-by-step instructions for creating an alert. A simple example was provided that can allow you to track other sites that may copy your content and post it on their site. I have been able to catch a few sites that have copied my content. If you have other ideas of finding those that duplicate your content, I would like to hear them. Just post your ideas in the comments section.
What to Avoid When Designing Web Sites
I enjoy using Entrecard on a daily basis. It allows me to find new blogs that I would have never have visited without going through Entrecard. At the same time I also find blogs that I would never visit again, not because of the content, but because of how they are designed. In this post I will list several points that I consider to be a bad for Web sites and blogs, and items that should be avoided if you want to keep your visitors coming back for more. What You Should Avoid When Managing a Web SiteI have written many posts regarding designing a good Web site, at least in my opinion. These are outlined in Blog Designing Tips for New Bloggers and Web Site Design Tips. Now let's look at some bad points that you should avoid when designing Web sites. - Creating a complex design.
Avoid adding too many links, objects, and ads to the sidebars and focus more on providing an easy to find and read navigational links. Your visitors won't stay around hunting for a specific link. Keep the navigation simple. - Popup Ads.
These windows that open when you visit a site are really annoying, and in reality serve no real purpose as most users would just close them anyway. Making money with ads is okay by me, just as long as they are incorporated in the Web pages and don't display in a new window. - Background Music.
I have visited many Web sites that include some music that loads and then plays in the background. If you would like music on your site, provide the play option to the user and don't play it automatically. - Flash animation - no real content.
I usually visit sites looking for specific information. When a site's navigation and content are all contained in flash animation, I usually close the window. Although flash can look great, I prefer the standard text to Flash on a Web site. Besides, search engines can't index content properly if it is built in Flash animation. - Copied content - no original ideas.
Don't copy the hard work of others and post it on your site. You will probably be punished by the search engines for having duplicate content, and won't get many visitors in the end. You could write a brief summary of the Web page and then link back to the original site. Many Large Images. Many times I have visited a personal Web site and had to wait for several minutes for some images to download. If you would like to use photos on your site, make them smaller in an image editor first, and then upload them. Don't let the browser do the resizing since they will still be large, and just look smaller.
SummaryThis post has provided several items that you should avoid on your Web site if you want your visitors to keep returning for more. The items listed above are the most common annoyances on Web sites today, and they are the reasons I refuse to re-visit a Web site. Now the question to you is: what would you add to the list to make it more complete?
Review: Life is Colourful
One of the most popular niche many people choose when creating a blog is the "money making" niche. I am not a fan of this niche, in fact I think it is too saturated with blogs. The blog this week, title Life is Colourful, is a blog that is partially in the "money making" niche. There is more to this blog, which is a good thing, as they author also ventures into the world of the Internet and SEO to provide even more tips to help you get started in blogging. Web Site: Life is Colourful - Making 2 cents per minute Description: It's all about Blogging, Internet, SEO, Technology, Reviews and Life. Design  On of the weakest points of Life is Colourful is the design. While one of the main topics discussed is how to make money online, the blog isn't overwhelmed by ads. The design of the blog contains three sidebars, which is a little unusual. There is a left sidebar, and two right sidebars. The content is between the left and right sidebars. Since there are three sidebars, each column is not very wide. This has caused the author to choose a rather small font for the sidebars and the content. This can make it difficult for some to read easily. I rather prefer a larger font, at least for the content. The left sidebar contains only ads, and not many as only three are displayed at the top. The right sidebars contain the navigation links. The links are organized into sections, however, there seem to be too many. This clutters the right sidebar to the point where it is a little difficult to easily navigate around the blog. There are many comment links and other Web site links included in the sidebar. I'd much rather see more links related to the content of the blog. A few minor tweaks to the design of the blog will make it a much more appealing blog for all visitors. Focus  The focus of the blog is rather difficult to find as many topics are discussed on the blog. If I had to choose the main focus I will probably put it in the Internet category. Unfortunately, the Internet category is very broad and not very focused. In this case, however, the author has chosen many topics on the Internet, including making money, SEO and Web site reviews. Many of the topics discussed can be a separate blog in itself. There are also a few technology reviews as well. The author does indicate other Web sites and blogs that they manage, but maybe a few more with the topics discussed on this blog can narrow down the focus of Life is Colourful. Content  I enjoyed the content of this blog, as I found the posts well written and not too long. The addition of images within each post provides some nice colour without distracting from the point of the post. The author takes time to update the blog on a regular basis. It seems on almost a daily basis the blog is updated, which indicates the devotion the author has to the blog. The content of Life is Colourful is definitely the strongest, and with good reason, aspect of the blog. Spelling and Grammar  I found that the posts are well written and contain very few spelling and grammar mistakes. For those posts that do have a mistake, the mistake doesn't reduce the readability, or distract from the point the author is trying to make. Overall  The design of Life is Colourful can be a little cleaner to make navigating around the blog easier for visitors. Reducing the number of links in the two right sidebars can go a long way to the usability of the blog. Increasing the font size will also help with the readability of the blog. While the focus seems to be a little broad, the actual content of Life is Colourful is the strongest point of the blog. The author updates the blog on a regular basis which is always good to have on a blog. Overall, Life is Colourful is definitely a great blog to visit.
Taking a Week Off
I have been infected with a nasty cold, which has impaired my ability to read and write. I will be taking this week off of blogging to recover, but I will be back next week starting on Monday with a new review followed by some tech tips and advice.
Grouping Posts by Categories in Blogger
I recently had questions regarding adding categories to a Blogger blog. Although it doesn't appear like Blogger supports categories, it in fact does and they can be added easily. In one of my recent posts titled Blog Designing Tips for New Bloggers, made mention of categories and that all new blogs should include a listing of them in their sidebar. In this post I will explain what categories are, and how to incorporate them into your Blogger blog. About CategoriesEach post on a blog is usually about a specific topic, and a blog may have several topics overall. When you create many posts about a topic it would be nice to allow the visitor to view all posts that are related to that topic. This is where categories come into play. A category is simply a tag, or label for a post. When you add a post to a category you simply begin to organize your blog in a meaningful manner. You then list you categories on your blog and when a visitor clicks the category link, a new page displaying all posts in that category is shown to the visitor. It is important, however, not to create too many categories. I believe roughly 15 categories is a good number to have on your blog. Too many and your listing would be too large to read easily. In the next section I will show you how to implement categories in a Blogger blog. Labels = CategoriesIn the Blogger world you can attach labels to each post that you publish. These labels can then be listed in your blog's sidebar as links. When a visitor then clicks one of these links, it will take them to a Web page that displays all posts that are assigned that label. To add labels to your blog, use the following steps: - Log in to your Blogger account, and then click the Layout link to the blog you want to change.
- Click the Add a Page Element where you want the categories to appear.
- From the list of page elements, click the Add to Blob button under Labels.
- Enter a title, and then click Save Changes. This should add the new Labels element to your blog.
- Now when you create or edit a post, enter some labels in the text box labelled Labels for this post. Each label should be separated by a comma.
- When you publish the post, a label will show up on your blog with the number of posts associated with it.
Blog Designing Tips for New Bloggers
I have been busy writing free blog reviews each week for those that have requested a review. When I review a blog one of the criteria I use to rate a blog is how well the blog is designed. There are many different designs that you can use for a blog, but I think for many new bloggers what to include in the design can seem confusing. I have decided to compile a list of the items I look for in a blog. Others will have their opinion, but here are mine. The Layout of a BlogBefore I talk about the elements, or widgets, to include it is important to have a well defined layout. The layout sets the tone on how your blog will look and feel to a visitor. There are a few layout standards that you can see throughout the many blogs online. Some blogs incorporate one navigational sidebar and the content, while others include two sidebars. Some layouts place the sidebar on the left side of the page, while others place it on the right side. For those with two sidebars, you may see them split on the left and right side with the content in the middle, or both sidebars on one side only. Some will argue that putting your sidebars on the right side is better for SEO (Search Engine Optimization), but I haven't really seen any proof of this. I have my sidebars on the right side so the content is read first. The layout you choose should include at least one sidebar for navigation, and a location for the content. Above both of these elements, you should include a header that includes an image of your blog and links back to your home page. Some may include the blog name in text in the header, but I like images as you can do more with them. What to Include on Your BlogThis is where many new bloggers may have difficulty. There are so many widgets on the Internet that you can include in your blog, which may be confusing as to what yours should actually use. I'll try to make it easier for you. The first thing you should include is a way to subscribe to the RSS feed of your blog. This can be either through a button/image, a form to subscribe via e-mail, or both. This should be located at the top of your navigational sidebar. It is important to introduce yourself to your visitors by writing an "About Me" page. Many visitors that like reading blogs, especially those that provide information or advice, like to know that the author of the blog has some experience on the topic they are writing about. This should be near the top if you can put it there. The next is a listing of the categories of your posts. This helps visitors read posts for a specific topic without having to perform a search. For blogs created in Blogger, the labels function performs the same thing. Each post should be assigned a category, and then the categories listed in the sidebar below the subscription buttons, or the "About Me" information. You should also include a list of archives to allow visitors to look through your past posts. This isn't as important, so it can be included further down your sidebar. Including Advertising on Your BlogIt seems most people that start blogs always include advertising. Why not try and make some money with your blog? The problem is many new bloggers get carried away with the ads. Making money online takes time and effort, and doesn't happen overnight. You need to first build a visitor base before making money off your blog. When placing ads on your blog, ensure that you keep things organized, meaning don't just place ads everywhere on the post pages. The ads should blend in nicely with the blog, to make the content stand out and not the ads. When you first start out, don't worry about placing ads, in fact forget about them until you have over 100 visitors a day. You won't make much money from them anyway, and you should be concentrating on your content in the beginning. Then as the number of visitors grows, you can place the ads on your blog. Remember to blend in the ads so they don't standout. SummaryFor many new bloggers creating a well designed site can be a daunting task. When starting a blog, it is important to add several elements, such as RSS subscription, categories, and an "About Me" page. Next concentrate on writing good unique content, and not worry about such things as advertising. Once your visitor count gets above 100, then you can start looking into advertising. Remember, however, not to bombard your visitors with ads, but instead blend them into the blog. I would like your opinion on what elements you think should be included in a blog.
Review: Blog with Ric
When creating a blog there are two things that separate a good blog from a great blog: a focus and a good design. A blog needs to be focused on a specific subject, unless it is a personal diary, and it also needs to have an easy to follow navigational design. For this week's review I will look at a blog that contains a long description, but short posts, and all the elements of a good design. The author has chosen to talk about many subjects, but can they all be tied together under a single focus? Let's have a look at Blog with Ric. Web Site: Blog with Ric Description: This blog is intended to share my experiences with just about anything. Postings can be about blogger hacks and tools, design and templates, programming and web development, earning online, my investments, savings tips, useful links, personal rants and other topics that catches my mind's fancy. Design  I feel the design of a blog can help determine if a visitor stays and reads the posts you have written, or simply closes the site and moves one. A site should be easy to navigate and well designed to help a visitor find their way around. The design of Blog with Ric almost accomplishes both those tasks. It has all the information that I look for in a blog, an "About Me" section, "Categories", or in this case "Labels", archives, and a method of subscribing to the RSS feed. All of this information is provided in the right navigation sidebars, in which there are two. With the left side dedicated to the blog's content, the author has moved all navigational links to the right-side, similar to Technically Easy. The one thing that, unfortunately, Blog with Ric lacks is some organization on the right side. For the right side, it nice to have the subscription information at the top, but it could be followed by the "About Me", and "Labels" sections to allow the visitors to navigate through the many posts. The ads on the right part of the navigational sidebar could display the ads, and other links. This sill provide a nice balance of navigation and advertising for the blog. The one major downside to this blog is the lack of colour. There are two dominant colours: yellow and green. While a few posts provide some images, they don't add much colour to the blog. I'm not a huge fan of yellow, at least for the background, but adding some more images to the blog could help spice it up a bit soon it doesn't look too drab. Overall, the design of Blog with Ric has all the elements needed for a good blog, but a bit more colours, and some minor organization in the sidebars could make it even better. Focus  The focus of the blog appears to be a long-winded description of various topics that the author has chosen to discuss. When I read through the posts on the blog, it appears the focus is more geared towards Web sites. Many of the posts talk about the author's success with this blog, with topics discussing how the blog success came about and the Web sites that were used. Many of the posts simply contain links to Web sites the author has found interesting, and overviews of various technologies, whether they are related to Web sites or not. To some degree, the focus can be hard to determine as the author has chosen to talk about many different topics with regards to Web sites and technology. Content  It can be difficult to rate the content of a blog if there is no real focus. In this case I will look at the content without regards to the focus. Most of the content are posts that contain only text, with very little images, which can be both good and bad, as text is quicker to download, so the blog loads quickly, however, at the same time a picture can help enhance the topic of the post. It would be nice to use a few more images in some of the posts to add colour to the yellow and green look of the blog. The posts themselves are quick and to the point, which is always a plus with blogs. This allows a visitor to read many posts quickly without getting bogged down in lots of off-topic discussions. Many of the post themselves consists of a one line introduction to a Web site, followed by a link. Although this is nice, additional text about the site would add more value for a visitor. The one big plus to the content is the fact that a new post is published on almost a daily basis, which can help keep visitors coming back for more. Spelling and Grammar  I found that the posts are well written and contain very few spelling and grammar mistakes. For those posts that do have a mistake, the mistake doesn't reduce the readability, or distract from the point the author is trying to make. Overall  Bog with Ric has a lot of potential of being a great blog, with some minor modifications to the design and focus. The posts are well written, short and to the point, but don't have any real focus. Many of the topics discussed can be divided and written over several blogs. This is one blog, however, that you may want to check out.
Home
|