Questions about HyperText Markup Language (HTML), the main language for creating web pages and other interactive information that can be displayed in a web browser.

learn more… | top users | synonyms

21
votes
8answers
11k views

Alternative to Lorem Ipsum (dummy text) for websites

Lorem Ipsum has been the known default for dummy text. Per a search the last discussion in regards to alternatives is two years old. I thought I would post a new thread on this topic. So, what are ...
21
votes
10answers
18k views

Do web frameworks such as Bootstrap or HTML5 boilerplate offer anything to a designer (not developer)?

Note, this is about design much more than development. I build sites from scratch with completely hand written CSS and HTML. I've known about pre-build css templates such as Bootstrap or HTML5 ...
8
votes
8answers
11k views

Is there a visual web editor based on bootstrap?

Bootstrap is a great framework, and I want know if there is a tool that gives you the possibility of dragging html components, re-sizing and moving them, changing colours, all while generating the ...
7
votes
5answers
4k views

Is programming a website for mobile first really necessary?

I've read through a number of sources which state mobile first design is almost essential, which I can't deny it does have obvious benefits such as faster load times for mobiles which generally have ...
7
votes
3answers
33k views

Email signature hell--How to include a logo image and have it stay sharp?

I found a couple useful threads on this forum with respect to the issues posed by (displaying) images in email signatures-- here, for example-- and I've searched all over the web, but still have not ...
7
votes
3answers
655 views

Can Email Be Responsive?

Love it or hate it, there’s no denying the popularity of HTML emails. And, like the web before it, the inbox has officially gone mobile—with over 50 percent of email opens occurring on mobile devices. ...
6
votes
4answers
2k views

Responsive web design is based on screen resolution or screen size?

for mobile devices the resolution is actually big, only screen size is small. based on that: For websites design, do we target screen resolution (e.g 1080x1920)? And for mobile apps. do we target ...
5
votes
2answers
509 views

What unicode character should I use to represent the fill bucket?

I'm designing a mockup paint editor for the web and I'm using unicode characters to represent all of the different tools. I ran into a problem when I got to the fill bucket - I can't find anything ...
5
votes
1answer
172 views

How do you build a webpage with a main text body and 2 columns underneath?

I have a body of text that I am trying to layout in a visually pleasing way but I can not figure it out. The goal is to have this layout (see psuedocode): <container> <main /> ...
4
votes
7answers
1k views

How do you create a client website design mockup/image?

For all the graphic designers who do web design too: How do you produce client design mockups for review and then convert them into HTML/Wordpress etc? Are they created in Illustrator/Photoshop and ...
4
votes
3answers
136k views

What width should I design for when creating a website? [duplicate]

I just got a freelance project to design the UI for a website. Can someone tell me what layout (dimension) is used to design a website front end in Photoshop? What are the basic dimensions used?
4
votes
3answers
358 views

What factors do these colors share?

Colors below seem to share some kind of "tone" together. For example, colors like this or this seem too bright to fit into this group. What exactly makes this "tone"? I want some technical ...
4
votes
2answers
893 views

Text wrapping fill-last-line-first

