coordinates in an area tag - html

So I've started a web design course about 4 months ago, it's going smoothly and I'm really enjoying it. I'm trying to learn more in my own time and found tag while searching for something similair.
I don't fully understand it, but I think I get the grasp of it, so basically I'm asking if what I think the cords do is correct.
coords="x1,y1, x2,y2"
Does that create a box, which I can then use a so when it's pressed linked to another page?

I think you're a bit confused.
This function won't perform any doing. In fact, all that is a 'string'. Meaning, if you refer to cords, you will just find 'x1,y1, x2,y2' as the value.
If you're interested in linking content, use 'a' tags. Also, if you'd like to create a nice box, you're going to need some styling knowledge. Remember, as a web designer you create content for the web developer to put together. If you're looking into making the sites, look for a course in 'Web Development'.

Related

HTML to WordPress

I've never used WordPress.org before. I'm wondering if I can convert this html website that I have to wordpress exactly the same?
https://reporting.pacificamerican.org/pas/
And if this website is a wordpress site, does it means that I don't have to go into the codes if I want to update my content? Because right now with html site it takes more time to update all the contents.
Thank you.
Yes, you can, but looking at the content I wouldn't say it looks like a great idea. Mostly because of how static the current content seems to be.
Pros:
It looks like you are about to add a blog-page. WordPress does make such re-occuring content easy.
It looks like you have repeated the menu on every page. (If you change the menu on one page, then you have to makes changes to all pages as well?). WordPress would help with that and let you use one menu everywhere. But there are also tons of easier methods to accomplish the same thing without WordPress. (For example <?php include 'menu.php';?> using PHP).
Cons:
The "multiple sub-pages in one page" that you are using doesn't play naturally with WordPress. Absolutely possible yes, perhaps not even difficult, but not out-of-the-box for sure.
The time it would take to edit pages would likely not change as drastic as you hope. I believe that the current content looks so static that anyone with a bit HTML/CSS knowledge would rather want to edit those static html files over having to click around in the WordPress admin interface.
The scroll-spy, editing tables and things like the yearly admissions does not come naturally either. I can think of a few dozen ways to solve such things with WordPress, but if you are going to do this work yourself, then the WordPress-conversion will take some effort and the results will not always be as pretty as you might imagine.
You'll definitely take a performance hit over using only static html. (But that is true for any CMS/framework)
My suggestion would be to first look at your current workflow. Perhaps look at an IDE that can upload with a click or on save, have history so you can back up when things break, and predefined snippets that make static content changes easy, (and of course code syntax highlighting!).
What tools are you using now?
Also remember that you are asking on a coding-site. Not many here would opt to use the WordPress editor over simply editing html-files. In fact, I dare to say many here carries a deep grudge after having to work around some specific quirks in the WP editor (aka tinyMCE).
Sure, you could replicate the layouts.
Sure, your content would be editable with just a form.
It would take a lot of effort, but certainly doable.

identifying a website feature

Sorry for the vague title.
I am trying to identify a feature that I have been seeing on lots of websites lately.
It is some type of animation that freelancers use when they say something like "projects worked on" or "hours spent coding" then there will be a counter that starts from 0 then increases to a number, say 64, and also a circle may start to form or some kind of load bar that accompanies the rise in number.
I'm very sorry if this question is in the wrong place, I would be very happy if somebody could advise where I could find more information about this subject.
and example is at jamesdowen .com
This is what you're looking for: http://anthonyterrien.com/knob/
Though I must say, I don't recommend it to have on your portfolio as it shows vague stats. Graphs are good to use if you can use it to show correctly.
You're looking for jQuery Knob
Google it, or just start here: http://anthonyterrien.com/knob/

How do i code a scrolling window to stay at a certain link per page

