Questions tagged [html]

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.

Filter by
Sorted by
Tagged with
27
votes
9answers
20k 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 ...
27
votes
10answers
20k 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 ...
21
votes
3answers
3k views

What is the convention to indicate “the same value as above”?

I have received a table of data to put on an html page. Many values in the second column are repeated for a few rows. The author indicated this by using starting double quotes (“), probably ...
13
votes
2answers
71k 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 ...
11
votes
5answers
68k 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 ...
11
votes
8answers
14k 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 ...
10
votes
4answers
16k 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 1920x1080)? And for mobile apps. do we target ...
9
votes
5answers
5k 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 ...
9
votes
3answers
14k views

Setting font-weight vs bold font-family in CSS, which is more correct?

There are basically two ways of making a font bold in CSS: via the font-familyattribute and via the font-weight attribute. Let's say i'm using the font Raleway for example and have loaded a Light, a ...
8
votes
3answers
370k 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?
8
votes
3answers
1k 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. ...
7
votes
5answers
4k 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 ...
7
votes
2answers
10k views

How to convert a circle to a path?

For example, when I save an SVG from illustrator and view the code, I see a <circle> element, for example, <circle cx="131.6" cy="292.3" r="311.7" /> but I'd like for it to be a <path&...
6
votes
2answers
1k 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 ...
6
votes
1answer
301 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 /> <...
5
votes
1answer
19k 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. ...
5
votes
3answers
470 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 ...
5
votes
2answers
2k 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 ...
5
votes
3answers
2k 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 <body&...
5
votes
4answers
598 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 I ...
5
votes
1answer
7k 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' ...
5
votes
1answer
346 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 ...
5
votes
2answers
7k 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 ...
4
votes
7answers
3k 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
2answers
260 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 ...
4
votes
3answers
24k 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 ...
4
votes
2answers
586 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, the ...
4
votes
1answer
195 views

What are some classic decorative typography techniques?

I'm working on a website, and I'm using a drop cap/initial letter for the text body. I find this technique to be very eye-catching and beautiful to look at. Does anyone know any similar simple, ...
4
votes
1answer
355 views

InDesign relink Index Markers

Working with Indesign Creative Cloud 2017, I've run into an issue. I was delivered files and the supplied IDML file has about 150 Index entries that I need to relink in the content. When I export ...
4
votes
1answer
119 views

Where can I get regular webdesign exercise tasks?

Over the past year, my portfolio has become pretty leaned towards photography. I'm fresh out of university, so I don't have much client work to show. The thing is, while I can always find subjects to ...
4
votes
5answers
12k 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 ...
3
votes
3answers
4k 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 ...
3
votes
4answers
493 views

Width of unicode musical symbols vis a vis fixed width font

In my experience, the musical Unicode symbols for flat (♭) and sharp (♯) are not exactly the same width as the fixed width font that I am using, consequently columnar character alignment ...
3
votes
2answers
233 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
1k 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 order ...
3
votes
2answers
854 views

svg image looks odd in html page

So I have two of the same images one is a SVG and the other one is a PNG. I used Inkscape to export the PNG from the SVG. The dilemma that I am stuck with is that on the SVG the blue lines go much ...
3
votes
1answer
945 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 style="...
3
votes
1answer
803 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
235 views

Dealing with a lot of repetition in data table

I have a table where a lot data is repeated (see the competition, players and date columns). The endless rows of the same stuff draws the eye and makes it seem like the most important thing in the ...
3
votes
1answer
516 views

How to export html photoshop to public image host?

I'm looking to export my photoshop designs with both html and images that were sliced up. I'd like to automate the process to host the images in a public domain. I currently use Dropbox but I have to ...
3
votes
2answers
739 views

Svg letters from Inkscape to html

I have done an infographic with Inkscape. When I put the img in the html I cannot see the letters. I convert them to path: path > object to path and it is solved. I suppose that I use a type of letter ...
3
votes
1answer
377 views

Setting the Viewbox so that the inline SVG will “Snap” to the size of the containing element?

I created this simple inline SVG by saving as "Optimized SVG" in inkscape. Prior to saving I set the size to 200X200px. <div style="width: 200px; background-color: red;"> <?xml ...
3
votes
0answers
532 views

Any tool to automatically generate HTML layout structure diagram?

I usually post in StackOverflow, but this is more a layout/design question. I am trying to get an overview of the HTML structure of an application I am working on, and was looking for a tool to ...
3
votes
1answer
594 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 ...
3
votes
2answers
499 views

Strangers ID's in elements when save an .ai file as SVG in Illustrator

I have a map of a floor with offices in it in Illustrator, and I need to add to each office drawn an ID to work with it in JavaScript. But the names of the offices have numbers and/or special ...
3
votes
1answer
453 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 ...
2
votes
4answers
505 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.
2
votes
2answers
1k 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
1answer
7k views

Exporting SVG paths to HTML to animate with JavaScript

I have a complex blueprint, which I've traced in Inkscape. I'm going to programmatically animate the path and also add some other effects with JavaScript. I can include the file using HTML (e.g. <...
2
votes
2answers
1k 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 ...