I have a peculiar design for a web page that I have to implement from an already made design, and some of the text wrappings are filled bottom-up (in my case it's for bottom-left aligned thin text ...
4
votes
3answers
536 views

Do and don't do with styling <html> and <body> tags

When I look at some CSS style for a web page, I typically first look at styling the <html> and <body> tags and then I look at other sub-elements. The styling of <html> and ...
4
votes
4answers
620 views

Positioning a DIV before the previous DIV

I'm not savvy when it comes to HTML/CSS. I use Typepad for my blog, and that limits me a lot. There are four divs. <div id="container-inner"> <div id="nav"></div> <div ...
4
votes
1answer
106 views

How to typeset units in HTML

What is the correct way to set type units in HTML? Stuff like 2km Do I just put the unit right after the value as above? Or is there a special short space? If so how do I prevent a line break ...
3
votes
1answer
13k views

How to make an email flyer

I have a client and he's been wanting me to create an e-flyer for him. When I first read it, I wasn't paying much attention to the details so I ended up thinking he just wanted a flyer for printing. ...
3
votes
2answers
233 views

For web content, is it better to use an entity or the actual character?

I'm confused about the correct way to insert special typographic characters (like quotation marks and em dashes) when producing content that will be displayed on a web page. Is it better or preferred ...
3
votes
3answers
14k views

How do I make it so my website footer is always at the bottom of the page (but not sticky)? [closed]

I'm fairly good at getting stuff to work nicely as I come from a coding background, but I'm lacking in the design/visual department. I'm building a website for a friend and one of the things he wants ...
3
votes
2answers
204 views

What sort of structure does the slice tool generate when exported as HTML?

When I used the slice tool on each part and export as HTML, does it generate a skeletal HTML code where it consists of frame layouts? I would like to know for both Photoshop CS4 and GIMP.
3
votes
2answers
367 views

Implement non-symmetrical background image to a site

I am trying to add the following 3D image as background to the content of a wordpress website: Click for full resolution Website I would like the header part to stay the same size on all pages, ...
3
votes
1answer
334 views

Can I re-color my artwork programmatically?

I have a rather interesting issue. I have columns in my web app that look similar to these guys: I've been able to slice them up and build these guys out...but now I have an added requirement of ...
3
votes
2answers
71 views

Does Photoshop also pull HTML? Or just CSS?

Im new to the most recent version of Photoshop, it has a cool feature I discovered where it takes the CSS of your design and copy's/paste's the thing into an editor. Where would you arrange the HTML ...
3
votes
2answers
17k views

Is there a “generate CSS/HTML” feature or plugin in Sketch app

I have found a script that does exactly that (generates CSS and HTML for the layers and offers an option of exporting those in % values) and cuts the work for the web-dev in half for Photoshop. Now I ...
3
votes
1answer
2k views

Get rid of thin white lines between shape 'joins'

I've created an icon made out of basic lines/shapes in Adobe Illustrator, then make it one solid, continuous shape. I want to use this icon as a pre-loader on a website, the idea being each 'segment' ...
3
votes
2answers
5k views

Optimizing hero/intro photos on mobile and XXL displays

I have a few questions regarding trendy super-large photo headers. I've seen them called "hero" images, but just so we're clear, I'm talking about designs like this one: A large photo is used as a ...
2
votes
2answers
631 views

Identifying HTML colour codes placed in one pixel

How many colours at once can one pixel contain? Is there a tool that can represent this pixel in a form of HTML colour codes? (And if there are many colours in this pixel, can this tool show the ...
2
votes
1answer
530 views

What kind of table / definition list should I use for a CSS concert program listing?

I'm looking for some advice on how to render a classical concert program listing on a web site. I can define the composer & title using either <dl> or <table> tags: <table ...
2
votes
2answers
522 views

How does the grid system work for a full width page?

How does the grid system work for those websites that expand to the full size of the browser (no matter how you resize) while working with a base 12 grid system (such as 960.gs)? For example, take a ...
2
votes
2answers
630 views

How can you get decorative dots or dashes between links in the sitemap hierarchy, using either CSS or images?

In the footer of my clients site, I want to give the users total clarity about where things are on the website so that they can quickly navigate there. So I will implement what looks like a nested ...
2
votes
2answers
385 views

Layout with Tables - Hierarchy

In this fiddle there's a markup and style I'm doing for a website: http://jsfiddle.net/UvJmP/ I am trying to represent data in this way: D2's table data is contained in D1 D3's table data is ...
2
votes
2answers
495 views

Happy birthday, Mac. How to achieve canvas logo animation like this one?

How was this animation created? Can someone give an example how to create animation like this one? Is it possible to achieve animation like this one using canvas and logo in .svg format? Is this ...
2
votes
4answers
397 views

Can I use CSS spritesheets to give a div a re-sizable background?

I'm trying to give a div a background according to a spritesheet, meaning that it'll define the parts from the sprite sheet and use those accordingly in the div. This is my sprite sheet image: Now ...
2
votes
1answer
201 views

AI - Adding properties to layers

I am exporting my image from AI as html and would like it to stay centered on the canvas as the browser changes size. I heard that you can add attributes to the layer by changing the name of the ...
2
votes
1answer
3k views

How to make Illustrator slice coordinates match HTML coordinates?

Today I have the problem to slice a map from illustrator CS6 to HTML. For example i have a map with many states like this map states Because I want to make the mouse hover to each state so that i ...
2
votes
1answer
59 views

How can you render an SVG path with only the d=“…” attribute?

In looking to add another SVG to our svg-def.svg file for our website, one would assume it wise to mirror the approach of a previous developer. In our case, the prior developer was able to entirely ...
2
votes
1answer
231 views

Possible to not have InDesign CC automatically generate class names based on 'Style Name'?

In the Export Tagging settings in InDesign CC, there is an option to use a custom tag as well as a custom class name. However, if the class is left blank then the Style Name is used in its place. Is ...
1
vote
4answers
340 views

Will my web site's type in the web browser look exactly as it does in Photoshop?

Are there specific web font guidelines to use in Photoshop files for web design? I am having issues with line spacing and fonts not showing correctly in HTML.
1
vote
3answers
3k views

What is the PSD to HTML best practices with HTML5?

I'm getting quite confused with all the different methods of converting from psd to html 5. I'm trying to practice converting PSDs to HTML so i get enough experience. There are a ton of complicated ...
1
vote
1answer
1k views

In Dreamweaver (or HTML and CSS in general) how can you style the ® Registered mark to be smaller and floating upwards?

On the web, using ® (&#174; or &reg;) will make the Registered mark almost as big as the rest of the text. How can you modify the size of it to match how it would appear in print?
1
vote
3answers
4k views

How to measure the distances in .psd

I already asked here a question about font types, which used in .psd layout, but I have another problem: how to measure all distances between objects if in .psd these objects have .png format? I need ...
1
vote
3answers
1k views

How can I set the height of my website to be the same height as the visible browser window, with no vertical scrolling?

I want to design a portfolio website, and I don't want it to scroll vertically. What are the dimensions for this kind of website, like the standard browser height? How can I create a website that's ...
1
vote
3answers
544 views

How to create a PDF template and export as HTML/CSS?

I need a tool that allows me to design how a PDF file would look like in a web page. Something simple the image below, I would like to design using some visual tool, export to HTML/CSS and then just ...
1
vote
2answers
345 views

Change HTML tag styles with GREP in InDesign

I have some HTML in a text and I would like to apply a character style to the HTML tags: <p>This is some <strong>HTML</strong> I want to use.</p> I want to only change the ...
1
vote
2answers
2k views

How to create a responsive sprite sheet animation in css?

i've been trying to do this for hours but so far i haven't made any progress. I have a site with a few animations in it, some will be activated on click and some on hover. something similar to the ...
1
vote
1answer
409 views

SVG font-weight changes when rendered in html

I have a logo in SVG format that I am using on a UI Prototype I'm creating using HTML5. I created the SVG using Inkscape. Today I noticed the logo's font-weight has changed, and I can't seem to change ...
1
vote
0answers
35 views

Shuffle characters in the font file

I am looking for a way to simple shuffle english and cyrillic characters inside the select font. For example "R" should represent "H" and otherwise. Actually I need to shuffle all the letters. I will ...
1
vote
1answer
213 views

Strange ID when save a file as SVG in Illustrator

I drew a map of a floor with offices in Illustrator, and I need to named each office floor. But the names have numbers or special characers such () and +, i.e. 360 (IVO+IMR+IEC) And when I save it as ...
1
vote
0answers
1k views

Coding Google material design “chip” (contact thumbnail) in CSS [closed]

I am creating a website and i will be using an element like the contact "chips" in Google Material design. What would the HTML/CSS code be for this? I have tried certain bits of code but I can't ...
1
vote
2answers
1k views

Animated gif in Photoshop only saves as html file

I created an animated banner ad in Photoshop CC and need to save it as gif. I used Timeline/Motion. When I "Save for Web" the second box from the top is set to "GIF". I click "Save" and the only ...