Iteration 1 is due on Wednesday! Have I started, that would be a firm, NO! But I have at least thought about it and am very worried that it won't live up to the expectations of the class. I've never done AJAX or heard of it before this class. I will try and do my best but like Drake said if it doesn't work, we don't get credit. I was thinking about doing something with a picture like the lab but with a button like Drake's example. I don't even know where to begin with this process. I guess I can try it first and then see what happens with it.
For starters, I guess I can read over the lab again and try to go over Drake's example. If I still confused which I probably will be, I'll probably check out the w3schools site to see if they can help me on a beginners level.
I'm just hoping that I can get through the course. I'm curious to know what other people are doing for iteration one as well as how they're doing. Is anyone else frustrated with this programming language that has no compiler which we have gotten so used to? If I'm struggling I might be asking my classmates for help so be prepared classmates because I will probably be confused and frustrated by Wednesday.
BLOGGER UPDATE: Hey guys, I wanted to update everyone on the blogger bug that was making the comments count incorrect. They fixed it!!! I don't know what was done, but the comments have been accurate for the past week now, and I've been closely monitoring everytime I make a new comment and the numbers are all correct! This means no counting by hand! I hope everyone can make use of my application and if not, that's fine, but I know it has saved some people a lot of time. It kind of just became a challenge for me to do at one point. I started doing it, thinking it'd be cool, then I hit those problems and it became something I needed to figure out! lol
Anyway, the reason I'm posting is to talk about the noscript tag. The noscript tag is a tag used in HTML when JavaScript is disabled or not supported by a browser. This tag is very important in our class because everything we're dealing with is AJAX, so it's all JavaScript-based! If a user visits one of our AJAX-based sites without JavaScript enabled on their browser or with a browser that doesn't support JavaScript, they will not get any results. All the visitor would see on our sites would be the static information within the HTML. Obviously for sites like ours that are developed 100% around the use of AJAX, our sites pretty much become useless then. This is where the noscript tag comes into play.
The noscript tag allows the browser to display alternate information when/if JavaScript isn't enabled/supported. Using the noscript tag is extremely simple. All you need to do is type . Unfortunately, if JavaScript is disabled/unsupported on our sites, the noscript tag still won't give the results we want, but it will at least inform the user that they need to either enable JavaScript or find a browser that supports it if they want to experience the full effect and purpose of our AJAX-based websites.
The majority of the time, the text you place between the noscript tag is what determines whether or not a visitor stays at your site, or just gives up and goes somewhere else. A few important points you may want to consider in the noscript tag are to try and type as much relevant content as you can related to the thing the user is trying to view (in the case of this class, that would mean listing some sort of related information to the API the JavaScript is attempting to access) and telling the user that JavaScript is necessary to properly view this site. Sometimes it's a good idea to give short instructions to the user on how to enable JavaScript on a few popular browsers in case they aren't aware it's disabled and don't know how to re-enable it.
It seems weird to think that such a large company that employs some of the most tech savvy programmers would steal code from another company, but that is what Plurk is accusing them of. Plurk is a social networking site that claims to be "a social journal for your life". They claimed this week that Microsoft of intellectual property theft. Microsoft China recently introduced their own microblogging service called Juku, which Plurk claims is mostly code from their service. Microsoft admitted that it could have code from their site, but blamed it on an independent vendor.
You can read the blog post by Plurk that shows some similarities in code and design. Below is one of the pictures from that blog.
Even though Microsoft shut down the Juku site, at least temporarily, Plurk isn't completely happy with that. They believe that Microsoft is just placing the blame on an independent vendor so that they will not have to be responsible for the so called stolen code. This is not the first time in recent weeks that Microsoft has placed the blame on someone else. Last month they were forced to remove a Windows 7 media and administration tool from the Microsoft Store site after a violation of the GPL.
There is a lot of controversy brewing lately over the actions of Google regarding an individual's web activity. First of all, based on your prior web searches, Google is now ranking websites for you when you perform the same search the following time. In other words, if you had chosen to search for “jewelry,” the results would be displayed and you would choose the suitable choice. The next time you performed the same search, instead of the results being displayed based on “adwords,” they will be structured according to the websites you last visited when searching this same topic. This new practice takes place regardless if you are logged in or not, and Google considers it to be more of a helpful tool rather than a nuisance. This video explains this process further in depth.
In addition, the little cookies that are on the Google website also allow perspective companies to strategically place ads based on your web profile of user activity. This new cookie based personalization feature does allow users to opt out, but because of the value we place on our time and the lack of knowledge needed to execute this process, more than likely this won’t occur. Many have commented that they fear users will not discover new sites if they are continually ranked in order based on past preferences. One more thing that Google frequently does is to place search results of companies that they are in partnerships with, without disclosing that information. Google claims that they never manipulate data but some, think otherwise.
The bottom line, in my opinion, is that Google needs to take into account how others perceive what they are doing and ensure their customers that they are committed to providing them best service possible. It would be very easy for a current Google customer to switch to another search engine and not think twice about it! Who will win and who will lose is the biggest question now. I hope you have a moment to decide what you think about this new feature.
Forbes magazine recently posted an article about the year's most hacked software. Believe it or not it was not Microsoft, but Adobe. According to iDefense, 45 bugs were found in Adobe reader software this year opposed to only 14 last year. Most of the more common Microsoft programs dropped in number of bugs found. Experts believe that one of the things that make Adobe a good candidate for hackers is because of the large number of users who have Adobe reader. They also explain that the complex code causes the potential of having a high risk of flaws.
Adobe is aware of these problems with their software being targeting so they have recently decided to require a quarterly patching cycle, an idea taken from Microsoft. Adobe has decided to take a more proactive approach to finding and fixing bugs.
Some of the other companies that made the most hacked software list were Internet Explorer, Firefox, Adobe Flash, Apple Quicktime, Microsoft Office, and Windows. Cybersecurity research frim Qualys was one of the companies that Forbes used to do find out the most vulnerable software and their chief technology officer, Wolfgang Kandek, states that "wormable" quality to Windows bugs means they remain his top priority.
Some people believe that if they are only using trusted software that they will not be vulnerable to many of the bug you read about in the news, but really it is the most common software that we use that causes the hackers to be able to get into our system.
It’s a little late in the semester to post about this but it may help future IS449W students especially if Professor Drake finds this useful and decides to point it out. I was actually going to blog about this a long time ago but with everything else going on it seems to have slipped my mind. Anyway, I don’t know how many know that there is another emich server that can be used for group web projects.
The nice thing about this server is it allows every group member to have access to the group site rather than having one member use his/her people.emich.edu site. I suppose that could also be a downside because one member could potentially overwrite what someone else has done. However, I did not find that to be a problem when I last used yipe.
This site seems to have all the information contained on the people.emich.edu page but it is more to the point. So, if you know what you need, software wise, you can just go to yipe.emich.edu and download it: filezilla, Winscp, Fugu, putty, MacSSH etc.
The people.emich.edu site is a little less to the point and doesn't seem to have all the download links that yipe has.
I'm sure we have all came across a pop up window that claims that it is scanning your computer for viruses and then claims you have one. I have never trusted these pop up scanners because I never know where there come from and since I have an up to date antivirus running on my computer I always figure its some sort of scan to get people to spend money. Well recently the FBI's Internet Crime Complaint Center issued a warning stating that a majority of these are in fact scams. They state that "At best, the software is subpar. At worst, it could result in viruses, Trojans and/or keyloggers being installed on the user's computer". It is estimated that by the FBI that victims of these scams have lost more than $150 million.
The FBI recommends that you do not click on these pop ups and should in fact close your browser immediately and possibly your computer. You should also run your antivirus to make sure there is nothing on your computer.
Security FAQ's website lists ways to help you identify fake antivirus programs:
Fake anti-virus software will often find more suspicious activity on your computer than those programs that are made by legitimate companies.
The number of pop-ups you see will increase drastically, even when you are not connected to the internet.
After installing the fake anti-virus program you may notice that your computer slows down drastically due to the amount of junk that has been installed onto your system.
You may also find that your default homepage has been changed and now points to the scammer’s ‘official-looking’ site.
Words on websites are now underlined and now hyperlink to undesirable locations, such as adult sites.
Of course the best possible way to prevent these scams is to never use any of these sort of antivirus programs and use only the one you have installed on your computer.
More and more brick and mortar stores such as Walmart, Target, and others are investing in online technology allowing online purchases to be shipped to the purchaser's nearest store for local pick up. So how does an e-commerce giant like Amazon respond?
According to the website TimesOnline.com, Amazon, in response to the growing customer demand for site to store shipping from brick and mortar retailers, appears to be secretly searching for high profile properties to setup brick and mortar shops of their own. Techflash.com also sees Amazon's brick and mortar presence as a great way to show off the Amazon's kindle reader. Quoting a source from Maximumpc.com "When Amazon was just selling books and CDs that fitted easily through the letterbox it was fine to be a web-only business, but now it has branched out into everything from children's bikes to electricals it believes it could boost sales by having stores that offer a collection point for shoppers. It will probably be an Argos-sytle operation," said a source familiar with Amazon's proposals.
Depending on the markup of products for shipping to the respective stores and the cost of products being stocked in the store, I think this is a win win for consumers and Amazon. Not only does Amazon increase their business by expanding their business model but the customer gains a very respectable retailer in their community. Not to mention the creation of jobs within a jobs starved economy. With a net work of $59.1 Billion, Amazon definitely has the resources to compete in a retail market.
Colin posted about Google Wave earlier this semester, but recently Google made a change to help the collaboration site better. In an article in ITNews, Google announced that it purchased AppJet which makes the EtherPad, a real-time workgroup collaboration application. EtherPad is described as a "Web-based word processor that allows people to work together in really real-time".
EtherPad:
Unfortunately, current EtherPad customers are upset because they don't believe Google Wave will be as good as EtherPad. Customers who have the "professional" edition will be able to export their files into zip files and if they are using a "starter" edition they can export into various formats. The web based application will only be operating until March of 2010. Because of this you can no longer create EtherPad accounts with AppJet.
I think this is a smart move for Google. Their Wave has not been completely released, so it makes sense to acquire a company that has the online collaboration already figured out. Hopefully they can create an online word processing application for Google that will function the same way as EtherPad.
We all know Google currently reigns supreme in the search engine market, and recently Microsoft has introduced its own revised search engine called Bing. But where do the numbers really fall? According to Net Applications Google currently holds 84.91%, followed by Yahoo at 6.22%, Baidu (one I personally had never heard of before) at 3.28% and Bing at 3.26%. These numbers are pretty shocking and it makes sense that a couple of the largest competitors of Google would want to team up against Google.
Microsoft and Yahoo are teaming up with one another in the search engine market in the fight against Google. The deal first announced to the public on July 29, 2009 would join the two companies’ services; Yahoo search will utilize the Bing search engine and Yahoo will offer advertising for Microsoft products on its site. This is a ten year agreement that will combine the two companies resources in the search engine market in hopes of gaining sizeable market share from Google.
Both parties feel this will free up resources from other areas of development and allow them to offer new and exciting options to the public. It has an added benefit to advertisers as they will get combined advertising on both Microsoft and Yahoo search pages, allowing them not to have to choose one or the other. Microsoft and Yahoo had originally hoped to have the agreement finalized by October of 2009, but due to some unforeseen delays are now targeting July 2010. But ultimately the deal needs to be accepted and approved by the department of justice for anti-trust reasons.
This deal could pave the way for other combined services from the two companies which overall is a benefit to the consumers. And could drive Google harder as it continues to increase it’s offerings to the public.
Google continues to add to its line-up of helpful software tools for everyday use with Dictionary and Translated Search this week. These two new offerings from Google while not anything new breakthrough wise, will help keep web traffic on their site and help farther their “one-stop” resource for all things on the web.
Google Dictionary is a feature rich dictionary that can be accessed through Google’s search page or directly here. Dictionary is not just for those of us using the English language, but offers it in 27 languages including most western European, Chinese, Arabic and Korean. You can also translate individual words from one language to another. Links to other dictionaries such as Wikipedia, Princeton University and others are included so the user can cross-reference the definition with other sources. “Google's word definitions page is full of useful information including an International Phonetic Alphabet (IPA) pronunciation guide, synonyms, standard definitions, and usage examples.”
Translated search is a new feature that allows the user to search foreign language websites using the English language. They had a similar option before that would convert a foreign sites webpage into English, but this new option purposely searches only foreign sites bases on a search declared in English. This new feature has been added to the search options panel found on their search page. “Once you've got your translated search, a box at the top of the results page tells you what language the results are being translated into and what language the results are being translated from. You have the option to add other languages to expand your search; Google supports 42 choices.”
For iteration 3 I decided to add Google map markers to my existing Google map. I wanted the markers to represent information about Dogs in the Pinckney area. I added the search to my existing map and was able to input searches and get the results I wanted. However, I found that the search dialog box didn’t show up when I used Firefox! I goofed with that for a long time with no solution so I decided to start over. I grabbed the code to create a map on my page then added the search dialog and that worked with both browsers. I didn’t realize, at the time, that I was using the “local search” feature, but, after I realized that fact I figured it would be good since I wanted a local search.
My goal was to have a couple buttons that a user could click to do predefined searches. In my case they would be for Veterinarians and Kennels. And, actually, that part was easy because it was a basic feature of the local search map. However, I didn’t count on this other “default” feature: “By default, when a search completes, the search results are placed on your map and they are also listed in tabular form above the search form input.” The tabular form obliterated the map points that I was trying to show.
I spent hours looking for a clue about how to get rid of the tabular result list but I couldn’t find anything. I wasn’t even sure what to call that “feature” so it was difficult to search for answers. I finally pasted one of the map URLs into my browser and found what I was looking for.
The nice thing about adding google.maps.LocalSearch() to your Google map is that it allows you to pre-load the search so you can do (in my case) an “execute('veterinarians')” or “execute('kennels')” search by clicking on a button.
// These options will be applied to the search dialog var options = {
//This text shows in the search dialog
searchFormHint: 'Click a Button or, type here!',
// This stops the initial info window from poping up
suppressInitialResultSelection: true,
//sets the map zoom limit
zoomLimit: 13,
// This suppresses the TAB LIST that obliterates the map points!
// This creates the Search Object "mySearch" with the above options
map.addControl(mySearch = new google.maps.LocalSearch(options));
// These are the onClick events for the search buttons which use //mySearch object and the execute method
function displaySearch(search_string) {
if (search_string == "vet")
{
mySearch.execute('veterinarians');
}
else if (search_string == "kennel") {
mySearch.execute('kennels');
}
} // HTML Buttons that preform a "predefined" search when clicked
This isn't a detailed description of exactally what you need but, it may give you some ideas of what you can do with Google Maps. I was very surprised to learn how much you can do to customize your map and really amazed at all the Methods and Options.
I know that Matt just gave some useful tips in his blog about screen resolutions. I thought that I would give you a couple that I used for our group project. The first issue that we had was trying to make rounded corners for our dive so the page didn't look so boxy. There are a number of ways that you can do this and we first started off by using 2 images that sat in the background.
The problem we had is that the images were bigger than we needed them to be and if we wanted to change the width of the div we had to change the picture. The solution to the problem was to create 4 tiny images of rounded corners and create a div for them. There are many websites that will generate the images for you such as RoundedCornr and Spiffy corners. I actually used RoundedCornr to generate pictures for me then used a simple code to create it. The code was almost the same for every image. It just depended on whether it was left or right.
The other problem that we were facing was the page showing up differently when viewing from different monitors. The way that I attempted to solve this problem was instead of just using the width element, I used a min-max property. I found the idea while searching on the internet from the website CSS Tricks. The idea is that your page "shrinks to 780px to accommodates users with 800×600 resolution, with no horizontal scroll and grows to 1260px to accommodates users with 1280×768 resolution and everything in between". The CSS is actually very simple too. The code just requires two lines in your CSS:
Of course I have not been able to try if this works out because right now I only have my laptop working. I will not know until class if this solves the problem.
Google Chrome is getting ready to launch a beta version for Mac, according to an article in ComputerWorld. This is not surprising considering the success that Google has had with its Windows version of Chrome. Google states the the beta version "only has 8 bugs left" before it can release the beta version. The downfall of this is that the Mac version will not have as many features as the Windows version. Some of the most popular features that will not be in the beta version are bookmark manager, app mode, task manager, gears, and sync for Mac. There are many other features that will not be available most likely because Google still wants to be able to release their beta version of the browser by the end of the year as planned.
According to the video below by CNET, there are many reasons why some people may not want to try Google Chrome for Mac. Keep in mind, this review was done back in June when all they had was a rough developer version of the browser.
I don't use a Mac and never have so I can't say whether or not this will be a hit with Mac users. Many I presume may have their favorite browser just like Windows users do. I do think that it will become much more popular if they can offer all of the features that are available for Windows and also ones that are available through competitive Mac browsers. If you would like to be notified when the beta version is released, you can sign up at Google and they will email you when it becomes available.
Revisiting my blog counting application earlier today, created yet another source of confusion and frustration for me! Yesterday my application was working perfectly and counting all 55 of my comments. I double checked this number by going through every single post and counting by hand to confirm I had 55 as of yesterday.
Today, the number came back as 50 and after adding one more reads 51. Of course, my first assumption was that I messed something up yet again, but then I found an interesting result....
It appears that Blogger is handling some of the comments on certain posts incorrectly. If you go to Ahmed's post, you'll notice that although Blogger claims there is 5 comments on this post, only 2 show up! I immediately noticed this, because 2 of those 5 comments USED TO BE my comments.
I wanted to make everyone aware of this problem that Blogger seems to be having with comments. Yesterday, my comments showed on Ahmed's post, but today they're mysteriously missing.
Professor Drake, I think I speak for everyone when I say this: Please consider this bug when grading our comments, as this could effect some peoples' comments number! Thanks!
Update:
The comments from Ahmed's post appear to be showing up again, so I don't know if this bug was temporary or is something that will occur again...none-the-less, it's something to be aware of.
Update 2:
Checked it again, and now it's returning the correct number, and all comments are being shown...Blogger is very shaky with the comments.
Update 3:
The post immediately following Ahmed's post is giving the same results. The "Best of Both Worlds" post that Justin made has 4 comments, but occassionally only 2 are shown. It appears to be only the first and last comments for each posting.
Last night I wrapped up my work on my individual project. While I am happy that it is finished, I am disappointed that I could not get my site functioning as I originally planned. As a refresher, my site is for a tree care company and I was designing an application for users to submit a bid request. As it stands now, I pull data from the Weather Underground API and Google Calendar RSS feed and display it. The page automatically displays todays weather and the most recent event on the calendar. This would be the first thing that I would change if I had more time to work on the project. I would use a javascript calendar to dynamically display a calendar to my user so they can pick a specific date they wanted to have a bid on.
Another shortcoming for my application is how the data is displayed. I was hoping to throw the results from my API's into a equation that would display an image showing the likelihood that the bid would happen on the requested day. For example, if the calendar showed 9 appointments and the weather was forecasted as rainy, the application would return a sad face and tell the user to select another day. If it was going to be sunny and there were only 3 appointments for that day, the program would return a happy face.
Finally, I am also unhappy with the functionality of the calendar as I have implemented it. Right now I am iterating over the RSS feed from the calendar. What I needed to do was use the GCal data API to be able to download and upload data to the calendar. This requires the use of authentication which didn't appeal to me for usage by customers that wouldn't have access to the calendar.
Part of why I settled with my project as it is now is because the owner of the tree service company, a.k.a. my father, showed a lack of interest in the application. To him, he didn't like the idea of customers telling him when to do a bid. He would much prefer them send him an email telling them what they were interested in and then he would set the final date for the bid. I'll have to rethink this system to better match his business needs before spending a lot of time developing an application that would never be used!
When I read the story of Wired writer Evan Ratliff's attempt to alter his identity and hide away for a month, I was shocked at how much information his pursuant's were able to conjure up. For those of you unfamiliar with the story, Wired challenged writer Evan Ratliff to change his identity and offered a $5,000 reward for anyone that could find him, take his picture, and say the secret code "fluke". The magazines editor would place a crumb trail online of information that a detective would be able to dig up on a person i.e. bank accounts, credit transactions, social media accounts, and phone records. From this the pursuant's would try to piece together his new identity and whereabouts.
The crazy stuff people eventually tracked down about him online included: all of his previous addresses in the U.S., detailed information about his entire family, his childhood nicknames, his cats names, his favorite mechanic and authors, that he had celiac disease, his signature on a deed to his apartment in New York, and his purchasing habits. In fact a lot of this information is posted about all of us all over the web. Don't believe me? Google your name and see what comes up. For those of you that are unlucky like me and have a uncommon name, you're a pretty easy target. Sites such as www.123people.com and www.isthisyour.name scour the internet collecting information about whomever they can find. I'm sure i'll be getting Google Alerts for this blog posting in a matter of months. They are still showing up for my blog posts in Bud Gibson's (link is cached by Google) class a few years ago...
Getting back to Ratliffs story, it didn't take long for a devoted group to set out to track Ratliff down. One individual setup a web-forum where other searchers could share clues and ideas. A twitter tag was created and trackers could tweet their latest trails and data. Another person created a facebook application to try to track down Ratliff. Smart enough to know that he could use this to his advantage, Ratliff frequented the sites to see if anyone was hot on his trail or off following the diversions he created. He had a close call in Atlanta where, upon landing at the airport, he checked the twitter account and realized people where already there looking for him. Eventually his traffic to these sites would be his demise. The facebook application logged users IP addresses and the developer eventually tied Ratliff and his false identity attached to the IP address.
So did Ratliff manage to vanish in a digital age? I recommend reading the article to find out exactly what happened to him. What I will say is that it would be interesting to see what the results would be if someone kept a lower profile then he did (which was already pretty low). He did a good job avoiding traceable transactions by using cash and Visa gift cards as credit cards. But you can only last so long on cash alone. Another issue he had was the use of I.D. To really succeed at disappearing, you would need to find a way to totally create a new identity complete with new I.D.'s or just move to some remote place in the mountains.
Some people may ask why you would want to add Google Map markers into an array and I would not have a good answer. Today, however is a new day and for me I wanted to be able to add multiple markers on a map and then remove specific markers with a click of a button.
You could use the command MyMap.clearOverlays() to clear all markers at one time, but this would hinder you if you want to remove only certain markers. To remove certain markers all you need to do is add your markers into an array and then refer to that marker in the array using the command MyMap.removeOverlay(markersArray[i]). Although this looks foreign now, I will take you through adding markers and then removing them.
The first thing you want to do is add a marker into an array. Below is the code
Code Broken Down: var markersArray = []; This statement creates an array and then initializes the array with the = []. This will need to be placed outside any functions in order to create a global variable
var point = new GLatLng(42.251012,-83.625011); var marker = new GMarker(point); map.addOverlay(marker); Adds a marker to an exact point on a google map. This code is actually a repeat of the code shown in my previous post Adding a Marker to a Google Map. Please review this post if you need a refresher.
markersArray.push(marker); This statements pushes your added marker into thearray so you can reference it at a later time
For me I wanted to remove a marker from a google map. Now that I added it to my array all I need to do to reference this marker when I want to remove it from a google maps using the following command. MyMap.removeOverlay(markersArray[i])
As an added bonus, If you want to see how many markers are in your array you can use the command alert(markersArray.length);
I have incorporated this into my group project and will show the functionality at work during our presentation.
A lot of us have already blogged about a bunch of different JavaScript libraries and tools, but I found another tool which looks quite intriguing and I thought I'd blog about it to share my findings with the rest of you. After speaking with quite a few people from our class who have very limited or no prior experience with JavaScript, I decided to look into more helpful tools. A few different guys have told me they have found useful books teaching JavaScript which have helped them learn it better, and while the best way to learn it is to read up on it and keep practicing it, hopefully this tool, called Blackbird, can be helpful as well.
Blackbird is an "Open Source JavaScript Logging Utility" that does just that; logs information regarding your JavaScript. This tool is more beneficial for those of us who already understand JS well enough to write a decent amount of code without much trouble. Essentially what it does is places a small black window on your screen that pops up different messages related to your JS code upon execution. It is the ultimate replacement to the alert() command, allowing you to not only alert things right within the Blackbird interface, but also allowing you to choose what type of an alert it is. It offers options for 'debug,' 'info,' 'warn,' 'error,' and 'profile.' By using the different options you can quickly see what the status of a message is and even toggle between the different categories to show only certain messages at a time.
To add Blackbird to your page, all you have to do is download a JS and a CSS file from their site, upload them to your server, then include a reference to them in the head of the page you want to use Blackbird on, like in the image below.
Blackbird also has some neat features built into it that allow you to position it in different locations throughout your page as well as allowing you to toggle it on or off. As you can see from the site, it is compatible with nearly all the common browsers, including Internet Explorer 6+, Firefox 2+, Safari 2+, and Opera 9.5. Check it out!
On a similar note to my last post about W3C's validation standards on the Web, I decided to talk a little bit about different screen sizes and resolutions. Designing layouts for the Web is always tricky because of the many different screen sizes and resolutions people use out there today. I'm sure Professor Drake and I aren't the only ones who would love to have their 42+ inch flat-panel TV double as a huge computer screen! Many people would enjoy this, and some people have already found ways to do it, including DVI, VGA, AV, and Component cables. The point is, even though the majority of people don't browse the Internet on their TV screen, the vast amount of different sized screens with different resolution possibilities is still very large throughout the number of possibilities today. Multiple screens, resolutions, and even different browsers all play a factor into how users are presented with Websites.
While I don't have the ultimate solution to these issues, hopefully I can explain a little bit of how to plan some of your design work so that it looks the same on as many different browsers and screens as possible. As Professor Drake has already emphasized in this class, making projects work with Internet Explorer as well as Firefox is rather crucial. Unfortunately, just because your code may work on both of these browsers, doesn't mean other browsers will display it as you'd expect or want it to. One of the best and easiest ways to ensure clients will see your Website as you want it to be displayed is by testing it thoroughly once you have gotten it to a point where you're satisfied with it. An excellent tool for testing sites in many different browsers is http://browsershots.org/. This site also allows you to specify common settings that an end-user who is browsing your site might have. Options for different screen sizes and color depth, as well as whether or not JavaScript, Java, or Flash are enabled by the user can all be adjusted to test your project. The site contacts multiple virtual machines based on the parameters and browsers you specify then returns screenshots of what your Website looks like within each of those environments. The process can take quite a while sometimes, but it is an excellent tool for testing your work.
Beyond simply relying on that site, there are some things that you should know when coding Websites that will allow you to get results you want on most users' screens. I remember Colin posting something a while ago about a fluid layout, using percentages to position your divs throughout the HTML rather than static measurements. This can be very useful, but can still be a little unpredictable sometimes depending on the browser and operating system being used by the user. Percentages can also be hard to use when displaying a background image as part of your layout. I used to always code with percentages, until I came across these types of problems in positioning my content over my background images and keeping the same look once the screen got resized on or viewed on different sized monitors. An example of this can be seen on Terry's individual project. His layout looks really neat on a standard resolution and non-widescreen monitor, but when you view it on a widescreen, and maximize the browser, you notice that the content adjusts to the size of the browser due to the percentages he has set to them, but the background image remains the same size. Terry, please realize that I'm not criticizing your work in any way, I'm simply trying to show the differences in different screen sizes and the occasional issues that percentages can cause. While the site still works perfectly when the screen is resized, the layout of it doesn't quite line up as neatly as it did when it was the original size. One common approach used by most professionals is the process of wrapping content within other divs in order to position things as needed using CSS, and ensure they display the same way despite user preferences and screen sizes. A simple example showing some text wrapped in a div, within a larger div can be seen throughout EMU's web pages:
The use of, what I'd describe as, "parent divs" or "div wrappers" are really the key to properly positioning elements throughout your HTML. Not only do these processes ensure much more accurate results for the user, but they also ensure proper validation among the W3C standards. One more crucial point to mention regarding sizes and positioning is the use of background images. I've seen a few projects using a background image within the HTML and while it looks great in the native resolution of a certain computer, it doesn't look right when viewed on some other screens that are larger or smaller or have a different resolution. To get the best results with background images, try to find/create images that are big enough to fill a larger monitor, but not too big, that a user with a smaller monitor won't see any of the details of the image. I could go on about this in greater detail, but I'm sure most of you have already stopped reading at this point anyway, so I'll leave it at that! :) I hope this post is somewhat informative and makes sense to those who read it. The idea of different resolutions and screen sizes is an important issue to be aware of when creating Websites, and the more you test your work on different environments, the less likely you will be to have dissatisfied visitors to your sites.