On this page, I want to get my scrolling dinosaur name window to specifically keep that dinosaurs name at the top so the person doesn't have to scroll all the way down to the next dinosaur.
I also want to know if there's an easier way to do this window.
My predicament is this....
I have over 30 dinosaurs on here. Each time I add a new one I have to update each and every one of the dinosaurs pages to add that one new dinosaur. Its not really time effective... Is there a better way without having to use frames?
My code is open so you can look at it and modify it at your leasure.
Thanks!
Vince
At this point I would suggest you go for server side code. Since you have 30 dinosaurs, it would be much easier to create and maintain a simple page using server side scripts such as PHP or ASP.NET to load the dinosaur from a database.
What are server side scripts?
Server side scripts allow you to dynamically generate a page on the fly whenever the user requests a page. For example, take youtube's search page. Rather than generate a seperate page for every single possible search term, they simply have a base template there, and then they fetch the relevant results based on the search query. The same can be applied to your site. You can have one page for all the dinosaurs, and you would just load the appropriate dinosaur based on the url.
Once you do that, putting the current dinosaur at the top of the page would be a trivial task. Since it appears that you already have a fair amount of knowledge in HTML, it should be easy for you to pick up and use some PHP. Codecademy has some excellent tutorials.
Along the same lines as Kevins answer but more specifically I'd like to recommend you look into a PHP MVC framework such as CakePHP, Laravel or CodeIgniter.
You've done all the hard work manually building these pages, which is awfully time consuming.
Once you learn one of these frameworks and you'll rebuild this site in a day.
If your links had id attributes on them you could scroll the list to a position by linking to #whatever. Here's a quick code example of a link.
<li id="camarasaurus">Camarasaurus</li>
Here's a small example: http://jsbin.com/ExExEvAB/1/edit?html,css,output
As for making it easier to administrate, I'd look into PHP since it's widely available and there's tons of resources to learn from. When you're basically looking for is <?php include "dinosaur-menu.html" ?> since you're thinking in terms of frames. You can make it even easier but this alone should make it a ton easier to update.
I really started to enjoy Mixture recently. It's great for prototyping and is, in my opinion, perfect for exactly what you're trying to do here.

tmpl_if what is this and how can I work on this easily on a code editor?

I'm involved in a new project. When I opened the first page, I noticed various tags like: <TMPL_IF>some code</TMPL_IF>.
There are quite straight forward and in a couple of hours I was able to do loops and conditional programming, everything is fine but I would like to understand some things about those tags:
Where these tags come from? Are they html? Or something different? Are an extension given by some sort of library on the server?
How can I make my code editor (read Dreamweaver, or jedit) make understand those tags and make the code highlight working again?
May I use those tags in all pages? I mean, I have some sites that could really have improovements with the use of those tags... I have search on the web, and I have seen that there are a bunch of them, from loops to unless conditions, really really nice, but I haven't find a place that teach them from scrap.
Please point me in the right direction.

The hunt for a CSS attribute-editable Interactive User Interface Learning Tool

I am attempting to learn css attribute relationships. With my current knowledge, I would venture to say that there are only about 30 or so attributes that the majority of web pages are built around, but how you match them up is what gives one page a cleaner look, better functionality, and an overall better experience for the user. Currently I am getting feedback that the 'only' way to learn is by a combination of experience and looking at examples of implementation(s) on webpages that have the feature(s) I want, and trying to replicate. I think this is too time consuming, and not an effective tool for someone wanting to develop a solid approach to CSS. Is/are there tools that you have used similar to any of the below that help you understand the interaction of the attributes for basic manipulation of semantic markup?
Current tools that have GUIs to allow quick feedback of attribute/element manipulation:
JSFIDDLE : An online platform for viewing HTML, JS, CSS, and the result in one window, allowing for common shared code.
Button Maker : Dynamic CSS/HTML generation for a graphical button.
SourceTree : For understanding repository structure for Git,
Mercurial and SVN version control systems.
Eclipse : An IDE with 'desktop' organization of multiple implementations, code, and information panes.
CodingBat : An online console for learning Python or Java by 'snippet' coding and viewing results of different passed parameters.
Codeyear / CodeAcademy : An online IDE to allow for both 'snippet' coding and viewing CSS/HTML/JS/results in several structured learning paths.
Specifically, I would like to learn the relationships of postion based styles, such as fixed, float and such.
For me, the best way to learn: Think up of something you want to make. Make it. Go through the process of finding out what works and what doesn't. Figure out how to fix it. Fix it. Be amazed at how crappy the result is. Repeat.
You won't learn all the little tricks by looking at independent examples. You won't learn much by "looking at" anything. Do it. Once you have a basic grasp of what's going on, make something. Copy something. Time consuming? yes, sure... if you say so. Experience comes with time.
The thing with copying other people is that you don't know the process they went through. Why did they do something a certain way? Is it even right? Just because somebody put it online doesn't mean it's any good.
So specifically, what function do you want to implement? Google that, read all the different ways people do it. Find one that you like, implement it. Tweak it. If you don't understand, look into that.
I think there's a term for when you're trying to find something, you go from one (related) thing to another until you forget your original issue... That's bad when you need to be productive. It's perfectly fine here, where you just want to learn everything.
For some things, it's important to have structure. Once you learn the basics, I think having some sort of structure or system will just slow you down. I like to go at it and solve a problem, learning as I go. When I'm trying to figure something out, I have nothing but Notepad and Chrome with a lot of Google search results tabs open. You don't need all these GUI tools. Sure they might make your development go a little faster with their auto complete or error warnings, but what's your rush?
Don't spend so much time finding the perfect set of tools that you never get to the thing you were finding those tools for. Just do it.