JavaScript is the most popular scripting language on the Internet due to it's wide acceptance with all major browsers. If you stumble across this blog and you don't have an understanding of HTML and CSS then my suggestion is to start learning those two languages first and then dabble with JavaScript. Either way, let's dive into JavaScript and cover some basics on its capabilities and how it is coded.
What can JavaScript do for your web pages? Well first and foremost JavaScript was designed for the purpose of adding interactivity to web pages. JavaScript can be embedded right into HTML pages. Specifically, a few examples of what JavaScript can do is react to events, validate data such as forms (like a form you fill out on a website asking for certain information), and create cookies. One important thing to remember about the difference between HTML and JavaScript is that JavaScript is case sensitive whereas HTML is not.
To insert JavaScript into an HTML file you use the <script> tag. Advancing on this you will typically write:
<script type="text/javascript">
....some javascript code....
</script>
Whatever is contained between the opening <script> and closing </script> tags is what is executed by the browser when the page is loaded. But what if we don't want JavaScript to execute right away, rather we want it to execute when an event occurs. An event could be when a user clicks a button. If this is the case then we need to add a function inside of our <script> tags:
<script type="text/javascript">
function displayDate ()
It is common to put any JavaScript that involves functions within the <head> tags of an HTML document. This makes for better organization and also ensures that the JavaScript will not interfere with the page content between the opening and closing <body> tags.
Next I just want to quickly mention JavaScript statements and what is referred to as Javascript Code (or simply JavaScript). A JavaScript statement is kind of what it sounds like. It is a command to a browser. For example, the following line of code would tell the browser to write "Hi I'm Jordan" onto the web page:
document. write("Hi I'm Jordan");
Javascript Code is a sequence of multiple JavaScript statements. For example:
<script type="text/javascript">
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
document.write("<p>This is another paragraph</p>");
</script>
This is merely scratching the surface of JavaScript and how important is to web design and development. I simply wanted to introduce you into what JavaScript is and show you a few examples of what the Javascript language looks like. I'm definitely at the beginner spectrum of JavaScript myself so I feel your pain if you are thinking JavaScript is "another programming language I have to learn ON TOP of HTML and CSS". There are tons of resources out there to help you begin your quest with JavaScript. One site I recently registered for was www.codeacademy.com. Let me know what you think, I would love to hear some of your comments with regards to JavaScript or my blog in general!
Tuesday, April 10, 2012
Sunday, April 8, 2012
15 Web Design and Development Trends for 2012
I recently stumbled across an article by Craig Grannell that discussed some trends that web industry professionals are forecasting for the year 2012. I felt that this article fit in really nice with what I am trying to accomplish with my blog and be a resource for people interested in web design and development.
There is no doubt about it that 2012 is going to be a hectic year for the web. Industry professionals are predicting a turbulent year as mobile devices and desktops battle as well as brand new innovative ways emerge to represent content digitally. Let's take a look at the 15 topics discussed in Craig's article.
1. Progressive Enhancement
These new technologies that are swarming the web will become more and more accepted. I'm talking about HTML5, CSS3, and mobile devices. Basically there will be more of a rush than ever to embrace the "shiny new" says Grannell.
2. Responsive Design
This term relates to how a design for the web for example will appear when it is shrunken down and viewed on maybe a tablet, and then maybe even shrunken down farther when it is viewed on a mobile device. This is referred to as how as how "fluid" a design is. Design for 2012 will need to look past screen size dimensions and put additional focus on how content will be displayed at multiple different resolutions and sizes.
3. Flash Will Survive
The year 2011 talked a lot about the demise of Flash (one of my previous blog posts). Some industry professionals made comments in the article that while web developers and designers are continuously caught up in HTML5 and CSS3 due to the hype, they will come to the conclusion that Flash still is the predominant tool to create engaging experiences online due to its extremely large acceptance in the online community.
4. Native Support for Plug-In Features
This is talking about a push for individual browsers to increase browser-native features and power with regards to HTML5.
5. Appification Takes Hold
As one could expect, professionals are predicting more high-quality and high-performance games running on browsers. They also feel that the year 2012 will have designers thinking more about tablets and screen interaction elements. Design could now live between "point and click" and "touch and swipe" states the article. One could also expect that 2012 will be huge for apps. The article talks about how in this year we will start to see apps adopt the merging of Android and iOS with HTML5 to create exciting user experiences .
6. Web App Fragmentation
This section of the article dealt with apps and how although they will definitely see an increase in 2012, these apps will be fragmented on the web. For example, there has already been examples of "Chrome-only" apps. This isn't a positive thing developers or consumers.
7. Mobile gets bigger
Mobile traffic usage and traffic of course are predicted to sky rocket in 2012. Peter-Paul Koch believes that in terms of market share mobile browsing will exceed 10% this year. That's pretty significant for mobile devices. They are definitely something to keep an eye on in 2012
8. A Device Explosion
Tablets and mobile devices will flood the market. Not simply just the iPad, a handful of more inexpensive devices are expected to increase meaning designers/developers are going to have to get their hands on more devices to double check for compatibility of their sites.
9. Respect Beyond Aesthetics
Designer and illustrator Geri Coady notes in this section that she thinks that, "2012 will find more designers and clients understanding that appearance alone isn’t everything: “We should treat style, content, and behaviour with equal respect – they must work together to strengthen the meaning and personality of a site, app, or brand."
10. Social Battles Heat Up
Professionals think that Facebook will continue to lead the social media revolution in 2012, however a number of start ups as expected will gain attention as they have been as of late. There is also speculation around the idea that Facebook will offer tools in the near future to actually "create a a site" instead of just a page to really attract their fan base.
11. Growth of the Two-Screen Model
TV companies can't afford to not be more aware of competition in the living room. In 2012 it is predicted that TV programs will have an increase in output for lively content to mobile devices.
12. Distributed Workforces
In today's times many designers and developers have been able to find work from their bedroom, Starbucks, etc. In 2012 talented designers may continue this trend of not working in the standard cubicle which could focus organizations to change the way they search for talent and once they find it adjust their organization culture based on these creatives' past tendencies.
13. Stronger Customer Service
Web designers more than ever will gain a strong understanding that they do more than just design websites, rather they need to understand they are providing a service for a client. Web designers/developers think more about their online users and how they will interact with the site, when in reality the actual client is equally as important.
14. Better Value, Not Lower Prices
Industry professionals stated in this section of the article that the web design industry is "on a continuous march towards professionalism". There is an increase in the need for web designers and developers to not cut corners and focus on truly providing an exceptional service for their clients.
15. Pushing the Boundaries
HTML5 and CSS3 increased acceptance is the main thing that we will see an increase in in 2012. Designers and developers will experiment and showcase the potential this technology has. Thinking outside of the box and embracing new ways of doing things were two things mentioned in this section of the article. The future is bright.
This talk about web design and development for the current year is especially exciting to me due to the fact I am graduation from the University of Northern Iowa in May. As I continue to work on my skills in this field and read articles like this it really ignites my enthusiasm to become involved in the industry.
There is no doubt about it that 2012 is going to be a hectic year for the web. Industry professionals are predicting a turbulent year as mobile devices and desktops battle as well as brand new innovative ways emerge to represent content digitally. Let's take a look at the 15 topics discussed in Craig's article.
1. Progressive Enhancement
These new technologies that are swarming the web will become more and more accepted. I'm talking about HTML5, CSS3, and mobile devices. Basically there will be more of a rush than ever to embrace the "shiny new" says Grannell.
2. Responsive Design
This term relates to how a design for the web for example will appear when it is shrunken down and viewed on maybe a tablet, and then maybe even shrunken down farther when it is viewed on a mobile device. This is referred to as how as how "fluid" a design is. Design for 2012 will need to look past screen size dimensions and put additional focus on how content will be displayed at multiple different resolutions and sizes.
3. Flash Will Survive
The year 2011 talked a lot about the demise of Flash (one of my previous blog posts). Some industry professionals made comments in the article that while web developers and designers are continuously caught up in HTML5 and CSS3 due to the hype, they will come to the conclusion that Flash still is the predominant tool to create engaging experiences online due to its extremely large acceptance in the online community.
4. Native Support for Plug-In Features
This is talking about a push for individual browsers to increase browser-native features and power with regards to HTML5.
5. Appification Takes Hold
As one could expect, professionals are predicting more high-quality and high-performance games running on browsers. They also feel that the year 2012 will have designers thinking more about tablets and screen interaction elements. Design could now live between "point and click" and "touch and swipe" states the article. One could also expect that 2012 will be huge for apps. The article talks about how in this year we will start to see apps adopt the merging of Android and iOS with HTML5 to create exciting user experiences .
6. Web App Fragmentation
This section of the article dealt with apps and how although they will definitely see an increase in 2012, these apps will be fragmented on the web. For example, there has already been examples of "Chrome-only" apps. This isn't a positive thing developers or consumers.
7. Mobile gets bigger
Mobile traffic usage and traffic of course are predicted to sky rocket in 2012. Peter-Paul Koch believes that in terms of market share mobile browsing will exceed 10% this year. That's pretty significant for mobile devices. They are definitely something to keep an eye on in 2012
8. A Device Explosion
Tablets and mobile devices will flood the market. Not simply just the iPad, a handful of more inexpensive devices are expected to increase meaning designers/developers are going to have to get their hands on more devices to double check for compatibility of their sites.
9. Respect Beyond Aesthetics
Designer and illustrator Geri Coady notes in this section that she thinks that, "2012 will find more designers and clients understanding that appearance alone isn’t everything: “We should treat style, content, and behaviour with equal respect – they must work together to strengthen the meaning and personality of a site, app, or brand."
10. Social Battles Heat Up
Professionals think that Facebook will continue to lead the social media revolution in 2012, however a number of start ups as expected will gain attention as they have been as of late. There is also speculation around the idea that Facebook will offer tools in the near future to actually "create a a site" instead of just a page to really attract their fan base.
11. Growth of the Two-Screen Model
TV companies can't afford to not be more aware of competition in the living room. In 2012 it is predicted that TV programs will have an increase in output for lively content to mobile devices.
12. Distributed Workforces
In today's times many designers and developers have been able to find work from their bedroom, Starbucks, etc. In 2012 talented designers may continue this trend of not working in the standard cubicle which could focus organizations to change the way they search for talent and once they find it adjust their organization culture based on these creatives' past tendencies.
13. Stronger Customer Service
Web designers more than ever will gain a strong understanding that they do more than just design websites, rather they need to understand they are providing a service for a client. Web designers/developers think more about their online users and how they will interact with the site, when in reality the actual client is equally as important.
14. Better Value, Not Lower Prices
Industry professionals stated in this section of the article that the web design industry is "on a continuous march towards professionalism". There is an increase in the need for web designers and developers to not cut corners and focus on truly providing an exceptional service for their clients.
15. Pushing the Boundaries
HTML5 and CSS3 increased acceptance is the main thing that we will see an increase in in 2012. Designers and developers will experiment and showcase the potential this technology has. Thinking outside of the box and embracing new ways of doing things were two things mentioned in this section of the article. The future is bright.
This talk about web design and development for the current year is especially exciting to me due to the fact I am graduation from the University of Northern Iowa in May. As I continue to work on my skills in this field and read articles like this it really ignites my enthusiasm to become involved in the industry.
Sunday, April 1, 2012
Adobe Flash and Interactivity for Web Pages
We've all seen the message you receive when you stumble across a web page and there is supposed to be a video that begins playing however in your case it doesn't because you the message you are receiving states, "You need to upgrade to the latest version of Flash". In this blog post I want to discuss what exactly is Adobe Flash, it's applications and how it benefits web design/development, and also the future of Flash as it battles HTML5 and others who have a hatred for it.
Adobe Flash simply put is a multimedia platform that is typically used to add animation, video, and interactivity to web pages. Adobe Flash has the ability to capture user input and even runs off of its own language, ActionScript. Flash manipulates both vector and rastor graphics to provide animation of images and text.
Adobe Flash simply put is a multimedia platform that is typically used to add animation, video, and interactivity to web pages. Adobe Flash has the ability to capture user input and even runs off of its own language, ActionScript. Flash manipulates both vector and rastor graphics to provide animation of images and text.
But just what can Adobe Flash do for your website? Take a look at this awesome example of a site that uses Flash:
http://www.proyectiva.com/.
Pretty cool stuff. Obviously a site like this is far more interactive and fun to play around with than a website that simply has standard links, images, and text. On top of videos Flash is a common tool used to create games that can add interactivity to your website. One important thing to keep in mind when using Flash with your website is bandwidth issues. If a lot of Flash is used it can really slow down your site and frustrate visitors. Use Flash when it will be the most effective is generally a good rule of thumb.
With all of the hype surrounding HTML5 one topic that is always brought up is the issue of whether HTML5 will eventually replace Adobe Flash down the road. Here is an infographic that highlights some statistics relating to HTML5 and Flash:
http://venturebeat.com/2012/01/31/html5-versus-flash-infographic/
It is obvious that at this point in time that Adobe Flash has the edge on HTML5. But will this advantage begin to shift in the upcoming months as HTML5 becomes more and more accepted? As of recent the World Wide Web Consortium (W3C) actually replaced the need for Flash all together. In response to this Adobe has announced that it plans to introduce a new product titled Edge that supposedly is software that is being developed to combine the powers of HTML5, CSS, JavaScript, and the Canvas tags that have been introduced with HTML5. It will be interesting to monitor the battle between these two in the upcoming months and see if anything major results. As for now Flash is still the dominant player and it appears that it isn't going away completely any time soon.
http://www.proyectiva.com/.
Pretty cool stuff. Obviously a site like this is far more interactive and fun to play around with than a website that simply has standard links, images, and text. On top of videos Flash is a common tool used to create games that can add interactivity to your website. One important thing to keep in mind when using Flash with your website is bandwidth issues. If a lot of Flash is used it can really slow down your site and frustrate visitors. Use Flash when it will be the most effective is generally a good rule of thumb.
With all of the hype surrounding HTML5 one topic that is always brought up is the issue of whether HTML5 will eventually replace Adobe Flash down the road. Here is an infographic that highlights some statistics relating to HTML5 and Flash:
http://venturebeat.com/2012/01/31/html5-versus-flash-infographic/
It is obvious that at this point in time that Adobe Flash has the edge on HTML5. But will this advantage begin to shift in the upcoming months as HTML5 becomes more and more accepted? As of recent the World Wide Web Consortium (W3C) actually replaced the need for Flash all together. In response to this Adobe has announced that it plans to introduce a new product titled Edge that supposedly is software that is being developed to combine the powers of HTML5, CSS, JavaScript, and the Canvas tags that have been introduced with HTML5. It will be interesting to monitor the battle between these two in the upcoming months and see if anything major results. As for now Flash is still the dominant player and it appears that it isn't going away completely any time soon.
Monday, March 19, 2012
Designing for the User
So let's say you've came up with this real spiffy layout that looks very modern and slick. That's great, but is it enough? The answer is no. The real drive behind any website design needs to keep the end user in mind throughout the ENTIRE process. How hard will it be for someone to move around the site? If the answer is "not very easy" then those users will probably not stick around very long and probably won't come back either. The definite bottom line: Think in terms of your potential customer at all times and how that user will experience your site.
Here are some helpful things to keep in mind when designing a website that will increase user experience:
This list is obviously not all there is to creating a good user experience on your site, but it is a good start. I have found that wireframes are a good way to organize the sequence of pages that could potentially occur within your site. Drawing these out and actually visually observing where a potential user online could all go can be very helpful. They say the customer is always right, and that is true for the online world as well. Always keep them in mind so they will want to keep coming back again and again!
Here are some helpful things to keep in mind when designing a website that will increase user experience:
- Write in the second person and write content that deals with their needs/problems and how you can solve them. This keeps the focuson the user.
- Map out the site for them! By this I mean help the user understand where they are at all times within the site. You all know from experience how deep you can get into a website and how confusing it can be to get back to one certain area you are trying to re-locate. One method web designers use to solve this is breadcrumb navigation, which basically means there is a clickable link usually at the top of the screen for each of the previous spots the user came from.
- Call to Action. Clearly state what you want the user to do with a call to action button. This helps guide them through the process. Use active words like "now" or "go".
- Simply put, don't make your potential customer think. Fine tune the site as much as possible so that it is straightforward and obvious. Confusion leads to customers leaving frustrated.
- A clean navigation. The buttons located at the top of the site should be simple and direct. Start broad and get more specific deeper into the site. A good example is for a dealership to have a navigation button for "cars" and a seperate button for "trucks" and so on.
- Make sure all links work! Imagine you have gone through the entire checkout process and when you go to click "order" the button accidentally takes you back to some random page and you lose all your data you have entered. Not good.
- Use appropriate title tags and alt tags. Title tags are what appear on your browser screen for each page and alt tags are what appear if you scroll your mouse over an image, link, etc.
This list is obviously not all there is to creating a good user experience on your site, but it is a good start. I have found that wireframes are a good way to organize the sequence of pages that could potentially occur within your site. Drawing these out and actually visually observing where a potential user online could all go can be very helpful. They say the customer is always right, and that is true for the online world as well. Always keep them in mind so they will want to keep coming back again and again!
Monday, March 5, 2012
Wordpress: More than a Blogging Tool
Wordpress was started by Matt Mullenweg in 2003. What started off as a standard blogging and CMS (content management system) has come a long ways in its short life, primarily in its effects on the web design world. Wordpress is now a full featured web site creation tool. It truly ranges from standard blogs to professional looking websites, and everything in between. Wordpress functions sort of like the backbone of your website due to the fact it is an open-source software. This means that the code and files on wordpress are open to the user to customize and enhance to the user's liking.
The meat behind Wordpress is its extensive template and plugin system. These hundreds of themes and plugins allow for almost unlimited creativiy and customization. This link from tripwire magazine highlights 35 plugins they consider crucial for a succesful blog or website.
TripWire Plugin Article
One obvious disadvantage to Wordpress and to a web designer/developer is that if you use wordpress alone you do not own your domain name. What I mean by this is that if you were to create a site on Wordpress the URL to your site would be something like 'jordanmarshallwebdesign.wordress.com'. Now Wordpress does offer you the option to purchase a unique domain name, and I believe the cost on this was something around 12-20 dollars per year, which isn't terribly expensive.
I have only done minimal research on Wordpress as of right now and I have some questions regarding how it really stands up against traditional professional web design/developing standards using Dreamweaver, Photoshop, and NotePad. It does sound like an exciting service though does have a ton of real world value, it's just that it feels like creating something on Wordpress has less luster than creating a visually stunning website from scratch and giving the creator the peace of mind knowing they did everything on their own and didn't have to use any pre-built templates or things of that nature.
The meat behind Wordpress is its extensive template and plugin system. These hundreds of themes and plugins allow for almost unlimited creativiy and customization. This link from tripwire magazine highlights 35 plugins they consider crucial for a succesful blog or website.
TripWire Plugin Article
One obvious disadvantage to Wordpress and to a web designer/developer is that if you use wordpress alone you do not own your domain name. What I mean by this is that if you were to create a site on Wordpress the URL to your site would be something like 'jordanmarshallwebdesign.wordress.com'. Now Wordpress does offer you the option to purchase a unique domain name, and I believe the cost on this was something around 12-20 dollars per year, which isn't terribly expensive.
I have only done minimal research on Wordpress as of right now and I have some questions regarding how it really stands up against traditional professional web design/developing standards using Dreamweaver, Photoshop, and NotePad. It does sound like an exciting service though does have a ton of real world value, it's just that it feels like creating something on Wordpress has less luster than creating a visually stunning website from scratch and giving the creator the peace of mind knowing they did everything on their own and didn't have to use any pre-built templates or things of that nature.
Monday, February 27, 2012
Job Outlook for Web Developers
Today I stumbled across an article online that talked about the job outlook of Web Developers for 2012 and beyond. The article, which was from usnews.com, currently has the job title of Web Developer as the number 6 on the "Top 10 Jobs for 2012". I'll take it. Let's take a look at what exactly this article by Katy Marquardt had to say.
First, the article talked about some basics of what a web developer actually does. I think the most important statement that Katy makes is that really a web developer does more than create more than visually-appealing and user friendly websites, but that they must take into account a client's products or services as well as that client's target market so that the design and functionality is reflected to portray that target audience.
The outlook looks real promising according to Katy for web developers. She states that the Bureau of Labor Statistics projects nearly a 22% employment growth between 2010 and 2020, resulting in that time from the need for over 65,000 jobs to be filled. The Bureau of Labor Statistics that web developers made a median salary of $75, 660 in 2010, with the lowest-paid developers still earning $43,190 that same year. That's comforting to me and really motivates me to continue to teach myself web design and development so I can obtain a well-paying, satisfying career.
The remainder of the article talks about how networking is important in landing that first web developer job, but so is showcasing your abilities. This is something that is a constant battle for me as I continue to attempt to teach myself to professionally develop websites. On a lighter note, Katy asks someone about what one can expect on a daily basis in the field of web development. The person's response is that:
First, the article talked about some basics of what a web developer actually does. I think the most important statement that Katy makes is that really a web developer does more than create more than visually-appealing and user friendly websites, but that they must take into account a client's products or services as well as that client's target market so that the design and functionality is reflected to portray that target audience.
The outlook looks real promising according to Katy for web developers. She states that the Bureau of Labor Statistics projects nearly a 22% employment growth between 2010 and 2020, resulting in that time from the need for over 65,000 jobs to be filled. The Bureau of Labor Statistics that web developers made a median salary of $75, 660 in 2010, with the lowest-paid developers still earning $43,190 that same year. That's comforting to me and really motivates me to continue to teach myself web design and development so I can obtain a well-paying, satisfying career.
The remainder of the article talks about how networking is important in landing that first web developer job, but so is showcasing your abilities. This is something that is a constant battle for me as I continue to attempt to teach myself to professionally develop websites. On a lighter note, Katy asks someone about what one can expect on a daily basis in the field of web development. The person's response is that:
"Web development is very exciting, demanding, and fun. You have the best of both worlds, where you get to exercise your creativity and have the exacting demands of coding. You always have to be learning and have the ability to learn on the fly."
That job description in combination with the potential starting salary for a web developer position will drive me internally throughout this semester to do everything I can on my part to become a future master of the web. I want to prove to myself and to others what is possible to be taught on your own, in your own free time if you put your mind to it.
link to Katy's article: 2012 Web Development Outlook
link to Katy's article: 2012 Web Development Outlook
Monday, February 20, 2012
CSS: Making Webpages Attractive
I previously wrote a blog that barely skimmed the surface of HTML and now I would like to attempt another blog at what really gives HTML it's appearance that you see on the web today: CSS. CSS stands for Cascading Style Sheets. The styles of CSS define how to display HTML elements. Typically CSS files are saved as a seperate style sheet that is linked with an HTML file. One of the major benefits of using CSS to style your HTML files is that by updating a CSS stylesheet this update can affect the appearance/layout on all of the pages that make up a site, making CSS a huge time saver!
There are two basic parts to CSS syntax: Selectors and declarations. The selector typically is the HTML element you want to style, so for example if you remember from the HTML blog we could use CSS to set the appearance of a paragaph element <p> with <p> being the selector. Each declaration for a selector has two parts, a property and a value. Here is an example of a declaration: color:blue;. Color is the 'property' and blue is the 'value'. Typically when someone is writing code for a CSS stylesheet they write each declaration on a separate line, resulting in the following appearance:
p
{
color:blue;
text-align:center;
}
These selectors and declarations can be broken down a little more due to the fact CSS actually lets you specify your own selectors. Id selectors are used to specify a style for a single, unique element, and denoted by a "#". For example:
#topText
{
text-align:center;
color:red;
}
There are also class selectors, which are used to style a group of elements. Class selectors allow you to set a particular style for many HTML elements with the same class, and is denoted with a "." For example:
.center {text-align:center;}
There are three ways to insert CSS into your HTML code. The three ways are by using external style sheets, internal style sheets, and inline styles. External style sheets are best used when there are numerous pages for a website that are styled. External style sheets utilize the <link> tag to link to an external style sheet (an external style sheet is saved as a file with a .css file format). Internal style sheets utilize the <style> tag and are primarily used when an individual web page has a unique style. Inline styles are advised to only use sparingly. I recommend you to read up more on stylesheets as I have just covered the very basics here.
In conclusion, CSS makes your websites sexy! CSS is a huge time saver and when done properly can save a web designer/developer a ton of time when it comes to adding styles to text, paragraphs, background colors, etc. There are tons of tutorials out there on CSS and I encourage you to check them out for futher details!
There are two basic parts to CSS syntax: Selectors and declarations. The selector typically is the HTML element you want to style, so for example if you remember from the HTML blog we could use CSS to set the appearance of a paragaph element <p> with <p> being the selector. Each declaration for a selector has two parts, a property and a value. Here is an example of a declaration: color:blue;. Color is the 'property' and blue is the 'value'. Typically when someone is writing code for a CSS stylesheet they write each declaration on a separate line, resulting in the following appearance:
p
{
color:blue;
text-align:center;
}
These selectors and declarations can be broken down a little more due to the fact CSS actually lets you specify your own selectors. Id selectors are used to specify a style for a single, unique element, and denoted by a "#". For example:
#topText
{
text-align:center;
color:red;
}
There are also class selectors, which are used to style a group of elements. Class selectors allow you to set a particular style for many HTML elements with the same class, and is denoted with a "." For example:
.center {text-align:center;}
There are three ways to insert CSS into your HTML code. The three ways are by using external style sheets, internal style sheets, and inline styles. External style sheets are best used when there are numerous pages for a website that are styled. External style sheets utilize the <link> tag to link to an external style sheet (an external style sheet is saved as a file with a .css file format). Internal style sheets utilize the <style> tag and are primarily used when an individual web page has a unique style. Inline styles are advised to only use sparingly. I recommend you to read up more on stylesheets as I have just covered the very basics here.
In conclusion, CSS makes your websites sexy! CSS is a huge time saver and when done properly can save a web designer/developer a ton of time when it comes to adding styles to text, paragraphs, background colors, etc. There are tons of tutorials out there on CSS and I encourage you to check them out for futher details!
Subscribe to:
Posts (Atom)