Web Site Coding - My Nav Menu Is Messed Up

How do I implement responsive website from a existing website?

Very simple and easy to convert an existing website into a responsive website provided its build using div and css.If the website is build using table or in-line css it is very difficult to convert it into a responsive website.You need to do following to convert an existing website into a responsive website.Create a css file called responsive.cssInclude this file on all pages.Copy all existing css from all css that you are using on website into responsive.cssNow follow the instructions below to convert the design into responsive design.Responsive CSS is created using media query. @media only screen and (max-width:999px) {  }Any css written between the curly brackets would work between resolution 0 to 999 pixel, hence make sure you don't write conflicting css.All common css for header, footer etc should be written for 0 to 999 resolution.Best option is convert all pixel driven css to percentage. Imagine that you are writing css for 100% screen size.For Multi Screen Size @media only screen and (min-width : 320px) and (max-width : 480px)  {}Create Media Query like above based on your requirements.Like 480 to 640 etc. Note when writing css for multiple screen size don't include these css in 0 to 999 pixel else it would conflict.Keep Multi Screen Resolution to Limited based on requirement for easy going.Additional Important Note :If you are using jquery like nivo slider etc for banners else you will have to find and replace them with responsive jquery like Owl Carousel Replace standard menu to responsive menu like Responsive Nav - Responsive Navigation Plugin, Responsive Mobile Menu Plugin for jQuery, SmartMenus jQuery Website Menu Plugin - Google it and you would find many more.

How can I change the fonts on the primary menu of my WordPress site?

The process breaks down to 2 main steps, determine what code you need to change and making the change. The following instructions are using Chrome as your browser, they may need to be adapted slightly for your browser of choice.To determine what you need to changeWhile viewing the front end of the right click one of the menu items and select “Inspect” or the equivalent in your browser.In the panel that opens you should see the item you selected highlighted as well as the list of CSS styles applied to it. In the list of CSS styles look for a line similar to.menu-item {
text-transform: uppercase;
}
copy this entire section (there will likely be other rules in this same set of curly braces)To add a new rule to override thisGo to the WordPress dashboard and choose Appearance -> CustomizeIn the Customizer choose “Additional CSS” (this was added in WordPress 4.7 if you are using an older version you will need an additional plugin to add styles or will need to edit a child theme’s style sheet)In the additional CSS box, paste in the code you copied before.Remove all of the rules between the curly braces except the text-transform:uppercase;Finally change that rule to be text-transform: capitalize;
Save your changes and your menu items should now be changed

How does change menu hover color in WordPress?

This is a good CSS exercise. Use rightClick -> inspect in Chrome to find the element you want to change the hover characteristics. Create a new pseudo element with :hover (e.g., h1:hover {color: #CAA00F;} Put in style.css or theme css area.Mark rapisite.com

What is the SEO value of "mega menus"?

I actually find mega-menus to be bad for users and bad for SEO.User ExperienceThere are examples of successful mega-menus but my experience leads me to believe that they often do more harm then good.The idea behind mega-menus is to make it easier to find and navigate to the 'right' information. That's a great goal. However, too often I believe mega-menus suffer from what is called the Paradox of Choice. http://video.google.com/videopla...This theory essentially boils down to the idea that users disengage when presented with too many choices. I always ask if a site is tracking the interaction and engagement that comes from mega-menu clicks. Often, they're not. When that tracking is put in place many found that very few actually clicked on those links and those who did, did not have a better user profile (e.g. - time on site, page views per visit, site interactions, conversion). Yes, I know some might say that simply viewing the options provides a benefit, but I remain skeptical. SEOFrom an SEO perspective I dislike having so many links on nearly every page of the site. From an old school Page Rank perspective, you're diluting the power of contextual links and essentially 'voting' for nothing by 'voting' for everything.Google is getting better at understanding the placement of a link and potentially giving it a different weight, but ... the links still count.In addition, mega-menu links create strange cross-linking patterns. If you were a major eCommerce site you might wind up having a link to refrigerators from the lingerie category.Mega-menus often confuse and destroy the topical relevance of a page. About Hidden ContentI'm not too concerned with the number of links being 'hidden' in the onmouseover action as long as the user has the ability to see the same links that the search engine is seeing. (e.g. - you're not cloaking)The web is evolving and there are a number of new reveal methods that allow users to see more content on-demand, while preserving the user experience. Search engines simply have to adapt to that reality.As with everything, there are limits and reasonable guidelines. Putting 2,000 links in your mega-menu might raise some red flags as would putting links that were completely off-topic. TL;DRMega-menus often don't advance UX and while the 'hidden' links aren't problematic, the abundance and diversity of links usually translates into negative SEO value.

What are some website and app development worst practices?

1. Using original size image files straight from camera is bad. Always resize to the final screen size you need. If you are using html width and height attributes on your graphics, you are doing it wrong. Size graphics in your image editor. This ensures the image  file is as small as possible and reduces page load time and data quota usage. Use .png file format if image quality is important. Make sure you resize the image vertically and horizontally by the same percentage so you don't get a squashed or stretched graphic.2. Not testing on all the most common browsers and screen resolutions you expect visitors to use.3. Not considering what the visitor wants from the site. The site is for their benefit mainly, so focus on delivering what they would expect the site to offer. Keep it simple and to the point. 4. Having no consistent navigation layout from page to page. You should use one navigation template and use it on all pages, so the visitor doesn't have to re-discover all your links. Have a separate nav file for your nav menu, so if you need to change it, you only need to change one file not each page. Use separate files ('includes' in php, for example) for all common elements, like headers, footers etc.5. A mess of code, poorly formatted. Comment your code so it is easy to understand what each section does when you or a colleague need to do any updates in the future.6. Not involving the client in every step of the design. You might think you know exactly what they want, but you don't! Develop little by little and get their feedback on each stage. This way, if you start going astray on what they are expecting, you can get back on track easily, without having to redesign the whole package.7. Not using a common css style sheet for the whole site. Avoid in-line styling of each element, or you may need to spend hours editing loads of code if even a small style change is needed.